Skip to content

罗鑫霖 / vion-tools

Go to a project
Commit 51fdd55f by 李君
Options

特征图片点击显示body1

1 parent abdd0417
Inline Side-by-side
Showing 10 changed files with 268 additions and 25 deletions
public/config.js
window._serverHost = ['localhost', '192.168.1.174'].includes(window.location.hostname) ? '36.112.68.214:33333' : window.location.host window._serverHost = ['localhost', '192.168.1.165'].includes(window.location.hostname) ? '36.112.68.214:33333' : window.location.host
window._baseUrl = ['localhost', '192.168.1.174'].includes(window.location.hostname) ? 'http://36.112.68.214:33333/btool/' : `https://${window._serverHost}/btool/` window._baseUrl = ['localhost', '192.168.1.165'].includes(window.location.hostname) ? 'http://36.112.68.214:33333/btool/' : `https://${window._serverHost}/btool/`
window._baseImgUrl = ['localhost', '192.168.1.174'].includes(window.location.hostname) ? 'http://36.112.68.214:33333/images/' : `${window.location.origin}/images/` window._baseImgUrl = ['localhost', '192.168.1.165'].includes(window.location.hostname) ? 'https://store.keliuyun.com/images/' : `${window.location.origin}/images/`
window._socketUrl = ['localhost', '192.168.1.174'].includes(window.location.hostname) ? `wss://${window._serverHost}/` : `wss://${window._serverHost}/` window._socketUrl = ['localhost', '192.168.1.165'].includes(window.location.hostname) ? `wss://${window._serverHost}/` : `wss://${window._serverHost}/`
const log = console.log.bind(console) const log = console.log.bind(console)
src/Request/PublicAxiosInstance.js
...@@ -4,7 +4,7 @@ import Cookies from "js-cookie" ...@@ -4,7 +4,7 @@ import Cookies from "js-cookie"
import {getTimestampString} from "@/PublicUtil/PublicUtil" import {getTimestampString} from "@/PublicUtil/PublicUtil"
import {ElMessage} from 'element-plus' import {ElMessage} from 'element-plus'
// 创建 axios 的一个实例 // 创建 axios 的一个实例
let baseURL = ['localhost', '192.168.1.174'].includes(window.location.hostname) ? '' : window._baseUrl let baseURL = ['localhost', '192.168.1.165'].includes(window.location.hostname) ? '' : window._baseUrl
const axiosInstance = axios.create( const axiosInstance = axios.create(
{ {
baseURL: baseURL baseURL: baseURL
...@@ -15,14 +15,14 @@ const axiosInstance = axios.create( ...@@ -15,14 +15,14 @@ const axiosInstance = axios.create(
axiosInstance.interceptors.request.use( axiosInstance.interceptors.request.use(
config => { config => {
// Cookies.set('atoken','ab703fa7-a386-4572-9bec-0cfa6ed33a08') // Cookies.set('atoken','8ea25327-5fb5-4d7b-a31c-955eff87615b')
if(!Cookies.get('atoken')){ if(!Cookies.get('atoken')){
ElMessage({ ElMessage({
message: `登录过期，请重新登录`, message: `登录过期，请重新登录`,
type: 'warning' type: 'warning'
}) })
setTimeout(()=>{ setTimeout(()=>{
let url = ['localhost', '192.168.1.174'].includes(window.location.hostname) ? 'http://36.112.68.214:33333/' : window.location.origin let url = ['localhost', '192.168.1.165'].includes(window.location.hostname) ? 'http://36.112.68.214:33333/' : window.location.origin
// if(url.includes('36.112.68.214')){ // if(url.includes('36.112.68.214')){
// url = 'http://36.112.68.214:33333/' // url = 'http://36.112.68.214:33333/'
// } // }
...@@ -46,7 +46,7 @@ axiosInstance.interceptors.response.use( ...@@ -46,7 +46,7 @@ axiosInstance.interceptors.response.use(
type: 'warning' type: 'warning'
}) })
setTimeout(()=>{ setTimeout(()=>{
let url = ['localhost', '192.168.1.174'].includes(window.location.hostname) ? 'http://36.112.68.214:33333/' : window.location.origin let url = ['localhost', '192.168.1.165'].includes(window.location.hostname) ? 'http://36.112.68.214:33333/' : window.location.origin
// if(url.includes('36.112.68.214')){ // if(url.includes('36.112.68.214')){
// url = 'http://36.112.68.214:33333/' // url = 'http://36.112.68.214:33333/'
// } // }
......
src/views/ComparisonCapturedPictures/ComparisonCapturedPictures.vue
...@@ -99,6 +99,7 @@ ...@@ -99,6 +99,7 @@
<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> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<span class="el-icon-picture-outline openImage" @click="openImage(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>
...@@ -116,6 +117,7 @@ ...@@ -116,6 +117,7 @@
<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> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<span class="el-icon-picture-outline openImage" @click="openImage(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>
...@@ -129,6 +131,7 @@ ...@@ -129,6 +131,7 @@
</a-row> </a-row>
<DetailDialog ref="DetailDialogRef" /> <DetailDialog ref="DetailDialogRef" />
<DetailDialogComparison ref="DetailDialogComparisonRef" /> <DetailDialogComparison ref="DetailDialogComparisonRef" />
<imgOtherDialog ref="imgOtherDialogRef" />
</template> </template>
<script> <script>
...@@ -153,10 +156,12 @@ ...@@ -153,10 +156,12 @@
import {ElMessage} from 'element-plus' import {ElMessage} from 'element-plus'
import DetailDialog from "./DetailDialog.vue"; import DetailDialog from "./DetailDialog.vue";
import DetailDialogComparison from "./DetailDialogComparison.vue"; import DetailDialogComparison from "./DetailDialogComparison.vue";
import imgOtherDialog from "./imgOtherDialog.vue";
export default { export default {
components: { components: {
DetailDialog, DetailDialog,
DetailDialogComparison DetailDialogComparison,
imgOtherDialog
}, },
setup() { setup() {
// scalar // scalar
...@@ -175,7 +180,7 @@ ...@@ -175,7 +180,7 @@
// ref // ref
const DetailDialogRef = ref(); const DetailDialogRef = ref();
const DetailDialogComparisonRef = ref(); const DetailDialogComparisonRef = ref();
const imgOtherDialogRef = ref()
const pagedTableDataList = computed( const pagedTableDataList = computed(
() => { () => {
return getPagedList(dataList.value, 10) return getPagedList(dataList.value, 10)
...@@ -520,8 +525,6 @@ ...@@ -520,8 +525,6 @@
} }
parmas.persionlistLeft = boxListLeft.value parmas.persionlistLeft = boxListLeft.value
parmas.persionlistRight = boxListRight.value parmas.persionlistRight = boxListRight.value
console.log(clickItemObj.value)
console.log(parmas)
DetailDialogComparisonRef.value.initDialog(clickItemObj.value,parmas); DetailDialogComparisonRef.value.initDialog(clickItemObj.value,parmas);
} }
// 店员特征对比 // 店员特征对比
...@@ -569,6 +572,21 @@ ...@@ -569,6 +572,21 @@
} }
} }
const openImage = function(item,event){
event.stopPropagation()
if(item.features_url){
let url = item.picture_url
imgOtherDialogRef.value.initDialog(url.split('0.jpg')[0]+'1.jpg')
}else{
ElMessage(
{
message: `该图片没有特征`,
type: 'warning'
}
)
return
}
}
__main() __main()
return { return {
...@@ -609,9 +627,11 @@ ...@@ -609,9 +627,11 @@
shoperFeatureComparison, shoperFeatureComparison,
clickItem, clickItem,
downloadFile, downloadFile,
openImage,
// ref // ref
DetailDialogRef, DetailDialogRef,
DetailDialogComparisonRef DetailDialogComparisonRef,
imgOtherDialogRef
} }
} }
} }
...@@ -650,6 +670,14 @@ ...@@ -650,6 +670,14 @@
right: 0; right: 0;
cursor: pointer; cursor: pointer;
} }
.openImage{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
right: 30px;
cursor: pointer;
}
} }
.comparsionBox{ .comparsionBox{
padding-top: 5px; padding-top: 5px;
......
src/views/ComparisonCapturedPictures/DetailDialog.vue
...@@ -26,6 +26,7 @@ ...@@ -26,6 +26,7 @@
<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" @click='clickItem(item)'> <el-image :src="item.picture_url" :fit="'fill'" class="single-image" @click='clickItem(item)'>
</el-image> </el-image>
<span class="el-icon-picture-outline openImage" @click="openImage(item,$event)"></span>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p> <p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
...@@ -41,6 +42,7 @@ ...@@ -41,6 +42,7 @@
</template> </template>
</a-modal> </a-modal>
<imgDialog ref='imgModelRef'></imgDialog> <imgDialog ref='imgModelRef'></imgDialog>
<imgOtherDialog ref="imgOtherDialogRef" ></imgOtherDialog>
</template> </template>
<script> <script>
...@@ -49,15 +51,18 @@ import {isArray } from '@/PublicUtil/Judgment' ...@@ -49,15 +51,18 @@ import {isArray } from '@/PublicUtil/Judgment'
import comparsionResultApi from '@/views/ComparisonCapturedPictures/api' import comparsionResultApi from '@/views/ComparisonCapturedPictures/api'
import clusterResultApi from '@/views/SnapshotCluster/ClusterResult/ClusterResultApi' import clusterResultApi from '@/views/SnapshotCluster/ClusterResult/ClusterResultApi'
import imgDialog from '../SnapshotCluster/imgDialog.vue' import imgDialog from '../SnapshotCluster/imgDialog.vue'
import imgOtherDialog from "./imgOtherDialog.vue";
export default { export default {
components:{ components:{
imgDialog imgDialog,
imgOtherDialog
}, },
setup() { setup() {
const isVisible = ref(false); const isVisible = ref(false);
const isLoading = ref(false); const isLoading = ref(false);
const detailData = ref({}); const detailData = ref({});
const imgModelRef = ref(); const imgModelRef = ref();
const imgOtherDialogRef = ref();
const dataList = ref([]) const dataList = ref([])
const initDialog = (record,parmas) => { const initDialog = (record,parmas) => {
detailData.value = record; detailData.value = record;
...@@ -124,7 +129,21 @@ export default { ...@@ -124,7 +129,21 @@ export default {
} }
} }
const openImage = function(item,event){
event.stopPropagation()
if(item.features_url){
let url = item.picture_url
imgOtherDialogRef.value.initDialog(url.split('0.jpg')[0]+'1.jpg')
}else{
ElMessage(
{
message: `该图片没有特征`,
type: 'warning'
}
)
return
}
}
return { return {
isVisible, isVisible,
detailData, detailData,
...@@ -135,7 +154,9 @@ export default { ...@@ -135,7 +154,9 @@ export default {
formatDirection, formatDirection,
downloadFile, downloadFile,
clickItem, clickItem,
imgModelRef imgModelRef,
imgOtherDialogRef,
openImage
}; };
}, },
}; };
...@@ -177,6 +198,14 @@ export default { ...@@ -177,6 +198,14 @@ export default {
left: 120px; left: 120px;
cursor: pointer; cursor: pointer;
} }
.openImage{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
left: 90px;
cursor: pointer;
}
.featureNum{ .featureNum{
position: absolute; position: absolute;
top: 0; top: 0;
......
src/views/ComparisonCapturedPictures/DetailDialogComparison.vue
...@@ -30,6 +30,7 @@ ...@@ -30,6 +30,7 @@
<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> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<span class="el-icon-picture-outline openImage" @click="openImage(item,$event)"></span>
<p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p> <p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div> <div>方向:{{ formatDirection(item.direction) }}</div>
...@@ -50,6 +51,7 @@ ...@@ -50,6 +51,7 @@
<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> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<span class="el-icon-picture-outline openImage" @click="openImage(item,$event)"></span>
<p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p> <p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div> <div>方向:{{ formatDirection(item.direction) }}</div>
...@@ -65,13 +67,18 @@ ...@@ -65,13 +67,18 @@
<a-button @click="onCancel">返回</a-button> <a-button @click="onCancel">返回</a-button>
</template> </template>
</a-modal> </a-modal>
<imgOtherDialog ref="imgOtherDialogRef" />
</template> </template>
<script> <script>
import { reactive, ref } from "vue"; import { reactive, ref } from "vue";
import {isArray } from '@/PublicUtil/Judgment' import {isArray } from '@/PublicUtil/Judgment'
import comparsionResultApi from '@/views/ComparisonCapturedPictures/api' import comparsionResultApi from '@/views/ComparisonCapturedPictures/api'
import imgOtherDialog from "./imgOtherDialog.vue";
export default { export default {
components: {
imgOtherDialog
},
setup() { setup() {
const isVisible = ref(false); const isVisible = ref(false);
const isLoadingTop = ref(false); const isLoadingTop = ref(false);
...@@ -79,6 +86,7 @@ export default { ...@@ -79,6 +86,7 @@ export default {
const detailData = ref({}); const detailData = ref({});
const dataListLeft = ref([]) const dataListLeft = ref([])
const dataListRight = ref([]) const dataListRight = ref([])
const imgOtherDialogRef = ref()
const initDialog = (record,parmas) => { const initDialog = (record,parmas) => {
detailData.value = record; detailData.value = record;
isVisible.value = true; isVisible.value = true;
...@@ -94,7 +102,6 @@ export default { ...@@ -94,7 +102,6 @@ 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)) {
...@@ -164,6 +171,21 @@ export default { ...@@ -164,6 +171,21 @@ export default {
} }
} }
const openImage = function(item,event){
event.stopPropagation()
if(item.features_url){
let url = item.picture_url
imgOtherDialogRef.value.initDialog(url.split('0.jpg')[0]+'1.jpg')
}else{
ElMessage(
{
message: `该图片没有特征`,
type: 'warning'
}
)
return
}
}
return { return {
isVisible, isVisible,
...@@ -175,7 +197,9 @@ export default { ...@@ -175,7 +197,9 @@ export default {
formatDirection, formatDirection,
isLoadingTop, isLoadingTop,
isLoadingBottom, isLoadingBottom,
downloadFile downloadFile,
openImage,
imgOtherDialogRef
}; };
}, },
}; };
...@@ -205,6 +229,14 @@ export default { ...@@ -205,6 +229,14 @@ export default {
left: 120px; left: 120px;
cursor: pointer; cursor: pointer;
} }
.openImage{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
left: 90px;
cursor: pointer;
}
} }
.featureNum{ .featureNum{
position: absolute; position: absolute;
...@@ -214,4 +246,9 @@ export default { ...@@ -214,4 +246,9 @@ export default {
font-weight: 900; font-weight: 900;
font-size: 16px; font-size: 16px;
} }
.dialogImg{
/deep/.el-dialog--center .el-dialog__body{
text-align: center;
}
}
</style> </style>
src/views/ComparisonCapturedPictures/DetailDialogComparisonNew.vue
...@@ -33,6 +33,7 @@ ...@@ -33,6 +33,7 @@
<el-image :src="item.picture_url" :fit="'fill'" class="single-image" @click='clickItem(item)'> <el-image :src="item.picture_url" :fit="'fill'" class="single-image" @click='clickItem(item)'>
</el-image> </el-image>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<span class="el-icon-picture-outline openImage" @click="openImage(item,$event)"></span>
<p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p> <p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>人员类型:{{ item.person_type==1?'店员':'顾客' }}</div> <div>人员类型:{{ item.person_type==1?'店员':'顾客' }}</div>
...@@ -51,6 +52,7 @@ ...@@ -51,6 +52,7 @@
</template> </template>
</a-modal> </a-modal>
<imgDialog ref='imgModelRef'></imgDialog> <imgDialog ref='imgModelRef'></imgDialog>
<imgOtherDialog ref="imgOtherDialogRef" ></imgOtherDialog>
</template> </template>
<script> <script>
...@@ -59,9 +61,11 @@ import {isArray } from '@/PublicUtil/Judgment' ...@@ -59,9 +61,11 @@ import {isArray } from '@/PublicUtil/Judgment'
import comparsionResultApi from '@/views/ComparisonCapturedPictures/api' import comparsionResultApi from '@/views/ComparisonCapturedPictures/api'
import clusterResultApi from '@/views/SnapshotCluster/ClusterResult/ClusterResultApi' import clusterResultApi from '@/views/SnapshotCluster/ClusterResult/ClusterResultApi'
import imgDialog from '../SnapshotCluster/imgDialog.vue' import imgDialog from '../SnapshotCluster/imgDialog.vue'
import imgOtherDialog from "./imgOtherDialog.vue";
export default { export default {
components:{ components:{
imgDialog imgDialog,
imgOtherDialog
}, },
setup() { setup() {
const isVisible = ref(false); const isVisible = ref(false);
...@@ -73,6 +77,7 @@ export default { ...@@ -73,6 +77,7 @@ export default {
const comparisonList = ref([]) const comparisonList = ref([])
const comparisonNewList = ref([]) const comparisonNewList = ref([])
const imgModelRef = ref(); const imgModelRef = ref();
const imgOtherDialogRef = ref();
watch(comparisonList,(newVal,oldVal)=>{ watch(comparisonList,(newVal,oldVal)=>{
comparisonNewList.value = [] comparisonNewList.value = []
newVal.forEach(item=>{ newVal.forEach(item=>{
...@@ -144,6 +149,21 @@ export default { ...@@ -144,6 +149,21 @@ export default {
} }
} }
const openImage = function(item,event){
event.stopPropagation()
if(item.features_url){
let url = item.picture_url
imgOtherDialogRef.value.initDialog(url.split('0.jpg')[0]+'1.jpg')
}else{
ElMessage(
{
message: `该图片没有特征`,
type: 'warning'
}
)
return
}
}
const clickItem = function(data){ const clickItem = function(data){
clusterResultApi.getBodyPoint({'feature_url':data.features_url}).then((r) => { clusterResultApi.getBodyPoint({'feature_url':data.features_url}).then((r) => {
imgModelRef.value.initDialog(data.picture_url,r.data); imgModelRef.value.initDialog(data.picture_url,r.data);
...@@ -164,7 +184,9 @@ export default { ...@@ -164,7 +184,9 @@ export default {
comparisonNewList, comparisonNewList,
changeShowFun, changeShowFun,
clickItem, clickItem,
imgModelRef imgModelRef,
openImage,
imgOtherDialogRef
}; };
}, },
}; };
...@@ -211,6 +233,14 @@ export default { ...@@ -211,6 +233,14 @@ export default {
left: 120px; left: 120px;
cursor: pointer; cursor: pointer;
} }
.openImage{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
left: 90px;
cursor: pointer;
}
} }
.featureNum{ .featureNum{
position: absolute; position: absolute;
......
src/views/ComparisonCapturedPictures/imgOtherDialog.vue 0 → 100644
<template>
<a-modal
title="body1"
v-if='isVisible'
v-model:visible="isVisible"
width="1200px"
height='90%'
class="detail-modal"
>
<div style="width: 100%;text-align: center;">
<el-image :src="imgUrl" :fit="'contain'" class="single-image"> </el-image>
</div>
<template #footer>
<a-button @click="isVisible=false">返回</a-button>
</template>
</a-modal>
</template>
<script>
import { reactive, ref } from "vue";
export default {
setup() {
const isVisible = ref(false);
const imgUrl = ref()
const initDialog = (url) => {
imgUrl.value = url
isVisible.value = true;
};
return {
isVisible,
initDialog,
imgUrl,
};
},
};
</script>
<style lang="less" scoped>
</style>
src/views/FeatureComparisonVerification/FeatureComparisonVerification.vue
...@@ -69,6 +69,7 @@ ...@@ -69,6 +69,7 @@
<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> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<span class="el-icon-picture-outline openImage" @click="openImage(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>
...@@ -91,6 +92,7 @@ ...@@ -91,6 +92,7 @@
<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> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<span class="el-icon-picture-outline openImage" @click="openImage(item,$event)"></span>
<p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p> <p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div> <div>方向:{{ formatDirection(item.direction) }}</div>
...@@ -112,6 +114,7 @@ ...@@ -112,6 +114,7 @@
<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> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<span class="el-icon-picture-outline openImage" @click="openImage(item,$event)"></span>
<p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p> <p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div> <div>方向:{{ formatDirection(item.direction) }}</div>
...@@ -122,7 +125,15 @@ ...@@ -122,7 +125,15 @@
</div> </div>
</a-col> </a-col>
</a-row> </a-row>
<el-dialog v-model="centerDialogVisible" v-if="centerDialogVisible" title="body1" >
<el-image :src="otherPictureUrl" :fit="'contain'" class="single-image">
</el-image>
<template #footer>
<span class="dialog-footer">
<el-button @click="centerDialogVisible = false">关闭</el-button>
</span>
</template>
</el-dialog>
</template> </template>
<script> <script>
...@@ -152,6 +163,8 @@ ...@@ -152,6 +163,8 @@
const pageSize = ref(10) const pageSize = ref(10)
const total = ref() const total = ref()
const isLoading = ref(false) const isLoading = ref(false)
const centerDialogVisible = ref(false)
const otherPictureUrl = ref()
// sequence // sequence
const dataList = ref([]) const dataList = ref([])
const accountList = ref([]) const accountList = ref([])
...@@ -475,6 +488,22 @@ ...@@ -475,6 +488,22 @@
} }
} }
const openImage = function(item,event){
event.stopPropagation()
if(item.features_url){
centerDialogVisible.value = true;
let url = item.picture_url
otherPictureUrl.value = url.split('0.jpg')[0]+'1.jpg'
}else{
ElMessage(
{
message: `该图片没有特征`,
type: 'warning'
}
)
return
}
}
__main() __main()
return { return {
...@@ -486,6 +515,8 @@ ...@@ -486,6 +515,8 @@
isLoadingFeature, isLoadingFeature,
isLoadingComparison, isLoadingComparison,
currentItemId, currentItemId,
centerDialogVisible,
otherPictureUrl,
// sequence // sequence
accountList, accountList,
plazaList, plazaList,
...@@ -507,7 +538,8 @@ ...@@ -507,7 +538,8 @@
chooseItem, chooseItem,
reComparison, reComparison,
reComparisonFeature, reComparisonFeature,
downloadFile downloadFile,
openImage
} }
} }
} }
...@@ -532,6 +564,14 @@ ...@@ -532,6 +564,14 @@
right: 0; right: 0;
cursor: pointer; cursor: pointer;
} }
.openImage{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
right: 30px;
cursor: pointer;
}
.featureNum{ .featureNum{
position: absolute; position: absolute;
top: 0; top: 0;
...@@ -576,6 +616,14 @@ ...@@ -576,6 +616,14 @@
top: 0; top: 0;
right: 0; right: 0;
} }
.openImage{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
right: 30px;
cursor: pointer;
}
} }
.col{ .col{
flex: 0 0 20%; flex: 0 0 20%;
......
src/views/SnapshotCluster/singleImgComparisonDialog.vue
...@@ -19,6 +19,7 @@ ...@@ -19,6 +19,7 @@
<el-image :src="item.picture_url" :fit="'fill'" class="single-image" @click='clickItem(item)'> <el-image :src="item.picture_url" :fit="'fill'" class="single-image" @click='clickItem(item)'>
</el-image> </el-image>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<span class="el-icon-picture-outline openImage" @click="openImage(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>人员类型:{{ item.person_type==1?'店员':'顾客' }}</div> <div>人员类型:{{ item.person_type==1?'店员':'顾客' }}</div>
...@@ -37,6 +38,7 @@ ...@@ -37,6 +38,7 @@
<el-col :span="8" class="itemBox" v-for="item in comparisonList"> <el-col :span="8" class="itemBox" v-for="item in comparisonList">
<el-image :src="item.picture_url" :fit="'fill'" class="single-image" @click='clickItem(item)'> <el-image :src="item.picture_url" :fit="'fill'" class="single-image" @click='clickItem(item)'>
</el-image> </el-image>
<span class="el-icon-picture-outline openImage" @click="openImage(item,$event)"></span>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p> <p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
...@@ -57,6 +59,7 @@ ...@@ -57,6 +59,7 @@
<el-col :span="8" class="itemBox" v-for="item in reComparisonList"> <el-col :span="8" class="itemBox" v-for="item in reComparisonList">
<el-image :src="item.picture_url" :fit="'fill'" class="single-image" @click='clickItem(item)'> <el-image :src="item.picture_url" :fit="'fill'" class="single-image" @click='clickItem(item)'>
</el-image> </el-image>
<span class="el-icon-picture-outline openImage" @click="openImage(item,$event)"></span>
<span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span> <span class="el-icon-document downloadFile" @click="downloadFile(item,$event)"></span>
<p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p> <p class="featureNum">{{item.featureNum?(item.featureNum).toFixed(2):0}}</p>
<div>时间:{{ item.counttime }}</div> <div>时间:{{ item.counttime }}</div>
...@@ -73,6 +76,7 @@ ...@@ -73,6 +76,7 @@
</template> </template>
</a-modal> </a-modal>
<imgDialog ref='imgModelRef'></imgDialog> <imgDialog ref='imgModelRef'></imgDialog>
<imgOtherDialog ref="imgOtherDialogRef" ></imgOtherDialog>
</template> </template>
<script> <script>
...@@ -81,9 +85,11 @@ import featureApi from '@/views/FeatureComparisonVerification/api.js' ...@@ -81,9 +85,11 @@ import featureApi from '@/views/FeatureComparisonVerification/api.js'
import clusterResultApi from '@/views/SnapshotCluster/ClusterResult/ClusterResultApi' import clusterResultApi from '@/views/SnapshotCluster/ClusterResult/ClusterResultApi'
import {isArray} from '@/PublicUtil/Judgment' import {isArray} from '@/PublicUtil/Judgment'
import imgDialog from './imgDialog.vue' import imgDialog from './imgDialog.vue'
import imgOtherDialog from "../ComparisonCapturedPictures/imgOtherDialog.vue";
export default { export default {
components:{ components:{
imgDialog imgDialog,
imgOtherDialog
}, },
setup() { setup() {
const isVisible = ref(false); const isVisible = ref(false);
...@@ -93,6 +99,7 @@ export default { ...@@ -93,6 +99,7 @@ export default {
const detailData = ref({}); const detailData = ref({});
const featureList = ref([]) const featureList = ref([])
const imgModelRef = ref(); const imgModelRef = ref();
const imgOtherDialogRef = ref();
const comparisonList = ref([]) const comparisonList = ref([])
const reComparisonList = ref([]) const reComparisonList = ref([])
const formatDirection = function(number) { const formatDirection = function(number) {
...@@ -198,6 +205,21 @@ export default { ...@@ -198,6 +205,21 @@ export default {
} }
} }
const openImage = function(item,event){
event.stopPropagation()
if(item.features_url){
let url = item.picture_url
imgOtherDialogRef.value.initDialog(url.split('0.jpg')[0]+'1.jpg')
}else{
ElMessage(
{
message: `该图片没有特征`,
type: 'warning'
}
)
return
}
}
const onCancel = () => { const onCancel = () => {
isVisible.value = false; isVisible.value = false;
}; };
...@@ -217,7 +239,9 @@ export default { ...@@ -217,7 +239,9 @@ export default {
imgModelRef, imgModelRef,
comparisonList, comparisonList,
reComparisonList, reComparisonList,
reComparisonFeature reComparisonFeature,
openImage,
imgOtherDialogRef
}; };
}, },
}; };
...@@ -270,6 +294,14 @@ export default { ...@@ -270,6 +294,14 @@ export default {
right: 10px; right: 10px;
cursor: pointer; cursor: pointer;
} }
.openImage{
position: absolute;
color: #1890ff;
font-size: 32px;
top: 0;
left: 90px;
cursor: pointer;
}
.featureNum{ .featureNum{
position: absolute; position: absolute;
top: 0; top: 0;
......
vue.config.js
...@@ -58,7 +58,7 @@ module.exports = { ...@@ -58,7 +58,7 @@ module.exports = {
devServer: { devServer: {
proxy: { proxy: {
'/': { '/': {
target: 'http://36.112.68.214:22222/btool/', target: 'https://store.keliuyun.com/btool/',
changeOrigin: true changeOrigin: true
} }
} }
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!