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