lcw
This commit is contained in:
228
src/views/backOfficeSystem/ApprovalInformation/Clue/index.vue
Normal file
228
src/views/backOfficeSystem/ApprovalInformation/Clue/index.vue
Normal file
@ -0,0 +1,228 @@
|
||||
<template>
|
||||
<div class="" style="overflow: auto;height: 100%;">
|
||||
<el-card shadow="never" style="border: none;">
|
||||
<template #header>
|
||||
<h3 class="card-header">
|
||||
基础信息
|
||||
</h3>
|
||||
</template>
|
||||
<div class="flex flex-warp just-between">
|
||||
<div class="flex flex-1" v-for="(item, index) in basicInformation" :key="index">
|
||||
<div class="lable">{{ item.label }}：</div>
|
||||
<div v-if="item.showSolt">
|
||||
<DictTag :tag="false" :value="listQuery[item.key]" color="#000" :options="item.options" />
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ listQuery[item.key] }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card shadow="never" style="border: none;">
|
||||
<template #header>
|
||||
<h3 class="card-header">
|
||||
相关人员
|
||||
</h3>
|
||||
</template>
|
||||
<ObjectInformation :item='listQuery' :dict="{ D_BZ_XB }" />
|
||||
</el-card>
|
||||
<el-card shadow="never" style="border: none;">
|
||||
<template #header>
|
||||
<h3 class="card-header">
|
||||
附件
|
||||
</h3>
|
||||
</template>
|
||||
<div class="grid-container">
|
||||
<div class="grid-item flex just-between" style="" v-for="(item, index) in srcList" :key="index">
|
||||
<div class="names">{{ item.name }}</div>
|
||||
<div class="icon"><a :href="setAddress(item.id)" download><el-icon><Download /></el-icon></a></div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</el-card>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import ObjectInformation from './objectInformation.vue'
|
||||
import { qcckGet } from '@/api/qcckApi'
|
||||
import { onMounted, getCurrentInstance, ref, reactive } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { setAddress } from '@/utils/tools'
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_SF, D_BZ_XB, D_GS_XS_LY, D_BZ_SSZT, D_GS_XS_LX, D_GS_XS_QTLX } =
|
||||
proxy.$dict("D_BZ_SF", "D_BZ_XB", "D_GS_XS_LY", "D_BZ_SSZT", "D_GS_XS_LX", "D_GS_XS_QTLX"); //获取字典数据
|
||||
|
||||
// 基础信息
|
||||
const basicInformation = ref(
|
||||
[
|
||||
{
|
||||
label: '线索名称',
|
||||
key: 'xsMc',
|
||||
},
|
||||
{
|
||||
label: '线索类型',
|
||||
key: 'xlLx',
|
||||
showSolt: true,
|
||||
options: D_GS_XS_LX
|
||||
},
|
||||
{
|
||||
label: '情报来源',
|
||||
key: 'qbLy',
|
||||
showSolt: true,
|
||||
options: D_GS_XS_LY
|
||||
},
|
||||
{
|
||||
label: '指向开始时间',
|
||||
key: 'zxkssj'
|
||||
},
|
||||
{
|
||||
label: '指向结束时间',
|
||||
key: 'zxjssj',
|
||||
|
||||
},
|
||||
{
|
||||
label: '指向地点',
|
||||
key: 'zxdz',
|
||||
},
|
||||
{
|
||||
label: '所属专题',
|
||||
key: 'sszt',
|
||||
showSolt: true,
|
||||
options: D_BZ_SSZT
|
||||
}, {
|
||||
label: '线索内容',
|
||||
key: 'xsNr',
|
||||
},
|
||||
]
|
||||
)
|
||||
//根据id获取数据query的id获取数据
|
||||
const listQuery = ref({})
|
||||
// 图片信息
|
||||
const srcList = ref({})
|
||||
const getDataById = (id) => {
|
||||
const params = { id }
|
||||
qcckGet(params, '/mosty-gsxt/qbcj/selectByid').then(res => {
|
||||
listQuery.value = res
|
||||
srcList.value = res.ossList
|
||||
|
||||
// onSubmit(res.ossList)
|
||||
})
|
||||
}
|
||||
const route = useRoute()
|
||||
onMounted(() => {
|
||||
const id = route.query.id
|
||||
getDataById(id)
|
||||
|
||||
})
|
||||
// const onSubmit = async (val) => {
|
||||
// const data = []
|
||||
// for (let i = 0; i < val.length; i++) {
|
||||
// const res = await qcckGet({}, `/mosty-base/minio/file/download/${val[i].id}`)
|
||||
// data.push(res)
|
||||
// }
|
||||
|
||||
// srcList.value = data.reduce((acc, file) => {
|
||||
// const { suffix, url } = file;
|
||||
// const name= suffix.startsWith('.') ? suffix.substring(1) : suffix;
|
||||
// // 如果该后缀的分组不存在，则初始化
|
||||
// if (!acc[name]) {
|
||||
// acc[name] = [];
|
||||
// }
|
||||
// // 将当前文件的 url 推入对应分组的数组
|
||||
// acc[name].push(url);
|
||||
// return acc;
|
||||
// }, []);
|
||||
// console.log(srcList.value);
|
||||
|
||||
// }
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card-header {
|
||||
font-size: 18px;
|
||||
color: #303133;
|
||||
font-weight: 600;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
::v-deep .el-card {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.flex-1 {
|
||||
width: 48%;
|
||||
font-family: verdana;
|
||||
font-size: 14px;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.lable {
|
||||
font-size: 14px;
|
||||
width: 13%;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.el-image {
|
||||
padding: 0 5px;
|
||||
max-width: 300px;
|
||||
max-height: 200px;
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.image-slot {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--el-fill-color-light);
|
||||
color: var(--el-text-color-secondary);
|
||||
font-size: 30px;
|
||||
border: 1px solid silver;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(6, 1fr);
|
||||
/* 5等分列 */
|
||||
gap: 0px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.grid-item {
|
||||
width: 290px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 5px 10px;
|
||||
height: 50px;
|
||||
border-radius: 5px;
|
||||
background-color: aliceblue;
|
||||
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
.names{
|
||||
width: 80%;
|
||||
white-space: nowrap; /* 禁止换行 */
|
||||
overflow: hidden; /* 隐藏溢出内容 */
|
||||
text-overflow: ellipsis; /* 显示省略号 */
|
||||
}
|
||||
.icon{
|
||||
text-align: right;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,59 @@
|
||||
<template>
|
||||
<MyTable :tableData="tableDate.tableData" :tableColumn="tableDate.tableColumn"
|
||||
:tableHeight="tableDate.tableHeight" :key="tableDate.keyCount" :tableConfiger="tableDate.tableConfiger"
|
||||
:controlsWidth="tableDate.controlsWidth">
|
||||
<template #xb="{ row }">
|
||||
<DictTag :tag="false" :value="row.xb" :options="dict.D_BZ_XB" />
|
||||
</template>
|
||||
<template #bqList="{ row }">
|
||||
<span v-if="row.bqList">
|
||||
<span v-for="(it, idx) in row.bqList" :key="idx"> {{ it.bqMc }}、</span>
|
||||
</span>
|
||||
</template>
|
||||
</MyTable>
|
||||
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref,reactive, watch } from 'vue'
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
const props = defineProps({
|
||||
item: {
|
||||
type: Object,
|
||||
default:()=>{}
|
||||
}, dict: {
|
||||
type: Object,
|
||||
default:()=>{}
|
||||
}
|
||||
});
|
||||
let tableDate = reactive({
|
||||
tableData: [],
|
||||
keyCount: 0,
|
||||
tableConfiger: {
|
||||
rowHieght: 61,
|
||||
showSelectType: "null",
|
||||
loading: false,
|
||||
haveControls:false,
|
||||
},
|
||||
total: 0,
|
||||
pageConfiger: {
|
||||
pageSize: 20,
|
||||
pageCurrent: 1
|
||||
}, //分页
|
||||
controlsWidth: 200, //操作栏宽度
|
||||
tableColumn: [
|
||||
{ label: "姓名", prop: "xm" },
|
||||
{ label: "性别", prop: "xb",showSolt:true },
|
||||
{ label: "身份证号", prop: "sfzh" },
|
||||
{ label: "户籍地", prop: "hjdz" },
|
||||
{ label: "户籍地派出所", prop: "hjdpcs" },
|
||||
{ label: "标签", prop: "bqList",showSolt:true }
|
||||
]
|
||||
});
|
||||
watch(() => props.item, (val) => {
|
||||
tableDate.tableData=val.ryList
|
||||
|
||||
},{deep:true})
|
||||
</script>
|
||||
<style lang="css" scoped>
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,203 @@
|
||||
<template>
|
||||
<div class="" style="overflow: auto;height: 100%;">
|
||||
<el-card shadow="never" style="border: none;">
|
||||
<template #header>
|
||||
<h3 class="card-header">
|
||||
基础信息
|
||||
</h3>
|
||||
</template>
|
||||
<div class="flex flex-warp just-between">
|
||||
<div class="flex flex-1" v-for="(item, index) in basicInformation" :key="index">
|
||||
<div class="lable">{{ item.label }}：</div>
|
||||
<div v-if="item.showSolt">
|
||||
<DictTag :tag="false" :value="listQuery[item.key]" color="#000" :options="item.options" />
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ listQuery[item.key] }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card shadow="never" style="border: none;">
|
||||
<template #header>
|
||||
<h3 class="card-header">
|
||||
附件
|
||||
</h3>
|
||||
</template>
|
||||
<div class="grid-container">
|
||||
<div class="grid-item" :key="index">
|
||||
<el-image :src="setAddress( listQuery.ryFjZp)" :zoom-rate="1.2" :max-scale="7" :min-scale="0.2"
|
||||
:preview-src-list="[listQuery.ryFjZp]" show-progress :initial-index="4" fit="cover">
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<el-icon><icon-picture /></el-icon>
|
||||
</div>
|
||||
</template>
|
||||
</el-image>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { Picture as IconPicture } from '@element-plus/icons-vue'
|
||||
// import ObjectInformation from './objectInformation.vue'
|
||||
import { qcckGet } from '@/api/qcckApi'
|
||||
import { onMounted, getCurrentInstance, ref, reactive } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { setAddress } from '@/utils/tools'
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_GS_RQFJ_FXDJ, D_GS_RQFJ_FXLB } =
|
||||
proxy.$dict(
|
||||
"D_BZ_RCSHZT",
|
||||
"D_GS_RQFJ_LX",
|
||||
"D_GS_RQFJ_FXDJ",
|
||||
"D_BZ_SF",
|
||||
"D_GS_RQFJ_FXLB"
|
||||
);
|
||||
// 基础信息
|
||||
const basicInformation = ref(
|
||||
[
|
||||
{
|
||||
label: '姓名',
|
||||
key: 'ryXm',
|
||||
},
|
||||
{
|
||||
label: '电话',
|
||||
key: 'rySjhm'
|
||||
},
|
||||
{
|
||||
label: '身份证号',
|
||||
key: 'rySfzh'
|
||||
},
|
||||
{
|
||||
label: '户籍地址',
|
||||
key: 'ryHjdz',
|
||||
},
|
||||
|
||||
{
|
||||
label: '护照号码',
|
||||
key: 'ryHzhm',
|
||||
},
|
||||
{
|
||||
label: '现住地址',
|
||||
key: 'ryXzdz',
|
||||
},
|
||||
{
|
||||
label: '管辖单位',
|
||||
key: 'gxDwMc',
|
||||
|
||||
}, {
|
||||
label: '责任部门',
|
||||
key: 'ssbm',
|
||||
},
|
||||
{
|
||||
label: '标签',
|
||||
key: 'bqList',
|
||||
},
|
||||
{
|
||||
label: '风险积分',
|
||||
key: 'fxjf',
|
||||
}, {
|
||||
label: '风险等级',
|
||||
key: 'fxDj',
|
||||
showSolt: true,
|
||||
options: D_GS_RQFJ_FXDJ
|
||||
}, {
|
||||
label: '风险类别',
|
||||
key: 'fxLb',
|
||||
showSolt: true,
|
||||
options: D_GS_RQFJ_FXLB
|
||||
}
|
||||
]
|
||||
)
|
||||
|
||||
//根据id获取数据query的id获取数据
|
||||
const listQuery = ref({})
|
||||
// 图片信息
|
||||
const srcList = ref([])
|
||||
const getDataById = (id) => {
|
||||
qcckGet({}, '/mosty-gsxt/tbGsxtRqfjRy/' + id).then(res => {
|
||||
listQuery.value = res
|
||||
|
||||
})
|
||||
}
|
||||
const route = useRoute()
|
||||
onMounted(() => {
|
||||
const id = route.query.id
|
||||
getDataById(id)
|
||||
})
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card-header {
|
||||
font-size: 18px;
|
||||
color: #303133;
|
||||
font-weight: 600;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
::v-deep .el-card {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.flex-1 {
|
||||
width: 48%;
|
||||
font-family: verdana;
|
||||
font-size: 14px;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.lable {
|
||||
font-size: 14px;
|
||||
width: 13%;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.el-image {
|
||||
padding: 0 5px;
|
||||
max-width: 300px;
|
||||
max-height: 200px;
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.image-slot {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--el-fill-color-light);
|
||||
color: var(--el-text-color-secondary);
|
||||
font-size: 30px;
|
||||
border: 1px solid silver;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(6, 1fr);
|
||||
/* 5等分列 */
|
||||
gap: 0px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.grid-item {
|
||||
width: 290px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,184 @@
|
||||
<template>
|
||||
<div class="" style="overflow: auto;height: 100%;">
|
||||
<el-card shadow="never" style="border: none;">
|
||||
<template #header>
|
||||
<h3 class="card-header">
|
||||
基础信息
|
||||
</h3>
|
||||
</template>
|
||||
<div class="flex flex-warp just-between">
|
||||
<div class="flex flex-1" v-for="(item,index) in basicInformation" :key="index">
|
||||
<div class="lable">{{item.label}}：</div>
|
||||
<div v-if="item.showSolt">
|
||||
<DictTag :tag="false" :value="listQuery[item.key]" color="#000"
|
||||
:options="item.options"/>
|
||||
</div>
|
||||
<div v-else>
|
||||
{{ listQuery[item.key] }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card shadow="never" style="border: none;">
|
||||
<template #header>
|
||||
<h3 class="card-header">
|
||||
布控信息
|
||||
</h3>
|
||||
</template>
|
||||
<ObjectInformation :item='listQuery' :dict="{D_BZ_XB}"/>
|
||||
</el-card>
|
||||
<el-card shadow="never" style="border: none;">
|
||||
<template #header>
|
||||
<h3 class="card-header">
|
||||
布控附件
|
||||
</h3>
|
||||
</template>
|
||||
<div class="grid-container">
|
||||
<div v-for="(item,index) in listQuery.ossList" class="grid-item" :key="index">
|
||||
<el-image :src="setAddress(item.id)" :zoom-rate="1.2" :max-scale="7" :min-scale="0.2" :preview-src-list="srcList"
|
||||
show-progress :initial-index="4" fit="cover">
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<el-icon><icon-picture /></el-icon>
|
||||
</div>
|
||||
</template>
|
||||
</el-image>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { Picture as IconPicture } from '@element-plus/icons-vue'
|
||||
import ObjectInformation from './objectInformation.vue'
|
||||
import {qcckGet} from '@/api/qcckApi'
|
||||
import { onMounted ,getCurrentInstance,ref, reactive} from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import {setAddress} from '@/utils/tools'
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_GS_BK_DJ, D_GS_BK_DX,D_GS_BK_CZYQ,D_BZ_XB } = proxy.$dict("D_GS_BK_BKYS","D_BZ_XB","D_GS_BK_SJLX","D_GS_BK_DJ","D_GS_BK_DX","D_GS_BK_ZT","D_GS_BK_CZYQ","D_GS_BK_CZJSDWLX","D_GS_BK_TJFS"); //获取字典数据
|
||||
|
||||
// 基础信息
|
||||
const basicInformation = ref(
|
||||
[
|
||||
{
|
||||
label: '布控对象',
|
||||
key: 'bkDx',
|
||||
showSolt: true,
|
||||
options:D_GS_BK_DX
|
||||
},
|
||||
{
|
||||
label: '布控开始时间',
|
||||
key:'bkSjKs'
|
||||
},
|
||||
{
|
||||
label: '布控结束时间',
|
||||
key:'bkSjJs'
|
||||
},
|
||||
{
|
||||
label: '处置要求',
|
||||
key: 'czYq',
|
||||
showSolt: true,
|
||||
options:D_GS_BK_CZYQ
|
||||
},
|
||||
{
|
||||
label: '布控等级',
|
||||
key: 'bkDj',
|
||||
showSolt: true,
|
||||
options:D_GS_BK_DJ
|
||||
},
|
||||
{
|
||||
label: '布控事由',
|
||||
key:'bkSy'
|
||||
}
|
||||
]
|
||||
)
|
||||
//根据id获取数据query的id获取数据
|
||||
const listQuery = ref({})
|
||||
// 图片信息
|
||||
const srcList = ref([])
|
||||
const getDataById = (id) => {
|
||||
qcckGet({}, '/mosty-gsxt/tbGsxtBk/selectVoById/' + id).then(res => {
|
||||
listQuery.value=res
|
||||
srcList.value=res.ossList.map(v=>setAddress(v.id))
|
||||
})
|
||||
}
|
||||
const route=useRoute()
|
||||
onMounted(() => {
|
||||
const id = route.query.id
|
||||
getDataById(id)
|
||||
})
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.card-header {
|
||||
font-size: 18px;
|
||||
color: #303133;
|
||||
font-weight: 600;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
::v-deep .el-card {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.flex-1 {
|
||||
width: 48%;
|
||||
font-family: verdana;
|
||||
font-size: 14px;
|
||||
margin-bottom: 20px;
|
||||
|
||||
.lable {
|
||||
font-size: 14px;
|
||||
width: 13%;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
.el-image {
|
||||
padding: 0 5px;
|
||||
max-width: 300px;
|
||||
max-height: 200px;
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
}
|
||||
|
||||
.image-slot {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--el-fill-color-light);
|
||||
color: var(--el-text-color-secondary);
|
||||
font-size: 30px;
|
||||
border: 1px solid silver ;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(6, 1fr);
|
||||
/* 5等分列 */
|
||||
gap: 0px;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.grid-item {
|
||||
width: 290px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,56 @@
|
||||
<template>
|
||||
<MyTable :tableData="tableDate.tableData" :tableColumn="tableDate.tableColumn"
|
||||
:tableHeight="tableDate.tableHeight" :key="tableDate.keyCount" :tableConfiger="tableDate.tableConfiger"
|
||||
:controlsWidth="tableDate.controlsWidth">
|
||||
<template #fjZp="{ row }">
|
||||
<el-image :src="row.fjZp"></el-image>
|
||||
</template>
|
||||
<template #ryXb="{ row }">
|
||||
<DictTag :tag="false" :value="row.ryXb" :options="dict.D_BZ_XB" />
|
||||
</template>
|
||||
<template #bqList="{ row }">
|
||||
<span v-if="row.bqList">
|
||||
<span v-for="(it, idx) in row.bqList" :key="idx"> {{ it.bqMc }}、</span>
|
||||
</span>
|
||||
</template>
|
||||
</MyTable>
|
||||
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref,reactive, watch } from 'vue'
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import { tableColumnList } from '../tableRow.js'
|
||||
const props = defineProps({
|
||||
item: {
|
||||
type: Object,
|
||||
default:()=>{}
|
||||
}, dict: {
|
||||
type: Object,
|
||||
default:()=>{}
|
||||
}
|
||||
});
|
||||
let tableDate = reactive({
|
||||
tableData: [],
|
||||
keyCount: 0,
|
||||
tableConfiger: {
|
||||
rowHieght: 61,
|
||||
showSelectType: "null",
|
||||
loading: false,
|
||||
haveControls:false,
|
||||
},
|
||||
total: 0,
|
||||
pageConfiger: {
|
||||
pageSize: 20,
|
||||
pageCurrent: 1
|
||||
}, //分页
|
||||
controlsWidth: 200, //操作栏宽度
|
||||
tableColumn: []
|
||||
});
|
||||
watch(() => props.item, (val) => {
|
||||
tableDate.tableColumn = tableColumnList[val.bkDx]
|
||||
tableDate.tableData=val.bkdxList
|
||||
},{deep:true})
|
||||
</script>
|
||||
<style lang="css" scoped>
|
||||
|
||||
</style>
|
||||
86
src/views/backOfficeSystem/ApprovalInformation/tableRow.js
Normal file
86
src/views/backOfficeSystem/ApprovalInformation/tableRow.js
Normal file
@ -0,0 +1,86 @@
|
||||
let zdList = {}
|
||||
export const Zd = (val) => {
|
||||
console.log(val);
|
||||
zdList = val
|
||||
|
||||
}
|
||||
|
||||
|
||||
export const tableColumnList = {
|
||||
'01': [
|
||||
{ label: "照片", prop: "fjZp", showSolt: true },
|
||||
{ label: "姓名", prop: "ryXm" },
|
||||
{ label: "性别", prop: "ryXb", showSolt: true },
|
||||
{ label: "身份证号", prop: "rySfzh" },
|
||||
{ label: "户籍地", prop: "ryHjd" },
|
||||
{ label: "现居住地址", prop: "ryXjd" },
|
||||
{ label: "虚拟身份", prop: "qtXnsf" },
|
||||
{ label: "车牌号", prop: "clCph" },
|
||||
{ label: "车辆识别代码", prop: "clCjh" },
|
||||
{ label: "特征描述", prop: "qtTzms" },
|
||||
{ label: "预警等级", prop: "yjdj", showSolt: true, options: zdList.D_GS_ZDR_YJDJ },
|
||||
{ label: "标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
], '02': [
|
||||
{ label: "照片", prop: "fjZp", showSolt: true },
|
||||
{ label: "姓名", prop: "ryXm" },
|
||||
{ label: "性别", prop: "ryXb", showSolt: true },
|
||||
{ label: "身份证号", prop: "rySfzh" },
|
||||
{ label: "户籍地", prop: "ryHjd" },
|
||||
{ label: "现居住地址", prop: "ryXjd" },
|
||||
{ label: "虚拟身份", prop: "qtXnsf" },
|
||||
{ label: "车牌号", prop: "clCph" },
|
||||
{ label: "车辆识别代码", prop: "clCjh" },
|
||||
{ label: "特征描述", prop: "qtTzms" },
|
||||
{ label: "预警等级", prop: "yjdj", showSolt: true, options: zdList.D_GS_ZDR_YJDJ },
|
||||
{ label: "标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
], '03': [
|
||||
{ label: "车牌号", prop: "clCph" },
|
||||
{ label: "车辆颜色", prop: "clYs" },
|
||||
{ label: "预警等级", prop: "yjdj", showSolt: true, options: zdList.D_GS_ZDR_YJDJ },
|
||||
{ label: "预警标签", prop: "yjbq", showSolt: true, options: zdList.BD_BK_CLYJBQ },
|
||||
],
|
||||
'04': [
|
||||
{ label: "身份证号", prop: "rySfzh" },
|
||||
{ label: "姓名", prop: "ryXm" },
|
||||
{ label: "性别", prop: "ryXb", showSolt: true },
|
||||
{ label: "预警等级", prop: "yjdj", showSolt: true, options: zdList.D_GS_ZDR_YJDJ },
|
||||
{ label: "标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
],
|
||||
'05': [
|
||||
{ label: "车辆识别代码", prop: "clCjh" },
|
||||
{ label: "车牌号", prop: "clCph" },
|
||||
{ label: "车主姓名", prop: "ryXm" },
|
||||
{ label: "预警等级", prop: "yjdj", showSolt: true, options: zdList.D_GS_ZDR_YJDJ },
|
||||
{ label: "标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
],
|
||||
'06': [
|
||||
{ label: "Mac地址", prop: "mac" },
|
||||
{ label: "预警等级", prop: "yjdj", showSolt: true, options: zdList.D_GS_ZDR_YJDJ },
|
||||
{ label: "标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
],
|
||||
'07': [
|
||||
{ label: "IMEI", prop: "imei" },
|
||||
{ label: "预警等级", prop: "yjdj", showSolt: true, options: zdList.D_GS_ZDR_YJDJ },
|
||||
{ label: "标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
],
|
||||
'08': [
|
||||
{ label: "IMSI", prop: "imsi" },
|
||||
{ label: "预警等级", prop: "yjdj", showSolt: true, options: zdList.D_GS_ZDR_YJDJ },
|
||||
{ label: "标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
],
|
||||
'09': [
|
||||
{ label: "电话", prop: "rySjhm", type: "input" },
|
||||
{ label: "姓名", prop: "ryXm" },
|
||||
{ label: "性别", prop: "ryXb", showSolt: true },
|
||||
{ label: "预警等级", prop: "yjdj", showSolt: true, options: zdList.D_GS_ZDR_YJDJ },
|
||||
{ label: "标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
], '10': [
|
||||
{ label: "照片", prop: "fjZp", showSolt: true },
|
||||
{ label: "姓名", prop: "ryXm" },
|
||||
{ label: "性别", prop: "ryXb", showSolt: true },
|
||||
{ label: "身份证号", prop: "rySfzh" },
|
||||
{ label: "预警等级", prop: "yjdj", showSolt: true, options: zdList.D_GS_ZDR_YJDJ },
|
||||
{ label: "标签", prop: "bqList", showSolt: true, showOverflowTooltip: true }
|
||||
],
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user