Skip to content

罗鑫霖 / vion-tools

Go to a project
Commit b393711c by 李君
Options

特征比对

1 parent 1def2659
Inline Side-by-side
Showing 4 changed files with 374 additions and 0 deletions
src/router/index.js
...@@ -33,6 +33,14 @@ const menuRoute = [ ...@@ -33,6 +33,14 @@ const menuRoute = [
path: 'EquipmentTimeErrorVerification', path: 'EquipmentTimeErrorVerification',
component: () => import("@/views/EquipmentTimeErrorVerification/EquipmentTimeErrorVerification.vue"), component: () => import("@/views/EquipmentTimeErrorVerification/EquipmentTimeErrorVerification.vue"),
}, },
{
path: 'FeatureComparisonVerification',
component: () => import("@/views/FeatureComparisonVerification/FeatureComparisonVerification.vue"),
},
{
path: 'ComparisonCapturedPictures',
component: () => import("@/views/ComparisonCapturedPictures/ComparisonCapturedPictures.vue"),
},
] ]
}, },
] ]
......
src/views/ComparisonCapturedPictures/ComparisonCapturedPictures.vue 0 → 100644
<template>
<div>
抓拍图片对比
</div>
</template>
<script>
</script>
<style>
</style>
src/views/FeatureComparisonVerification/FeatureComparisonVerification.vue 0 → 100644
<template>
<a-row>
<a-col :span="14">
<a-form :model="queryForm" layout="inline" :label-col="{ style: { width: '70px' } }">
<a-form-item label="集团：" style="padding: 5px 0">
<a-select v-model:value="queryForm.account_id" style="width: 280px" mode="multiple" :maxTagCount="1"
@change="onAccountChange" :options="accountList" optionFilterProp="label" show-search>
</a-select>
</a-form-item>
<a-form-item label="广场：" style="padding: 5px 0">
<a-select v-model:value="queryForm.plaza_id" style="width: 280px" mode="multiple" :maxTagCount="1"
@change="onPlazaChange" :options="plazaList" optionFilterProp="label" show-search>
</a-select>
</a-form-item>
<a-form-item label="出入类型：" style="padding: 5px 0">
<a-select v-model:value="queryForm.type" style="width: 280px">
<a-select-option :value="0">全场</a-select-option>
<a-select-option :value="1">广场出入口</a-select-option>
<a-select-option :value="2">楼层出入口</a-select-option>
<a-select-option :value="3">店铺出入口</a-select-option>
<a-select-option :value="4">其他</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="区域信息：" style="padding: 5px 0">
<a-select v-model:value="queryForm.zone_id" style="width: 280px" mode="multiple" :maxTagCount="1"
@change="onZoneChange" :options="zoneList" optionFilterProp="label" show-search>
</a-select>
</a-form-item>
<a-form-item label="监控点：" style="padding: 5px 0">
<a-select v-model:value="queryForm.gate_id" style="width: 280px" mode="multiple" :maxTagCount="1"
:options="gateList" optionFilterProp="label" show-search>
</a-select>
</a-form-item>
<a-form-item label="方向：" style="padding: 5px 0">
<a-select v-model:value="queryForm.direction" mode="multiple" :maxTagCount="1" style="width: 280px">
<a-select-option :value="1">进</a-select-option>
<a-select-option :value="-1">出</a-select-option>
<a-select-option :value="0">横穿</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="抓怕类型：" style="padding: 5px 0">
<a-select v-model:value="queryForm.picType" style="width: 280px">
<a-select-option :value="1">半身照</a-select-option>
<a-select-option :value="2">全身照</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="人员类型：" style="padding: 5px 0">
<a-select v-model:value="queryForm.personType" mode="multiple" :maxTagCount="1"
style="width: 280px">
<a-select-option :value="1">店员</a-select-option>
<a-select-option :value="2">顾客</a-select-option>
</a-select>
</a-form-item>
<a-form-item label="选择日期：" style="padding: 5px 0">
<a-date-picker v-model:value="queryForm.date" :format="'YYYY-MM-DD'" style="width: 280px" />
</a-form-item>
<a-form-item label="选择时间：" style="padding: 5px 0">
<a-time-picker v-model:value="queryForm.startTime" style="width: 140px" />
<a-time-picker v-model:value="queryForm.endTime" style="width: 140px" />
</a-form-item>
<a-form-item style="padding: 5px 0">
<a-button type="primary" @click="confirmSearch" :loading="isLoading">查询</a-button>
</a-form-item>
</a-form>
<div v-loading="isLoading">
<el-row v-for="row in pagedTableDataList">
<el-col :span="6" v-for="item in row">
<div style="margin: 0 5px">
<el-image :src="item.picture_url" :fit="'fill'" class="single-image">
</el-image>
<div>时间:{{ item.counttime }}</div>
<div>方向:{{ formatDirection(item.direction) }}</div>
<div>地点:{{ item.gate_name }}</div>
</div>
</el-col>
</el-row>
<a-pagination v-model:current="pageNum" v-model:pageSize="pageSize" :total="total"
:show-total="total => `共 ${total} 条`" :pageSizeOptions="['12', '24', '48', '192']"
@change="onPageNumChange" @showSizeChange="onPageSizeChange" show-size-changer show-quick-jumper
style="text-align:center" />
</div>
</a-col>
<a-col :span="10">
col-12
</a-col>
</a-row>
</template>
<script>
import {
computed,
reactive,
ref,
toRaw
} from 'vue'
import snapshotRecordApi from '@/views/SnapshotCluster/SnapshotRecord/SnapshotRecordApi'
import {
isArray
} from '@/PublicUtil/Judgment'
import moment from 'moment'
import {
filterEmptyValueInObject,
formatDate,
formatTime,
getPagedList
} from '@/PublicUtil/PublicUtil'
export default {
setup() {
// scalar
const pageNum = ref(1)
const pageSize = ref(12)
const total = ref()
const isLoading = ref(false)
// sequence
const dataList = ref([])
const accountList = ref([])
const plazaList = ref([])
const zoneList = ref([])
const gateList = ref([])
const pagedTableDataList = computed(
() => {
return getPagedList(dataList.value, 8)
}
)
const queryForm = reactive({
account_id: [],
plaza_id: [],
zone_id: [],
gate_id: [],
type: 0,
direction: [1, -1, 0],
picType: 2,
personType: [1, 2],
date: moment(moment().format('YYYY-MM-DD'), 'YYYY-MM-DD'),
startTime: moment('00:00:00', 'HH:mm:ss'),
endTime: moment('23:59:59', 'HH:mm:ss'),
})
// function
const onPageNumChange = function(num) {
pageNum.value = num
confirmSearch()
}
const onPageSizeChange = function(current, size) {
pageNum.value = 1
pageSize.value = size
confirmSearch()
}
const onAccountChange = function() {
getPlazaList()
getZoneList()
getGateList()
}
const onPlazaChange = function() {
getZoneList()
getGateList()
}
const onZoneChange = function() {
getGateList()
}
const getPlazaList = function() {
queryForm.plaza_id = []
plazaList.value = []
snapshotRecordApi.getPlazaList({
account_id: queryForm.account_id.toString()
}).then(
(r) => {
if (isArray(r)) {
for (const item of r) {
plazaList.value.push({
value: item.id,
label: item.name,
})
}
}
}
)
}
const getZoneList = function() {
queryForm.zone_id = []
zoneList.value = []
snapshotRecordApi.getZoneList({
account_id: queryForm.account_id.toString(),
plaza_id: queryForm.plaza_id.toString(),
}).then(
(r) => {
if (isArray(r)) {
for (const item of r) {
zoneList.value.push({
value: item.id,
label: item.name,
})
}
}
}
)
}
const getGateList = function() {
queryForm.gate_id = []
gateList.value = []
snapshotRecordApi.getGateList({
account_id: queryForm.account_id.toString(),
plaza_id: queryForm.plaza_id.toString(),
zone_id: queryForm.zone_id.toString(),
type: queryForm.type,
}).then(
(r) => {
if (isArray(r.data)) {
for (const item of r.data) {
gateList.value.push({
value: item.id,
label: item.name,
})
}
}
}
)
}
const getAccountList = function() {
queryForm.account_id = []
accountList.value = []
snapshotRecordApi.getAccountList().then(
(r) => {
if (isArray(r)) {
for (const item of r) {
accountList.value.push({
value: item.id,
label: item.name,
})
}
}
}
)
}
const confirmSearch = function() {
isLoading.value = true
const rawData = toRaw(queryForm)
const data = filterEmptyValueInObject({
account_id: rawData.account_id.toString(),
type: rawData.type,
plaza_id: rawData.plaza_id.toString(),
zone_id: rawData.zone_id.toString(),
gate_id: rawData.gate_id.toString(),
direction: rawData.direction.toString(),
picType: rawData.picType,
personType: rawData.personType.toString(),
startTime: formatDate(rawData.date) + ' ' + formatTime(rawData.startTime),
endTime: formatDate(rawData.date) + ' ' + formatTime(rawData.endTime),
page: pageNum.value - 1,
pageSize: pageSize.value,
})
snapshotRecordApi.getSnapshotRecordList(data).then(
(r) => {
isLoading.value = false
r.data.persons.forEach((item) => {
let str = item.features_url.indexOf("/images/feature")
if (item.features_url) {
item.features_url = window.location.origin + item.features_url
.substring(str)
}
let str1 = item.picture_url.indexOf("/images/picture")
if (item.picture_url) {
item.picture_url = window.location.origin + item.picture_url.substring(
str1)
}
})
dataList.value = r.data.persons
total.value = r.data.pageNum
}
)
}
const formatDirection = function(number) {
switch (number) {
case 1: {
return '进'
}
case -1: {
return '出'
}
case 0: {
return '横穿'
}
default: {
break
}
}
}
const __main = function() {
getAccountList()
}
__main()
return {
// scalar
isLoading,
pageNum,
pageSize,
total,
// sequence
accountList,
plazaList,
zoneList,
gateList,
pagedTableDataList,
// mapping
queryForm,
// function
onPageNumChange,
onPageSizeChange,
onAccountChange,
onPlazaChange,
onZoneChange,
confirmSearch,
formatDirection,
}
}
}
</script>
<style scoped="scoped">
.single-image {
height: 300px;
width: 100%;
}
</style>
src/views/Main/Main.vue
...@@ -61,6 +61,18 @@ ...@@ -61,6 +61,18 @@
<span style="padding: 0 5px">设备时间错误校验</span> <span style="padding: 0 5px">设备时间错误校验</span>
</div> </div>
</a-menu-item> </a-menu-item>
<a-menu-item :key="'/Main/FeatureComparisonVerification'">
<div class="flex-vertical-center">
<img :src="require('./Icons/7.svg')" style="height: auto;width:20px"/>
<span style="padding: 0 5px">特征对比验证</span>
</div>
</a-menu-item>
<a-menu-item :key="'/Main/ComparisonCapturedPictures'">
<div class="flex-vertical-center">
<img :src="require('./Icons/7.svg')" style="height: auto;width:20px"/>
<span style="padding: 0 5px">抓拍图片对比</span>
</div>
</a-menu-item>
</a-menu> </a-menu>
</el-aside> </el-aside>
<el-main> <el-main>
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!