Skip to content

罗鑫霖 / vion-tools

Go to a project
Commit 9351d021 by 李君
Options

抓拍图片对比优化

1 parent 0b4aeb0c
Inline Side-by-side
Showing 4 changed files with 142 additions and 127 deletions
public/config.js
window._serverHost = ['localhost', '192.168.1.168'].includes(window.location.hostname) ? '36.112.68.214:9999' : window.location.host window._serverHost = ['localhost', '192.168.1.168'].includes(window.location.hostname) ? '36.112.68.214:9999' : window.location.host
window._baseUrl = ['localhost', '192.168.1.168'].includes(window.location.hostname) ? 'http://36.112.68.214:9999/tool/' : `http://${window._serverHost}/tool/` window._baseUrl = ['localhost', '192.168.1.168'].includes(window.location.hostname) ? 'http://36.112.68.214:9999/tool/' : `http://${window._serverHost}/tool/`
window._baseImgUrl = ['localhost', '192.168.1.168'].includes(window.location.hostname) ? 'http://36.112.68.214:9999/' : `${window.location.origin}/` window._baseImgUrl = ['localhost', '192.168.1.168'].includes(window.location.hostname) ? 'http://36.112.68.214:9999/images/' : `${window.location.origin}/images/`
const log = console.log.bind(console) const log = console.log.bind(console)
src/views/ComparisonCapturedPictures/ComparisonCapturedPictures.vue
<template> <template>
<a-form :model="queryForm" layout="inline" :label-col="{ style: { width: '70px' } }"> <a-row>
<a-form-item label="集团：" style="padding: 5px 0"> <a-col :span='14'>
<a-select v-model:value="queryForm.account_id" style="width: 280px" mode="multiple" :maxTagCount="1" <a-form :model="queryForm" layout="inline" :label-col="{ style: { width: '70px' } }">
@change="onAccountChange" :options="accountList" optionFilterProp="label" show-search> <a-form-item label="集团：" style="padding: 5px 0">
</a-select> <a-select v-model:value="queryForm.account_id" style="width: 230px" mode="multiple" :maxTagCount="1"
</a-form-item> @change="onAccountChange" :options="accountList" optionFilterProp="label" show-search>
<a-form-item label="广场：" style="padding: 5px 0"> </a-select>
<a-select v-model:value="queryForm.plaza_id" style="width: 280px" mode="multiple" :maxTagCount="1" </a-form-item>
@change="onPlazaChange" :options="plazaList" optionFilterProp="label" show-search> <a-form-item label="广场：" style="padding: 5px 0">
</a-select> <a-select v-model:value="queryForm.plaza_id" style="width: 230px" mode="multiple" :maxTagCount="1"
</a-form-item> @change="onPlazaChange" :options="plazaList" optionFilterProp="label" show-search>
<a-form-item label="出入类型：" style="padding: 5px 0"> </a-select>
<a-select v-model:value="queryForm.type" style="width: 280px"> </a-form-item>
<a-select-option :value="0">全场</a-select-option> <a-form-item label="出入类型：" style="padding: 5px 0">
<a-select-option :value="1">广场出入口</a-select-option> <a-select v-model:value="queryForm.type" style="width: 230px">
<a-select-option :value="2">楼层出入口</a-select-option> <a-select-option :value="0">全场</a-select-option>
<a-select-option :value="3">店铺出入口</a-select-option> <a-select-option :value="1">广场出入口</a-select-option>
<a-select-option :value="4">其他</a-select-option> <a-select-option :value="2">楼层出入口</a-select-option>
</a-select> <a-select-option :value="3">店铺出入口</a-select-option>
</a-form-item> <a-select-option :value="4">其他</a-select-option>
<a-form-item label="区域信息：" style="padding: 5px 0" v-if='queryForm.type==0 || queryForm.type==3'> </a-select>
<a-select v-model:value="queryForm.zone_id" style="width: 280px" mode="multiple" :maxTagCount="1" </a-form-item>
@change="onZoneChange" :options="zoneList" optionFilterProp="label" show-search> <a-form-item label="区域信息：" style="padding: 5px 0" v-if='queryForm.type==0 || queryForm.type==3'>
</a-select> <a-select v-model:value="queryForm.zone_id" style="width: 230px" mode="multiple" :maxTagCount="1"
</a-form-item> @change="onZoneChange" :options="zoneList" optionFilterProp="label" show-search>
<a-form-item label="监控点：" style="padding: 5px 0"> </a-select>
<a-select v-model:value="queryForm.gate_id" style="width: 280px" mode="multiple" :maxTagCount="1" </a-form-item>
:options="gateList" optionFilterProp="label" show-search> <a-form-item label="监控点：" style="padding: 5px 0">
</a-select> <a-select v-model:value="queryForm.gate_id" style="width: 230px" mode="multiple" :maxTagCount="1"
</a-form-item> :options="gateList" optionFilterProp="label" show-search>
<a-form-item label="方向：" style="padding: 5px 0"> </a-select>
<a-select v-model:value="queryForm.direction" mode="multiple" :maxTagCount="1" style="width: 280px"> </a-form-item>
<a-select-option :value="1">进</a-select-option> <a-form-item label="方向：" style="padding: 5px 0">
<a-select-option :value="-1">出</a-select-option> <a-select v-model:value="queryForm.direction" mode="multiple" :maxTagCount="1" style="width: 230px">
<a-select-option :value="0">横穿</a-select-option> <a-select-option :value="1">进</a-select-option>
</a-select> <a-select-option :value="-1">出</a-select-option>
</a-form-item> <a-select-option :value="0">横穿</a-select-option>
<a-form-item label="抓拍类型：" style="padding: 5px 0"> </a-select>
<a-select v-model:value="queryForm.picType" style="width: 280px"> </a-form-item>
<a-select-option :value="1">半身照</a-select-option> <a-form-item label="抓拍类型：" style="padding: 5px 0">
<a-select-option :value="2">全身照</a-select-option> <a-select v-model:value="queryForm.picType" style="width: 230px">
</a-select> <a-select-option :value="1">半身照</a-select-option>
</a-form-item> <a-select-option :value="2">全身照</a-select-option>
<a-form-item label="人员类型：" style="padding: 5px 0"> </a-select>
<a-select v-model:value="queryForm.personType" mode="multiple" :maxTagCount="1" </a-form-item>
style="width: 280px"> <a-form-item label="人员类型：" style="padding: 5px 0">
<a-select-option :value="1">店员</a-select-option> <a-select v-model:value="queryForm.personType" mode="multiple" :maxTagCount="1"
<a-select-option :value="2">顾客</a-select-option> style="width: 230px">
</a-select> <a-select-option :value="1">店员</a-select-option>
</a-form-item> <a-select-option :value="2">顾客</a-select-option>
<a-form-item label="选择日期：" style="padding: 5px 0"> </a-select>
<a-date-picker v-model:value="queryForm.date" :format="'YYYY-MM-DD'" style="width: 280px" /> </a-form-item>
</a-form-item> <a-form-item label="选择日期：" style="padding: 5px 0">
<a-form-item label="选择时间：" style="padding: 5px 0"> <a-date-picker v-model:value="queryForm.date" :format="'YYYY-MM-DD'" style="width: 230px" />
<a-time-picker v-model:value="queryForm.startTime" style="width: 140px" /> </a-form-item>
<a-time-picker v-model:value="queryForm.endTime" style="width: 140px" /> <a-form-item label="选择时间：" style="padding: 5px 0">
</a-form-item> <a-time-picker v-model:value="queryForm.startTime" style="width: 120px" />
<a-form-item label="图片数量：" style="padding: 5px 0"> <a-time-picker v-model:value="queryForm.endTime" style="width: 120px" />
<a-input-number v-model:value="queryForm.minPic" :min="0" style="width: 100px"/>至 </a-form-item>
<a-input-number v-model:value="queryForm.maxPic" :min="0" style="width: 100px"/> <a-form-item label="图片数量：" style="padding: 5px 0">
</a-form-item> <a-input-number v-model:value="queryForm.minPic" :min="0" style="width: 100px"/>至
<a-form-item style="padding: 5px 0"> <a-input-number v-model:value="queryForm.maxPic" :min="0" style="width: 100px"/>
<a-button type="primary" @click="confirmSearch" :loading="isLoading">查询</a-button> </a-form-item>
</a-form-item> <a-form-item style="padding: 5px 0">
</a-form> <a-button type="primary" @click="confirmSearch" :loading="isLoading">查询</a-button>
<div v-loading="isLoading"> </a-form-item>
<a-row v-for="row in pagedTableDataList"> </a-form>
<a-col :span="3" v-for="(item,index) in row"> <div v-loading="isLoading">
<div style="margin: 0 5px" draggable="true" @dragstart="dragStart(item,$event)" :class="item.id==currentItemId?'actived':''"> <a-row v-for="row in pagedTableDataList">
<el-image :src="item.picture_url" :fit="'fill'" class="single-image"> <a-col class='colItem' :span="4" v-for="(item,index) in row">
</el-image> <div style="margin: 0 5px" draggable="true" @dragstart="dragStart(item,$event)">
<div>时间:{{ item.counttime }}</div> <el-image :src="item.picture_url" :fit="'fill'" class="single-image">
<div>类型:{{ formatPersonType(item.personType) }}</div> </el-image>
<div>地点:{{ item.gate_name }}</div> <div>时间:{{ item.counttime }}</div>
<div>类型:{{ formatPersonType(item.personType) }}</div>
<div>地点:{{ item.gate_name }}</div>
</div>
</a-col>
</a-row>
<a-pagination v-model:current="pageNum" v-model:pageSize="pageSize" :total="total"
:show-total="total => `共 ${total} 条`" :pageSizeOptions="['10', '20']"
@change="onPageNumChange" @showSizeChange="onPageSizeChange" show-size-changer show-quick-jumper
style="text-align:center" />
</div>
</a-col>
<a-col :span='10'>
<div class="imgbox1">
<div class="btns">
<a-button type="primary" @click="featureComparison" >特征对比</a-button>
<a-button type="primary" @click="shoperFeatureComparison" >店员特征对比</a-button>
</div> </div>
</a-col>
</a-row>
<a-pagination v-model:current="pageNum" v-model:pageSize="pageSize" :total="total"
:show-total="total => `共 ${total} 条`" :pageSizeOptions="['16', '32']"
@change="onPageNumChange" @showSizeChange="onPageSizeChange" show-size-changer show-quick-jumper
style="text-align:center" />
</div>
<div class="imgbox1">
<div class="btns">
<a-button type="primary" @click="featureComparison" >特征对比</a-button>
<a-button type="primary" @click="shoperFeatureComparison" >店员特征对比</a-button>
</div>
<a-row :gutter="[16,16]">
<a-col :span='12'>
<div class='comparsionBox' v-loading='isLoadingComparison'> <div class='comparsionBox' v-loading='isLoadingComparison'>
<p v-if='boxListLeft.length>0'>共{{boxListLeft.length}}张</p> <p v-if='boxListLeft.length>0'>共{{boxListLeft.length}}张</p>
<a-row @dragenter="dragEnter($event)" @dragleave="dragLeave($event)" @drop="dropLeft($event)" <a-row @dragenter="dragEnter($event)" @dragleave="dragLeave($event)" @drop="dropLeft($event)"
@dragover="allowDrop($event)" > @dragover="allowDrop($event)" >
<a-col :span="8" v-for="item in boxListLeft"> <a-col :span="6" v-for="item in boxListLeft">
<div style="margin: 0 5px" > <div style="margin: 0 5px" :class="item.id==currentItemId?'actived':''" @click="clickItem(item)">
<el-image :src="item.picture_url" :fit="'fill'" class="single-image"> <el-image :src="item.picture_url" :fit="'fill'" class="single-image">
</el-image> </el-image>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
...@@ -104,15 +106,12 @@ ...@@ -104,15 +106,12 @@
<a-empty v-if='boxListLeft.length==0' description="拖拽图片到此处"></a-empty> <a-empty v-if='boxListLeft.length==0' description="拖拽图片到此处"></a-empty>
</a-row> </a-row>
</div> </div>
<div class='comparsionBox' v-loading='isLoadingComparisonRight' style="margin-top: 15px;">
</a-col>
<a-col :span='12'>
<div class='comparsionBox' v-loading='isLoadingComparisonRight'>
<p v-if='boxListRight.length>0'>共{{boxListRight.length}}张</p> <p v-if='boxListRight.length>0'>共{{boxListRight.length}}张</p>
<a-row @dragenter="dragEnter($event)" @dragleave="dragLeave($event)" @drop="dropRight($event)" <a-row @dragenter="dragEnter($event)" @dragleave="dragLeave($event)" @drop="dropRight($event)"
@dragover="allowDrop($event)"> @dragover="allowDrop($event)">
<a-col :span="8" v-for="item in boxListRight"> <a-col :span="6" v-for="item in boxListRight">
<div style="margin: 0 5px" > <div style="margin: 0 5px" :class="item.id==currentItemId?'actived':''" @click="clickItem(item)">
<el-image :src="item.picture_url" :fit="'fill'" class="single-image"> <el-image :src="item.picture_url" :fit="'fill'" class="single-image">
</el-image> </el-image>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
...@@ -123,11 +122,11 @@ ...@@ -123,11 +122,11 @@
<a-empty v-if='boxListRight.length==0' description="拖拽图片到此处"></a-empty> <a-empty v-if='boxListRight.length==0' description="拖拽图片到此处"></a-empty>
</a-row> </a-row>
</div> </div>
</a-col> </div>
</a-row> </a-col>
<DetailDialog ref="DetailDialogRef" /> </a-row>
<DetailDialogComparison ref="DetailDialogComparisonRef" /> <DetailDialog ref="DetailDialogRef" />
</div> <DetailDialogComparison ref="DetailDialogComparisonRef" />
</template> </template>
<script> <script>
...@@ -160,7 +159,7 @@ ...@@ -160,7 +159,7 @@
setup() { setup() {
// scalar // scalar
const pageNum = ref(1) const pageNum = ref(1)
const pageSize = ref(16) const pageSize = ref(10)
const total = ref() const total = ref()
const isLoading = ref(false) const isLoading = ref(false)
const isLoadingComparison = ref(false) const isLoadingComparison = ref(false)
...@@ -177,7 +176,7 @@ ...@@ -177,7 +176,7 @@
const pagedTableDataList = computed( const pagedTableDataList = computed(
() => { () => {
return getPagedList(dataList.value, 8) return getPagedList(dataList.value, 10)
} }
) )
...@@ -401,10 +400,14 @@ ...@@ -401,10 +400,14 @@
const allowDrop= function (event) { const allowDrop= function (event) {
event.preventDefault(); event.preventDefault();
} }
const clickItemObj = ref({})
const clickItem = function(item){
clickItemObj.value = item
currentItemId.value = item.id
}
const dropLeft= function (event) { const dropLeft= function (event) {
event.preventDefault(); event.preventDefault();
boxObj.value = boxObjStart.value boxObj.value = boxObjStart.value
currentItemId.value = boxObj.value.id
isLoadingComparison.value = true; isLoadingComparison.value = true;
boxListLeft.value = []; boxListLeft.value = [];
const rawData = toRaw(queryForm) const rawData = toRaw(queryForm)
...@@ -443,7 +446,6 @@ ...@@ -443,7 +446,6 @@
event.preventDefault(); event.preventDefault();
boxListRight.value = []; boxListRight.value = [];
boxObj.value = boxObjStart.value boxObj.value = boxObjStart.value
currentItemId.value = boxObj.value.id
const rawData = toRaw(queryForm) const rawData = toRaw(queryForm)
isLoadingComparisonRight.value = true isLoadingComparisonRight.value = true
let parmas = { let parmas = {
...@@ -480,16 +482,16 @@ ...@@ -480,16 +482,16 @@
// 特征对比 // 特征对比
const featureComparison = function(){ const featureComparison = function(){
const rawData = toRaw(queryForm) const rawData = toRaw(queryForm)
if(!boxObj.value.id){ if(!clickItemObj.value.id){
ElMessage( ElMessage(
{ {
message: `请拖拽图片到下方`, message: `请选择拖拽的图片`,
type: 'warning' type: 'warning'
} }
) )
return return
} }
if(!boxObj.value.picture_url){ if(!clickItemObj.value.picture_url){
ElMessage( ElMessage(
{ {
message: `该图片没有特征，请选择有效的图片`, message: `该图片没有特征，请选择有效的图片`,
...@@ -499,28 +501,30 @@ ...@@ -499,28 +501,30 @@
return return
} }
let parmas = { let parmas = {
mall_id:boxObj.value.mall_id, mall_id:clickItemObj.value.mall_id,
picType:rawData.picType, picType:rawData.picType,
pic_id:boxObj.value.id, pic_id:clickItemObj.value.id,
countdate:formatDate(rawData.date) countdate:formatDate(rawData.date)
} }
parmas.persionlistLeft = boxListLeft.value parmas.persionlistLeft = boxListLeft.value
parmas.persionlistRight = boxListRight.value parmas.persionlistRight = boxListRight.value
DetailDialogComparisonRef.value.initDialog(boxObj.value,parmas); console.log(clickItemObj.value)
console.log(parmas)
DetailDialogComparisonRef.value.initDialog(clickItemObj.value,parmas);
} }
// 店员特征对比 // 店员特征对比
const shoperFeatureComparison = function(){ const shoperFeatureComparison = function(){
const rawData = toRaw(queryForm) const rawData = toRaw(queryForm)
if(!boxObj.value.id){ if(!clickItemObj.value.id){
ElMessage( ElMessage(
{ {
message: `请拖拽图片到下方`, message: `请选择拖拽的图片`,
type: 'warning' type: 'warning'
} }
) )
return return
} }
if(!boxObj.value.picture_url){ if(!clickItemObj.value.picture_url){
ElMessage( ElMessage(
{ {
message: `该图片没有特征，请选择有效的图片`, message: `该图片没有特征，请选择有效的图片`,
...@@ -530,12 +534,13 @@ ...@@ -530,12 +534,13 @@
return return
} }
let parmas = { let parmas = {
plaza_id:boxObj.value.mall_id, plaza_id:clickItemObj.value.mall_id,
pic_type:rawData.picType, pic_type:rawData.picType,
pic_id:boxObj.value.id, pic_id:clickItemObj.value.id,
ip:window._baseImgUrl ip:window._baseImgUrl,
countdate:formatDate(rawData.date)
} }
DetailDialogRef.value.initDialog(boxObj.value,parmas); DetailDialogRef.value.initDialog(clickItemObj.value,parmas);
} }
__main() __main()
...@@ -575,6 +580,7 @@ ...@@ -575,6 +580,7 @@
dropRight, dropRight,
featureComparison, featureComparison,
shoperFeatureComparison, shoperFeatureComparison,
clickItem,
// ref // ref
DetailDialogRef, DetailDialogRef,
DetailDialogComparisonRef DetailDialogComparisonRef
...@@ -601,6 +607,10 @@ ...@@ -601,6 +607,10 @@
margin-right: 10px; margin-right: 10px;
} }
} }
.colItem{
flex: 0 0 20%;
max-width: 20%;
}
.comparsionBox{ .comparsionBox{
padding-top: 5px; padding-top: 5px;
border: 2px dashed #ccc; border: 2px dashed #ccc;
......
src/views/ComparisonCapturedPictures/DetailDialogComparison.vue
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
</a-col> </a-col>
<a-col :span='20'> <a-col :span='20'>
<div v-loading='isLoadingTop' class='rowBox'> <div v-loading='isLoadingTop' class='rowBox'>
<p v-if="dataListLeft">左侧<span style="float: right;margin-right: 25px;" v-if="dataListLeft.length">共{{dataListLeft.length}}张</span></p> <p v-if="dataListLeft">上方<span style="float: right;margin-right: 25px;" v-if="dataListLeft.length">共{{dataListLeft.length}}张</span></p>
<a-row > <a-row >
<a-col :span="6" v-for="(item,index) in dataListLeft" :key='index'> <a-col :span="6" v-for="(item,index) in dataListLeft" :key='index'>
<div style="margin: 0 5px" class="itemBox"> <div style="margin: 0 5px" class="itemBox">
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
</a-row> </a-row>
</div> </div>
<div v-loading='isLoadingBottom' class='rowBox'> <div v-loading='isLoadingBottom' class='rowBox'>
<p v-if="dataListRight">右侧<span style="float: right;margin-right: 25px;" v-if="dataListRight.length">共{{dataListRight.length}}张</span></p> <p v-if="dataListRight">下方<span style="float: right;margin-right: 25px;" v-if="dataListRight.length">共{{dataListRight.length}}张</span></p>
<a-row> <a-row>
<a-col :span="6" v-for="(item,index) in dataListRight" :key='index'> <a-col :span="6" v-for="(item,index) in dataListRight" :key='index'>
<div style="margin: 0 5px" class="itemBox"> <div style="margin: 0 5px" class="itemBox">
...@@ -83,6 +83,7 @@ export default { ...@@ -83,6 +83,7 @@ export default {
countdate:parmas.countdate, countdate:parmas.countdate,
personList:parmas.persionlistLeft personList:parmas.persionlistLeft
} }
console.log(parmasObj)
comparsionResultApi.getPersonContrastList(parmasObj).then((r) => { comparsionResultApi.getPersonContrastList(parmasObj).then((r) => {
isLoadingTop.value = false isLoadingTop.value = false
if (r.data&&isArray(r.data.personList)) { if (r.data&&isArray(r.data.personList)) {
......
src/views/FeatureComparisonVerification/FeatureComparisonVerification.vue
...@@ -64,7 +64,7 @@ ...@@ -64,7 +64,7 @@
</a-form> </a-form>
<div v-loading="isLoading"> <div v-loading="isLoading">
<el-row v-for="row in pagedTableDataList"> <el-row v-for="row in pagedTableDataList">
<el-col :span="6" v-for="(item,index) in row" :key="index"> <el-col class="col" :span="6" v-for="(item,index) in row" :key="index">
<div style="margin: 0 5px" @click='chooseItem(item)' class="colItem" :class="currentItemId==item.id?'actived':''"> <div style="margin: 0 5px" @click='chooseItem(item)' class="colItem" :class="currentItemId==item.id?'actived':''">
<el-image :src="item.picture_url" :fit="'fill'" class="single-image"> <el-image :src="item.picture_url" :fit="'fill'" class="single-image">
</el-image> </el-image>
...@@ -75,7 +75,7 @@ ...@@ -75,7 +75,7 @@
</el-col> </el-col>
</el-row> </el-row>
<a-pagination v-model:current="pageNum" v-model:pageSize="pageSize" :total="total" <a-pagination v-model:current="pageNum" v-model:pageSize="pageSize" :total="total"
:show-total="total => `共 ${total} 条`" :pageSizeOptions="['12', '24', '48', '192']" :show-total="total => `共 ${total} 条`" :pageSizeOptions="['10', '20']"
@change="onPageNumChange" @showSizeChange="onPageSizeChange" show-size-changer show-quick-jumper @change="onPageNumChange" @showSizeChange="onPageSizeChange" show-size-changer show-quick-jumper
style="text-align:center" /> style="text-align:center" />
</div> </div>
...@@ -83,7 +83,7 @@ ...@@ -83,7 +83,7 @@
<a-col :span="10" class='imgBox1'> <a-col :span="10" class='imgBox1'>
<p style="margin-left: 15px;" v-if='featureList.length>0'>共{{featureList.length}}张</p> <p style="margin-left: 15px;" v-if='featureList.length>0'>共{{featureList.length}}张</p>
<el-row class="imgBox1_top" :gutter="10" v-loading="isLoadingFeature"> <el-row class="imgBox1_top" :gutter="10" v-loading="isLoadingFeature">
<el-col :span="8" class="itemBox" v-for="item in featureList"> <el-col :span="6" class="itemBox" v-for="item in featureList">
<el-image :src="item.picture_url" :fit="'fill'" class="single-image"> <el-image :src="item.picture_url" :fit="'fill'" class="single-image">
</el-image> </el-image>
<p class="featureNum">{{(item.featureNum).toFixed(2)}}</p> <p class="featureNum">{{(item.featureNum).toFixed(2)}}</p>
...@@ -100,7 +100,7 @@ ...@@ -100,7 +100,7 @@
<a-button type="primary" @click="reComparisonFeature" >重提特征比对</a-button> <a-button type="primary" @click="reComparisonFeature" >重提特征比对</a-button>
</div> </div>
<el-row :gutter="10" v-loading="isLoadingComparison" class='imgBox2'> <el-row :gutter="10" v-loading="isLoadingComparison" class='imgBox2'>
<el-col :span="8" class="itemBox" v-for="item in comparisonList"> <el-col :span="6" class="itemBox" v-for="item in comparisonList">
<el-image :src="item.picture_url" :fit="'fill'" class="single-image"> <el-image :src="item.picture_url" :fit="'fill'" class="single-image">
</el-image> </el-image>
<p class="featureNum">{{(item.featureNum).toFixed(2)}}</p> <p class="featureNum">{{(item.featureNum).toFixed(2)}}</p>
...@@ -140,7 +140,7 @@ ...@@ -140,7 +140,7 @@
setup() { setup() {
// scalar // scalar
const pageNum = ref(1) const pageNum = ref(1)
const pageSize = ref(12) const pageSize = ref(10)
const total = ref() const total = ref()
const isLoading = ref(false) const isLoading = ref(false)
// sequence // sequence
...@@ -156,7 +156,7 @@ ...@@ -156,7 +156,7 @@
const isLoadingFeature = ref(false) const isLoadingFeature = ref(false)
const pagedTableDataList = computed( const pagedTableDataList = computed(
() => { () => {
return getPagedList(dataList.value, 8) return getPagedList(dataList.value, 10)
} }
) )
...@@ -519,6 +519,10 @@ ...@@ -519,6 +519,10 @@
padding-left: 5px; padding-left: 5px;
} }
} }
.col{
flex: 0 0 20%;
max-width: 20%;
}
.actived{ .actived{
border: 1px solid #1890ff; border: 1px solid #1890ff;
} }
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!