Commit fc28a04c by 李君

特征比对增加下载文件以及增加人员id显示

1 parent 9351d021
...@@ -91,13 +91,14 @@ ...@@ -91,13 +91,14 @@
<a-button type="primary" @click="shoperFeatureComparison" >店员特征对比</a-button> <a-button type="primary" @click="shoperFeatureComparison" >店员特征对比</a-button>
</div> </div>
<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'><span>{{boxListLeft[0].person_unid}}</span> <span style="float: right;">{{boxListLeft.length}}</span></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="6" v-for="item in boxListLeft"> <a-col :span="6" v-for="item in boxListLeft">
<div style="margin: 0 5px" :class="item.id==currentItemId?'actived':''" @click="clickItem(item)"> <div class="itemBox" :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>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div> <div>方向:{{ formatDirection(item.direction) }}</div>
<div>地点:{{ item.gate_name }}</div> <div>地点:{{ item.gate_name }}</div>
...@@ -107,13 +108,14 @@ ...@@ -107,13 +108,14 @@
</a-row> </a-row>
</div> </div>
<div class='comparsionBox' v-loading='isLoadingComparisonRight' style="margin-top: 15px;"> <div class='comparsionBox' v-loading='isLoadingComparisonRight' style="margin-top: 15px;">
<p v-if='boxListRight.length>0'>{{boxListRight.length}}</p> <p v-if='boxListRight.length>0'><span>{{boxListRight[0].person_unid}}</span> <span style="float: right;">{{boxListRight.length}}</span></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="6" v-for="item in boxListRight"> <a-col :span="6" v-for="item in boxListRight">
<div style="margin: 0 5px" :class="item.id==currentItemId?'actived':''" @click="clickItem(item)"> <div class="itemBox" :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>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div> <div>方向:{{ formatDirection(item.direction) }}</div>
<div>地点:{{ item.gate_name }}</div> <div>地点:{{ item.gate_name }}</div>
...@@ -542,6 +544,21 @@ ...@@ -542,6 +544,21 @@
} }
DetailDialogRef.value.initDialog(clickItemObj.value,parmas); DetailDialogRef.value.initDialog(clickItemObj.value,parmas);
} }
const downloadFile = function(item,event){
event.stopPropagation()
if(item.features_url){
window.open(item.features_url)
}else{
ElMessage(
{
message: `该图片没有特征`,
type: 'warning'
}
)
return
}
}
__main() __main()
return { return {
...@@ -581,6 +598,7 @@ ...@@ -581,6 +598,7 @@
featureComparison, featureComparison,
shoperFeatureComparison, shoperFeatureComparison,
clickItem, clickItem,
downloadFile,
// ref // ref
DetailDialogRef, DetailDialogRef,
DetailDialogComparisonRef DetailDialogComparisonRef
...@@ -611,14 +629,27 @@ ...@@ -611,14 +629,27 @@
flex: 0 0 20%; flex: 0 0 20%;
max-width: 20%; max-width: 20%;
} }
.itemBox{
margin: 0 5px;
position: relative;
.downloadFile{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
right: 0;
cursor: pointer;
}
}
.comparsionBox{ .comparsionBox{
padding-top: 5px; padding-top: 5px;
border: 2px dashed #ccc; border: 2px dashed #ccc;
height: 430px; height: 430px;
overflow-y: auto; overflow-y: auto;
p{ p{
text-align: right; // text-align: right;
margin-right: 20px; margin-right: 20px;
margin-left: 20px;
} }
.ant-empty{ .ant-empty{
margin: 0 auto; margin: 0 auto;
......
...@@ -9,9 +9,10 @@ ...@@ -9,9 +9,10 @@
<div v-loading='isLoading'> <div v-loading='isLoading'>
<a-row :gutter="[16,16]"> <a-row :gutter="[16,16]">
<a-col :span='4'> <a-col :span='4'>
<div style="margin: 0 5px"> <div style="margin: 0 5px" class="itemBox">
<el-image :src="detailData.picture_url" :fit="'fill'" class="single-image"> <el-image :src="detailData.picture_url" :fit="'fill'" class="single-image">
</el-image> </el-image>
<span class="el-icon-document downloadFile" @click="downloadFile(detailData,$event)"></span>
<div>时间:{{ detailData.counttime }}</div> <div>时间:{{ detailData.counttime }}</div>
<div>方向:{{ formatDirection(detailData.direction) }}</div> <div>方向:{{ formatDirection(detailData.direction) }}</div>
<div>地点:{{ detailData.gate_name }}</div> <div>地点:{{ detailData.gate_name }}</div>
...@@ -20,10 +21,11 @@ ...@@ -20,10 +21,11 @@
<a-col :span='20'> <a-col :span='20'>
<a-row v-for="(row,index) in dataList" :key='index' class='rowBox'> <a-row v-for="(row,index) in dataList" :key='index' class='rowBox'>
<p>{{row.name}} {{row.shopname}}</p> <p>{{row.name}} {{row.shopname}}</p>
<a-col :span="6" v-for="item in row.personList" class='itemBox' :key='item.id'> <a-col :span="4" v-for="item in row.personList" :key='item.id' class='colItem'>
<div style="margin: 0 5px"> <div style="margin: 0 5px" class="itemBox">
<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>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<p class="featureNum">{{item.featureNum}}</p> <p class="featureNum">{{item.featureNum}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
</div> </div>
...@@ -84,33 +86,60 @@ export default { ...@@ -84,33 +86,60 @@ export default {
const onCancel = () => { const onCancel = () => {
isVisible.value = false; isVisible.value = false;
}; };
const downloadFile = function(item,event){
event.stopPropagation()
if(item.features_url){
window.open(item.features_url)
}else{
ElMessage(
{
message: `该图片没有特征`,
type: 'warning'
}
)
return
}
}
return { return {
isVisible, isVisible,
detailData, detailData,
onCancel, onCancel,
dataList, dataList,
initDialog, initDialog,
isLoading, isLoading,
formatDirection formatDirection,
downloadFile
}; };
}, },
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.single-image { .single-image {
height: 300px; height: 200px;
width: 100%; width: 150px;
} }
.rowBox{ .rowBox{
border : 2px dashed #ccc; border : 2px dashed #ccc;
padding: 0 5px; padding: 0 5px;
margin-bottom: 15px; margin-bottom: 15px;
} }
.colItem{
flex: 0 0 20%;
max-width: 20%;
}
.itemBox{ .itemBox{
position: relative; position: relative;
} }
.downloadFile{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
left: 120px;
cursor: pointer;
}
.featureNum{ .featureNum{
position: absolute; position: absolute;
top: 0; top: 0;
......
...@@ -8,9 +8,10 @@ ...@@ -8,9 +8,10 @@
<div> <div>
<a-row :gutter="[16,16]"> <a-row :gutter="[16,16]">
<a-col :span='4'> <a-col :span='4'>
<div style="margin: 0 5px"> <div style="margin: 0 5px" class="itemBox">
<el-image :src="detailData.picture_url" :fit="'fill'" class="single-image"> <el-image :src="detailData.picture_url" :fit="'fill'" class="single-image">
</el-image> </el-image>
<span class="el-icon-document downloadFile" @click="downloadFile(detailData,$event)"></span>
<div>时间:{{ detailData.counttime }}</div> <div>时间:{{ detailData.counttime }}</div>
<div>方向:{{ formatDirection(detailData.direction) }}</div> <div>方向:{{ formatDirection(detailData.direction) }}</div>
<div>地点:{{ detailData.gate_name }}</div> <div>地点:{{ detailData.gate_name }}</div>
...@@ -18,12 +19,17 @@ ...@@ -18,12 +19,17 @@
</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">
<a-row > 上方
<a-col :span="6" v-for="(item,index) in dataListLeft" :key='index'> <span v-if="dataListLeft.length" style="margin-left: 25px;">{{dataListLeft[0].person_unid}}</span>
<span v-if="dataListLeft.length" style="float: right;margin-right: 25px;">{{dataListLeft.length}}</span>
</p>
<a-row class='rowAllBox'>
<a-col class='colItem' :span="4" v-for="(item,index) in dataListLeft" :key='index'>
<div style="margin: 0 5px" class="itemBox"> <div style="margin: 0 5px" class="itemBox">
<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>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<p class="featureNum">{{(item.featureNum).toFixed(2)}}</p> <p class="featureNum">{{(item.featureNum).toFixed(2)}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div> <div>方向:{{ formatDirection(item.direction) }}</div>
...@@ -33,12 +39,17 @@ ...@@ -33,12 +39,17 @@
</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">
<a-row> 下方
<a-col :span="6" v-for="(item,index) in dataListRight" :key='index'> <span v-if="dataListRight.length" style="margin-left: 25px;">{{dataListRight[0].person_unid}}</span>
<span v-if="dataListRight.length" style="float: right;margin-right: 25px;">{{dataListRight.length}}</span>
</p>
<a-row class='rowAllBox'>
<a-col class='colItem' :span="4" v-for="(item,index) in dataListRight" :key='index'>
<div style="margin: 0 5px" class="itemBox"> <div style="margin: 0 5px" class="itemBox">
<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>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<p class="featureNum">{{(item.featureNum).toFixed(2)}}</p> <p class="featureNum">{{(item.featureNum).toFixed(2)}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div> <div>方向:{{ formatDirection(item.direction) }}</div>
...@@ -158,7 +169,21 @@ export default { ...@@ -158,7 +169,21 @@ export default {
const onCancel = () => { const onCancel = () => {
isVisible.value = false; isVisible.value = false;
}; };
const downloadFile = function(item,event){
event.stopPropagation()
if(item.features_url){
window.open(item.features_url)
}else{
ElMessage(
{
message: `该图片没有特征`,
type: 'warning'
}
)
return
}
}
return { return {
isVisible, isVisible,
...@@ -169,23 +194,37 @@ export default { ...@@ -169,23 +194,37 @@ export default {
initDialog, initDialog,
formatDirection, formatDirection,
isLoadingTop, isLoadingTop,
isLoadingBottom isLoadingBottom,
downloadFile
}; };
}, },
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.single-image { .single-image {
height: 300px; height: 200px;
width: 100%; width: 150px;
} }
.rowBox{ .rowBox{
border : 2px dashed #ccc; border : 2px dashed #ccc;
padding: 0 5px; padding: 0 5px;
margin-bottom: 15px; margin-bottom: 15px;
}
.rowAllBox{
height: 350px;
overflow-y: auto;
} }
.itemBox{ .itemBox{
position: relative; position: relative;
.downloadFile{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
left: 120px;
cursor: pointer;
}
} }
.featureNum{ .featureNum{
position: absolute; position: absolute;
......
...@@ -65,9 +65,10 @@ ...@@ -65,9 +65,10 @@
<div v-loading="isLoading"> <div v-loading="isLoading">
<el-row v-for="row in pagedTableDataList"> <el-row v-for="row in pagedTableDataList">
<el-col class="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 @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>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div> <div>方向:{{ formatDirection(item.direction) }}</div>
<div>地点:{{ item.gate_name }}</div> <div>地点:{{ item.gate_name }}</div>
...@@ -81,11 +82,15 @@ ...@@ -81,11 +82,15 @@
</div> </div>
</a-col> </a-col>
<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 v-if='featureList.length>0' style="margin-left: 15px;">
<span>{{featureList[0].person_unid}}</span>
<span style="float: right;">{{featureList.length}}</span>
</p>
<el-row class="imgBox1_top" :gutter="10" v-loading="isLoadingFeature"> <el-row class="imgBox1_top" :gutter="10" v-loading="isLoadingFeature">
<el-col :span="6" 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>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<p class="featureNum">{{(item.featureNum).toFixed(2)}}</p> <p class="featureNum">{{(item.featureNum).toFixed(2)}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div> <div>方向:{{ formatDirection(item.direction) }}</div>
...@@ -95,7 +100,10 @@ ...@@ -95,7 +100,10 @@
</el-row> </el-row>
<div class="imgBox2_top" > <div class="imgBox2_top" >
<div class="btns"> <div class="btns">
<p style="float: left;margin-left: 15px;" v-if='comparisonList.length>0'>{{comparisonList.length}}</p> <p v-if='comparisonList.length>0' style="margin-left: 15px;float: left">
<span>{{comparisonList[0].person_unid}}</span>
<span syle="margin-left:30px">{{comparisonList.length}}</span>
</p>
<a-button type="primary" @click="reComparison" >重新比对</a-button> <a-button type="primary" @click="reComparison" >重新比对</a-button>
<a-button type="primary" @click="reComparisonFeature" >重提特征比对</a-button> <a-button type="primary" @click="reComparisonFeature" >重提特征比对</a-button>
</div> </div>
...@@ -103,6 +111,7 @@ ...@@ -103,6 +111,7 @@
<el-col :span="6" 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>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<p class="featureNum">{{(item.featureNum).toFixed(2)}}</p> <p class="featureNum">{{(item.featureNum).toFixed(2)}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div> <div>方向:{{ formatDirection(item.direction) }}</div>
...@@ -434,6 +443,21 @@ ...@@ -434,6 +443,21 @@
} }
) )
} }
const downloadFile = function(item,event){
event.stopPropagation()
if(item.features_url){
window.open(item.features_url)
}else{
ElMessage(
{
message: `该图片没有特征`,
type: 'warning'
}
)
return
}
}
__main() __main()
return { return {
...@@ -466,7 +490,7 @@ ...@@ -466,7 +490,7 @@
chooseItem, chooseItem,
reComparison, reComparison,
reComparisonFeature, reComparisonFeature,
downloadFile
} }
} }
} }
...@@ -483,6 +507,14 @@ ...@@ -483,6 +507,14 @@
.itemBox{ .itemBox{
position: relative; position: relative;
} }
.downloadFile{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
right: 0;
cursor: pointer;
}
.featureNum{ .featureNum{
position: absolute; position: absolute;
top: 0; top: 0;
...@@ -514,10 +546,19 @@ ...@@ -514,10 +546,19 @@
} }
} }
.colItem{ .colItem{
position: relative;
cursor: pointer; cursor: pointer;
div{ margin: 0 5px;
div{
padding-left: 5px; padding-left: 5px;
} }
.downloadFile{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
right: 0;
}
} }
.col{ .col{
flex: 0 0 20%; flex: 0 0 20%;
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!