更新页面
This commit is contained in:
@ -184,7 +184,4 @@ watch(()=>props.modelValue,val=>{
|
|||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.el-dialog__title {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="form-item-box" :style="{ width: width }">
|
<div class="form-item-box" :class="props.showBtn?'showBtn-upload':''" :style="{ width: width }">
|
||||||
<el-upload
|
<el-upload
|
||||||
v-bind="$attrs"
|
v-bind="$attrs"
|
||||||
:headers="headers"
|
:headers="headers"
|
||||||
@ -7,24 +7,24 @@
|
|||||||
class="avatar-uploader"
|
class="avatar-uploader"
|
||||||
:limit="props.limit"
|
:limit="props.limit"
|
||||||
:action="actionUrl"
|
:action="actionUrl"
|
||||||
list-type="picture-card"
|
:list-type=" props.showBtn ? '' :'picture-card'"
|
||||||
:file-list="fileList"
|
:file-list="fileList"
|
||||||
show-file-list
|
show-file-list
|
||||||
:on-exceed="handleExceed"
|
:on-exceed="handleExceed"
|
||||||
:on-success="handlerSuccess"
|
:on-success="handlerSuccess"
|
||||||
:before-upload="beforeImgUpload"
|
:before-upload="beforeImgUpload"
|
||||||
>
|
>
|
||||||
|
|
||||||
<template #default>
|
<template #default>
|
||||||
<el-icon> <Plus /> </el-icon>
|
<el-button v-if="props.showBtn" size="small" type="primary">上传文件</el-button>
|
||||||
|
<el-icon v-else> <Plus /> </el-icon>
|
||||||
</template>
|
</template>
|
||||||
<template #file="{ file }">
|
<template #file="{ file }" v-if="!props.showBtn">
|
||||||
<div v-if="props.isImg">
|
<div v-if="props.isImg">
|
||||||
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
|
<img class="el-upload-list__item-thumbnail" :src="file.url" alt="" />
|
||||||
<span class="el-upload-list__item-actions">
|
<span class="el-upload-list__item-actions">
|
||||||
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
|
<span class="el-upload-list__item-preview" @click="handlePictureCardPreview(file)">
|
||||||
<el-icon>
|
<el-icon> <zoom-in /></el-icon>
|
||||||
<zoom-in />
|
|
||||||
</el-icon>
|
|
||||||
</span>
|
</span>
|
||||||
<span
|
<span
|
||||||
v-if="!disabled"
|
v-if="!disabled"
|
||||||
@ -79,13 +79,11 @@ import {
|
|||||||
ref,
|
ref,
|
||||||
defineProps,
|
defineProps,
|
||||||
defineEmits,
|
defineEmits,
|
||||||
defineExpose,
|
|
||||||
computed,
|
computed,
|
||||||
watch,
|
watch,
|
||||||
onMounted
|
onMounted
|
||||||
} from "vue";
|
} from "vue";
|
||||||
import { ElMessage, ElMessageBox } from "element-plus";
|
import { ElMessage } from "element-plus";
|
||||||
import type from "element-plus/es/components/upload/src/upload.type";
|
|
||||||
import { useStore } from "vuex";
|
import { useStore } from "vuex";
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
//获取组件传值
|
//获取组件传值
|
||||||
@ -104,6 +102,10 @@ const props = defineProps({
|
|||||||
width: {
|
width: {
|
||||||
default: COMPONENT_WIDTH,
|
default: COMPONENT_WIDTH,
|
||||||
type: String
|
type: String
|
||||||
|
},
|
||||||
|
showBtn:{
|
||||||
|
type:Boolean,
|
||||||
|
default:false
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -184,6 +186,8 @@ const headers = ref({
|
|||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
if (props.modelValue) {
|
if (props.modelValue) {
|
||||||
|
console.log(props.modelValue,'==========props.modelValue');
|
||||||
|
console.log(fileList.value,'====键');
|
||||||
fileList.value = props.modelValue.map((el) => {
|
fileList.value = props.modelValue.map((el) => {
|
||||||
return {
|
return {
|
||||||
url: `/mosty-api/mosty-base/minio/image/download/` + el
|
url: `/mosty-api/mosty-base/minio/image/download/` + el
|
||||||
@ -191,6 +195,7 @@ onMounted(() => {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
const fileList = ref([]);
|
const fileList = ref([]);
|
||||||
const handlerSuccess = (res, file) => {
|
const handlerSuccess = (res, file) => {
|
||||||
file.url = `/mosty-api/mosty-base/minio/image/download/` + res.data;
|
file.url = `/mosty-api/mosty-base/minio/image/download/` + res.data;
|
||||||
|
|||||||
@ -4,10 +4,11 @@
|
|||||||
:model="listQuery"
|
:model="listQuery"
|
||||||
:label-width="props.labelWidth"
|
:label-width="props.labelWidth"
|
||||||
:rules="props.rules"
|
:rules="props.rules"
|
||||||
:inline="true"
|
:inline="props.inline"
|
||||||
label-position="right"
|
label-position="right"
|
||||||
>
|
>
|
||||||
<el-form-item
|
<el-form-item
|
||||||
|
:class="myClass"
|
||||||
v-for="item in props.formList"
|
v-for="item in props.formList"
|
||||||
:style="item.width && { width: item.width }"
|
:style="item.width && { width: item.width }"
|
||||||
:prop="item.prop"
|
:prop="item.prop"
|
||||||
@ -63,7 +64,7 @@
|
|||||||
/>
|
/>
|
||||||
<!-- 部门department -->
|
<!-- 部门department -->
|
||||||
<template v-else-if="item.type === 'department'">
|
<template v-else-if="item.type === 'department'">
|
||||||
<MOSTY.Department clearable v-model="listQuery[item.prop]" />
|
<MOSTY.Department style="width: 100%;" clearable v-model="listQuery[item.prop]" />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<!-- 上传 upload -->
|
<!-- 上传 upload -->
|
||||||
@ -183,6 +184,10 @@ const props = defineProps({
|
|||||||
modelValue: {
|
modelValue: {
|
||||||
type: Object,
|
type: Object,
|
||||||
default: {}
|
default: {}
|
||||||
|
},
|
||||||
|
inline:{
|
||||||
|
type:Boolean,
|
||||||
|
default:true
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
const elform = ref();
|
const elform = ref();
|
||||||
@ -196,6 +201,10 @@ const submit = (resfun) => {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const reset = () =>{
|
||||||
|
elform.value.resetFields()
|
||||||
|
}
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
() => listQuery.value,
|
() => listQuery.value,
|
||||||
(newVal) => {
|
(newVal) => {
|
||||||
@ -215,5 +224,5 @@ watch(
|
|||||||
{ immediate: true, deep: true }
|
{ immediate: true, deep: true }
|
||||||
);
|
);
|
||||||
|
|
||||||
defineExpose({ submit });
|
defineExpose({ submit,reset });
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@ -329,18 +329,6 @@ export const publicRoutes = [
|
|||||||
name: "HumanIntelligence",
|
name: "HumanIntelligence",
|
||||||
meta: { title: "人力情报采集管理系统", icon: "article" },
|
meta: { title: "人力情报采集管理系统", icon: "article" },
|
||||||
children: [
|
children: [
|
||||||
{
|
|
||||||
path: "/RlStatisticalAnalysis",
|
|
||||||
name: "RlStatisticalAnalysis",
|
|
||||||
component: () =>
|
|
||||||
import(
|
|
||||||
"@/views/backOfficeSystem/HumanIntelligence/RlStatisticalAnalysis/index"
|
|
||||||
),
|
|
||||||
meta: {
|
|
||||||
title: "人力情报统计分析",
|
|
||||||
icon: "article"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
path: "/CollectCrculate",
|
path: "/CollectCrculate",
|
||||||
name: "CollectCrculate",
|
name: "CollectCrculate",
|
||||||
@ -353,6 +341,19 @@ export const publicRoutes = [
|
|||||||
icon: "article"
|
icon: "article"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: "/RlStatisticalAnalysis",
|
||||||
|
name: "RlStatisticalAnalysis",
|
||||||
|
component: () =>
|
||||||
|
import(
|
||||||
|
"@/views/backOfficeSystem/HumanIntelligence/RlStatisticalAnalysis/index"
|
||||||
|
),
|
||||||
|
meta: {
|
||||||
|
title: "人力情报统计分析",
|
||||||
|
icon: "article"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
path: "/TaskScheduling",
|
path: "/TaskScheduling",
|
||||||
name: "TaskScheduling",
|
name: "TaskScheduling",
|
||||||
|
|||||||
@ -1,175 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">智能采集设备信息{{ title }}</span>
|
|
||||||
<div>
|
|
||||||
<el-button type="primary" v-if="title != '详情'" size="small" :loading="loading" @click="submit">保存</el-button>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="视频设备代码">
|
|
||||||
<el-input v-model="listQuery.sbbh" placeholder="011022"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="设备名称">
|
|
||||||
<el-input v-model="listQuery.sbmc" placeholder="设备1"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="品牌型号">
|
|
||||||
<el-input v-model="listQuery.ppxh" placeholder="xxxxxx"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="IP地址">
|
|
||||||
<el-input v-model="listQuery.ip" placeholder="58.1265.5545.20"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="网络端口号">
|
|
||||||
<el-input v-model="listQuery.wldkh" placeholder="100"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="行政区划">
|
|
||||||
<el-input v-model="listQuery.xzqh" placeholder="巴宜区纺织路派出所"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="设备工作状态">
|
|
||||||
<el-input v-model="listQuery.sbgzzt" placeholder="正常工作"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="天上人间ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="经度">
|
|
||||||
<el-input v-model="listQuery.jd" placeholder="101.3235165515"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="纬度">
|
|
||||||
<el-input v-model="listQuery.wd" placeholder="28.132132156"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
list: [
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 提交
|
|
||||||
const submit = ()=>{
|
|
||||||
elform.value.validate((valid) => {
|
|
||||||
if (!valid) return false;
|
|
||||||
// loading.value = true;
|
|
||||||
let params = { ...listQuery.value}
|
|
||||||
let url = title.value == '新增' ? '/mosty-lzcj/tbDwYy/insert' :'/mosty-lzcj/tbDwYy/update'
|
|
||||||
// qcckPost(params, url).then((res) => {
|
|
||||||
// proxy.$message({ type: "success", message: title.value+'成功'});
|
|
||||||
// close()
|
|
||||||
// emit("updateDate",modelLx.value);
|
|
||||||
// }).catch(()=>{
|
|
||||||
// loading.value = false;
|
|
||||||
// });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
title.value = type == 'add' ? '新增' : type == 'eidt' ? '编辑' : '详情'
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.labelTileile{
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
line-height: 30px;
|
|
||||||
padding-left: 8px;
|
|
||||||
// text-align: center;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,162 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="智能采集设备信息">
|
|
||||||
<el-button type="primary" @click="addEdit('add', '')">
|
|
||||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
|
||||||
<span style="vertical-align: middle">新增</span>
|
|
||||||
</el-button>
|
|
||||||
</PageTitle>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('eidt', row)">编辑</el-button>
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
<el-button size="small" @click="delDictItem([row.id])" type="danger">删除</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "场所名称", prop: 'name', placeholder: "场所名称", showType: "input" },
|
|
||||||
{ label: "行政区划", prop: 'xzqh', placeholder: "行政区划", showType: "input" },
|
|
||||||
{ label: "设备工作状态", prop: 'sbgzzt', placeholder: "设备工作状态", showType: "input" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{name: '天上人间ktv', sbmc: '设备1', sbgzzt: '正常工作', xzqh: '巴宜区纺织路派出所', jd: '101.32351651515', wd: '28.132132156'},
|
|
||||||
{name: '天上人间ktv', sbmc: '设备2', sbgzzt: '正常工作', xzqh: '巴宜区纺织路派出所', jd: '101.32351651515', wd: '28.132132156'},
|
|
||||||
{name: '天上人间ktv', sbmc: '设备3', sbgzzt: '正常工作', xzqh: '巴宜区纺织路派出所', jd: '101.32351651515', wd: '28.132132156'},
|
|
||||||
{name: '天上人间ktv', sbmc: '设备4', sbgzzt: '正常工作', xzqh: '巴宜区纺织路派出所', jd: '101.32351651515', wd: '28.132132156'},
|
|
||||||
{name: '天上人间ktv', sbmc: '设备5', sbgzzt: '正常工作', xzqh: '巴宜区纺织路派出所', jd: '101.32351651515', wd: '28.132132156'},
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 200, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "name" },
|
|
||||||
{ label: "设备名称", prop: "sbmc" },
|
|
||||||
{ label: "设备工作状态", prop: "sbgzzt" },
|
|
||||||
{ label: "行政区划", prop: "xzqh" },
|
|
||||||
{ label: "经度", prop: "jd" },
|
|
||||||
{ label: "纬度", prop: "wd" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 删除
|
|
||||||
const delDictItem = (ids) =>{
|
|
||||||
let url = '/mosty-lzcj/tbDwMbkf/delete';
|
|
||||||
proxy.$confirm("确定要删除", "警告", {type: "warning"}).then(() => {
|
|
||||||
// qcckPost(ids,url).then(()=>{
|
|
||||||
// proxy.$message({ type: "success", message: "删除成功" });
|
|
||||||
// getList(chooseType.value);
|
|
||||||
// })
|
|
||||||
}).catch(() => {});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,157 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">机动车抓拍采集信息详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="视频设备代码">
|
|
||||||
<el-input v-model="listQuery.videoDeviceCode" placeholder="011022"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="日期时间">
|
|
||||||
<el-input v-model="listQuery.captureTime" placeholder="2025/1/20 10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="机动车号牌号码">
|
|
||||||
<el-input v-model="listQuery.plateNumber" placeholder="藏C 123456"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="机动车号牌颜色">
|
|
||||||
<el-input v-model="listQuery.plateColor" placeholder="绿色"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="机动车号牌种类">
|
|
||||||
<el-input v-model="listQuery.plateType" placeholder="纯电动车"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="机动车车身颜色">
|
|
||||||
<el-input v-model="listQuery.vehicleColor" placeholder="黑色"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="抓拍图片" >
|
|
||||||
<div class="image-group">
|
|
||||||
<div class="image-item" v-for="(item, index) in listQuery.captureImages" :key="index">
|
|
||||||
<el-image :src="item.img" fit="cover"></el-image>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="车牌图片" >
|
|
||||||
<div class="image-group">
|
|
||||||
<div class="image-item" v-for="(item, index) in listQuery.plateImages" :key="index">
|
|
||||||
<el-image :src="item.img" fit="cover"></el-image>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
videoDeviceCode: '',
|
|
||||||
captureTime: '',
|
|
||||||
plateNumber: '',
|
|
||||||
plateColor: '',
|
|
||||||
plateType: '',
|
|
||||||
vehicleColor: '',
|
|
||||||
captureImages: [
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
],
|
|
||||||
plateImages: [
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.image-group {
|
|
||||||
display: flex;
|
|
||||||
gap: 10px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
|
|
||||||
.image-item {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
border: 1px solid #dcdfe6;
|
|
||||||
|
|
||||||
.el-image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,164 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="机动车抓拍采集信息"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 抓拍图片 -->
|
|
||||||
<template #captureImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.captureImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.captureImage]">
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 车牌图片 -->
|
|
||||||
<template #licensePlateImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.licensePlateImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.licensePlateImage]">
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "视频设备编号", prop: 'deviceNo', placeholder: "请输入视频设备编号", showType: "input" },
|
|
||||||
{ label: "日期时间", prop: 'dateTime', placeholder: "请选择日期时间", showType: "date" },
|
|
||||||
]);
|
|
||||||
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{deviceNo:'123456789', captureImage:'', licensePlateImage:'', dateTime:'2025/1/20 10:00:00', plateNumber:'藏G 123456', plateType:'绿牌电动车'},
|
|
||||||
{deviceNo:'123456789', captureImage:'', licensePlateImage:'', dateTime:'2025/1/20 10:00:00', plateNumber:'藏G 123456', plateType:'绿牌电动车'},
|
|
||||||
{deviceNo:'123456789', captureImage:'', licensePlateImage:'', dateTime:'2025/1/20 10:00:00', plateNumber:'藏G 123456', plateType:'绿牌电动车'},
|
|
||||||
{deviceNo:'123456789', captureImage:'', licensePlateImage:'', dateTime:'2025/1/20 10:00:00', plateNumber:'藏G 123456', plateType:'绿牌电动车'},
|
|
||||||
{deviceNo:'123456789', captureImage:'', licensePlateImage:'', dateTime:'2025/1/20 10:00:00', plateNumber:'藏G 123456', plateType:'绿牌电动车'},
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 120,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "序号", type: "index", width: 60 },
|
|
||||||
{ label: "视频设备编号", prop: "deviceNo" },
|
|
||||||
{ label: "抓拍图片", prop: "captureImage", slot: true },
|
|
||||||
{ label: "车牌图片", prop: "licensePlateImage", slot: true },
|
|
||||||
{ label: "日期时间", prop: "dateTime" },
|
|
||||||
{ label: "机动车号牌", prop: "plateNumber" },
|
|
||||||
{ label: "机动车号牌种类", prop: "plateType" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,135 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">从业人员涉及案事件信息</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="姓名">
|
|
||||||
<el-input v-model="listQuery.xm" placeholder="张三"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="证件号码">
|
|
||||||
<el-input v-model="listQuery.zjhm" placeholder="512412547865963541"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.csdm" placeholder="01"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="天上人间ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="案事件编号">
|
|
||||||
<el-input v-model="listQuery.asjbh" placeholder="1234567"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="案事件发生时间">
|
|
||||||
<el-input v-model="listQuery.ajfssj" placeholder="2025/1/20 10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="案事件类别">
|
|
||||||
<el-input v-model="listQuery.ajlb" placeholder="刑事案件"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="案事件处理结果">
|
|
||||||
<el-input v-model="listQuery.ajclqk" placeholder=""/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="简要案情">
|
|
||||||
<el-input type="textarea" v-model="listQuery.jyaq" :rows="4" placeholder="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,164 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="从业人员涉及案事件信息">
|
|
||||||
<el-button type="primary" @click="addEdit('add', '')">
|
|
||||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
|
||||||
<span style="vertical-align: middle">新增</span>
|
|
||||||
</el-button>
|
|
||||||
</PageTitle>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('eidt', row)">编辑</el-button>
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
<el-button size="small" @click="delDictItem([row.id])" type="danger">删除</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "场所名称", prop: 'csmc', placeholder: "请输入场所名称", showType: "input" },
|
|
||||||
{ label: "案件发生时间", prop: 'ajfssj', placeholder: "请选择案件发生时间", showType: "date" },
|
|
||||||
{ label: "案件类别", prop: 'ajlb', placeholder: "请选择案件类别", showType: "input" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{csmc:'天上人间ktv', xm:'张三', ajlb:'刑事', ajfssj:'2022/1/20 10:00:00', ajclqk:'', jyaq:'xxxxxxxxxx'},
|
|
||||||
{csmc:'天上人间ktv', xm:'张三', ajlb:'纠纷', ajfssj:'2022/1/20 10:00:00', ajclqk:'', jyaq:'xxxxxxxxxx'},
|
|
||||||
{csmc:'天上人间ktv', xm:'张三', ajlb:'纠纷', ajfssj:'2022/1/20 10:00:00', ajclqk:'', jyaq:'xxxxxxxxxx'},
|
|
||||||
{csmc:'天上人间ktv', xm:'张三', ajlb:'纠纷', ajfssj:'2022/1/20 10:00:00', ajclqk:'', jyaq:'xxxxxxxxxx'},
|
|
||||||
{csmc:'天上人间ktv', xm:'张三', ajlb:'纠纷', ajfssj:'2022/1/20 10:00:00', ajclqk:'', jyaq:'xxxxxxxxxx'},
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 200, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "csmc" },
|
|
||||||
{ label: "姓名", prop: "xm" },
|
|
||||||
{ label: "案件类别", prop: "ajlb" },
|
|
||||||
{ label: "案事件发生时间", prop: "ajfssj" },
|
|
||||||
{ label: "案事件处理结果", prop: "ajclqk" },
|
|
||||||
{ label: "简要案情", prop: "jyaq" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 删除
|
|
||||||
const delDictItem = (ids) =>{
|
|
||||||
let url = '/mosty-lzcj/tbDwMbkf/delete';
|
|
||||||
proxy.$confirm("确定要删除", "警告", {type: "warning"}).then(() => {
|
|
||||||
// qcckPost(ids,url).then(()=>{
|
|
||||||
// proxy.$message({ type: "success", message: "删除成功" });
|
|
||||||
// getList(chooseType.value);
|
|
||||||
// })
|
|
||||||
}).catch(() => {});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,139 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">公安机关日常检查信息详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.csdm" placeholder="01"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="天上人间ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="日常检查登记号">
|
|
||||||
<el-input v-model="listQuery.rcjcdjh" placeholder="1"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所负责人">
|
|
||||||
<el-input v-model="listQuery.csfzr" placeholder="李四"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="检查人姓名">
|
|
||||||
<el-input v-model="listQuery.jcrxm" placeholder="张三"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="检查人警号">
|
|
||||||
<el-input v-model="listQuery.jcrjh" placeholder="123456"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="公安机关机构代码">
|
|
||||||
<el-input v-model="listQuery.gajgjgdm" placeholder="1234566"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="检查部门">
|
|
||||||
<el-input v-model="listQuery.jcbm" placeholder="巴宜区防范路演出所"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="场所检查简要情况">
|
|
||||||
<el-input type="textarea" v-model="listQuery.csjcjyqk" :rows="4" placeholder="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="检查结果简要情况">
|
|
||||||
<el-input type="textarea" v-model="listQuery.jcjgjyqk" :rows="4" placeholder="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,147 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="公安机关日常检查信息"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "场所名称", prop: 'name', placeholder: "场所名称", showType: "input" },
|
|
||||||
{ label: "检查类型", prop: 'checkType', placeholder: "检查类型", showType: "input" },
|
|
||||||
{ label: "检查日期", prop: 'checkDate', placeholder: "检查日期", showType: "date" },
|
|
||||||
]);
|
|
||||||
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{name:'天上人间ktv',checkType:'日常检查',checkPerson:'张山',policeNo:'123456',checkDept:'巴宜区纺织路派出所',checkDate:'2025/1/20 10:00:00',manager:'李四'},
|
|
||||||
{name:'天上人间ktv',checkType:'日常检查',checkPerson:'张山',policeNo:'123456',checkDept:'巴宜区纺织路派出所',checkDate:'2025/1/20 10:00:00',manager:'李四'},
|
|
||||||
{name:'天上人间ktv',checkType:'日常检查',checkPerson:'张山',policeNo:'123456',checkDept:'巴宜区纺织路派出所',checkDate:'2025/1/20 10:00:00',manager:'李四'},
|
|
||||||
{name:'天上人间ktv',checkType:'日常检查',checkPerson:'张山',policeNo:'123456',checkDept:'巴宜区纺织路派出所',checkDate:'2025/1/20 10:00:00',manager:'李四'},
|
|
||||||
{name:'天上人间ktv',checkType:'日常检查',checkPerson:'张山',policeNo:'123456',checkDept:'巴宜区纺织路派出所',checkDate:'2025/1/20 10:00:00',manager:'李四'},
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 120,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "name" },
|
|
||||||
{ label: "检查类型", prop: "checkType" },
|
|
||||||
{ label: "检查人姓名", prop: "checkPerson" },
|
|
||||||
{ label: "检查人警号", prop: "policeNo" },
|
|
||||||
{ label: "检查部门", prop: "checkDept" },
|
|
||||||
{ label: "检查日期", prop: "checkDate" },
|
|
||||||
{ label: "场所负责人", prop: "manager" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,135 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">安全防范设备信息详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.csdm" placeholder="01"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="天上人间ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="安全防范设备类型">
|
|
||||||
<el-input v-model="listQuery.aqffsblx" placeholder="灭火器"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="设备名称">
|
|
||||||
<el-input v-model="listQuery.sbmc" placeholder="干粉灭火器"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="设备序号">
|
|
||||||
<el-input v-model="listQuery.sbxh" placeholder="1234566"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="品牌型号">
|
|
||||||
<el-input v-model="listQuery.ppxh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="厂商名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="xxxxxxx"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="安全防范设备数量">
|
|
||||||
<el-input v-model="listQuery.sl" placeholder="100"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="检测机构名称" style="width:50%;">
|
|
||||||
<el-input v-model="listQuery.jcjgmc" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,145 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="安全防范设备信息"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "场所名称", prop: 'name', placeholder: "请输入场所名称", showType: "input" },
|
|
||||||
{ label: "设备名称", prop: 'sbmc', placeholder: "请输入设备名称", showType: "input" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{name:'天上人间ktv', aqffsblx:'灭火器', sbmc:'干粉灭火器', cjsmc:'xxxxx', sl:100},
|
|
||||||
{name:'天上人间ktv', aqffsblx:'灭火器', sbmc:'干粉灭火器', cjsmc:'xxxxx', sl:100},
|
|
||||||
{name:'天上人间ktv', aqffsblx:'灭火器', sbmc:'干粉灭火器', cjsmc:'xxxxx', sl:100},
|
|
||||||
{name:'天上人间ktv', aqffsblx:'灭火器', sbmc:'干粉灭火器', cjsmc:'xxxxx', sl:100},
|
|
||||||
{name:'天上人间ktv', aqffsblx:'灭火器', sbmc:'干粉灭火器', cjsmc:'xxxxx', sl:100},
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 120, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "name" },
|
|
||||||
{ label: "安全防范设备类型", prop: "aqffsblx" },
|
|
||||||
{ label: "设备名称", prop: "sbmc" },
|
|
||||||
{ label: "厂商名称", prop: "cjsmc" },
|
|
||||||
{ label: "品牌型号", prop: "ppxh" },
|
|
||||||
{ label: "安全防范设备数量", prop: "sl" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,268 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">{{ title }}</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-tabs v-model="activeName">
|
|
||||||
<el-tab-pane label="场所信息" name="basic">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="flex align-center">
|
|
||||||
<div style="width: calc(100% - 176px);">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="娱乐特行场所类型">
|
|
||||||
<el-input v-model="listQuery.cslx" placeholder="ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="统一社会信用代码">
|
|
||||||
<el-input v-model="listQuery.tyshxydm" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="单位名称(营业执照登记名称)">
|
|
||||||
<el-input v-model="listQuery.dwmc" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.csdm" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所联系电话">
|
|
||||||
<el-input v-model="listQuery.cslxdh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="经营状况">
|
|
||||||
<el-input v-model="listQuery.jyzt" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="开业日期">
|
|
||||||
<el-input v-model="listQuery.kyrq" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<img height="130" src="@/assets/images/person.png" alt="">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="单位注册地址">
|
|
||||||
<el-input v-model="listQuery.dwzcdz" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="场所地址">
|
|
||||||
<el-input v-model="listQuery.csdz" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<div class="flex align-center">
|
|
||||||
<div style="width: calc(100% - 176px);">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="法定代表人">
|
|
||||||
<el-input v-model="listQuery.fddbr" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="法定代表人证件号码">
|
|
||||||
<el-input v-model="listQuery.fddbrzjhm" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="法定代表人联系电话">
|
|
||||||
<el-input v-model="listQuery.fddbrLxdh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="法定代表人居住地址">
|
|
||||||
<el-input v-model="listQuery.fddbrJzdz" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所负责人">
|
|
||||||
<el-input v-model="listQuery.csfzr" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所负责人身份证号">
|
|
||||||
<el-input v-model="listQuery.csfzrSfzh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所负责人联系方式">
|
|
||||||
<el-input v-model="listQuery.csfzrLxfs" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所负责人居住地址">
|
|
||||||
<el-input v-model="listQuery.csfzrJzdz" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<img height="65" style="width: 100%;" src="@/assets/images/person.png" alt="">
|
|
||||||
<img height="65" style="width: 100%;" src="@/assets/images/person.png" alt="">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="保安服务公司名称">
|
|
||||||
<el-input v-model="listQuery.bafwgsmc" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="保安负责人">
|
|
||||||
<el-input v-model="listQuery.bafzr" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="保安负责人联系方式">
|
|
||||||
<el-input v-model="listQuery.bafzrLxfs" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="保安人员数量">
|
|
||||||
<el-input v-model="listQuery.bars" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所面积">
|
|
||||||
<el-input v-model="listQuery.csmj" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="upload-group">
|
|
||||||
<el-form-item label="营业执照照片">
|
|
||||||
<img height="130" src="@/assets/images/person.png" alt="">
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="娱乐经营许可证">
|
|
||||||
<img height="130" src="@/assets/images/person.png" alt="">
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="安保服务公司合同">
|
|
||||||
<img height="130" src="@/assets/images/person.png" alt="">
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="娱乐场所备案编号">
|
|
||||||
<el-input v-model="listQuery.ylcsbabh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="娱乐场所备案机构名称">
|
|
||||||
<el-input v-model="listQuery.ylcsbajgmc" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="娱乐经营许可证编号">
|
|
||||||
<el-input v-model="listQuery.yljyxkzbh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="娱乐场所经营许可证发证机构">
|
|
||||||
<el-input v-model="listQuery.ylcsjyxkzfzjg" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="是否安装视频监控设备">
|
|
||||||
<el-input v-model="listQuery.sfazspjksb" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="是否安装信息采集设备">
|
|
||||||
<el-input v-model="listQuery.sfazxxcjsb" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="是否安装消防设备">
|
|
||||||
<el-input v-model="listQuery.sfazxfsb" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="责任民警">
|
|
||||||
<el-input v-model="listQuery.zrmj" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所行政区划">
|
|
||||||
<el-input v-model="listQuery.csxzqh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="治安管理单位">
|
|
||||||
<el-input v-model="listQuery.zaglbm" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</el-tab-pane>
|
|
||||||
<el-tab-pane label="从业人员" name="staff">
|
|
||||||
<!-- 从业人员表格 -->
|
|
||||||
</el-tab-pane>
|
|
||||||
</el-tabs>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,161 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="娱乐场所管理"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
|
|
||||||
<template #defaultSlot>
|
|
||||||
<div>
|
|
||||||
<el-input-number v-model="queryFrom.xqy"></el-input-number>
|
|
||||||
<span class="ml10 mr10" style="color: #000;">至</span>
|
|
||||||
<el-input-number v-model="queryFrom.dqy"></el-input-number>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</Search>
|
|
||||||
defaultSlot
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
<el-button size="small">从业人员</el-button>
|
|
||||||
<el-button size="small">转区域</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "场所名称", prop: 'name', placeholder: "请输入场所名称", showType: "input" },
|
|
||||||
{ label: "场所电话", prop: 'phone', placeholder: "请输入场所电话", showType: "input" },
|
|
||||||
{ label: "法人姓名", prop: 'frxm', placeholder: "请输入法人姓名", showType: "input" },
|
|
||||||
{ label: "法人证件号码", prop: 'frzjhm', placeholder: "请输入法人证件号码", showType: "input" },
|
|
||||||
{ label: "法人联系电话", prop: 'frlxdh', placeholder: "请输入法人联系电话", showType: "input" },
|
|
||||||
{ label: "经营状况", prop: 'jyzt', placeholder: "请选择经营状况", showType: "select", options: [{ label: '在业', value: '在业' }]},
|
|
||||||
{ label: "场所类型", prop: 'cslx', placeholder: "请选择场所类型", showType: "select", options: [{ label: '全部', value: '全部' },]},
|
|
||||||
{ label: "所属辖区", prop: 'ssxq', placeholder: "请选择所属辖区", showType: "department" },
|
|
||||||
{ label: "面积大小", prop: 'mj', placeholder: "请输入面积范围", showType: "defaultSlot" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{name:'天上人间KTV',cslx:'KTV',jyzt:'在业',ssxq:'巴宜区纺织路派出所',frxm:'张三',frzjhm:'510183199656566652',frlxdh:'15882344902'},
|
|
||||||
{name:'天上人间KTV',cslx:'KTV',jyzt:'在业',ssxq:'巴宜区纺织路派出所',frxm:'张三',frzjhm:'510183199656566652',frlxdh:'15882344902'},
|
|
||||||
{name:'天上人间KTV',cslx:'KTV',jyzt:'在业',ssxq:'巴宜区纺织路派出所',frxm:'张三',frzjhm:'510183199656566652',frlxdh:'15882344902'},
|
|
||||||
{name:'天上人间KTV',cslx:'KTV',jyzt:'在业',ssxq:'巴宜区纺织路派出所',frxm:'张三',frzjhm:'510183199656566652',frlxdh:'15882344902'},
|
|
||||||
{name:'天上人间KTV',cslx:'KTV',jyzt:'在业',ssxq:'巴宜区纺织路派出所',frxm:'张三',frzjhm:'510183199656566652',frlxdh:'15882344902'},
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 250, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "name" },
|
|
||||||
{ label: "场所类型", prop: "cslx" },
|
|
||||||
{ label: "经营状态", prop: "jyzt" },
|
|
||||||
{ label: "所属辖区", prop: "ssxq" },
|
|
||||||
{ label: "法人姓名", prop: "frxm" },
|
|
||||||
{ label: "法人证件号码", prop: "frzjhm" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,150 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">人脸抓拍采集信息</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="视频设备代码">
|
|
||||||
<el-input v-model="listQuery.videoDeviceCode" placeholder="011022"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="日期时间">
|
|
||||||
<el-input v-model="listQuery.captureTime" placeholder="2025/1/20 10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="抓拍图片">
|
|
||||||
<div class="image-group">
|
|
||||||
<div class="image-item" v-for="(item, index) in listQuery.captureImages" :key="index">
|
|
||||||
<el-image :src="item.img" fit="cover"></el-image>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="人像图片">
|
|
||||||
<div class="image-group">
|
|
||||||
<div class="image-item" v-for="(item, index) in listQuery.plateImages" :key="index">
|
|
||||||
<el-image :src="item.img" fit="cover"></el-image>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
videoDeviceCode: '',
|
|
||||||
captureTime: '',
|
|
||||||
plateNumber: '',
|
|
||||||
plateColor: '',
|
|
||||||
plateType: '',
|
|
||||||
vehicleColor: '',
|
|
||||||
captureImages: [
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
],
|
|
||||||
plateImages: [
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.image-group {
|
|
||||||
display: flex;
|
|
||||||
gap: 10px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
|
|
||||||
.image-item {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
border: 1px solid #dcdfe6;
|
|
||||||
|
|
||||||
.el-image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,216 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="身份标签管理" />
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search
|
|
||||||
:searchArr="searchConfiger"
|
|
||||||
@submit="onSearch"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData"
|
|
||||||
>
|
|
||||||
<!-- 抓拍图片 -->
|
|
||||||
<template #captureImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.captureImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.captureImage]"
|
|
||||||
>
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 人像图片 -->
|
|
||||||
<template #personImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.personImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.personImage]"
|
|
||||||
>
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 车牌图片 -->
|
|
||||||
<template #licensePlateImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.licensePlateImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.licensePlateImage]"
|
|
||||||
>
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)"
|
|
||||||
>详情</el-button
|
|
||||||
>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{
|
|
||||||
label: "视频设备编号",
|
|
||||||
prop: "deviceNo",
|
|
||||||
placeholder: "请输入视频设备编号",
|
|
||||||
showType: "input"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "日期时间",
|
|
||||||
prop: "captureTime",
|
|
||||||
placeholder: "请选择日期时间",
|
|
||||||
showType: "date"
|
|
||||||
}
|
|
||||||
]);
|
|
||||||
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{
|
|
||||||
deviceNo: "123456789",
|
|
||||||
captureImage: "",
|
|
||||||
personImage: "",
|
|
||||||
captureTime: "2025/1/20 10:00:00"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
deviceNo: "123456789",
|
|
||||||
captureImage: "",
|
|
||||||
personImage: "",
|
|
||||||
captureTime: "2025/1/20 10:00:00"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
deviceNo: "123456789",
|
|
||||||
captureImage: "",
|
|
||||||
personImage: "",
|
|
||||||
captureTime: "2025/1/20 10:00:00"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
deviceNo: "123456789",
|
|
||||||
captureImage: "",
|
|
||||||
personImage: "",
|
|
||||||
captureTime: "2025/1/20 10:00:00"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
deviceNo: "123456789",
|
|
||||||
captureImage: "",
|
|
||||||
personImage: "",
|
|
||||||
captureTime: "2025/1/20 10:00:00"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 120,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "视频设备编号", prop: "deviceNo" },
|
|
||||||
{ label: "抓拍图片", prop: "captureImage", slot: true },
|
|
||||||
{ label: "人像图片", prop: "personImage", slot: true },
|
|
||||||
{ label: "日期时间", prop: "captureTime" }
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
getList();
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList();
|
|
||||||
};
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) => {
|
|
||||||
queryFrom.value = { ...val };
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList();
|
|
||||||
};
|
|
||||||
|
|
||||||
const changeNo = (val) => {
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList();
|
|
||||||
};
|
|
||||||
const changeSize = (val) => {
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList();
|
|
||||||
};
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) => {
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
// let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
};
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight =
|
|
||||||
window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,169 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">从业人员涉及案事件信息 {{ title }}</span>
|
|
||||||
<div>
|
|
||||||
<el-button type="primary" v-if="title != '详情'" size="small" :loading="loading" @click="submit">保存</el-button>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="法律法规代码">
|
|
||||||
<el-input v-model="listQuery.flfgdm" placeholder="01"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="登记人姓名">
|
|
||||||
<el-input v-model="listQuery.djrxm" placeholder="李四"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="发布单位名称">
|
|
||||||
<el-input v-model="listQuery.fbdwmc" placeholder="巴宜区筑梦路派出所"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="发布范围描述">
|
|
||||||
<el-input v-model="listQuery.fbfwms" placeholder=""/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="电子文件名称">
|
|
||||||
<el-input v-model="listQuery.dzwjmc" placeholder="xxxxx通知"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="发布日期">
|
|
||||||
<el-date-picker v-model="listQuery.fbrq" type="datetime" placeholder="2025/1/20 10:00:00" style="width: 100%;" />
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="电子文件摘要">
|
|
||||||
<el-input type="textarea" v-model="listQuery.dzwjzy" :rows="4" placeholder="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<div class="upload-group">
|
|
||||||
<el-form-item label="电子附件">
|
|
||||||
<el-upload action="" :auto-upload="false">
|
|
||||||
<el-button type="primary">点击下载</el-button>
|
|
||||||
</el-upload>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
list: [
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 提交
|
|
||||||
const submit = ()=>{
|
|
||||||
elform.value.validate((valid) => {
|
|
||||||
if (!valid) return false;
|
|
||||||
// loading.value = true;
|
|
||||||
let params = { ...listQuery.value}
|
|
||||||
let url = title.value == '新增' ? '/mosty-lzcj/tbDwYy/insert' :'/mosty-lzcj/tbDwYy/update'
|
|
||||||
// qcckPost(params, url).then((res) => {
|
|
||||||
// proxy.$message({ type: "success", message: title.value+'成功'});
|
|
||||||
// close()
|
|
||||||
// emit("updateDate",modelLx.value);
|
|
||||||
// }).catch(()=>{
|
|
||||||
// loading.value = false;
|
|
||||||
// });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
title.value = type == 'add' ? '新增' : type == 'eidt' ? '编辑' : '详情'
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.labelTileile{
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
line-height: 30px;
|
|
||||||
padding-left: 8px;
|
|
||||||
// text-align: center;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,162 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="法律法规信息">
|
|
||||||
<el-button type="primary" @click="addEdit('add', '')">
|
|
||||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
|
||||||
<span style="vertical-align: middle">新增</span>
|
|
||||||
</el-button>
|
|
||||||
</PageTitle>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('eidt', row)">编辑</el-button>
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
<el-button size="small" @click="delDictItem([row.id])" type="danger">删除</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "电子文件名称", prop: 'dzwjmc', placeholder: "请输入电子文件名称", showType: "input" },
|
|
||||||
{ label: "发布单位", prop: 'fbdw', placeholder: "请输入发布单位", showType: "input" },
|
|
||||||
{ label: "发布日期", prop: 'fbrq', placeholder: "请选择发布日期", showType: "date" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{id: 1, dzwjmc: 'xxxxx法规', djr: '李四', fbdw: '巴吉区筑梦路派出所', fbrq: '2025/1/20 10:00:00'},
|
|
||||||
{id: 2, dzwjmc: 'xxxxx法规', djr: '李四', fbdw: '巴吉区筑梦路派出所', fbrq: '2025/1/20 10:00:00'},
|
|
||||||
{id: 3, dzwjmc: 'xxxxx法规', djr: '李四', fbdw: '巴吉区筑梦路派出所', fbrq: '2025/1/20 10:00:00'},
|
|
||||||
{id: 4, dzwjmc: 'xxxxx法规', djr: '李四', fbdw: '巴吉区筑梦路派出所', fbrq: '2025/1/20 10:00:00'},
|
|
||||||
{id: 5, dzwjmc: 'xxxxx法规', djr: '李四', fbdw: '巴吉区筑梦路派出所', fbrq: '2025/1/20 10:00:00'},
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 200,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "电子文件名称", prop: "dzwjmc" },
|
|
||||||
{ label: "登记人", prop: "djr" },
|
|
||||||
{ label: "发布单位", prop: "fbdw" },
|
|
||||||
{ label: "发布日期", prop: "fbrq" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 删除
|
|
||||||
const delDictItem = (ids) =>{
|
|
||||||
let url = '/mosty-lzcj/tbDwMbkf/delete';
|
|
||||||
proxy.$confirm("确定要删除", "警告", {type: "warning"}).then(() => {
|
|
||||||
// qcckPost(ids,url).then(()=>{
|
|
||||||
// proxy.$message({ type: "success", message: "删除成功" });
|
|
||||||
// getList(chooseType.value);
|
|
||||||
// })
|
|
||||||
}).catch(() => {});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,178 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">通知通告信息 {{ title }}</span>
|
|
||||||
<div>
|
|
||||||
<el-button type="primary" v-if="title != '详情'" size="small" :loading="loading" @click="submit">保存</el-button>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="通知通告代码">
|
|
||||||
<el-input v-model="listQuery.tzggdm" placeholder="01"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="发布人姓名">
|
|
||||||
<el-input v-model="listQuery.fbrxm" placeholder="张三"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="发布单位名称">
|
|
||||||
<el-input v-model="listQuery.fbdwmc" placeholder="巴宜区筑梦派出所"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="登记人姓名">
|
|
||||||
<el-input v-model="listQuery.djrxm" placeholder="李四"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="电子文件名称">
|
|
||||||
<el-input v-model="listQuery.dzwjmc" placeholder="xxxxx通知"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="发布范围描述">
|
|
||||||
<el-input v-model="listQuery.fbfwms" placeholder=""/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="紧急程度">
|
|
||||||
<el-input v-model="listQuery.jjcd" placeholder="非常紧急"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="发布日期">
|
|
||||||
<el-date-picker v-model="listQuery.fbrq" type="datetime" placeholder="2025/1/20 10:00:00" style="width: 100%;" />
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="电子文件摘要">
|
|
||||||
<el-input type="textarea" v-model="listQuery.dzwjzy" :rows="4" placeholder="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<div class="upload-group">
|
|
||||||
<el-form-item label="电子附件">
|
|
||||||
<el-upload action="" :auto-upload="false">
|
|
||||||
<el-button>点击下载</el-button>
|
|
||||||
</el-upload>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
list: [
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 提交
|
|
||||||
const submit = ()=>{
|
|
||||||
elform.value.validate((valid) => {
|
|
||||||
if (!valid) return false;
|
|
||||||
// loading.value = true;
|
|
||||||
let params = { ...listQuery.value}
|
|
||||||
let url = title.value == '新增' ? '/mosty-lzcj/tbDwYy/insert' :'/mosty-lzcj/tbDwYy/update'
|
|
||||||
// qcckPost(params, url).then((res) => {
|
|
||||||
// proxy.$message({ type: "success", message: title.value+'成功'});
|
|
||||||
// close()
|
|
||||||
// emit("updateDate",modelLx.value);
|
|
||||||
// }).catch(()=>{
|
|
||||||
// loading.value = false;
|
|
||||||
// });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
title.value = type == 'add' ? '新增' : type == 'eidt' ? '编辑' : '详情'
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.labelTileile{
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
line-height: 30px;
|
|
||||||
padding-left: 8px;
|
|
||||||
// text-align: center;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,164 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="通知通告信息">
|
|
||||||
<el-button type="primary" @click="addEdit('add', '')">
|
|
||||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
|
||||||
<span style="vertical-align: middle">新增</span>
|
|
||||||
</el-button>
|
|
||||||
</PageTitle>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('eidt', row)">编辑</el-button>
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
<el-button size="small" @click="delDictItem([row.id])" type="danger">删除</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "电子文件名称", prop: 'dzwjmc', placeholder: "请输入电子文件名称", showType: "input" },
|
|
||||||
{ label: "发布单位", prop: 'fbdw', placeholder: "请输入发布单位", showType: "input" },
|
|
||||||
{ label: "发布日期", prop: 'fbrq', placeholder: "请选择发布日期", showType: "date" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{id: 1, dzwjmc: 'xxxxx通知', djr: '李四', jjcd: '非常紧急', fbdw: '巴吉区筑梦路派出所', fbrq: '2025/1/20 10:00:00', djr: '张山'},
|
|
||||||
{id: 2, dzwjmc: 'xxxxx通知', djr: '李四', jjcd: '非常紧急', fbdw: '巴吉区筑梦路派出所', fbrq: '2025/1/20 10:00:00', djr: '张山'},
|
|
||||||
{id: 3, dzwjmc: 'xxxxx通知', djr: '李四', jjcd: '非常紧急', fbdw: '巴吉区筑梦路派出所', fbrq: '2025/1/20 10:00:00', djr: '张山'},
|
|
||||||
{id: 4, dzwjmc: 'xxxxx通知', djr: '李四', jjcd: '非常紧急', fbdw: '巴吉区筑梦路派出所', fbrq: '2025/1/20 10:00:00', djr: '张山'},
|
|
||||||
{id: 5, dzwjmc: 'xxxxx通知', djr: '李四', jjcd: '非常紧急', fbdw: '巴吉区筑梦路派出所', fbrq: '2025/1/20 10:00:00', djr: '张山'},
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 200,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "电子文件名称", prop: "dzwjmc" },
|
|
||||||
{ label: "发布人", prop: "djr" },
|
|
||||||
{ label: "紧急程度", prop: "jjcd" },
|
|
||||||
{ label: "发布单位", prop: "fbdw" },
|
|
||||||
{ label: "发布日期", prop: "fbrq" },
|
|
||||||
{ label: "登记人", prop: "djr" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 删除
|
|
||||||
const delDictItem = (ids) =>{
|
|
||||||
let url = '/mosty-lzcj/tbDwMbkf/delete';
|
|
||||||
proxy.$confirm("确定要删除", "警告", {type: "warning"}).then(() => {
|
|
||||||
// qcckPost(ids,url).then(()=>{
|
|
||||||
// proxy.$message({ type: "success", message: "删除成功" });
|
|
||||||
// getList(chooseType.value);
|
|
||||||
// })
|
|
||||||
}).catch(() => {});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,205 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">场所案事件信息{{ title }}</span>
|
|
||||||
<div>
|
|
||||||
<el-button type="primary" v-if="title != '详情'" size="small" :loading="loading" @click="submit">保存</el-button>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.csdm" placeholder="01"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="天上人间ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="案事件编号">
|
|
||||||
<el-input v-model="listQuery.asjbh" placeholder="123456"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="按时间发生时间">
|
|
||||||
<el-input v-model="listQuery.sbmc" placeholder="2025-03-10 10:10:10"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="简要案情">
|
|
||||||
<el-input v-model="listQuery.sbxh" type="textarea" placeholder="1234566"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<div class="labelTileile">
|
|
||||||
<span>案事件人员</span>
|
|
||||||
<el-button size="small" @click="modelValue = true,titleValue = '新增'">新增人员</el-button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row" v-for="(it,idx) in listQuery.list" :key="idx">
|
|
||||||
<el-form-item label="姓名">
|
|
||||||
<el-input v-model="it.xm" placeholder="xxxxxxx"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="证件号码">
|
|
||||||
<el-input v-model="it.zjhm" placeholder="100"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 新增人员 -->
|
|
||||||
<el-dialog :title="titleValue" width="700px" :model-value="modelValue" @close="closed">
|
|
||||||
<el-form :model="addForm" :rules="rules" ref="addFormVal" :inline="true">
|
|
||||||
<el-form-item label="姓名" prop="xm">
|
|
||||||
<el-input v-model="addForm.xm" placeholder="请输入姓名" clearable />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="身份证" prop="zjhm">
|
|
||||||
<el-input v-model="addForm.zjhm" placeholder="请输入身份证" clearable />
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
|
|
||||||
<template #footer>
|
|
||||||
<div class="tc">
|
|
||||||
<el-button @click="closed">取消</el-button>
|
|
||||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-dialog>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
list: [
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
const addFormVal = ref()
|
|
||||||
const modelValue = ref(false)
|
|
||||||
const titleValue = ref('')
|
|
||||||
const addForm = reactive({});
|
|
||||||
const rules = reactive({
|
|
||||||
xm: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
|
|
||||||
zjhm: [{ required: true, message: '请输入身份证', trigger: 'blur' }],
|
|
||||||
});
|
|
||||||
const closed = () => {
|
|
||||||
modelValue.value = false;
|
|
||||||
addForm.xm = ''
|
|
||||||
addForm.zjhm = ''
|
|
||||||
};
|
|
||||||
const onComfirm = () => {
|
|
||||||
addFormVal.value.validate((valid) => {
|
|
||||||
if (!valid) return false;
|
|
||||||
modelValue.value = false;
|
|
||||||
listQuery.value.list.push(addForm);
|
|
||||||
})
|
|
||||||
};
|
|
||||||
|
|
||||||
// 提交
|
|
||||||
const submit = ()=>{
|
|
||||||
elform.value.validate((valid) => {
|
|
||||||
if (!valid) return false;
|
|
||||||
// loading.value = true;
|
|
||||||
let params = { ...listQuery.value}
|
|
||||||
let url = title.value == '新增' ? '/mosty-lzcj/tbDwYy/insert' :'/mosty-lzcj/tbDwYy/update'
|
|
||||||
// qcckPost(params, url).then((res) => {
|
|
||||||
// proxy.$message({ type: "success", message: title.value+'成功'});
|
|
||||||
// close()
|
|
||||||
// emit("updateDate",modelLx.value);
|
|
||||||
// }).catch(()=>{
|
|
||||||
// loading.value = false;
|
|
||||||
// });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
title.value = type == 'add' ? '新增' : type == 'eidt' ? '编辑' : '详情'
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.labelTileile{
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
height: 30px;
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
padding: 0 8px;
|
|
||||||
cursor: pointer;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,163 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="场所案事件">
|
|
||||||
<el-button type="primary" @click="addEdit('add', '')">
|
|
||||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
|
||||||
<span style="vertical-align: middle">新增</span>
|
|
||||||
</el-button>
|
|
||||||
</PageTitle>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('eidt', row)">编辑</el-button>
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
<el-button size="small" @click="delDictItem([row.id])" type="danger">删除</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "场所名称", prop: 'name', placeholder: "请输入场所名称", showType: "input" },
|
|
||||||
{ label: "处罚日期", prop: 'clrq', placeholder: "案件办理时间", showType: "datePicker" },
|
|
||||||
{ label: "处罚类别", prop: 'cflb', placeholder: "案件类别", showType: "input" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{name:'天上人间ktv', ajlb:'刑事', ajfssj:'2022/1/20 10:00:00', ajclqk:'xxxxxxxxxx'},
|
|
||||||
{name:'天上人间ktv', ajlb:'纠纷', ajfssj:'2022/1/20 10:00:00', ajclqk:'xxxxxxxxxx'},
|
|
||||||
{name:'天上人间ktv', ajlb:'纠纷', ajfssj:'2022/1/20 10:00:00', ajclqk:'xxxxxxxxxx'},
|
|
||||||
{name:'天上人间ktv', ajlb:'纠纷', ajfssj:'2022/1/20 10:00:00', ajclqk:'xxxxxxxxxx'},
|
|
||||||
{name:'天上人间ktv', ajlb:'纠纷', ajfssj:'2022/1/20 10:00:00', ajclqk:'xxxxxxxxxx'},
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 200, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "name" },
|
|
||||||
{ label: "案件类别", prop: "ajlb" },
|
|
||||||
{ label: "案事件发生时间", prop: "ajfssj" },
|
|
||||||
{ label: "案事件处理结果", prop: "ajclqk" },
|
|
||||||
{ label: "简要案情", prop: "jyaq" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 删除
|
|
||||||
const delDictItem = (ids) =>{
|
|
||||||
let url = '/mosty-lzcj/tbDwMbkf/delete';
|
|
||||||
proxy.$confirm("确定要删除", "警告", {type: "warning"}).then(() => {
|
|
||||||
// qcckPost(ids,url).then(()=>{
|
|
||||||
// proxy.$message({ type: "success", message: "删除成功" });
|
|
||||||
// getList(chooseType.value);
|
|
||||||
// })
|
|
||||||
}).catch(() => {});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,149 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">人员抓拍采集信息详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="视频设备代码">
|
|
||||||
<el-input v-model="listQuery.videoDeviceCode" placeholder="011022"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="日期时间">
|
|
||||||
<el-input v-model="listQuery.captureTime" placeholder="2025/1/20 10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="背包判断标识">
|
|
||||||
<el-input v-model="listQuery.bbpdbs" placeholder="是"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="带帽判断标识">
|
|
||||||
<el-input v-model="listQuery.dmpdbs" placeholder="是"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<el-form-item label="抓拍图片" >
|
|
||||||
<div class="image-group">
|
|
||||||
<div class="image-item" v-for="(item, index) in listQuery.captureImages" :key="index">
|
|
||||||
<el-image :src="item.img" fit="cover"></el-image>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="人像图片" >
|
|
||||||
<div class="image-group">
|
|
||||||
<div class="image-item" v-for="(item, index) in listQuery.plateImages" :key="index">
|
|
||||||
<el-image :src="item.img" fit="cover"></el-image>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
videoDeviceCode: '',
|
|
||||||
captureTime: '',
|
|
||||||
plateNumber: '',
|
|
||||||
plateColor: '',
|
|
||||||
plateType: '',
|
|
||||||
vehicleColor: '',
|
|
||||||
captureImages: [
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
],
|
|
||||||
plateImages: [
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.image-group {
|
|
||||||
display: flex;
|
|
||||||
gap: 10px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
|
|
||||||
.image-item {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
border: 1px solid #dcdfe6;
|
|
||||||
|
|
||||||
.el-image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,172 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="人员抓拍采集信息"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 抓拍图片 -->
|
|
||||||
<template #captureImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.captureImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.captureImage]">
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 人像图片 -->
|
|
||||||
<template #personImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.personImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.personImage]">
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 车牌图片 -->
|
|
||||||
<template #licensePlateImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.licensePlateImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.licensePlateImage]">
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "视频设备编号", prop: 'deviceNo', placeholder: "请输入视频设备编号", showType: "input" },
|
|
||||||
{ label: "日期时间", prop: 'captureTime', placeholder: "请选择日期时间", showType: "date" },
|
|
||||||
]);
|
|
||||||
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{deviceNo:'123456789', captureImage:'', personImage:'', captureTime: '2025/1/20 10:00:00', backpackFlag: '是', hatFlag: '是'},
|
|
||||||
{deviceNo:'123456789', captureImage:'', personImage:'', captureTime: '2025/1/20 10:00:00', backpackFlag: '是', hatFlag: '是'},
|
|
||||||
{deviceNo:'123456789', captureImage:'', personImage:'', captureTime: '2025/1/20 10:00:00', backpackFlag: '是', hatFlag: '是'},
|
|
||||||
{deviceNo:'123456789', captureImage:'', personImage:'', captureTime: '2025/1/20 10:00:00', backpackFlag: '是', hatFlag: '是'},
|
|
||||||
{deviceNo:'123456789', captureImage:'', personImage:'', captureTime: '2025/1/20 10:00:00', backpackFlag: '是', hatFlag: '是'},
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 120,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "视频设备编号", prop: "deviceNo" },
|
|
||||||
{ label: "抓拍图片", prop: "captureImage", slot: true },
|
|
||||||
{ label: "人像图片", prop: "personImage", slot: true },
|
|
||||||
{ label: "日期时间", prop: "captureTime" },
|
|
||||||
{ label: "背包判断标识", prop: "backpackFlag" },
|
|
||||||
{ label: "带帽判断标识", prop: "hatFlag" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,122 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">娱乐场所从业人员日志详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.csdm" placeholder="0111"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="天上人间ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="从业人员姓名">
|
|
||||||
<el-input v-model="listQuery.cyrxm" placeholder="张三"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="从业人员证件号码">
|
|
||||||
<el-input v-model="listQuery.cyrzjhm" placeholder="511123456987452256"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="工作开始时间">
|
|
||||||
<el-input v-model="listQuery.gzkssj" placeholder="10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="工作结束时间">
|
|
||||||
<el-input v-model="listQuery.gzjssj" placeholder="23:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,143 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="娱乐场所从业人员日志信息"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "场所名称", prop: 'name', placeholder: "场所名称", showType: "input" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{name:'天上人间ktv', personName:'张三', idCard:'511123456987452256', startTime:'10:00:00', endTime:'23:00:00'},
|
|
||||||
{name:'天上人间ktv', personName:'张三', idCard:'511123456987452256', startTime:'10:00:00', endTime:'23:00:00'},
|
|
||||||
{name:'天上人间ktv', personName:'张三', idCard:'511123456987452256', startTime:'10:00:00', endTime:'23:00:00'},
|
|
||||||
{name:'天上人间ktv', personName:'张三', idCard:'511123456987452256', startTime:'10:00:00', endTime:'23:00:00'},
|
|
||||||
{name:'天上人间ktv', personName:'张三', idCard:'511123456987452256', startTime:'10:00:00', endTime:'23:00:00'},
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 120,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "name" },
|
|
||||||
{ label: "从业人员姓名", prop: "personName" },
|
|
||||||
{ label: "从业人员证件号码", prop: "idCard" },
|
|
||||||
{ label: "工作开始时间", prop: "startTime" },
|
|
||||||
{ label: "工作结束时间", prop: "endTime" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,152 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">警情情况详情详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.placeCode" placeholder="01"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.placeName" placeholder="天上人间KTV"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="警情登记号">
|
|
||||||
<el-input v-model="listQuery.policeRecordNo" placeholder="1234567"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="警情类别">
|
|
||||||
<el-input v-model="listQuery.policeType" placeholder="矛盾纠纷"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="报警人姓名">
|
|
||||||
<el-input v-model="listQuery.reporterName" placeholder="张三"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="报警时间">
|
|
||||||
<el-input v-model="listQuery.reportTime" placeholder="2025/1/20 10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="接警时间">
|
|
||||||
<el-input v-model="listQuery.receiveTime" placeholder="2025/1/20 10:01:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="处警人姓名">
|
|
||||||
<el-input v-model="listQuery.handlerName" placeholder="李四"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="警情处理结果">
|
|
||||||
<el-input v-model="listQuery.handleResult" type="textarea" :rows="3" placeholder="自行协商"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="简要案情">
|
|
||||||
<el-input v-model="listQuery.briefCase" type="textarea" :rows="5" placeholder="请输入简要案情"/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
placeCode: '',
|
|
||||||
placeName: '',
|
|
||||||
policeRecordNo: '',
|
|
||||||
policeType: '',
|
|
||||||
reporterName: '',
|
|
||||||
reportTime: '',
|
|
||||||
receiveTime: '',
|
|
||||||
handlerName: '',
|
|
||||||
handleResult: '',
|
|
||||||
briefCase: ''
|
|
||||||
});
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.image-group {
|
|
||||||
display: flex;
|
|
||||||
gap: 10px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
|
|
||||||
.image-item {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
border: 1px solid #dcdfe6;
|
|
||||||
|
|
||||||
.el-image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,163 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="警力情况信息"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 抓拍图片 -->
|
|
||||||
<template #captureImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.captureImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.captureImage]">
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 车牌图片 -->
|
|
||||||
<template #licensePlateImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.licensePlateImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.licensePlateImage]">
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "报警人姓名", prop: 'reporterName', placeholder: "请输入报警人姓名", showType: "input" },
|
|
||||||
{ label: "警情类别", prop: 'policeType', placeholder: "请输入警情类别", showType: "input" },
|
|
||||||
{ label: "报警时间", prop: 'reportTime', placeholder: "请选择报警时间", showType: "date" },
|
|
||||||
]);
|
|
||||||
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{placeName:'天上人间ktv', policeType:'刑事', reportTime:'2022/1/20 10:00:00', reporterName:'张三', handlerName:'李四'},
|
|
||||||
{placeName:'天上人间ktv', policeType:'纠纷', reportTime:'2022/1/20 10:00:00', reporterName:'张三', handlerName:'李四'},
|
|
||||||
{placeName:'天上人间ktv', policeType:'纠纷', reportTime:'2022/1/20 10:00:00', reporterName:'张三', handlerName:'李四'},
|
|
||||||
{placeName:'天上人间ktv', policeType:'纠纷', reportTime:'2022/1/20 10:00:00', reporterName:'张三', handlerName:'李四'},
|
|
||||||
{placeName:'天上人间ktv', policeType:'纠纷', reportTime:'2022/1/20 10:00:00', reporterName:'张三', handlerName:'李四'},
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 120,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "placeName" },
|
|
||||||
{ label: "警情类别", prop: "policeType" },
|
|
||||||
{ label: "报警时间", prop: "reportTime" },
|
|
||||||
{ label: "报警人姓名", prop: "reporterName" },
|
|
||||||
{ label: "处警人姓名", prop: "handlerName" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,227 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">从业人员详情 {{ title }}</span>
|
|
||||||
<div>
|
|
||||||
<el-button type="primary" v-if="title != '详情'" size="small" :loading="loading" @click="submit">保存</el-button>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.csdm" placeholder="01"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="天上人间ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="姓名">
|
|
||||||
<el-input v-model="listQuery.xm" placeholder="张三"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="证件号码">
|
|
||||||
<el-input v-model="listQuery.zjhm" placeholder="511123456789654125"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="职业类别代码">
|
|
||||||
<el-input v-model="listQuery.zylbdm" placeholder="123456"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="居住地址">
|
|
||||||
<el-input v-model="listQuery.jzdz" placeholder="林芝市巴宜区区政府路119号"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="入职时间">
|
|
||||||
<el-date-picker v-model="listQuery.rzsj" type="date" placeholder="2025/1/20" style="width: 100%;" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="离职时间">
|
|
||||||
<el-date-picker v-model="listQuery.lzsj" type="date" placeholder="请选择" style="width: 100%;" />
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="联系电话">
|
|
||||||
<el-input v-model="listQuery.lxdh" placeholder="15222222222"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="执业许可证编号">
|
|
||||||
<el-input v-model="listQuery.zyxkzbh" placeholder=""/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="岗位">
|
|
||||||
<el-input v-model="listQuery.gw" placeholder=""/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="资格证类型">
|
|
||||||
<el-input v-model="listQuery.zgzlx" placeholder=""/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="资格证编号">
|
|
||||||
<el-input v-model="listQuery.zgzbh" placeholder=""/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="资格证有效期截止日期">
|
|
||||||
<el-date-picker v-model="listQuery.zgzyxqjzrq" type="date" placeholder="请选择" style="width: 100%;" />
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="资格证有效期起始日期">
|
|
||||||
<el-date-picker v-model="listQuery.zgzyxqqsrq" type="date" placeholder="请选择" style="width: 100%;" />
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="抓拍图片" >
|
|
||||||
<div class="image-group">
|
|
||||||
<div class="image-item" v-for="(item, index) in listQuery.captureImages" :key="index">
|
|
||||||
<el-image :src="item.img" fit="cover"></el-image>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
captureImages: [
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
],
|
|
||||||
list: [
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 提交
|
|
||||||
const submit = ()=>{
|
|
||||||
elform.value.validate((valid) => {
|
|
||||||
if (!valid) return false;
|
|
||||||
// loading.value = true;
|
|
||||||
let params = { ...listQuery.value}
|
|
||||||
let url = title.value == '新增' ? '/mosty-lzcj/tbDwYy/insert' :'/mosty-lzcj/tbDwYy/update'
|
|
||||||
// qcckPost(params, url).then((res) => {
|
|
||||||
// proxy.$message({ type: "success", message: title.value+'成功'});
|
|
||||||
// close()
|
|
||||||
// emit("updateDate",modelLx.value);
|
|
||||||
// }).catch(()=>{
|
|
||||||
// loading.value = false;
|
|
||||||
// });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
title.value = type == 'add' ? '新增' : type == 'eidt' ? '编辑' : '详情'
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.labelTileile{
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
line-height: 30px;
|
|
||||||
padding-left: 8px;
|
|
||||||
// text-align: center;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
.image-group {
|
|
||||||
display: flex;
|
|
||||||
gap: 10px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
|
|
||||||
.image-item {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
border: 1px solid #dcdfe6;
|
|
||||||
|
|
||||||
.el-image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,144 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<PageTitle title="从业人员"/>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "人员姓名", prop: 'xm', placeholder: "请输入人员姓名", showType: "input" },
|
|
||||||
{ label: "证件号码", prop: 'zjhm', placeholder: "请输入证件号码", showType: "input" },
|
|
||||||
{ label: "联系电话", prop: 'lxdh', placeholder: "请输入联系电话", showType: "input" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{xm:'王五', zjhm:'511222222222222', lxfs:'15211111111', gw:'保洁', rzsj:'2022/1/20'},
|
|
||||||
{xm:'王五', zjhm:'511222222222222', lxfs:'15211111111', gw:'保洁', rzsj:'2022/1/20'},
|
|
||||||
{xm:'王五', zjhm:'511222222222222', lxfs:'15211111111', gw:'保洁', rzsj:'2022/1/20'},
|
|
||||||
{xm:'王五', zjhm:'511222222222222', lxfs:'15211111111', gw:'保洁', rzsj:'2022/1/20'},
|
|
||||||
{xm:'王五', zjhm:'511222222222222', lxfs:'15211111111', gw:'保洁', rzsj:'2022/1/20'},
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 120, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "姓名", prop: "xm" },
|
|
||||||
{ label: "证件号码", prop: "zjhm" },
|
|
||||||
{ label: "联系方式", prop: "lxfs" },
|
|
||||||
{ label: "岗位", prop: "gw" },
|
|
||||||
{ label: "入职时间", prop: "rzsj" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,136 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">可疑情况详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.placeCode" placeholder="01"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.placeName" placeholder="天上人间ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="可疑情况登记号">
|
|
||||||
<el-input v-model="listQuery.policeRecordNo" placeholder="1"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="可疑情况类别">
|
|
||||||
<el-input v-model="listQuery.policeType" placeholder="矛盾纠纷"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="登记人姓名">
|
|
||||||
<el-input v-model="listQuery.reporterName" placeholder="张三"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="可疑情况简要描述">
|
|
||||||
<el-input v-model="listQuery.briefCase" type="textarea" :rows="5" placeholder="请输入可疑情况简要描述"/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
placeCode: '',
|
|
||||||
placeName: '',
|
|
||||||
policeRecordNo: '',
|
|
||||||
policeType: '',
|
|
||||||
reporterName: '',
|
|
||||||
reportTime: '',
|
|
||||||
receiveTime: '',
|
|
||||||
handlerName: '',
|
|
||||||
handleResult: '',
|
|
||||||
briefCase: ''
|
|
||||||
});
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.image-group {
|
|
||||||
display: flex;
|
|
||||||
gap: 10px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
|
|
||||||
.image-item {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
border: 1px solid #dcdfe6;
|
|
||||||
|
|
||||||
.el-image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,162 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="可疑情况信息"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 抓拍图片 -->
|
|
||||||
<template #captureImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.captureImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.captureImage]">
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 车牌图片 -->
|
|
||||||
<template #licensePlateImage="{ row }">
|
|
||||||
<el-image
|
|
||||||
style="width: 100px; height: 60px"
|
|
||||||
:src="row.licensePlateImage"
|
|
||||||
fit="cover"
|
|
||||||
:preview-src-list="[row.licensePlateImage]">
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "登记人姓名", prop: 'reporterName', placeholder: "登记人姓名", showType: "input" },
|
|
||||||
{ label: "可疑情况类别", prop: 'policeType', placeholder: "可疑情况类别", showType: "input" },
|
|
||||||
]);
|
|
||||||
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{placeName:'天上人间ktv', registrantName:'张三', situationType:'纠纷', situationDesc:'xxxxxxxxxxxx', situationNo: '5'},
|
|
||||||
{placeName:'天上人间ktv', registrantName:'张三', situationType:'纠纷', situationDesc:'xxxxxxxxxxxx', situationNo: '4'},
|
|
||||||
{placeName:'天上人间ktv', registrantName:'张三', situationType:'纠纷', situationDesc:'xxxxxxxxxxxx', situationNo: '3'},
|
|
||||||
{placeName:'天上人间ktv', registrantName:'张三', situationType:'纠纷', situationDesc:'xxxxxxxxxxxx', situationNo: '2'},
|
|
||||||
{placeName:'天上人间ktv', registrantName:'张三', situationType:'纠纷', situationDesc:'xxxxxxxxxxxx', situationNo: '1'},
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 120,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "placeName" },
|
|
||||||
{ label: "登记人姓名", prop: "registrantName" },
|
|
||||||
{ label: "可疑情况类别", prop: "situationType" },
|
|
||||||
{ label: "可疑情况简要描述", prop: "situationDesc" },
|
|
||||||
{ label: "可疑情况登记号", prop: "situationNo" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,126 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">娱乐场所附加信息详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.csdm" placeholder="0111"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="天上人间ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="娱乐场所类型代码">
|
|
||||||
<el-input v-model="listQuery.ylcslxdm" placeholder="001"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="核定消费者数量">
|
|
||||||
<el-input v-model="listQuery.hdxfzsl" placeholder="100"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="包厢房间数">
|
|
||||||
<el-input v-model="listQuery.bxfjs" placeholder="20"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="娱乐场所治安级别代码">
|
|
||||||
<el-input v-model="listQuery.ylcszajbdm" placeholder="90"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="娱乐项目名称" style="width:50%;">
|
|
||||||
<el-input v-model="listQuery.ylxmmc" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,144 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="娱乐场所附加管理"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "场所名称", prop: 'name', placeholder: "请输入场所名称", showType: "input" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{name:'天上人间ktv', cslx:'ktv', hdjyrs: 100, bffjsl: 20, zaglbm: 90},
|
|
||||||
{name:'天上人间ktv', cslx:'ktv', hdjyrs: 100, bffjsl: 20, zaglbm: 90},
|
|
||||||
{name:'天上人间ktv', cslx:'ktv', hdjyrs: 100, bffjsl: 20, zaglbm: 90},
|
|
||||||
{name:'天上人间ktv', cslx:'ktv', hdjyrs: 100, bffjsl: 20, zaglbm: 90},
|
|
||||||
{name:'天上人间ktv', cslx:'ktv', hdjyrs: 100, bffjsl: 20, zaglbm: 90},
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 120, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "name" },
|
|
||||||
{ label: "娱乐场所类型", prop: "cslx" },
|
|
||||||
{ label: "核定接待者数量", prop: "hdjyrs" },
|
|
||||||
{ label: "包厢房间数量", prop: "bffjsl" },
|
|
||||||
{ label: "治安级别代码", prop: "zaglbm" },
|
|
||||||
{ label: "娱乐项目名称", prop: "ylxmmc" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,134 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">场所处罚信息详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.csdm" placeholder="01"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="天上人间ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所处罚登记号号">
|
|
||||||
<el-input v-model="listQuery.cscfdjh" placeholder="1234567"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所处罚日期">
|
|
||||||
<el-input v-model="listQuery.cscfrq" placeholder="2025/1/20 10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所处罚批准文号码">
|
|
||||||
<el-input v-model="listQuery.cscfpzwh" placeholder="1234567"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="批准机关名称">
|
|
||||||
<el-input v-model="listQuery.pzjgmc" placeholder=""/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="场所处罚类别">
|
|
||||||
<el-input v-model="listQuery.cscflb" placeholder="罚款"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="场所处罚原因简要情况">
|
|
||||||
<el-input type="textarea" v-model="listQuery.cscfyyqk" :rows="4" placeholder="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="场所处罚结果简要情况">
|
|
||||||
<el-input type="textarea" v-model="listQuery.cscfjgqk" :rows="4" placeholder="xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"/>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,161 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<PageTitle title="场所处罚信息">
|
|
||||||
<el-button type="primary" @click="addEdit('add', '')">
|
|
||||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
|
||||||
<span style="vertical-align: middle">新增</span>
|
|
||||||
</el-button>
|
|
||||||
</PageTitle>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('edit', row)">编辑</el-button>
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
<el-button size="small" @click="delDictItem([row.id])" type="danger">删除</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "场所名称", prop: 'name', placeholder: "请输入场所名称", showType: "input" },
|
|
||||||
{ label: "处罚日期", prop: 'cfrq', placeholder: "请选择处罚日期", showType: "date" },
|
|
||||||
{ label: "处罚类别", prop: 'cflb', placeholder: "请选择处罚类别", showType: "input" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{name:'天上人间ktv', cflb:'刑事', cfrq:'2022/1/20 10:00:00', cfyyqk:'', cfjgqk:'xxxxxxxxxx'},
|
|
||||||
{name:'天上人间ktv', cflb:'纠纷', cfrq:'2022/1/20 10:00:00', cfyyqk:'', cfjgqk:'xxxxxxxxxx'},
|
|
||||||
{name:'天上人间ktv', cflb:'纠纷', cfrq:'2022/1/20 10:00:00', cfyyqk:'', cfjgqk:'xxxxxxxxxx'},
|
|
||||||
{name:'天上人间ktv', cflb:'纠纷', cfrq:'2022/1/20 10:00:00', cfyyqk:'', cfjgqk:'xxxxxxxxxx'},
|
|
||||||
{name:'天上人间ktv', cflb:'纠纷', cfrq:'2022/1/20 10:00:00', cfyyqk:'', cfjgqk:'xxxxxxxxxx'},
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 220, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "name" },
|
|
||||||
{ label: "处罚类别", prop: "cflb" },
|
|
||||||
{ label: "处罚日期", prop: "cfrq" },
|
|
||||||
{ label: "处罚原因简要情况", prop: "cfyyqk" },
|
|
||||||
{ label: "处罚结果简要情况", prop: "cfjgqk" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 删除
|
|
||||||
const delDictItem = (ids) =>{
|
|
||||||
// let url = '/mosty-lzcj/TbDwYlth/delete';
|
|
||||||
proxy.$confirm("确定要删除", "警告", {type: "warning"}).then(() => {
|
|
||||||
// qcckPost(ids,url).then(()=>{
|
|
||||||
// proxy.$message({ type: "success", message: "删除成功" });
|
|
||||||
// getList(chooseType.value);
|
|
||||||
// })
|
|
||||||
}).catch(() => {});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,153 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">娱乐场所电子游戏机详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所代码">
|
|
||||||
<el-input v-model="listQuery.csdm" placeholder="0111"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="天上人间ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="电子游戏机">
|
|
||||||
<el-input v-model="listQuery.dzyx" placeholder="捕鱼机"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="品牌型号">
|
|
||||||
<el-input v-model="listQuery.ppxh" placeholder="ashaj200"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="数量">
|
|
||||||
<el-input v-model="listQuery.sl" placeholder="20"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="厂商名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="xxxx"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="相片" >
|
|
||||||
<div class="image-group">
|
|
||||||
<div class="image-item" v-for="(item, index) in listQuery.plateImages" :key="index">
|
|
||||||
<el-image :src="item.img" fit="cover"></el-image>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
plateImages: [
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.image-group {
|
|
||||||
display: flex;
|
|
||||||
gap: 10px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
|
|
||||||
.image-item {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
border: 1px solid #dcdfe6;
|
|
||||||
|
|
||||||
.el-image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,144 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="娱乐场所电子游戏机信息"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "场所名称", prop: 'name', placeholder: "场所名称", showType: "input" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{name:'天上人间ktv', deviceType:'捕鱼机', model:'ashaj200', count: 20, manufacturer: 'xxxx'},
|
|
||||||
{name:'天上人间ktv', deviceType:'捕鱼机', model:'ashaj200', count: 20, manufacturer: 'xxxxx'},
|
|
||||||
{name:'天上人间ktv', deviceType:'捕鱼机', model:'ashaj200', count: 20, manufacturer: 'xxxx'},
|
|
||||||
{name:'天上人间ktv', deviceType:'捕鱼机', model:'ashaj200', count: 20, manufacturer: 'xxxx'},
|
|
||||||
{name:'天上人间ktv', deviceType:'捕鱼机', model:'ashaj200', count: 20, manufacturer: 'xxxx'},
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 120,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "场所名称", prop: "name" },
|
|
||||||
{ label: "电子游戏机", prop: "deviceType" },
|
|
||||||
{ label: "品牌型号", prop: "model" },
|
|
||||||
{ label: "数量", prop: "count" },
|
|
||||||
{ label: "厂商名称", prop: "manufacturer" },
|
|
||||||
{ label: "图片", prop: "image", slot: true }
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="dialog" v-if="dialogForm">
|
<div class="dialog" v-if="dialogForm">
|
||||||
<div class="head_box" style="width: 93%">
|
<div class="head_box" >
|
||||||
<span class="title">{{ title }}重点人管理</span>
|
<span class="title">{{ title }}重点人管理</span>
|
||||||
<div>
|
<div>
|
||||||
<el-button
|
<el-button
|
||||||
|
|||||||
@ -1,736 +1,186 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="dialog" v-if="dialogForm">
|
<div class="dialog" v-if="dialogForm">
|
||||||
<div class="head_box">
|
<div class="head_box">
|
||||||
<span class="title">情报信息流转{{ title }} </span>
|
<span class="title">人力情报信息采集流转编辑</span>
|
||||||
<div>
|
<div>
|
||||||
<el-button
|
<el-button @click="submit">保存</el-button>
|
||||||
type="primary"
|
<el-button @click="close">暂存</el-button>
|
||||||
size="small"
|
<el-button @click="close">关闭</el-button>
|
||||||
:loading="loading"
|
|
||||||
@click="submit"
|
|
||||||
v-if="typeOf == 'edit' || typeOf == 'add' || typeOf == 'report'"
|
|
||||||
>保存</el-button
|
|
||||||
>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="form_cnt">
|
<div class="form_cnt">
|
||||||
<FormMessage
|
<FormMessage v-model="listQuery" :formList="formData" ref="elform" :rules="rules">
|
||||||
v-model="listQuery"
|
<template #gapdive>
|
||||||
:formList="formData"
|
<div style="width: 100%;height: 10px;" class="mb20">
|
||||||
ref="elform"
|
<el-divider content-position="left">基础信息</el-divider>
|
||||||
:rules="rules"
|
|
||||||
>
|
|
||||||
<!-- 上报人员-->
|
|
||||||
<template #sbRyId>
|
|
||||||
<el-button
|
|
||||||
@click="openDialog('01', 'ry')"
|
|
||||||
v-if="typeOf == 'edit' || typeOf == 'add'"
|
|
||||||
>选择</el-button
|
|
||||||
>
|
|
||||||
<div class="boxlist">
|
|
||||||
<MyTable
|
|
||||||
:tableData="tableDate.ryList"
|
|
||||||
:tableColumn="tableDate.tableColumnRy"
|
|
||||||
:tableHeight="tableDate.tableHeight"
|
|
||||||
:key="tableDate.keyCountRy"
|
|
||||||
:tableConfiger="tableDate.tableConfiger"
|
|
||||||
:controlsWidth="tableDate.controlsWidth"
|
|
||||||
>
|
|
||||||
<template #ryMz="{ row }">
|
|
||||||
<DictTag :tag="false" :value="row.ryMz" :options="D_BZ_MZ" />
|
|
||||||
</template>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-link
|
|
||||||
type="danger"
|
|
||||||
@click="delDict(row.id)"
|
|
||||||
v-if="typeOf == 'edit' || typeOf == 'add'"
|
|
||||||
>删除</el-link
|
|
||||||
>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<!-- 人员标签模型-->
|
<template #gapline>
|
||||||
<template #bqList>
|
<div style="width: 100%;height: 10px;" class="mb20">
|
||||||
<el-button
|
<el-divider content-position="left">线索内容</el-divider>
|
||||||
@click="openDialog('01', 'bq')"
|
|
||||||
v-if="typeOf == 'edit' || typeOf == 'add'"
|
|
||||||
>选择</el-button
|
|
||||||
>
|
|
||||||
<div class="boxlist">
|
|
||||||
<MyTable
|
|
||||||
:tableData="tableDate.bqList"
|
|
||||||
:tableColumn="tableDate.tableColumn"
|
|
||||||
:tableHeight="tableDate.tableHeight"
|
|
||||||
:key="tableDate.keyCount"
|
|
||||||
:tableConfiger="tableDate.tableConfiger"
|
|
||||||
:controlsWidth="tableDate.controlsWidth"
|
|
||||||
>
|
|
||||||
<template #bqLb="{ row }">
|
|
||||||
<DictTag :value="row.bqLb" :tag="false" :options="D_GS_BQ_LB" />
|
|
||||||
</template>
|
|
||||||
<template #bqLx="{ row }">
|
|
||||||
<DictTag :value="row.bqLx" :tag="false" :options="D_GS_BQ_LX" />
|
|
||||||
</template>
|
|
||||||
<template #bqZl="{ row }">
|
|
||||||
<DictTag :value="row.bqZl" :tag="false" :options="D_GS_BQ_ZL" />
|
|
||||||
</template>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-link
|
|
||||||
type="danger"
|
|
||||||
@click="delDictItem(row.bqId)"
|
|
||||||
v-if="typeOf == 'edit' || typeOf == 'add'"
|
|
||||||
>删除</el-link
|
|
||||||
>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
<template #scfj>
|
||||||
<!-- 上报单位代码 -->
|
<div style="width: 100%;padding-left: 50px;">
|
||||||
<template #sbDwDm>
|
<div>上传附件:<span class="f12">（可附电子表格、Word文档、图像、音视频文件）</span> </div>
|
||||||
<el-select
|
<div><MOSTY.Upload :showBtn="true" :limit="10" v-model="listQuery.tps" /> </div>
|
||||||
v-model="listQuery.sbDwDm"
|
|
||||||
placeholder="请选择上报单位代码"
|
|
||||||
style="width: 240px"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in deptList"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value.toString()"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</template>
|
|
||||||
<!-- 抄送单位代码 -->
|
|
||||||
<template #csDwDm>
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.csDwDm"
|
|
||||||
placeholder="请选择抄送单位代码"
|
|
||||||
style="width: 240px"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in deptList"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value.toString()"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</template>
|
|
||||||
<!-- 编制单位代码 -->
|
|
||||||
<template #bzDwDm>
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.bzDwDm"
|
|
||||||
placeholder="请选择编制单位代码"
|
|
||||||
style="width: 240px"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in deptList"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value.toString()"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</template>
|
|
||||||
<!-- 线索内容-->
|
|
||||||
<template #xsNr>
|
|
||||||
<div style="border: 1px solid #ccc">
|
|
||||||
<Toolbar
|
|
||||||
style="border-bottom: 1px solid #ccc"
|
|
||||||
:editor="clueRef"
|
|
||||||
:defaultConfig="clueConfig"
|
|
||||||
mode="default"
|
|
||||||
/>
|
|
||||||
<Editor
|
|
||||||
style="height: 500px; overflow-y: hidden"
|
|
||||||
v-model="clueHtml"
|
|
||||||
:defaultConfig="clueConfig"
|
|
||||||
mode="default"
|
|
||||||
@onCreated="clueCreated"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<!-- 汇编报刊-->
|
|
||||||
<template #hbBk>
|
|
||||||
<div style="border: 1px solid #ccc">
|
|
||||||
<Toolbar
|
|
||||||
style="border-bottom: 1px solid #ccc"
|
|
||||||
:editor="editorRef"
|
|
||||||
:defaultConfig="toolbarConfig"
|
|
||||||
mode="default"
|
|
||||||
/>
|
|
||||||
<Editor
|
|
||||||
style="height: 500px; overflow-y: hidden"
|
|
||||||
v-model="valueHtml"
|
|
||||||
:defaultConfig="editorConfig"
|
|
||||||
mode="default"
|
|
||||||
@onCreated="handleCreated"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</FormMessage>
|
</FormMessage>
|
||||||
|
<el-divider content-position="left"><span class="mr20">相关人员</span> <el-button type="primary" size="small" @click="showPeo = true,peoTitle = '新增人员'">添加人员</el-button></el-divider>
|
||||||
|
<MyTable
|
||||||
|
:tableData="pageForm.tableData"
|
||||||
|
:tableColumn="pageForm.tableColumn"
|
||||||
|
:tableHeight="pageForm.tableHeight"
|
||||||
|
:key="pageForm.keyCount"
|
||||||
|
:tableConfiger="pageForm.tableConfiger"
|
||||||
|
:controlsWidth="pageForm.controlsWidth"
|
||||||
|
@chooseData="chooseData"
|
||||||
|
>
|
||||||
|
<!-- 操作 -->
|
||||||
|
<template #controls="{ row }">
|
||||||
|
<el-link size="small" type="primary" @click="addEdit('detail', row)">详情</el-link >
|
||||||
|
<el-link size="small" type="success" @click="addEdit('edit', row)">编辑</el-link>
|
||||||
|
<el-link size="small" type="danger" @click="deleteRow(row)">删除</el-link>
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
</div>
|
</div>
|
||||||
<!-- 标签列表弹窗 -->
|
<!-- 人员 -->
|
||||||
<TagSelectorDialog
|
<AddPeo v-model="showPeo" :dic="props.dic" :title="peoTitle"></AddPeo>
|
||||||
v-model="chooseShow"
|
|
||||||
ref="tagDialog"
|
|
||||||
@chooseDate="handleTagSelect"
|
|
||||||
:dic="{ D_GS_BQ_ZL, D_GS_BQ_LB, D_GS_BQ_LX }"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<!-- 上报人员列表弹窗 -->
|
|
||||||
<DialogList
|
|
||||||
v-if="ryDialog"
|
|
||||||
:Single="true"
|
|
||||||
:roleIds="roleIds"
|
|
||||||
@chooseDate="chooseDate"
|
|
||||||
:titleValue="chooseTitle"
|
|
||||||
v-model="ryDialog"
|
|
||||||
bqDl="02"
|
|
||||||
:dic="{ D_BZ_MZ }"
|
|
||||||
></DialogList>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import AddPeo from './addPeo.vue'
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
||||||
import * as rule from "@/utils/rules.js";
|
import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, nextTick } from "vue";
|
||||||
import TagSelectorDialog from "@/components/aboutTable/TagSelectorDialog.vue";
|
|
||||||
import DialogList from "./dialogList.vue";
|
|
||||||
import { selectUserDeptPage } from "@/api/user-manage";
|
|
||||||
import {
|
|
||||||
ref,
|
|
||||||
defineExpose,
|
|
||||||
reactive,
|
|
||||||
onMounted,
|
|
||||||
defineEmits,
|
|
||||||
getCurrentInstance,
|
|
||||||
nextTick,
|
|
||||||
shallowRef,
|
|
||||||
onBeforeUnmount,
|
|
||||||
watch
|
|
||||||
} from "vue";
|
|
||||||
const emit = defineEmits(["updateDate"]);
|
const emit = defineEmits(["updateDate"]);
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
dic: Object
|
dic: Object
|
||||||
});
|
});
|
||||||
const chooseShow = ref(false); //选择弹窗
|
|
||||||
|
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
|
|
||||||
const {
|
|
||||||
D_GS_BQ_LB,
|
|
||||||
D_GS_BQ_ZL,
|
|
||||||
D_GS_BQ_LX,
|
|
||||||
D_GS_XS_SBRYLX,
|
|
||||||
D_GS_ZDQT_LB,
|
|
||||||
D_GS_XS_FXDJ,
|
|
||||||
D_BZ_MZ,
|
|
||||||
D_GS_XS_LX,
|
|
||||||
D_GS_RLQB_BJSB_BSZT,
|
|
||||||
D_BZ_SF
|
|
||||||
} = proxy.$dict(
|
|
||||||
"D_GS_BQ_LB",
|
|
||||||
"D_GS_BQ_ZL",
|
|
||||||
"D_GS_BQ_LX",
|
|
||||||
"D_GS_XS_SBRYLX",
|
|
||||||
"D_GS_ZDQT_LB",
|
|
||||||
"D_GS_XS_FXDJ",
|
|
||||||
"D_BZ_MZ",
|
|
||||||
"D_GS_XS_LX",
|
|
||||||
"D_GS_RLQB_BJSB_BSZT",
|
|
||||||
"D_BZ_SF"
|
|
||||||
); //获取字典数据
|
|
||||||
const ryDialog = ref(false); //选择弹窗
|
|
||||||
|
|
||||||
const tableDate = reactive({
|
|
||||||
bqList: [], //表格数据
|
|
||||||
ryList: [], //上报人员列表
|
|
||||||
keyCount: 0,
|
|
||||||
rykeyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
tableHeight: 225,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 90, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "标签代码", prop: "bqDm" },
|
|
||||||
{ label: "标签类别", prop: "bqLb", showSolt: true },
|
|
||||||
{ label: "标签类型", prop: "bqLx", showSolt: true },
|
|
||||||
{ label: "标签名称", prop: "bqMc" },
|
|
||||||
{ label: "标签种类", prop: "bqZl", showSolt: true }
|
|
||||||
],
|
|
||||||
tableColumnRy: [
|
|
||||||
{ label: "姓名", prop: "ryXm" },
|
|
||||||
{ label: "联系电话", prop: "ryLxdh" },
|
|
||||||
{ label: "身份证号", prop: "rySfzh" },
|
|
||||||
{ label: "民族", prop: "ryMz", showSolt: true },
|
|
||||||
{ label: "居住地址", prop: "jzdDz" }
|
|
||||||
]
|
|
||||||
});
|
|
||||||
const dialogForm = ref(false); //弹窗
|
const dialogForm = ref(false); //弹窗
|
||||||
const title = ref(""); //弹窗标题
|
const formData = ref([
|
||||||
const typeOf = ref(""); //弹窗类型
|
{ label: "", prop: "gapdive", type: "slot",width:'100%' },
|
||||||
const formData = ref([]);
|
{ label: "线索编号", prop: "xsbh", type: "input",},
|
||||||
const deptList = ref([]); //部门列表
|
{ label: "线索名称", prop: "xsmc", type: "input" },
|
||||||
// 更新 formData 的函数
|
{ label: "线索类型", prop: "xslx", type: "select", options:props.dic.D_GS_XS_LX },
|
||||||
const updateFormData = () => {
|
{ label: "情报来源", prop: "qbly", type: "select", options:props.dic.D_GS_XS_LY},
|
||||||
const isReport = typeOf.value === "report";
|
{ label: "指向开始时间", prop: "zxkssj", type: "datetime"},
|
||||||
const isReportDetails = typeOf.value === "reportDetails";
|
{ label: "指向结束时间", prop: "zxjssj", type: "datetime"},
|
||||||
const isLeadDetails = typeOf.value === "leadDetails";
|
{ label: "指向地点", prop: "zxdz", type: "input"},
|
||||||
// 判断是否应该全部禁用（reportDetails 或 leadDetails）
|
{ label: "所属专题", prop: "sszt", type: "select",options:props.dic.D_BZ_SSZT},
|
||||||
const shouldDisableAll = isReportDetails || isLeadDetails;
|
{ prop: "gapline", type: "slot",width:'100%' },
|
||||||
const baseFields = isReportDetails
|
{ prop: "scfj", type: "slot",width:'100%'},
|
||||||
? [] // reportDetails 模式下不显示 baseFields
|
{ label: "线索内容", prop: "xsnr", type: "textarea",width:'100%'},
|
||||||
: [
|
{ label: "群体类型", prop: "qtlx", type: "select",options:props.dic.D_GS_XS_QTLX },
|
||||||
{
|
{ label: "群体名称", prop: "qtmc", type: "input"},
|
||||||
label: "标签列表",
|
{ label: "涉及人数", prop: "sjrs", type: "inputNumber"},
|
||||||
prop: "bqList",
|
{ label: "线索报送单位", prop: "fjWb", type: "department"},
|
||||||
type: "slot",
|
]);
|
||||||
width: "80%",
|
const listQuery = ref({tps:[]}); //表单
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "上报人员",
|
|
||||||
prop: "sbRyId",
|
|
||||||
type: "slot",
|
|
||||||
width: "80%",
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "上报人员类型",
|
|
||||||
prop: "sbRyLx",
|
|
||||||
type: "select",
|
|
||||||
options: D_GS_XS_SBRYLX,
|
|
||||||
disabled: true // 原本就禁用的保持不变
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索标题",
|
|
||||||
prop: "xsBt",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索编号",
|
|
||||||
prop: "xsBh",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索类型",
|
|
||||||
prop: "xsLx",
|
|
||||||
type: "select",
|
|
||||||
options: D_GS_XS_LX,
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索开始日期",
|
|
||||||
prop: "xsRqKs",
|
|
||||||
type: "date",
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索截止日期",
|
|
||||||
prop: "xsRqJs",
|
|
||||||
type: "date",
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "指向地点",
|
|
||||||
prop: "xsZxdd",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "群体名称",
|
|
||||||
prop: "xsQtmc",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "群体类型",
|
|
||||||
prop: "xsQtlx",
|
|
||||||
type: "select",
|
|
||||||
options: D_GS_ZDQT_LB,
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "风险等级",
|
|
||||||
prop: "xsFxdj",
|
|
||||||
type: "select",
|
|
||||||
options: D_GS_XS_FXDJ,
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索名称",
|
|
||||||
prop: "xsMc",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索内容",
|
|
||||||
prop: "xsNr",
|
|
||||||
type: "slot",
|
|
||||||
width: "100%",
|
|
||||||
disabled: isReport || shouldDisableAll // report 或详情模式时禁用
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
const conditionalFields =
|
|
||||||
isReport || isReportDetails
|
|
||||||
? [
|
|
||||||
{
|
|
||||||
label: "报送编号",
|
|
||||||
prop: "bsBh",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "报送日期",
|
|
||||||
prop: "bsRq",
|
|
||||||
type: "date",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "是否初报",
|
|
||||||
prop: "bsSfCb",
|
|
||||||
type: "radio",
|
|
||||||
options: D_BZ_SF,
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "报送状态",
|
|
||||||
prop: "bsZt",
|
|
||||||
type: "select",
|
|
||||||
options: D_GS_RLQB_BJSB_BSZT,
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "上报单位",
|
|
||||||
prop: "sbDwMc",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "上报单位代码",
|
|
||||||
prop: "sbDwDm",
|
|
||||||
type: "slot",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "抄送单位",
|
|
||||||
prop: "csDwMc",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "抄送单位代码",
|
|
||||||
prop: "csDwDm",
|
|
||||||
type: "slot",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "编制单位",
|
|
||||||
prop: "bzDwMc",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "编制单位代码",
|
|
||||||
prop: "bzDwDm",
|
|
||||||
type: "slot",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "承办人",
|
|
||||||
prop: "cbrXm",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "承办人身份证号",
|
|
||||||
prop: "cbrSfzh",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "审核人",
|
|
||||||
prop: "shrXm",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "审核人身份证号",
|
|
||||||
prop: "shrSfzh",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "签发人",
|
|
||||||
prop: "qfrXm",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "签发人身份证号",
|
|
||||||
prop: "qfrSfzh",
|
|
||||||
type: "input",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "报送内容",
|
|
||||||
prop: "bsNr",
|
|
||||||
type: "textarea",
|
|
||||||
width: "100%",
|
|
||||||
disabled: isReportDetails
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "汇编报刊",
|
|
||||||
prop: "hbBk",
|
|
||||||
type: "slot",
|
|
||||||
width: "100%",
|
|
||||||
disabled: isReportDetails
|
|
||||||
}
|
|
||||||
]
|
|
||||||
: [];
|
|
||||||
// 最终表单数据
|
|
||||||
formData.value = [...baseFields, ...conditionalFields];
|
|
||||||
};
|
|
||||||
// 编辑器实例，必须用 shallowRef
|
|
||||||
const editorRef = shallowRef();
|
|
||||||
const clueRef = shallowRef();
|
|
||||||
|
|
||||||
// 内容 HTML
|
|
||||||
const valueHtml = ref("<p>hello</p>");
|
|
||||||
// 内容 HTML
|
|
||||||
const clueHtml = ref("<p>hello</p>");
|
|
||||||
const toolbarConfig = {};
|
|
||||||
const editorConfig = ref({ placeholder: "请输入内容...", readOnly: false });
|
|
||||||
const clueConfig = ref({ placeholder: "请输入内容...", readOnly: false });
|
|
||||||
|
|
||||||
const listQuery = ref({ sbRyLx: "06", xsLy: "02" }); //表单
|
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const elform = ref();
|
const elform = ref();
|
||||||
const tagDialog = ref();
|
const title = ref("");
|
||||||
const TYPE_TO_TITLE = {
|
const pageForm = reactive({
|
||||||
add: "新增",
|
tableData: [],
|
||||||
report: "上报",
|
keyCount: 0,
|
||||||
edit: "编辑",
|
tableConfiger: {
|
||||||
leadDetails: "详情", // 保持原逻辑
|
rowHieght: 61,
|
||||||
reportDetails: "上报详情" // 保持原逻辑
|
showSelectType: "checkBox",
|
||||||
};
|
loading: false
|
||||||
const rules = reactive({
|
},
|
||||||
xsbt: [{ required: true, message: "请输入线索标题", trigger: "blur" }]
|
controlsWidth: 220,
|
||||||
});
|
tableColumn: [
|
||||||
const editpeo = ref();
|
{ label: "姓名", prop: "xm" },
|
||||||
onMounted(() => {
|
{ label: "性别", prop: "xb" },
|
||||||
getdepartmentList();
|
{ label: "身份证号", prop: "sfzh" },
|
||||||
|
{ label: "户籍地", prop: "hjd" },
|
||||||
|
{ label: "户籍地派出所", prop: "hjdpcs" },
|
||||||
|
{ label: "标签", prop: "bq" }
|
||||||
|
]
|
||||||
});
|
});
|
||||||
|
const showPeo = ref(false)
|
||||||
|
const peoTitle = ref('')
|
||||||
|
onMounted(()=>{
|
||||||
|
tabHeightFn()
|
||||||
|
})
|
||||||
|
|
||||||
// 获取部门列表
|
|
||||||
const getdepartmentList = () => {
|
|
||||||
selectUserDeptPage().then((res) => {
|
|
||||||
deptList.value = res?.records.map((item) => ({
|
|
||||||
label: item.deptName,
|
|
||||||
value: item.deptId
|
|
||||||
}));
|
|
||||||
});
|
|
||||||
};
|
|
||||||
// 初始化数据
|
// 初始化数据
|
||||||
const init = (type, row) => {
|
const init = (type, row) => {
|
||||||
|
listQuery.value = {tps :[]};
|
||||||
|
tabHeightFn()
|
||||||
dialogForm.value = true;
|
dialogForm.value = true;
|
||||||
title.value = TYPE_TO_TITLE[type] || "新增"; // 安全回退
|
// 初始化表单数据，并根据详情页设置禁用状态
|
||||||
|
// if (row) getDataById(row.id);
|
||||||
typeOf.value = type;
|
|
||||||
if (typeOf == "reportDetails") {
|
|
||||||
editorRef.value.disable(); // 禁用
|
|
||||||
editorConfig.readOnly = true; // 禁用
|
|
||||||
}
|
|
||||||
|
|
||||||
if (typeOf == "leadDetails") {
|
|
||||||
clueRef.value.enable(); // 启用
|
|
||||||
clueConfig.readOnly = false; // 启用
|
|
||||||
}
|
|
||||||
|
|
||||||
if (row) getDataById(row.id);
|
|
||||||
if (row.sbRyId) getDataRyId(row.sbRyId);
|
|
||||||
};
|
};
|
||||||
// 根据id查询详情
|
// 根据id查询详情
|
||||||
const getDataById = (id) => {
|
const getDataById = (id) => {
|
||||||
// 根据 typeOf 的值决定调用哪个接口
|
// qcckGet({}, "/mosty-gsxt/tbGsxtRqfjNr/" + id).then((res) => {
|
||||||
const apiUrl =
|
// listQuery.value = res;
|
||||||
typeOf.value === "reportDetails"
|
// });
|
||||||
? "/mosty-gsxt/tbGsxtRlqbBjsb/selectVoByXsId/" + id
|
|
||||||
: "/mosty-gsxt/tbGsxtXs/selectVoById/" + id;
|
|
||||||
qcckGet({}, apiUrl).then((res) => {
|
|
||||||
listQuery.value = res;
|
|
||||||
tableDate.bqList = listQuery.value.bqList;
|
|
||||||
});
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// 根据id查询详情
|
|
||||||
const getDataRyId = (id) => {
|
|
||||||
qcckGet({}, "/mosty-gsxt/tbGsxtJwry/" + id).then((res) => {
|
|
||||||
tableDate.ryList = [res];
|
|
||||||
listQuery.value.sbRyId = res.id;
|
|
||||||
});
|
|
||||||
};
|
|
||||||
// 提交
|
// 提交
|
||||||
const submit = () => {
|
const submit = () => {
|
||||||
elform.value.submit((data) => {
|
elform.value.submit((data) => {
|
||||||
// 定义仅在 report 模式下需要的字段
|
let params = { ...data };
|
||||||
const reportFields = [
|
qcckPost(params, '/mosty-gsxt/tbGsxtRqfjNr/save').then((res) => {
|
||||||
"bsBh",
|
|
||||||
"bsNr",
|
|
||||||
"bsRq",
|
|
||||||
"bsSfCb",
|
|
||||||
"bsZt",
|
|
||||||
"sbDwDm",
|
|
||||||
"sbDwMc",
|
|
||||||
"csDwMc",
|
|
||||||
"csDwDm",
|
|
||||||
"bzDwMc",
|
|
||||||
"bzDwDm",
|
|
||||||
"cbrXm",
|
|
||||||
"cbrSfzh",
|
|
||||||
"shrXm",
|
|
||||||
"shrSfzh",
|
|
||||||
"qfrXm",
|
|
||||||
"qfrSfzh",
|
|
||||||
"hbBk",
|
|
||||||
"xsId" // 新增 xsId
|
|
||||||
];
|
|
||||||
|
|
||||||
// 准备最终提交数据
|
|
||||||
let submitData;
|
|
||||||
|
|
||||||
if (typeOf.value === "report") {
|
|
||||||
// report 模式：只提交 reportFields 里的字段 + hbBk（富文本）
|
|
||||||
submitData = {
|
|
||||||
...Object.fromEntries(
|
|
||||||
Object.entries(data).filter(([key]) => reportFields.includes(key))
|
|
||||||
),
|
|
||||||
hbBk: valueHtml.value, // 强制覆盖富文本字段
|
|
||||||
xsId: listQuery.value.id // 强制添加 xsId
|
|
||||||
};
|
|
||||||
} else {
|
|
||||||
// 非 report 模式：提交除 reportFields 外的所有字段
|
|
||||||
submitData = {
|
|
||||||
...Object.fromEntries(
|
|
||||||
Object.entries(data).filter(([key]) => !reportFields.includes(key))
|
|
||||||
),
|
|
||||||
xsNr: clueHtml.value // 强制覆盖线索内容字段
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
// 根据 title 决定请求 URL
|
|
||||||
let url =
|
|
||||||
title.value == "新增"
|
|
||||||
? "/mosty-gsxt/tbGsxtXs/save"
|
|
||||||
: title.value == "上报"
|
|
||||||
? "/mosty-gsxt/tbGsxtRlqbBjsb/save"
|
|
||||||
: "/mosty-gsxt/tbGsxtXs/update";
|
|
||||||
|
|
||||||
// 发起请求
|
|
||||||
qcckPost(submitData, url)
|
|
||||||
.then((res) => {
|
|
||||||
proxy.$message({ type: "success", message: title.value + "成功" });
|
proxy.$message({ type: "success", message: title.value + "成功" });
|
||||||
emit("getList");
|
emit("onSearch");
|
||||||
close();
|
close();
|
||||||
})
|
})
|
||||||
.catch(() => {});
|
.catch(() => {});
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
// 打开弹窗
|
|
||||||
const openDialog = (type, value) => {
|
|
||||||
nextTick(() => {
|
|
||||||
if (value == "ry") {
|
|
||||||
ryDialog.value = true;
|
|
||||||
} else if (value == "bq") {
|
|
||||||
chooseShow.value = true;
|
|
||||||
tagDialog.value.setValues(listQuery.value.bqList);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// 删除
|
|
||||||
const delDictItem = (bqId) => {
|
|
||||||
tableDate.bqList = tableDate.bqList.filter((item) => item.bqId !== bqId);
|
|
||||||
listQuery.value.bqList = tableDate.bqList;
|
|
||||||
};
|
|
||||||
// 删除
|
|
||||||
const delDict = (id) => {
|
|
||||||
tableDate.ryList = tableDate.ryList.filter((item) => item.id !== id);
|
|
||||||
listQuery.value.ryList = tableDate.ryList;
|
|
||||||
};
|
|
||||||
// 选择数据
|
|
||||||
const chooseDate = (data) => {
|
|
||||||
console.log(data[0].id);
|
|
||||||
tableDate.ryList = data;
|
|
||||||
listQuery.value.sbRyId = data[0].id;
|
|
||||||
};
|
|
||||||
const handleTagSelect = (selectedTags) => {
|
|
||||||
tableDate.bqList = selectedTags.map((item) => ({
|
|
||||||
bqDm: item.bqDm || "",
|
|
||||||
bqId: item.bqId || "",
|
|
||||||
bqLb: item.bqLb || "",
|
|
||||||
bqLx: item.bqLx || "",
|
|
||||||
bqMc: item.bqMc || "",
|
|
||||||
bqZl: item.bqZl || ""
|
|
||||||
}));
|
|
||||||
listQuery.value.bqList = tableDate.bqList;
|
|
||||||
// 每个标签包含: bqDm, bqId, bqLb, bqLx, bqMc, bqZl 属性
|
|
||||||
};
|
|
||||||
// 关闭
|
// 关闭
|
||||||
const close = () => {
|
const close = () => {
|
||||||
listQuery.value = {};
|
|
||||||
tableDate.bqList = [];
|
|
||||||
tableDate.ryList = [];
|
|
||||||
dialogForm.value = false;
|
dialogForm.value = false;
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
|
elform.value.reset()
|
||||||
|
listQuery.value = {tps :[]};
|
||||||
|
};
|
||||||
|
|
||||||
|
// 表格高度计算
|
||||||
|
const tabHeightFn = () => {
|
||||||
|
pageForm.tableHeight = window.innerHeight - 720;
|
||||||
|
window.onresize = function () {
|
||||||
|
tabHeightFn();
|
||||||
|
};
|
||||||
};
|
};
|
||||||
const handleCreated = (editor) => {
|
|
||||||
editorRef.value = editor; // 记录 editor 实例，重要！
|
|
||||||
};
|
|
||||||
const clueCreated = (editor) => {
|
|
||||||
clueRef.value = editor; // 记录 editor 实例，重要！
|
|
||||||
};
|
|
||||||
// 组件销毁时，也及时销毁编辑器
|
|
||||||
onBeforeUnmount(() => {
|
|
||||||
const editor = editorRef.value;
|
|
||||||
if (editor == null) return;
|
|
||||||
editor.destroy();
|
|
||||||
});
|
|
||||||
// 初始化调用一次
|
|
||||||
updateFormData();
|
|
||||||
|
|
||||||
// 监听 title 变化
|
|
||||||
watch(title, () => {
|
|
||||||
updateFormData();
|
|
||||||
});
|
|
||||||
defineExpose({ init });
|
defineExpose({ init });
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "~@/assets/css/layout.scss";
|
@import "~@/assets/css/layout.scss";
|
||||||
@import "~@/assets/css/element-plus.scss";
|
@import "~@/assets/css/element-plus.scss";
|
||||||
|
::v-deep .el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
|
||||||
|
color: #0072ff;
|
||||||
|
background: rgba(0, 114, 255, 0.3);
|
||||||
|
}
|
||||||
.boxlist {
|
.boxlist {
|
||||||
width: 99%;
|
width: 99%;
|
||||||
height: 225px;
|
height: 225px;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
::v-deep .avatar-uploader{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-upload-list{
|
||||||
|
margin-left: 20px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
::v-deep .el-upload-list__item-name .el-icon{
|
||||||
|
top: 3px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -0,0 +1,69 @@
|
|||||||
|
<template>
|
||||||
|
<el-dialog v-model="modelValue" :title="props.title" @close="close" :close-on-click-modal="false">
|
||||||
|
<FormMessage v-model="listQuery" :formList="formData" labelWidth="120px" ref="elform" :rules="rules"></FormMessage>
|
||||||
|
<template #footer>
|
||||||
|
<div class="flex just-center">
|
||||||
|
<el-button @click="close">取消</el-button>
|
||||||
|
<el-button type="primary" @click="submitForm">确认</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
|
import { reactive, ref } from 'vue';
|
||||||
|
const props = defineProps({
|
||||||
|
modelValue:{
|
||||||
|
type:Boolean,
|
||||||
|
default:false
|
||||||
|
},
|
||||||
|
dic:{
|
||||||
|
type:Object,
|
||||||
|
default:{}
|
||||||
|
},
|
||||||
|
title:{
|
||||||
|
type:String,
|
||||||
|
default:'新增人员'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const elform = ref()
|
||||||
|
const emit = defineEmits('update:modelValue')
|
||||||
|
const listQuery = ref({})
|
||||||
|
const formData = ref([
|
||||||
|
{ label: "姓名", prop: "xm", type: "input" },
|
||||||
|
{ label: "性别", prop: "xb", type: "select",options:props.dic.D_BZ_XB },
|
||||||
|
{ label: "身份证号", prop: "sfzh", type: "input" },
|
||||||
|
{ label: "户籍地", prop: "hjd", type: "input" },
|
||||||
|
{ label: "户籍地派出所", prop: "hjdpcs", type: "input" },
|
||||||
|
{ label: "标签", prop: "bq", type: "input" },
|
||||||
|
{ label: "是否挑头人", prop: "sfdtr", type: "select",options:props.dic.D_BZ_SF },
|
||||||
|
{ label: "是否响应人", prop: "sfxyr", type: "select" ,options:props.dic.D_BZ_SF },
|
||||||
|
{ label: "所属群体", prop: "ssqt", type: "input" },
|
||||||
|
{ label: "微信号", prop: "wxh", type: "input" },
|
||||||
|
{ label: "QQ", prop: "qqh", type: "input" },
|
||||||
|
])
|
||||||
|
const rules = reactive({
|
||||||
|
xm: [{ required: true, message: "请输入姓名", trigger: "blur" }],
|
||||||
|
xb: [{ required: true, message: "请选择性别", trigger: "change" }],
|
||||||
|
sfzh: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
|
||||||
|
hjd: [{ required: true, message: "请输入户籍地", trigger: "blur" }],
|
||||||
|
})
|
||||||
|
|
||||||
|
const submitForm = () =>{
|
||||||
|
elform.value.submit(()=>{
|
||||||
|
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const close = () =>{
|
||||||
|
elform.value.reset();
|
||||||
|
emit('update:modelValue',false)
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
::v-deep .el-form-item--default {
|
||||||
|
width: 48% !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,229 +0,0 @@
|
|||||||
<template>
|
|
||||||
<el-dialog
|
|
||||||
:title="titleValue"
|
|
||||||
width="900px"
|
|
||||||
:model-value="modelValue"
|
|
||||||
append-to-body
|
|
||||||
@close="closed"
|
|
||||||
>
|
|
||||||
<div>
|
|
||||||
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
|
||||||
<el-form-item label="人员姓名">
|
|
||||||
<el-input
|
|
||||||
placeholder="请输入人员姓名"
|
|
||||||
v-model="listQuery.ryXm"
|
|
||||||
clearable
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="success" @click="handleFilter">查询</el-button>
|
|
||||||
<el-button type="info" @click="reset()"> 重置 </el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<div
|
|
||||||
class="tabBox"
|
|
||||||
:class="props.Single ? 'tabBoxRadio' : ''"
|
|
||||||
style="margin-top: 0px"
|
|
||||||
>
|
|
||||||
<el-table
|
|
||||||
v-loading="loading"
|
|
||||||
ref="multipleUserRef"
|
|
||||||
@selection-change="handleSelectionChange"
|
|
||||||
:data="tableData"
|
|
||||||
border
|
|
||||||
:row-key="keyid"
|
|
||||||
style="width: 100%"
|
|
||||||
height="450"
|
|
||||||
>
|
|
||||||
<el-table-column
|
|
||||||
type="selection"
|
|
||||||
width="55"
|
|
||||||
:reserve-selection="true"
|
|
||||||
/>
|
|
||||||
<el-table-column prop="ryXm" align="center" label="姓名" />
|
|
||||||
<el-table-column prop="ryLxdh" align="center" label="联系电话" />
|
|
||||||
<el-table-column prop="rySfzh" align="center" label="身份证号">
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="bqYs" align="center" label="民族">
|
|
||||||
<template #default="{ row }">
|
|
||||||
<DictTag
|
|
||||||
:value="row.ryMz"
|
|
||||||
:tag="false"
|
|
||||||
:options="props.dic.D_BZ_MZ"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="jzdDz" align="center" label="居住地址">
|
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
<div class="fenye" :style="{ top: tableHeight + 'px' }">
|
|
||||||
<el-pagination
|
|
||||||
class="pagination"
|
|
||||||
@size-change="handleSizeChange"
|
|
||||||
@current-change="handleCurrentChange"
|
|
||||||
:current-page="listQuery.current"
|
|
||||||
:page-sizes="[10, 20, 50, 100]"
|
|
||||||
:page-size="listQuery.size"
|
|
||||||
layout="total, sizes, prev, pager, next, jumper"
|
|
||||||
:total="total"
|
|
||||||
></el-pagination>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<template #footer>
|
|
||||||
<div class="dialog-footer">
|
|
||||||
<el-button @click="closed">取消</el-button>
|
|
||||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-dialog>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { defineProps, ref, onMounted } from "vue";
|
|
||||||
import { qcckGet } from "@/api/qcckApi.js";
|
|
||||||
const props = defineProps({
|
|
||||||
modelValue: {
|
|
||||||
type: Boolean,
|
|
||||||
required: true
|
|
||||||
},
|
|
||||||
dic: {
|
|
||||||
type: Object,
|
|
||||||
default: () => {}
|
|
||||||
},
|
|
||||||
bqDl: {
|
|
||||||
type: String,
|
|
||||||
default: "01"
|
|
||||||
},
|
|
||||||
bqLx: {
|
|
||||||
type: String,
|
|
||||||
default: "01"
|
|
||||||
},
|
|
||||||
titleValue: {
|
|
||||||
type: String,
|
|
||||||
default: "选择大类"
|
|
||||||
},
|
|
||||||
LeaderType: {
|
|
||||||
type: String,
|
|
||||||
default: ""
|
|
||||||
},
|
|
||||||
//是否单选
|
|
||||||
Single: {
|
|
||||||
type: Boolean,
|
|
||||||
default: true
|
|
||||||
},
|
|
||||||
roleIds: {
|
|
||||||
type: Array,
|
|
||||||
default: []
|
|
||||||
}
|
|
||||||
});
|
|
||||||
const total = ref(0);
|
|
||||||
const listQuery = ref({
|
|
||||||
current: 1,
|
|
||||||
size: 20
|
|
||||||
});
|
|
||||||
const loading = ref(false);
|
|
||||||
const tableData = ref([]);
|
|
||||||
const emits = defineEmits(["update:modelValue", "chooseDate"]);
|
|
||||||
onMounted(() => {
|
|
||||||
handleFilter();
|
|
||||||
});
|
|
||||||
const closed = () => {
|
|
||||||
emits("update:modelValue", false);
|
|
||||||
};
|
|
||||||
const reset = () => {
|
|
||||||
listQuery.value = { current: 1, size: 20 };
|
|
||||||
getDataList();
|
|
||||||
};
|
|
||||||
|
|
||||||
const keyid = (row) => {
|
|
||||||
return row.id;
|
|
||||||
};
|
|
||||||
// 为用户分配角色
|
|
||||||
const onComfirm = () => {
|
|
||||||
const userList = multipleSelectionUser.value;
|
|
||||||
let list = [];
|
|
||||||
let listId = [];
|
|
||||||
userList.forEach((val) => {
|
|
||||||
if (listId.indexOf(val.id) == -1) {
|
|
||||||
list.push(val);
|
|
||||||
listId.push(val.id);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
emits("chooseDate", list);
|
|
||||||
closed();
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
* pageSize 改变触发
|
|
||||||
*/
|
|
||||||
const handleSizeChange = (currentSize) => {
|
|
||||||
listQuery.value.size = currentSize;
|
|
||||||
getDataList();
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 页码改变触发
|
|
||||||
*/
|
|
||||||
const handleCurrentChange = (currentPage) => {
|
|
||||||
listQuery.value.current = currentPage;
|
|
||||||
getDataList();
|
|
||||||
};
|
|
||||||
|
|
||||||
// 查询标签组合列表
|
|
||||||
const getDataList = () => {
|
|
||||||
const data = listQuery.value;
|
|
||||||
loading.value = true;
|
|
||||||
qcckGet(data, "/mosty-gsxt/tbGsxtJwry/selectPage").then((res) => {
|
|
||||||
tableData.value = res?.records;
|
|
||||||
total.value = Number(res.total);
|
|
||||||
loading.value = false;
|
|
||||||
multipleUser();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
//列表回显
|
|
||||||
function multipleUser() {
|
|
||||||
tableData.value.forEach((item) => {
|
|
||||||
if (props.roleIds.some((id) => id == item.id)) {
|
|
||||||
multipleUserRef.value.toggleRowSelection(item, true);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleFilter = () => {
|
|
||||||
listQuery.value.current = 1;
|
|
||||||
getDataList();
|
|
||||||
};
|
|
||||||
|
|
||||||
const multipleUserRef = ref(null);
|
|
||||||
const multipleSelectionUser = ref([]);
|
|
||||||
const handleSelectionChange = (val) => {
|
|
||||||
if (props.Single) {
|
|
||||||
if (val.length > 1) {
|
|
||||||
let del_row = val.shift();
|
|
||||||
multipleUserRef.value.toggleRowSelection(del_row, false);
|
|
||||||
}
|
|
||||||
multipleSelectionUser.value = val;
|
|
||||||
} else {
|
|
||||||
multipleSelectionUser.value = val;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
@import "@/assets/css/layout.scss";
|
|
||||||
@import "@/assets/css/element-plus.scss";
|
|
||||||
</style>
|
|
||||||
<style>
|
|
||||||
.tabBoxRadio .el-checkbox__inner {
|
|
||||||
border-radius: 50% !important;
|
|
||||||
}
|
|
||||||
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
:deep(.el-dialog) {
|
|
||||||
background: #fff !important;
|
|
||||||
border-radius: 8px !important;
|
|
||||||
/* 其他样式 */
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -4,24 +4,17 @@
|
|||||||
<PageTitle title="人力情报信息采集流转">
|
<PageTitle title="人力情报信息采集流转">
|
||||||
<el-button type="primary" @click="addEdit('add', '')">
|
<el-button type="primary" @click="addEdit('add', '')">
|
||||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||||
<span style="vertical-align: middle">新增</span>
|
<span style="vertical-align: middle">导出</span>
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button type="danger" @click="addEdit('add', '')">
|
<el-button type="danger" @click="addEdit('add', '')">
|
||||||
<el-icon style="vertical-align: middle"><Dete /></el-icon>
|
<el-icon style="vertical-align: middle"><Dete /></el-icon>
|
||||||
<span style="vertical-align: middle">批量删除</span>
|
<span style="vertical-align: middle">批量删除</span>
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button type="primary">
|
|
||||||
<span style="vertical-align: middle">导出</span>
|
|
||||||
</el-button>
|
|
||||||
</PageTitle>
|
</PageTitle>
|
||||||
</div>
|
</div>
|
||||||
<!-- 搜索 -->
|
<!-- 搜索 -->
|
||||||
<div ref="searchBox">
|
<div ref="searchBox">
|
||||||
<Search
|
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
||||||
:searchArr="searchConfiger"
|
|
||||||
@submit="onSearch"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<!-- 表格 -->
|
<!-- 表格 -->
|
||||||
<div class="tabBox">
|
<div class="tabBox">
|
||||||
@ -32,58 +25,19 @@
|
|||||||
:key="pageData.keyCount"
|
:key="pageData.keyCount"
|
||||||
:tableConfiger="pageData.tableConfiger"
|
:tableConfiger="pageData.tableConfiger"
|
||||||
:controlsWidth="pageData.controlsWidth"
|
:controlsWidth="pageData.controlsWidth"
|
||||||
@chooseData="chooseData"
|
@chooseData="chooseData">
|
||||||
>
|
|
||||||
<template #xsLy="{ row }">
|
<template #shzt="{row}">
|
||||||
<DictTag :tag="false" :value="row.xsLy" :options="D_GS_XS_LY" />
|
<span>采纳（将这条信息推送到情报管理模块）</span>
|
||||||
</template>
|
<span>退回！</span>
|
||||||
<template #xsFxdj="{ row }">
|
|
||||||
<DictTag :tag="false" :value="row.xsFxdj" :options="D_GS_XS_FXDJ" />
|
|
||||||
</template>
|
|
||||||
<template #xsQtlx="{ row }">
|
|
||||||
<DictTag :tag="false" :value="row.xsQtlx" :options="D_GS_ZDQT_LB" />
|
|
||||||
</template>
|
|
||||||
<template #xsZtCz="{ row }">
|
|
||||||
<DictTag :tag="false" :value="row.xsZtCz" :options="D_GS_XS_CZZT" />
|
|
||||||
</template>
|
|
||||||
<template #xsZt="{ row }">
|
|
||||||
<DictTag :tag="false" :value="row.xsZt" :options="D_GS_XS_ZT" />
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<!-- 操作 -->
|
<!-- 操作 -->
|
||||||
<template #controls="{ row }">
|
<template #controls="{ row }">
|
||||||
<el-link size="small" type="success" @click="addEdit('edit', row)"
|
<el-link size="small" type="primary" @click="addEdit('edit', row)">编辑</el-link>
|
||||||
>编辑</el-link
|
<!-- 审核 =》 退回（退回原因）和采纳 -->
|
||||||
>
|
<el-link size="small" type="success" @click="addEdit">审核</el-link>
|
||||||
<el-link
|
<el-link size="small" type="danger" @click="deleteRow(row)">删除</el-link>
|
||||||
size="small"
|
|
||||||
type="plain"
|
|
||||||
@click="addEdit('leadDetails', row)"
|
|
||||||
>线索详情</el-link
|
|
||||||
>
|
|
||||||
<el-link
|
|
||||||
size="small"
|
|
||||||
type="warning"
|
|
||||||
@click="addEdit('reportDetails', row)"
|
|
||||||
v-if="row.sfBjsb == 1"
|
|
||||||
>上报详情</el-link
|
|
||||||
>
|
|
||||||
<el-link
|
|
||||||
size="small"
|
|
||||||
type="primary"
|
|
||||||
@click="addEdit('report', row)"
|
|
||||||
v-if="row.sfBjsb == 0"
|
|
||||||
>上报</el-link
|
|
||||||
>
|
|
||||||
<el-link size="small" type="danger" @click="deleteRow(row)"
|
|
||||||
>删除</el-link
|
|
||||||
>
|
|
||||||
<el-link
|
|
||||||
size="small"
|
|
||||||
type="warning"
|
|
||||||
@click="transferClue(row)"
|
|
||||||
v-if="row.xsZt == '01'"
|
|
||||||
>采纳</el-link
|
|
||||||
>
|
|
||||||
</template>
|
</template>
|
||||||
</MyTable>
|
</MyTable>
|
||||||
<Pages
|
<Pages
|
||||||
@ -96,17 +50,8 @@
|
|||||||
}"
|
}"
|
||||||
></Pages>
|
></Pages>
|
||||||
</div>
|
</div>
|
||||||
<!-- 详情 -->
|
<!-- 新增 -->
|
||||||
<DetailForm ref="detailDiloag" @getList="getList" />
|
<AddForm ref="detailDiloag" :dic="{D_BZ_SF,D_BZ_XB,D_GS_XS_LY,D_BZ_SSZT,D_GS_XS_LX ,D_GS_XS_QTLX}" />
|
||||||
<el-dialog v-model="dialogVisible" title="是否采纳" width="500px">
|
|
||||||
<span>是否采纳该条数据</span>
|
|
||||||
<template #footer>
|
|
||||||
<div class="dialog-footer">
|
|
||||||
<el-button @click="dialogVisible = false">取消</el-button>
|
|
||||||
<el-button type="primary" @click="submitClue"> 确定 </el-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-dialog>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -115,67 +60,39 @@ import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
import Pages from "@/components/aboutTable/Pages.vue";
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
import Search from "@/components/aboutTable/Search.vue";
|
||||||
import DetailForm from "./components/addForm.vue";
|
import AddForm from "./components/addForm.vue";
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
|
const {D_GS_XS_LY, D_BZ_SSZT,D_BZ_SF,D_GS_XS_LX ,D_GS_XS_QTLX,D_BZ_XB} = proxy.$dict("D_GS_XS_LY","D_BZ_SSZT","D_BZ_SF","D_GS_XS_LX","D_GS_XS_QTLX","D_BZ_XB"); //获取字典数据
|
||||||
const { D_GS_XS_LY, D_GS_XS_FXDJ, D_GS_ZDQT_LB, D_GS_XS_CZZT, D_GS_XS_ZT } =
|
|
||||||
proxy.$dict(
|
|
||||||
"D_GS_XS_LY",
|
|
||||||
"D_GS_XS_FXDJ",
|
|
||||||
"D_GS_ZDQT_LB",
|
|
||||||
"D_GS_XS_CZZT",
|
|
||||||
"D_GS_XS_ZT"
|
|
||||||
); //获取字典数据
|
|
||||||
const dialogTitle = ref("新增信息"); //弹窗标题
|
|
||||||
const detailDiloag = ref();
|
const detailDiloag = ref();
|
||||||
const searchBox = ref(); //搜索框
|
const searchBox = ref(); //搜索框
|
||||||
const dialogVisible = ref(false);
|
|
||||||
const transferClueId = ref();
|
|
||||||
const searchConfiger = ref([
|
const searchConfiger = ref([
|
||||||
{
|
{ label: "线索名称", prop: 'clueTitle', placeholder: "请输入线索名称", showType: "input" },
|
||||||
label: "线索名称",
|
{ label: "语义关键字", prop: 'semanticKeywords', placeholder: "请输入语义关键字", showType: "input" },
|
||||||
prop: "xsMc",
|
{ label: "线索类型", prop: 'clueType', placeholder: "请选择线索类型", showType: "select" },
|
||||||
placeholder: "请输入线索名称",
|
{ label: "线索来源", prop: 'clueSource', placeholder: "请选择线索来源", showType: "select" },
|
||||||
showType: "input"
|
{ label: "线索状态", prop: 'xszt', placeholder: "请选择线索状态", showType: "select" },
|
||||||
},
|
{ label: "处置状态", prop: 'czzt', placeholder: "请选择处置状态", showType: "select" },
|
||||||
{
|
{ label: "开始时间", prop: 'startTime', placeholder: "请选择开始时间", showType: "date" },
|
||||||
label: "线索内容",
|
{ label: "结束时间", prop: 'endTime', placeholder: "请选择结束时间", showType: "date" },
|
||||||
prop: "xsNr",
|
{ label: "指向地点", prop: 'targetLocation', placeholder: "请输入指向地点", showType: "input" },
|
||||||
placeholder: "请输入线索内容",
|
|
||||||
showType: "input"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索大类",
|
|
||||||
prop: "xsDl",
|
|
||||||
placeholder: "请选择线索大型",
|
|
||||||
showType: "input"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索细类",
|
|
||||||
prop: "xsXl",
|
|
||||||
placeholder: "请选择线索细类",
|
|
||||||
showType: "input"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索来源",
|
|
||||||
prop: "xsLy",
|
|
||||||
placeholder: "请选择线索来源",
|
|
||||||
showType: "select",
|
|
||||||
options: D_GS_XS_LY
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索风险等级",
|
|
||||||
prop: "xsFxdj",
|
|
||||||
placeholder: "请选择线索风险等级",
|
|
||||||
showType: "select",
|
|
||||||
options: D_GS_XS_FXDJ
|
|
||||||
}
|
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const pageData = reactive({
|
const pageData = reactive({
|
||||||
tableData: [],
|
tableData: [
|
||||||
|
{
|
||||||
|
clueNo: "XS20240101001",
|
||||||
|
clueTitle: "可疑人员活动线索",
|
||||||
|
clueType: "人员线索",
|
||||||
|
clueSource: "群众举报",
|
||||||
|
startTime: "2024-01-01 08:00:00",
|
||||||
|
endTime: "2024-01-01 18:00:00",
|
||||||
|
targetLocation: "某市某区某街道",
|
||||||
|
clueContent: "发现多名可疑人员在该区域频繁出入，疑似从事非法活动。",
|
||||||
|
attachment: "report.pdf"
|
||||||
|
},],
|
||||||
keyCount: 0,
|
keyCount: 0,
|
||||||
tableConfiger: {
|
tableConfiger: {
|
||||||
rowHieght: 61,
|
rowHieght: 61,
|
||||||
@ -187,89 +104,69 @@ const pageData = reactive({
|
|||||||
pageSize: 20,
|
pageSize: 20,
|
||||||
pageCurrent: 1
|
pageCurrent: 1
|
||||||
},
|
},
|
||||||
controlsWidth: 350,
|
controlsWidth: 150,
|
||||||
tableColumn: [
|
tableColumn: [
|
||||||
{ label: "线索编号", prop: "xsBh" },
|
{ label: "上报人姓名", prop: "clueNo" },
|
||||||
{ label: "线索名称", prop: "xsMc" },
|
{ label: "上报人电话", prop: "clueNo" },
|
||||||
{ label: "线索来源", prop: "xsLy", showSolt: true },
|
{ label: "线索编号", prop: "clueNo" },
|
||||||
{ label: "风险等级", prop: "xsFxdj", showSolt: true },
|
{ label: "线索名称", prop: "clueTitle" },
|
||||||
|
{ label: "线索类型", prop: "clueType" },
|
||||||
|
{ label: "线索来源", prop: "clueSource" },
|
||||||
{ label: "开始时间", prop: "startTime" },
|
{ label: "开始时间", prop: "startTime" },
|
||||||
{ label: "结束时间", prop: "endTime" },
|
{ label: "结束时间", prop: "endTime" },
|
||||||
{ label: "指向地点", prop: "xsZxdd" },
|
{ label: "指向地点", prop: "targetLocation" },
|
||||||
{ label: "线索内容", prop: "xsNr" },
|
{ label: "线索内容", prop: "clueContent", width: 200 },
|
||||||
{ label: "群体类型", prop: "xsQtlx", showSolt: true },
|
{ label: "附件", prop: "attachment", showSolt: true },
|
||||||
{ label: "群体名称", prop: "xsQtmc" },
|
{ label: "审核状态", prop: "shzt", showSolt: true },
|
||||||
{ label: "上报单位", prop: "sbDwMc" },
|
|
||||||
{ label: "上报时间", prop: "sbSj" },
|
|
||||||
{ label: "涉及人数", prop: "xsSjrs" },
|
|
||||||
{ label: "附件", prop: "xsFj" },
|
|
||||||
{
|
|
||||||
label: "处置状态",
|
|
||||||
prop: "xsZtCz",
|
|
||||||
showSolt: true
|
|
||||||
},
|
|
||||||
{ label: "状态", prop: "xsZt", showSolt: true }
|
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
|
|
||||||
const queryFrom = ref({});
|
const queryFrom = ref({});
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
getList();
|
getList()
|
||||||
tabHeightFn();
|
tabHeightFn();
|
||||||
});
|
});
|
||||||
|
|
||||||
// 搜索
|
//选择类型
|
||||||
const onSearch = (val) => {
|
const handleType = (val) => {
|
||||||
queryFrom.value = { ...val };
|
pageData.keyCount++;
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
pageData.pageConfiger.pageCurrent = 1;
|
||||||
getList();
|
getList()
|
||||||
};
|
}
|
||||||
|
// 搜索
|
||||||
|
const onSearch = (val) =>{
|
||||||
|
queryFrom.value = {...val}
|
||||||
|
pageData.pageConfiger.pageCurrent = 1;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
//采纳
|
const changeNo = (val) =>{
|
||||||
const transferClue = (row) => {
|
|
||||||
dialogVisible.value = true;
|
|
||||||
transferClueId.value = row.id;
|
|
||||||
};
|
|
||||||
|
|
||||||
const submitClue = () => {
|
|
||||||
dialogVisible.value = false;
|
|
||||||
qcckGet({}, "/mosty-gsxt/tbGsxtXs/adopt/" + transferClueId.value)
|
|
||||||
.then((res) => {
|
|
||||||
proxy.$message({ type: "success", message: "采纳成功" });
|
|
||||||
getList();
|
|
||||||
transferClueId.value = "";
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
transferClueId.value = "";
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const changeNo = (val) => {
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
pageData.pageConfiger.pageNum = val;
|
||||||
getList();
|
getList()
|
||||||
};
|
}
|
||||||
const changeSize = (val) => {
|
const changeSize = (val) =>{
|
||||||
pageData.pageConfiger.pageSize = val;
|
pageData.pageConfiger.pageSize = val;
|
||||||
getList();
|
getList()
|
||||||
};
|
}
|
||||||
|
|
||||||
// 获取列表
|
// 获取列表
|
||||||
const getList = (val) => {
|
const getList = (val) =>{
|
||||||
pageData.tableConfiger.loading = true;
|
// pageData.tableConfiger.loading = true;
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
||||||
qcckGet(data, "/mosty-gsxt/tbGsxtXs/selectPage").then((res) => {
|
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
||||||
pageData.tableData = res.records || [];
|
// qcckPost(data,url).then(res=>{
|
||||||
pageData.total = res.total;
|
// pageData.tableData = res.records || [];
|
||||||
pageData.tableConfiger.loading = false;
|
// pageData.total = res.total;
|
||||||
})
|
// pageData.tableConfiger.loading = false;
|
||||||
.catch(() => {
|
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
||||||
pageData.tableConfiger.loading = false;
|
}
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// 详情
|
// 详情
|
||||||
const addEdit = (type, row) => {
|
const addEdit = (type, row) => {
|
||||||
detailDiloag.value.init(type, row);
|
nextTick(()=>{
|
||||||
|
detailDiloag.value.init(type, row);
|
||||||
|
})
|
||||||
};
|
};
|
||||||
|
|
||||||
// 表格高度计算
|
// 表格高度计算
|
||||||
@ -286,3 +183,4 @@ const tabHeightFn = () => {
|
|||||||
background: rgba(0, 0, 0, 0.5) !important;
|
background: rgba(0, 0, 0, 0.5) !important;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|||||||
@ -20,36 +20,6 @@
|
|||||||
ref="elform"
|
ref="elform"
|
||||||
:rules="rules"
|
:rules="rules"
|
||||||
>
|
>
|
||||||
<!-- 上报单位代码 -->
|
|
||||||
<template #bsDwDm>
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.bsDwDm"
|
|
||||||
placeholder="请选择上报单位代码"
|
|
||||||
style="width: 240px"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in deptList"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value.toString()"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</template>
|
|
||||||
<!-- 上报单位代码 -->
|
|
||||||
<template #ssbmdm>
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.ssbmdm"
|
|
||||||
placeholder="请选择所属单位代码"
|
|
||||||
style="width: 240px"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in deptList"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value.toString()"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</template>
|
|
||||||
<!-- 线索列表-->
|
<!-- 线索列表-->
|
||||||
<template #xsList>
|
<template #xsList>
|
||||||
<el-button @click="openDialog()">选择</el-button>
|
<el-button @click="openDialog()">选择</el-button>
|
||||||
@ -197,32 +167,12 @@ const tableDate = reactive({
|
|||||||
const dialogForm = ref(false); //弹窗
|
const dialogForm = ref(false); //弹窗
|
||||||
const chooseTitle = ref(""); //选择弹窗
|
const chooseTitle = ref(""); //选择弹窗
|
||||||
const formData = ref([
|
const formData = ref([
|
||||||
{ label: "报送单位代码", prop: "bsDwDm", type: "slot" },
|
{ label: "报送单位", prop: "ssbmdm", type: "department" },
|
||||||
{ label: "报送单位名称", prop: "bsDwMc", type: "input" },
|
|
||||||
{ label: "任务标题", prop: "rwBt", type: "input" },
|
{ label: "任务标题", prop: "rwBt", type: "input" },
|
||||||
{ label: "任务编号", prop: "rwBh", type: "input" },
|
{ label: "任务来源", prop: "rwLy", type: "select", options: D_GS_RLQB_RWDD_LY },
|
||||||
{
|
|
||||||
label: "任务类型",
|
|
||||||
prop: "rwLx",
|
|
||||||
type: "select",
|
|
||||||
options: D_GS_RLQB_RWDD_LX
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "任务来源",
|
|
||||||
prop: "rwLy",
|
|
||||||
type: "select",
|
|
||||||
options: D_GS_RLQB_RWDD_LY
|
|
||||||
},
|
|
||||||
{ label: "反馈开始时间", prop: "rwSjKs", type: "datetime" },
|
{ label: "反馈开始时间", prop: "rwSjKs", type: "datetime" },
|
||||||
{ label: "反馈截止时间", prop: "rwSjFkjz", type: "datetime" },
|
{ label: "反馈截止时间", prop: "rwSjFkjz", type: "datetime" },
|
||||||
{
|
{ label: "严重程度", prop: "rwYzcd", type: "select", options: D_GS_RLQB_RWDD_YZCD},
|
||||||
label: "严重程度",
|
|
||||||
prop: "rwYzcd",
|
|
||||||
type: "select",
|
|
||||||
options: D_GS_RLQB_RWDD_YZCD
|
|
||||||
},
|
|
||||||
{ label: "所属单位代码", prop: "ssbmdm", type: "slot" },
|
|
||||||
{ label: "所属单位名称", prop: "ssbmmc", type: "input" },
|
|
||||||
{ label: "任务内容", prop: "rwNr", type: "textarea", width: "100%" },
|
{ label: "任务内容", prop: "rwNr", type: "textarea", width: "100%" },
|
||||||
{ label: "线索列表", prop: "xsList", type: "slot", width: "80%" }
|
{ label: "线索列表", prop: "xsList", type: "slot", width: "80%" }
|
||||||
]);
|
]);
|
||||||
|
|||||||
@ -1,285 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">人力情报信息搜索任务调度详情 </span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="form_cnt">
|
|
||||||
<FormMessage
|
|
||||||
:formList="formData"
|
|
||||||
v-model="listQuery"
|
|
||||||
ref="elform"
|
|
||||||
:rules="rules"
|
|
||||||
>
|
|
||||||
<!-- 上报单位代码 -->
|
|
||||||
<template #bsDwDm>
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.bsDwDm"
|
|
||||||
placeholder="请选择上报单位代码"
|
|
||||||
style="width: 240px"
|
|
||||||
:disabled="true"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in deptList"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value.toString()"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</template>
|
|
||||||
<!-- 上报单位代码 -->
|
|
||||||
<template #ssbmdm>
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.ssbmdm"
|
|
||||||
placeholder="请选择所属单位代码"
|
|
||||||
style="width: 240px"
|
|
||||||
:disabled="true"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in deptList"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value.toString()"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</template>
|
|
||||||
<!-- 线索列表-->
|
|
||||||
<template #xsList>
|
|
||||||
<div class="boxlist">
|
|
||||||
<MyTable
|
|
||||||
:tableData="tableDate.xsList"
|
|
||||||
:tableColumn="tableDate.tableColumn"
|
|
||||||
:tableHeight="tableDate.tableHeight"
|
|
||||||
:key="tableDate.keyCount"
|
|
||||||
:tableConfiger="tableDate.tableConfiger"
|
|
||||||
:controlsWidth="tableDate.controlsWidth"
|
|
||||||
@chooseData="chooseData"
|
|
||||||
>
|
|
||||||
<template #xsLy="{ row }">
|
|
||||||
<DictTag :tag="false" :value="row.xsLy" :options="D_GS_XS_LY" />
|
|
||||||
</template>
|
|
||||||
<template #xsFxdj="{ row }">
|
|
||||||
<DictTag
|
|
||||||
:tag="false"
|
|
||||||
:value="row.xsFxdj"
|
|
||||||
:options="D_GS_XS_FXDJ"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<template #xsQtlx="{ row }">
|
|
||||||
<DictTag
|
|
||||||
:tag="false"
|
|
||||||
:value="row.xsQtlx"
|
|
||||||
:options="D_GS_ZDQT_LB"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
<template #xsZtCz="{ row }">
|
|
||||||
<DictTag
|
|
||||||
:tag="false"
|
|
||||||
:value="row.xsZtCz"
|
|
||||||
:options="D_GS_XS_CZZT"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
<template #xsZt="{ row }">
|
|
||||||
<DictTag :tag="false" :value="row.xsZt" :options="D_GS_XS_ZT" />
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</FormMessage>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
|
||||||
import DialogList from "./dialogList.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import * as rule from "@/utils/rules.js";
|
|
||||||
import { selectUserDeptPage } from "@/api/user-manage";
|
|
||||||
|
|
||||||
import {
|
|
||||||
ref,
|
|
||||||
defineExpose,
|
|
||||||
reactive,
|
|
||||||
onMounted,
|
|
||||||
defineEmits,
|
|
||||||
getCurrentInstance,
|
|
||||||
nextTick
|
|
||||||
} from "vue";
|
|
||||||
const emit = defineEmits(["updateDate"]);
|
|
||||||
const props = defineProps({
|
|
||||||
dic: Object
|
|
||||||
});
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const {
|
|
||||||
D_GS_RLQB_RWDD_LX,
|
|
||||||
D_GS_RLQB_RWDD_LY,
|
|
||||||
D_GS_RLQB_RWDD_YZCD,
|
|
||||||
D_GS_XS_FXDJ,
|
|
||||||
D_GS_XS_CZZT,
|
|
||||||
D_GS_XS_ZT,
|
|
||||||
D_GS_XS_LY,
|
|
||||||
D_GS_ZDQT_LB
|
|
||||||
} = proxy.$dict(
|
|
||||||
"D_GS_RLQB_RWDD_LX",
|
|
||||||
"D_GS_RLQB_RWDD_LY",
|
|
||||||
"D_GS_RLQB_RWDD_YZCD",
|
|
||||||
"D_GS_XS_FXDJ",
|
|
||||||
"D_GS_XS_CZZT",
|
|
||||||
"D_GS_XS_ZT",
|
|
||||||
"D_GS_XS_LY",
|
|
||||||
"D_GS_ZDQT_LB"
|
|
||||||
);
|
|
||||||
const tableDate = reactive({
|
|
||||||
xsList: [], //表格数据
|
|
||||||
rykeyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "checkBox",
|
|
||||||
loading: false,
|
|
||||||
size: "small",
|
|
||||||
border: true
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 220, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "线索名称", prop: "xsMc", width: "100px" },
|
|
||||||
{ label: "线索编号", prop: "xsBh", width: "100px" },
|
|
||||||
{ label: "线索来源", prop: "xsLy", showSolt: true, width: "100px" },
|
|
||||||
{ label: "风险等级", prop: "xsFxdj", showSolt: true, width: "100px" },
|
|
||||||
{ label: "开始时间", prop: "startTime", width: "100px" },
|
|
||||||
{ label: "结束时间", prop: "ryXjd", width: "100px" },
|
|
||||||
{ label: "指向地点", prop: "xsZxdd", width: "100px" },
|
|
||||||
{ label: "线索内容", prop: "xsNr", width: "100px" },
|
|
||||||
{ label: "群体类型", prop: "xsQtlx", showSolt: true, width: "100px" },
|
|
||||||
{ label: "群体名称", prop: "xsQtmc", width: "100px" },
|
|
||||||
{ label: "上报单位", prop: "sbDwMc", width: "100px" },
|
|
||||||
{ label: "上报时间", prop: "sbSj", width: "100px" },
|
|
||||||
{ label: "涉及人数", prop: "xsSjrs", width: "100px" },
|
|
||||||
{ label: "处置状态", prop: "xsZtCz", width: "100px", showSolt: true },
|
|
||||||
{ label: "状态", prop: "xsZt", width: "100px", showSolt: true }
|
|
||||||
]
|
|
||||||
});
|
|
||||||
const dialogForm = ref(false); //弹窗
|
|
||||||
const chooseTitle = ref(""); //选择弹窗
|
|
||||||
const formData = ref([
|
|
||||||
{ label: "报送单位代码", prop: "bsDwDm", type: "slot", disabled: true },
|
|
||||||
{ label: "报送单位名称", prop: "bsDwMc", type: "input", disabled: true },
|
|
||||||
{ label: "任务标题", prop: "rwBt", type: "input", disabled: true },
|
|
||||||
{ label: "任务编号", prop: "rwBh", type: "input", disabled: true },
|
|
||||||
{
|
|
||||||
label: "任务类型",
|
|
||||||
prop: "rwLx",
|
|
||||||
type: "select",
|
|
||||||
options: D_GS_RLQB_RWDD_LX,
|
|
||||||
disabled: true
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "任务来源",
|
|
||||||
prop: "rwLy",
|
|
||||||
type: "select",
|
|
||||||
options: D_GS_RLQB_RWDD_LY,
|
|
||||||
disabled: true
|
|
||||||
},
|
|
||||||
{ label: "反馈开始时间", prop: "rwSjKs", type: "datetime", disabled: true },
|
|
||||||
{ label: "反馈截止时间", prop: "rwSjFkjz", type: "datetime", disabled: true },
|
|
||||||
{
|
|
||||||
label: "严重程度",
|
|
||||||
prop: "rwYzcd",
|
|
||||||
type: "select",
|
|
||||||
options: D_GS_RLQB_RWDD_YZCD,
|
|
||||||
disabled: true
|
|
||||||
},
|
|
||||||
{ label: "所属单位代码", prop: "ssbmdm", type: "slot", disabled: true },
|
|
||||||
{ label: "所属单位名称", prop: "ssbmmc", type: "input", disabled: true },
|
|
||||||
{
|
|
||||||
label: "任务内容",
|
|
||||||
prop: "rwNr",
|
|
||||||
type: "textarea",
|
|
||||||
width: "100%",
|
|
||||||
disabled: true
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "线索列表",
|
|
||||||
prop: "xsList",
|
|
||||||
type: "slot",
|
|
||||||
width: "80%",
|
|
||||||
disabled: true
|
|
||||||
}
|
|
||||||
]);
|
|
||||||
const listQuery = ref({}); //表单
|
|
||||||
const roleIds = ref([]); //角色id
|
|
||||||
|
|
||||||
const chooseShow = ref(false); //选择弹窗
|
|
||||||
const loading = ref(false);
|
|
||||||
const elform = ref();
|
|
||||||
const title = ref("");
|
|
||||||
const deptList = ref([]); //部门列表
|
|
||||||
const chooseType = ref("01"); //选择弹窗类型
|
|
||||||
|
|
||||||
const rules = reactive({
|
|
||||||
rwbt: [{ required: true, message: "请输入任务标题", trigger: "blur" }]
|
|
||||||
});
|
|
||||||
const editpeo = ref();
|
|
||||||
onMounted(() => {
|
|
||||||
getdepartmentList();
|
|
||||||
});
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
title.value = type == "add" ? "新增" : "编辑";
|
|
||||||
if (row) getDataById(row.id);
|
|
||||||
};
|
|
||||||
// 根据id查询详情
|
|
||||||
const getDataById = (id) => {
|
|
||||||
qcckGet({}, "/mosty-gsxt/tbGsxtRlqbRwdd/selectVoById/" + id).then((res) => {
|
|
||||||
listQuery.value = res;
|
|
||||||
tableDate.xsList = listQuery.value.xsList;
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// 获取部门列表
|
|
||||||
const getdepartmentList = () => {
|
|
||||||
selectUserDeptPage().then((res) => {
|
|
||||||
deptList.value = res?.records.map((item) => ({
|
|
||||||
label: item.deptName,
|
|
||||||
value: item.deptId
|
|
||||||
}));
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
// 接收父组件传入的数据并回显
|
|
||||||
const setFormData = (data) => {
|
|
||||||
tableDate.xsList = data.xsList ?? [];
|
|
||||||
listQuery.value = {
|
|
||||||
...data // 假设 data 包含所有需要的字段
|
|
||||||
};
|
|
||||||
tableDate.tableData = data.bkdxList;
|
|
||||||
};
|
|
||||||
// 关闭
|
|
||||||
const close = () => {
|
|
||||||
listQuery.value = {};
|
|
||||||
dialogForm.value = false;
|
|
||||||
loading.value = false;
|
|
||||||
};
|
|
||||||
defineExpose({ init, setFormData });
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
@import "~@/assets/css/layout.scss";
|
|
||||||
@import "~@/assets/css/element-plus.scss";
|
|
||||||
.boxlist {
|
|
||||||
width: 99%;
|
|
||||||
height: 225px;
|
|
||||||
margin-top: 10px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -64,21 +64,18 @@
|
|||||||
:options="D_GS_RLQB_RWDD_YZCD"
|
:options="D_GS_RLQB_RWDD_YZCD"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
<template #rwZt="{ row }">
|
|
||||||
<DictTag
|
|
||||||
:tag="false"
|
|
||||||
:value="row.rwZt"
|
|
||||||
:options="D_GS_RLQB_RWDD_ZT"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
<!-- 操作 -->
|
<!-- 操作 -->
|
||||||
<template #controls="{ row }">
|
<template #controls="{ row }">
|
||||||
<el-link size="small" type="success" @click="addEdit('edit', row)"
|
<el-link size="small" type="success" @click="addEdit('edit', row)"
|
||||||
>编辑</el-link
|
>编辑</el-link
|
||||||
>
|
>
|
||||||
<el-link size="small" type="primary" @click="infoList('info', row)"
|
<el-link size="small" type="primary" @click="addEdit('info', row)"
|
||||||
>详情</el-link
|
>详情</el-link
|
||||||
>
|
>
|
||||||
|
<!-- 下发将消息推送至临安码 消息中心 -->
|
||||||
|
<el-link size="small" type="primary" @click="addEdit('info', row)"
|
||||||
|
>下发</el-link
|
||||||
|
>
|
||||||
<el-link size="small" type="danger" @click="deleteRow(row)"
|
<el-link size="small" type="danger" @click="deleteRow(row)"
|
||||||
>删除</el-link
|
>删除</el-link
|
||||||
>
|
>
|
||||||
@ -96,8 +93,6 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- 新增编辑 -->
|
<!-- 新增编辑 -->
|
||||||
<DetailForm ref="detailDiloag" @updateDate="getList()" />
|
<DetailForm ref="detailDiloag" @updateDate="getList()" />
|
||||||
<!--详情 -->
|
|
||||||
<InfoForm ref="infoDiloag" />
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -110,13 +105,11 @@ import DetailForm from "./components/addForm.vue";
|
|||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
||||||
import { selectUserDeptPage } from "@/api/user-manage";
|
import { selectUserDeptPage } from "@/api/user-manage";
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
||||||
import InfoForm from "./components/infoForm.vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
const { D_GS_RLQB_RWDD_LY, D_GS_RLQB_RWDD_YZCD, D_GS_RLQB_RWDD_ZT } =
|
const { D_GS_RLQB_RWDD_LY, D_GS_RLQB_RWDD_YZCD, D_GS_RLQB_RWDD_ZT } =
|
||||||
proxy.$dict("D_GS_RLQB_RWDD_LY", "D_GS_RLQB_RWDD_YZCD", "D_GS_RLQB_RWDD_ZT"); //获取字典数据
|
proxy.$dict("D_GS_RLQB_RWDD_LY", "D_GS_RLQB_RWDD_YZCD", "D_GS_RLQB_RWDD_ZT"); //获取字典数据
|
||||||
|
|
||||||
const detailDiloag = ref();
|
const detailDiloag = ref();
|
||||||
const infoDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
const searchBox = ref(); //搜索框
|
||||||
const deptList = ref([]); //部门列表
|
const deptList = ref([]); //部门列表
|
||||||
|
|
||||||
@ -133,12 +126,6 @@ const searchConfiger = ref([
|
|||||||
placeholder: "请输入任务标题",
|
placeholder: "请输入任务标题",
|
||||||
showType: "input"
|
showType: "input"
|
||||||
},
|
},
|
||||||
{
|
|
||||||
label: "任务编号",
|
|
||||||
prop: "rwBh",
|
|
||||||
placeholder: "请输入任务编号",
|
|
||||||
showType: "input"
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
label: "任务内容",
|
label: "任务内容",
|
||||||
prop: "rwNr",
|
prop: "rwNr",
|
||||||
@ -159,13 +146,6 @@ const searchConfiger = ref([
|
|||||||
showType: "select",
|
showType: "select",
|
||||||
options: D_GS_RLQB_RWDD_YZCD
|
options: D_GS_RLQB_RWDD_YZCD
|
||||||
},
|
},
|
||||||
{
|
|
||||||
label: "任务状态",
|
|
||||||
prop: "rwZt",
|
|
||||||
placeholder: "请选择任务状态",
|
|
||||||
showType: "select",
|
|
||||||
options: D_GS_RLQB_RWDD_ZT
|
|
||||||
}
|
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const pageData = reactive({
|
const pageData = reactive({
|
||||||
@ -183,16 +163,11 @@ const pageData = reactive({
|
|||||||
},
|
},
|
||||||
controlsWidth: 220,
|
controlsWidth: 220,
|
||||||
tableColumn: [
|
tableColumn: [
|
||||||
{ label: "任务编号", prop: "rwBh" },
|
|
||||||
{ label: "任务标题", prop: "rwBt" },
|
{ label: "任务标题", prop: "rwBt" },
|
||||||
{ label: "任务内容", prop: "rwNr", width: 200 },
|
{ label: "任务内容", prop: "rwNr", width: 200 },
|
||||||
{ label: "任务来源", prop: "rwLy", showSolt: true },
|
{ label: "任务来源", prop: "rwLy", showSolt: true },
|
||||||
{ label: "严重程度", prop: "rwYzcd", showSolt: true },
|
{ label: "严重程度", prop: "rwYzcd", showSolt: true },
|
||||||
// { label: "处理情况", prop: "processStatus" },
|
{ label: "下发状态", prop: "xfzt" },
|
||||||
{ label: "上报时间", prop: "sbSj" },
|
|
||||||
// { label: "采集状态", prop: "collectStatus" },
|
|
||||||
// { label: "填充部门", prop: "fillDepartment" },
|
|
||||||
{ label: "状态", prop: "rwZt", showSolt: true }
|
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -254,10 +229,7 @@ const getList = (val) => {
|
|||||||
const addEdit = (type, row) => {
|
const addEdit = (type, row) => {
|
||||||
detailDiloag.value.init(type, row);
|
detailDiloag.value.init(type, row);
|
||||||
};
|
};
|
||||||
// 详情
|
|
||||||
const infoList = (type, row) => {
|
|
||||||
infoDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 表格高度计算
|
// 表格高度计算
|
||||||
const tabHeightFn = () => {
|
const tabHeightFn = () => {
|
||||||
|
|||||||
@ -1,124 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">事故车辆附加信息详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="业务流水号码">
|
|
||||||
<el-input v-model="listQuery.ywlsh" placeholder="01131213"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="登记人姓名">
|
|
||||||
<el-input v-model="listQuery.djrxm" placeholder="张三"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="事故车辆发现时间">
|
|
||||||
<el-input v-model="listQuery.sgfxsj" placeholder="2025/1/20 10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="事故照片" >
|
|
||||||
<div class="image-group">
|
|
||||||
<div class="image-item" v-for="(item, index) in listQuery.plateImages" :key="index">
|
|
||||||
<el-image :src="item.img" fit="cover"></el-image>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const listQuery = ref({
|
|
||||||
plateImages: [
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.image-group {
|
|
||||||
display: flex;
|
|
||||||
gap: 10px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
|
|
||||||
.image-item {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
border: 1px solid #dcdfe6;
|
|
||||||
|
|
||||||
.el-image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,179 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="事故车辆附加信息" />
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount" />
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData"
|
|
||||||
>
|
|
||||||
<!-- 事故照片 -->
|
|
||||||
<template #accidentPhoto="{ row }">
|
|
||||||
<el-image style="width: 50px; height: 50px" :src="row.accidentPhoto" :preview-src-list="[row.accidentPhoto]">
|
|
||||||
</el-image>
|
|
||||||
</template>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "业务流水号码", prop: "businessNo", placeholder: "请输入业务流水号码", showType: "input" },
|
|
||||||
{ label: "事故车辆发现时间", prop: "discoveryTime", placeholder: "请选择事故车辆发现时间", showType: "date" }
|
|
||||||
]);
|
|
||||||
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{
|
|
||||||
id: 1,
|
|
||||||
businessNo: "01131213",
|
|
||||||
registrantName: "张三",
|
|
||||||
discoveryTime: "2025/1/20 10:00:00",
|
|
||||||
accidentPhoto: "https://example.com/photo1.jpg"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 2,
|
|
||||||
businessNo: "01131213",
|
|
||||||
registrantName: "张三",
|
|
||||||
discoveryTime: "2025/1/20 10:00:00",
|
|
||||||
accidentPhoto: "https://example.com/photo2.jpg"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 3,
|
|
||||||
businessNo: "01131213",
|
|
||||||
registrantName: "张三",
|
|
||||||
discoveryTime: "2025/1/20 10:00:00",
|
|
||||||
accidentPhoto: "https://example.com/photo3.jpg"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 4,
|
|
||||||
businessNo: "01131213",
|
|
||||||
registrantName: "张三",
|
|
||||||
discoveryTime: "2025/1/20 10:00:00",
|
|
||||||
accidentPhoto: "https://example.com/photo4.jpg"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
id: 5,
|
|
||||||
businessNo: "01131213",
|
|
||||||
registrantName: "张三",
|
|
||||||
discoveryTime: "2025/1/20 10:00:00",
|
|
||||||
accidentPhoto: "https://example.com/photo5.jpg"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 120,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "业务流水号码", prop: "businessNo" },
|
|
||||||
{ label: "登记人姓名", prop: "registrantName" },
|
|
||||||
{ label: "事故车辆发现时间", prop: "discoveryTime" },
|
|
||||||
{ label: "事故照片", prop: "accidentPhoto", slot: true }
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
getList();
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = val => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList();
|
|
||||||
};
|
|
||||||
// 搜索
|
|
||||||
const onSearch = val => {
|
|
||||||
queryFrom.value = { ...val };
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList();
|
|
||||||
};
|
|
||||||
|
|
||||||
const changeNo = val => {
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList();
|
|
||||||
};
|
|
||||||
const changeSize = val => {
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList();
|
|
||||||
};
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = val => {
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
};
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,220 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">承接车辆基本信息{{ title }}</span>
|
|
||||||
<div>
|
|
||||||
<el-button type="primary" v-if="title != '详情'" size="small" :loading="loading" @click="submit">保存</el-button>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="业务流水号">
|
|
||||||
<el-input v-model="listQuery.ywlsh" placeholder="01131213"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="车主姓名">
|
|
||||||
<el-input v-model="listQuery.czxm" placeholder="张三"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="车主证件号码">
|
|
||||||
<el-input v-model="listQuery.czzjhm" placeholder="511123456789012345"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="车主联系电话">
|
|
||||||
<el-input v-model="listQuery.czlxdh" placeholder="15222222222"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="机动车号牌种类">
|
|
||||||
<el-input v-model="listQuery.jdchpzl" placeholder="绿牌"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="机动车车牌号码">
|
|
||||||
<el-input v-model="listQuery.jdchphm" placeholder="藏G.123456"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="机动车中文名称">
|
|
||||||
<el-input v-model="listQuery.jdczwmc" placeholder="大众"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="机动车英文名称">
|
|
||||||
<el-input v-model="listQuery.jdcywmc" placeholder=""/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="机动车发动机型号">
|
|
||||||
<el-input v-model="listQuery.fdjh" placeholder="14653158455"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="机动车行驶证芯片号">
|
|
||||||
<el-input v-model="listQuery.jdcxszxph" placeholder=""/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="机动车车架号">
|
|
||||||
<el-input v-model="listQuery.jdccjh" placeholder="544845441154441"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="机动车车辆类型">
|
|
||||||
<el-input v-model="listQuery.jdccllx" placeholder="桥车"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="机动车车身颜色">
|
|
||||||
<el-input v-model="listQuery.jdccsys" placeholder="黑色"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="机动车照片" >
|
|
||||||
<div class="image-group">
|
|
||||||
<div class="image-item" v-for="(item, index) in listQuery.captureImages" :key="index">
|
|
||||||
<el-image :src="item.img" fit="cover"></el-image>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
captureImages: [
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
],
|
|
||||||
list: [
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 提交
|
|
||||||
const submit = ()=>{
|
|
||||||
elform.value.validate((valid) => {
|
|
||||||
if (!valid) return false;
|
|
||||||
// loading.value = true;
|
|
||||||
let params = { ...listQuery.value}
|
|
||||||
let url = title.value == '新增' ? '/mosty-lzcj/tbDwYy/insert' :'/mosty-lzcj/tbDwYy/update'
|
|
||||||
// qcckPost(params, url).then((res) => {
|
|
||||||
// proxy.$message({ type: "success", message: title.value+'成功'});
|
|
||||||
// close()
|
|
||||||
// emit("updateDate",modelLx.value);
|
|
||||||
// }).catch(()=>{
|
|
||||||
// loading.value = false;
|
|
||||||
// });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
title.value = type == 'add' ? '新增' : type == 'eidt' ? '编辑' : '详情'
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.labelTileile{
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
line-height: 30px;
|
|
||||||
padding-left: 8px;
|
|
||||||
// text-align: center;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
.image-group {
|
|
||||||
display: flex;
|
|
||||||
gap: 10px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
|
|
||||||
.image-item {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
border: 1px solid #dcdfe6;
|
|
||||||
|
|
||||||
.el-image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,144 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<PageTitle title="承接车辆基本信息"/>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "车主姓名", prop: 'zsxm', placeholder: "请输入车主姓名", showType: "input" },
|
|
||||||
{ label: "车牌号", prop: 'cph', placeholder: "请输入车牌号", showType: "input" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{xh: 1, zsxm: '张三', cph: '藏G.123456', hpzl: '绿牌', zxppmc: '大众', fdjh: '123466789', cjh: '123466789'},
|
|
||||||
{xh: 2, zsxm: '张三', cph: '藏G.123456', hpzl: '绿牌', zxppmc: '大众', fdjh: '123466789', cjh: '123466789'},
|
|
||||||
{xh: 3, zsxm: '张三', cph: '藏G.123456', hpzl: '绿牌', zxppmc: '大众', fdjh: '123466789', cjh: '123466789'},
|
|
||||||
{xh: 4, zsxm: '张三', cph: '藏G.123456', hpzl: '绿牌', zxppmc: '大众', fdjh: '123466789', cjh: '123466789'},
|
|
||||||
{xh: 5, zsxm: '张三', cph: '藏G.123456', hpzl: '绿牌', zxppmc: '大众', fdjh: '123466789', cjh: '123466789'},
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 120, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "车主姓名", prop: "zsxm" },
|
|
||||||
{ label: "车牌号", prop: "cph" },
|
|
||||||
{ label: "号牌种类", prop: "hpzl" },
|
|
||||||
{ label: "中文品牌名称", prop: "zxppmc" },
|
|
||||||
{ label: "发动机号", prop: "fdjh" },
|
|
||||||
{ label: "车架号", prop: "cjh" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,197 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">承接车辆交接信息{{ title }}</span>
|
|
||||||
<div>
|
|
||||||
<el-button type="primary" v-if="title != '详情'" size="small" :loading="loading" @click="submit">保存</el-button>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="业务流水号">
|
|
||||||
<el-input v-model="listQuery.ywlsh" placeholder="01131213"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="承接车辆">
|
|
||||||
<el-input v-model="listQuery.jdchphm" placeholder="藏G.123456"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="送车人姓名">
|
|
||||||
<el-input v-model="listQuery.czxm" placeholder="张三"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="送车人证件号码">
|
|
||||||
<el-input v-model="listQuery.czzjhm" placeholder="511123456789012345"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="送车人联系电话">
|
|
||||||
<el-input v-model="listQuery.czlxdh" placeholder="15222222222"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="收车时间">
|
|
||||||
<el-input v-model="listQuery.scsj" placeholder="2025/1/20 10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="收车人姓名">
|
|
||||||
<el-input v-model="listQuery.sqrxm" placeholder="李四"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="收车人证件号码">
|
|
||||||
<el-input v-model="listQuery.sqrzjhm" placeholder="511123456789012444"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="收车人联系方式">
|
|
||||||
<el-input v-model="listQuery.sqrlxfs" placeholder="15211111111"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="取车时间">
|
|
||||||
<el-input v-model="listQuery.qcsj" placeholder="2025/1/20 10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('详情');
|
|
||||||
const listQuery = ref({
|
|
||||||
captureImages: [
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
{img:require('@/assets/images/person.png')},
|
|
||||||
],
|
|
||||||
list: [
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
{xm:'张三',zjhm:'510183199626565555'},
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 提交
|
|
||||||
const submit = ()=>{
|
|
||||||
elform.value.validate((valid) => {
|
|
||||||
if (!valid) return false;
|
|
||||||
// loading.value = true;
|
|
||||||
let params = { ...listQuery.value}
|
|
||||||
let url = title.value == '新增' ? '/mosty-lzcj/tbDwYy/insert' :'/mosty-lzcj/tbDwYy/update'
|
|
||||||
// qcckPost(params, url).then((res) => {
|
|
||||||
// proxy.$message({ type: "success", message: title.value+'成功'});
|
|
||||||
// close()
|
|
||||||
// emit("updateDate",modelLx.value);
|
|
||||||
// }).catch(()=>{
|
|
||||||
// loading.value = false;
|
|
||||||
// });
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
title.value = type == 'add' ? '新增' : type == 'eidt' ? '编辑' : '详情'
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.labelTileile{
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
line-height: 30px;
|
|
||||||
padding-left: 8px;
|
|
||||||
// text-align: center;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
.image-group {
|
|
||||||
display: flex;
|
|
||||||
gap: 10px;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
|
|
||||||
|
|
||||||
.image-item {
|
|
||||||
width: 150px;
|
|
||||||
height: 150px;
|
|
||||||
border: 1px solid #dcdfe6;
|
|
||||||
|
|
||||||
.el-image {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,149 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<PageTitle title="承接车辆交接信息"/>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "车主姓名", prop: 'zsxm', placeholder: "请输入车主姓名", showType: "input" },
|
|
||||||
{ label: "车牌号", prop: 'cph', placeholder: "请输入车牌号", showType: "input" },
|
|
||||||
{ label: "车主联系电话", prop: 'zslxdh', placeholder: "请输入车主联系电话", showType: "input" },
|
|
||||||
{ label: "送车人姓名", prop: 'scrxm', placeholder: "请输入送车人姓名", showType: "input" },
|
|
||||||
{ label: "送车人联系电话", prop: 'scrlxdh', placeholder: "请输入送车人联系电话", showType: "input" },
|
|
||||||
{ label: "取车人姓名", prop: 'qcrxm', placeholder: "请输入取车人姓名", showType: "input" },
|
|
||||||
{ label: "取车人联系电话", prop: 'qcrlxdh', placeholder: "请输入取车人联系电话", showType: "input" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{xh: 1, cph: '藏G.123456', scrxm: '张三', scrlxdh: '15211111111', qcrxm: '李四', qcrlxdh: '15222222222', qcsj: '2025/1/20 10:00:00'},
|
|
||||||
{xh: 2, cph: '藏G.123456', scrxm: '张三', scrlxdh: '15211111111', qcrxm: '李四', qcrlxdh: '15222222222', qcsj: '2025/1/20 10:00:00'},
|
|
||||||
{xh: 3, cph: '藏G.123456', scrxm: '张三', scrlxdh: '15211111111', qcrxm: '李四', qcrlxdh: '15222222222', qcsj: '2025/1/20 10:00:00'},
|
|
||||||
{xh: 4, cph: '藏G.123456', scrxm: '张三', scrlxdh: '15211111111', qcrxm: '李四', qcrlxdh: '15222222222', qcsj: '2025/1/20 10:00:00'},
|
|
||||||
{xh: 5, cph: '藏G.123456', scrxm: '张三', scrlxdh: '15211111111', qcrxm: '李四', qcrlxdh: '15222222222', qcsj: '2025/1/20 10:00:00'},
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 120, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "车牌号", prop: "cph" },
|
|
||||||
{ label: "送车人姓名", prop: "scrxm" },
|
|
||||||
{ label: "送车人联系电话", prop: "scrlxdh" },
|
|
||||||
{ label: "取车人姓名", prop: "qcrxm" },
|
|
||||||
{ label: "取车人联系电话", prop: "qcrlxdh" },
|
|
||||||
{ label: "取车时间", prop: "qcsj" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,221 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">{{ title }}</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-tabs v-model="activeName">
|
|
||||||
<el-tab-pane label="场所信息" name="basic">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="flex align-center">
|
|
||||||
<div style="width: calc(100% - 176px);">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="统一社会信用代码">
|
|
||||||
<el-input v-model="listQuery.tyshdm" placeholder="ktv"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="单位名称（营业执照登记名称）">
|
|
||||||
<el-input v-model="listQuery.djmc" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所名称">
|
|
||||||
<el-input v-model="listQuery.csmc" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所联系电话">
|
|
||||||
<el-input v-model="listQuery.cslxdh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="经营状况">
|
|
||||||
<el-input v-model="listQuery.csdm" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所面积">
|
|
||||||
<el-input v-model="listQuery.csmj" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="开业日期">
|
|
||||||
<el-input v-model="listQuery.kyrq" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<img height="130" src="@/assets/images/person.png" alt="">
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-form-item label="单位注册地址">
|
|
||||||
<el-input v-model="listQuery.dwzcdz" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="场所地址">
|
|
||||||
<el-input v-model="listQuery.csdz" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<div class="flex align-center">
|
|
||||||
<div style="width: calc(100% - 176px);">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="法定代表人">
|
|
||||||
<el-input v-model="listQuery.fddbr" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="法定代表人证件号码">
|
|
||||||
<el-input v-model="listQuery.fddbrzjhm" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="法定代表人联系电话">
|
|
||||||
<el-input v-model="listQuery.fddbrLxdh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="法定代表人居住地址">
|
|
||||||
<el-input v-model="listQuery.fddbrJzdz" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所负责人">
|
|
||||||
<el-input v-model="listQuery.csfzr" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所负责人身份证号">
|
|
||||||
<el-input v-model="listQuery.csfzrSfzh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="场所负责人联系方式">
|
|
||||||
<el-input v-model="listQuery.csfzrLxfs" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所负责人居住地址">
|
|
||||||
<el-input v-model="listQuery.csfzrJzdz" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<img height="65" style="width: 100%;" src="@/assets/images/person.png" alt="">
|
|
||||||
<img height="65" style="width: 100%;" src="@/assets/images/person.png" alt="">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="upload-group">
|
|
||||||
<el-form-item label="营业执照照片">
|
|
||||||
<img height="130" src="@/assets/images/person.png" alt="">
|
|
||||||
<img height="130" src="@/assets/images/person.png" alt="">
|
|
||||||
<img height="130" src="@/assets/images/person.png" alt="">
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="机修场所备案编号">
|
|
||||||
<el-input v-model="listQuery.jxcsbabh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="场所备案机构名称">
|
|
||||||
<el-input v-model="listQuery.ylcsbajgmc" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="备案登记日期">
|
|
||||||
<el-input v-model="listQuery.badjrq" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="所属辖区">
|
|
||||||
<el-input v-model="listQuery.ssxq" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="责任民警">
|
|
||||||
<el-input v-model="listQuery.zrmj" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="警号">
|
|
||||||
<el-input v-model="listQuery.jh" placeholder="请输入"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</el-tab-pane>
|
|
||||||
<el-tab-pane label="从业人员" name="staff">
|
|
||||||
<!-- 从业人员表格 -->
|
|
||||||
</el-tab-pane>
|
|
||||||
</el-tabs>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
import { Plus } from '@element-plus/icons-vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const activeName = ref('basic');
|
|
||||||
const title = ref('机修场所信息管理详情');
|
|
||||||
const listQuery = ref({});
|
|
||||||
|
|
||||||
const areaOptions = ref([]); // 区域选项数据
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row,) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.upload-group {
|
|
||||||
display: flex;
|
|
||||||
// gap: 20px;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.unit {
|
|
||||||
margin-left: 5px;
|
|
||||||
}
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,158 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="机修场所信息管理"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
|
|
||||||
<template #defaultSlot>
|
|
||||||
<div>
|
|
||||||
<el-input-number v-model="queryFrom.xqy"></el-input-number>
|
|
||||||
<span class="ml10 mr10" style="color: #000;">至</span>
|
|
||||||
<el-input-number v-model="queryFrom.dqy"></el-input-number>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</Search>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
<el-button size="small">从业人员</el-button>
|
|
||||||
<el-button size="small">转区域</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "单位名称", prop: 'name', placeholder: "请输入单位名称", showType: "input" },
|
|
||||||
{ label: "单位电话", prop: 'phone', placeholder: "请输入单位电话", showType: "input" },
|
|
||||||
{ label: "法人姓名", prop: 'frxm', placeholder: "请输入法人姓名", showType: "input" },
|
|
||||||
{ label: "法人身份证号", prop: 'frzjhm', placeholder: "请输入法人身份证号", showType: "input" },
|
|
||||||
{ label: "法人联系电话", prop: 'frlxdh', placeholder: "请输入法人联系电话", showType: "input" },
|
|
||||||
{ label: "经营状况", prop: 'jyzt', placeholder: "请选择经营状况", showType: "select", options: [{ label: '在业', value: '在业' }]},
|
|
||||||
{ label: "所属辖区", prop: 'ssxq', placeholder: "请选择所属辖区", showType: "department" },
|
|
||||||
{ label: "面积大小", prop: 'mj', placeholder: "请输入面积范围", showType: "defaultSlot" },
|
|
||||||
]);
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{name:'天猫修车',jyzt:'在业',ssxq:'巴宜区纺织路派出所',frxm:'张三四五六',frzjhm:'511222222222222'},
|
|
||||||
{name:'天猫修车',jyzt:'在业',ssxq:'巴宜区纺织路派出所',frxm:'张三四五六',frzjhm:'511222222222222'},
|
|
||||||
{name:'天猫修车',jyzt:'在业',ssxq:'巴宜区纺织路派出所',frxm:'张三四五六',frzjhm:'511222222222222'},
|
|
||||||
{name:'天猫修车',jyzt:'在业',ssxq:'巴宜区纺织路派出所',frxm:'张三四五六',frzjhm:'511222222222222'},
|
|
||||||
{name:'天猫修车',jyzt:'在业',ssxq:'巴宜区纺织路派出所',frxm:'张三四五六',frzjhm:'511222222222222'},
|
|
||||||
], //表格数据
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 250, //操作栏宽度
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "单位名称", prop: "name" },
|
|
||||||
{ label: "经营状态", prop: "jyzt" },
|
|
||||||
{ label: "所属辖区", prop: "ssxq" },
|
|
||||||
{ label: "法人姓名", prop: "frxm" },
|
|
||||||
{ label: "法人身份证号", prop: "frzjhm" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,100 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">车辆配件业务登记信息详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="业务流水号码">
|
|
||||||
<el-input v-model="listQuery.ywlsh" placeholder="01131213"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="机动车配件项目序号">
|
|
||||||
<el-input v-model="listQuery.xmxh" placeholder="05"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="机动车配件物品名称">
|
|
||||||
<el-input v-model="listQuery.wpmc" placeholder="轮胎"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="机动车配件品牌型号">
|
|
||||||
<el-input v-model="listQuery.ppxh" />
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="数量">
|
|
||||||
<el-input v-model="listQuery.sl" placeholder="4"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const listQuery = ref({});
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,144 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="车辆配件业务登记信息"/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "业务流水号码", prop: 'businessNo', placeholder: "请输入业务流水号码", showType: "input" },
|
|
||||||
{ label: "配件物品名称", prop: 'accessoryName', placeholder: "请输入配件物品名称", showType: "input" },
|
|
||||||
]);
|
|
||||||
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{id: 1, businessNo: '01131213', accessoryNo: '05', accessoryName: '轮胎', brandModel: '', quantity: 4},
|
|
||||||
{id: 2, businessNo: '01131213', accessoryNo: '05', accessoryName: '轮胎', brandModel: '', quantity: 4},
|
|
||||||
{id: 3, businessNo: '01131213', accessoryNo: '05', accessoryName: '轮胎', brandModel: '', quantity: 4},
|
|
||||||
{id: 4, businessNo: '01131213', accessoryNo: '05', accessoryName: '轮胎', brandModel: '', quantity: 4},
|
|
||||||
{id: 5, businessNo: '01131213', accessoryNo: '05', accessoryName: '轮胎', brandModel: '', quantity: 4},
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 120,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "业务流水号码", prop: "businessNo" },
|
|
||||||
{ label: "配件项目序号", prop: "accessoryNo" },
|
|
||||||
{ label: "配件物品名称", prop: "accessoryName" },
|
|
||||||
{ label: "配件品牌型号", prop: "brandModel" },
|
|
||||||
{ label: "数量", prop: "quantity" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,112 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="dialog" v-if="dialogForm">
|
|
||||||
<div class="head_box">
|
|
||||||
<span class="title">机动车修理业务信息详情</span>
|
|
||||||
<div>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="cntinfo">
|
|
||||||
<el-form :model="listQuery" :label-width="230" label-position="left">
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="业务流水号码">
|
|
||||||
<el-input v-model="listQuery.ywlsh" placeholder="01131213"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="机动车修理项目序号">
|
|
||||||
<el-input v-model="listQuery.xmxh" placeholder="05"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="承接车辆号牌号">
|
|
||||||
<el-input v-model="listQuery.cph" placeholder="藏G.123456"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="机动车修理项目">
|
|
||||||
<el-input v-model="listQuery.xmmc" placeholder="换轮胎"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="承接日期">
|
|
||||||
<el-input v-model="listQuery.cjrq" placeholder="2025/1/18 10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="交付日期">
|
|
||||||
<el-input v-model="listQuery.jfrq" placeholder="2025/1/20 10:00:00"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="车主驾驶证号">
|
|
||||||
<el-input v-model="listQuery.jszh" placeholder="654644654654"/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="从业人员">
|
|
||||||
<el-input v-model="listQuery.cyry" placeholder="李四"/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { ref, reactive } from 'vue';
|
|
||||||
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const listQuery = ref({});
|
|
||||||
|
|
||||||
// 初始化数据
|
|
||||||
const init = (type, row) => {
|
|
||||||
dialogForm.value = true;
|
|
||||||
// 根据type和row初始化表单数据
|
|
||||||
};
|
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
dialogForm.value = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
defineExpose({init})
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
.dialog {
|
|
||||||
padding: 20px;
|
|
||||||
|
|
||||||
:deep(.el-form-item__label) {
|
|
||||||
background-color: #F7FAFB;
|
|
||||||
padding: 0px 8px;
|
|
||||||
color: #000;
|
|
||||||
font-weight: 500;
|
|
||||||
border: 1px solid #E3E7ED;
|
|
||||||
}
|
|
||||||
|
|
||||||
.head_box {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo{
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
|
||||||
display: flex;
|
|
||||||
|
|
||||||
.el-form-item {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .el-input__inner{
|
|
||||||
height: 36px !important;
|
|
||||||
line-height: 36px !important;
|
|
||||||
border-radius: 0;
|
|
||||||
color: #777575;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form-item--default{
|
|
||||||
margin-bottom: 0px;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,147 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div>
|
|
||||||
<div class="titleBox">
|
|
||||||
<PageTitle title="机动车修理业务信息 "/>
|
|
||||||
</div>
|
|
||||||
<!-- 搜索 -->
|
|
||||||
<div ref="searchBox">
|
|
||||||
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
|
||||||
</div>
|
|
||||||
<!-- 表格 -->
|
|
||||||
<div class="tabBox">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData">
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small" @click="addEdit('detail', row)">详情</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
<Pages
|
|
||||||
@changeNo="changeNo"
|
|
||||||
@changeSize="changeSize"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:pageConfiger="{
|
|
||||||
...pageData.pageConfiger,
|
|
||||||
total: pageData.total
|
|
||||||
}"
|
|
||||||
></Pages>
|
|
||||||
</div>
|
|
||||||
<!-- 详情 -->
|
|
||||||
<DetailForm ref="detailDiloag" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import DetailForm from "./components/detailForm.vue";
|
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const detailDiloag = ref();
|
|
||||||
const searchBox = ref(); //搜索框
|
|
||||||
|
|
||||||
const searchConfiger = ref([
|
|
||||||
{ label: "车牌号", prop: 'plateNumber', placeholder: "请输入车牌号", showType: "input" },
|
|
||||||
{ label: "机动车修理项目", prop: 'repairItem', placeholder: "请输入机动车修理项目", showType: "input" },
|
|
||||||
{ label: "从业人员", prop: 'employee', placeholder: "请输入从业人员", showType: "input" },
|
|
||||||
{ label: "承接日期", prop: 'acceptanceDate', placeholder: "请选择承接日期", showType: "date" },
|
|
||||||
]);
|
|
||||||
|
|
||||||
const queryFrom = ref({});
|
|
||||||
const pageData = reactive({
|
|
||||||
tableData: [
|
|
||||||
{id: 1, plateNumber: '藏G.123456', repairItem: '换轮胎', driverLicense: '654644654654', employee: '李四', acceptanceDate: '2025/1/18 10:00:00', deliveryDate: '2025/1/20 10:00:00'},
|
|
||||||
{id: 2, plateNumber: '藏G.123456', repairItem: '换轮胎', driverLicense: '654644654654', employee: '李四', acceptanceDate: '2025/1/18 10:00:00', deliveryDate: '2025/1/20 10:00:00'},
|
|
||||||
{id: 3, plateNumber: '藏G.123456', repairItem: '换轮胎', driverLicense: '654644654654', employee: '李四', acceptanceDate: '2025/1/18 10:00:00', deliveryDate: '2025/1/20 10:00:00'},
|
|
||||||
{id: 4, plateNumber: '藏G.123456', repairItem: '换轮胎', driverLicense: '654644654654', employee: '李四', acceptanceDate: '2025/1/18 10:00:00', deliveryDate: '2025/1/20 10:00:00'},
|
|
||||||
{id: 5, plateNumber: '藏G.123456', repairItem: '换轮胎', driverLicense: '654644654654', employee: '李四', acceptanceDate: '2025/1/18 10:00:00', deliveryDate: '2025/1/20 10:00:00'},
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
total: 0,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
},
|
|
||||||
controlsWidth: 120,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "车牌号", prop: "plateNumber" },
|
|
||||||
{ label: "机动车修理项目", prop: "repairItem" },
|
|
||||||
{ label: "车主驾驶证号", prop: "driverLicense" },
|
|
||||||
{ label: "从业人员", prop: "employee" },
|
|
||||||
{ label: "承接日期", prop: "acceptanceDate" },
|
|
||||||
{ label: "交付日期", prop: "deliveryDate" },
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
getList()
|
|
||||||
tabHeightFn();
|
|
||||||
});
|
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
|
||||||
const onSearch = (val) =>{
|
|
||||||
queryFrom.value = {...val}
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
const changeNo = (val) =>{
|
|
||||||
pageData.pageConfiger.pageNum = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
const changeSize = (val) =>{
|
|
||||||
pageData.pageConfiger.pageSize = val;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
|
|
||||||
// 获取列表
|
|
||||||
const getList = (val) =>{
|
|
||||||
// pageData.tableConfiger.loading = true;
|
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
|
||||||
// qcckPost(data,url).then(res=>{
|
|
||||||
// pageData.tableData = res.records || [];
|
|
||||||
// pageData.total = res.total;
|
|
||||||
// pageData.tableConfiger.loading = false;
|
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
|
||||||
|
|
||||||
// 详情
|
|
||||||
const addEdit = (type, row) => {
|
|
||||||
detailDiloag.value.init(type, row);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 表格高度计算
|
|
||||||
const tabHeightFn = () => {
|
|
||||||
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
|
||||||
window.onresize = function () {
|
|
||||||
tabHeightFn();
|
|
||||||
};
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
.el-loading-mask {
|
|
||||||
background: rgba(0, 0, 0, 0.5) !important;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,199 +1,102 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="dialog" v-if="dialogForm">
|
<div class="dialog" v-if="dialogForm">
|
||||||
<div class="head_box">
|
<div class="head_box">
|
||||||
<span class="title">情报信息流转{{ title }}</span>
|
<span class="title">{{ title }}情报信息流转</span>
|
||||||
<div>
|
<div>
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
<el-button type="primary" :loading="loading" @click="submit">保存</el-button>
|
||||||
|
<el-button @click="close">关闭</el-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="cntinfo">
|
<div class="form_cnt">
|
||||||
<el-form :model="listQuery" :label-width="130" label-position="right">
|
<FormMessage v-model="listQuery" :formList="formData" ref="elform" :rules="rules">
|
||||||
<el-divider content-position="left">基础信息</el-divider>
|
<template #gapdive>
|
||||||
<div class="form-row">
|
<div style="width: 100%;height: 10px;" class="mb20">
|
||||||
<el-form-item label="线索名称">
|
<el-divider content-position="left">基础信息</el-divider>
|
||||||
<el-input v-model="listQuery.xsmc" placeholder="请输入线索名称" />
|
</div>
|
||||||
</el-form-item>
|
</template>
|
||||||
<el-form-item label="线索来源">
|
<template #gapline>
|
||||||
<el-input v-model="listQuery.xsly" placeholder="请输入线索来源" />
|
<div style="width: 100%;height: 10px;" class="mb20">
|
||||||
</el-form-item>
|
<el-divider content-position="left">线索内容</el-divider>
|
||||||
<el-form-item label="线索编号">
|
</div>
|
||||||
<el-input v-model="listQuery.xsbh" placeholder="请输入线索编号" />
|
</template>
|
||||||
</el-form-item>
|
<template #scfj>
|
||||||
<el-form-item label="所属专题">
|
<div style="width: 100%;padding-left: 50px;">
|
||||||
<el-input v-model="listQuery.xszt" placeholder="请输入所属专题" />
|
<div>上传附件:<span class="f12">（可附电子表格、Word文档、图像、音视频文件）</span> </div>
|
||||||
</el-form-item>
|
<div><MOSTY.Upload :showBtn="true" :limit="10" v-model="listQuery.tps" /> </div>
|
||||||
<!-- <el-form-item label="线索类型">
|
</div>
|
||||||
<el-select v-model="listQuery.xslx" placeholder="请选择线索类型">
|
</template>
|
||||||
<el-option label="类型1" value="1"/>
|
</FormMessage>
|
||||||
<el-option label="类型2" value="2"/>
|
<el-divider content-position="left"><span class="mr20">相关人员</span> <el-button type="primary" size="small" @click="addEdit('add',null)">添加人员</el-button></el-divider>
|
||||||
</el-select>
|
<MyTable
|
||||||
</el-form-item>
|
:tableData="pageForm.tableData"
|
||||||
<el-form-item label="线索等级">
|
:tableColumn="pageForm.tableColumn"
|
||||||
<el-select v-model="listQuery.xsdj" placeholder="请选择线索等级">
|
:tableHeight="pageForm.tableHeight"
|
||||||
<el-option label="一级" value="1"/>
|
:key="pageForm.keyCount"
|
||||||
<el-option label="二级" value="2"/>
|
:tableConfiger="pageForm.tableConfiger"
|
||||||
</el-select>
|
:controlsWidth="pageForm.controlsWidth"
|
||||||
</el-form-item> -->
|
@chooseData="chooseData"
|
||||||
|
>
|
||||||
|
<template #xb="{row}">
|
||||||
|
<DictTag :value="row.xb" :tag="false" :options="props.dic.D_BZ_XB" />
|
||||||
|
</template>
|
||||||
|
<template #bqList="{row}">
|
||||||
|
<div v-if="row.bqList">
|
||||||
|
<el-tag type="success" v-for="(it,idx) in row.bqList" :key="idx">{{ it.bqMc }}</el-tag >
|
||||||
</div>
|
</div>
|
||||||
|
</template>
|
||||||
<el-divider content-position="left">线索描述</el-divider>
|
<!-- 操作 -->
|
||||||
<div class="form-row">
|
<template #controls="{ row }">
|
||||||
<el-form-item label="线索内容" class="full-width">
|
<el-link size="small" type="success" @click="addEdit('edit', row)">编辑</el-link>
|
||||||
<el-input
|
<el-link size="small" type="danger" @click="deleteRow(row)">删除</el-link>
|
||||||
type="textarea"
|
</template>
|
||||||
v-model="listQuery.xsnr"
|
</MyTable>
|
||||||
:rows="4"
|
|
||||||
placeholder="请输入线索内容"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="线索标签大类">
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.bqdl"
|
|
||||||
placeholder="请选择线索标签大类"
|
|
||||||
>
|
|
||||||
<el-option label="类型1" value="1" />
|
|
||||||
<el-option label="类型2" value="2" />
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="线索标签细类">
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.bqxl"
|
|
||||||
placeholder="请选择线索标签细类"
|
|
||||||
>
|
|
||||||
<el-option label="一级" value="1" />
|
|
||||||
<el-option label="二级" value="2" />
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="线索标签二级系类">
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.bqxl"
|
|
||||||
placeholder="请选择线索标签二级系类"
|
|
||||||
>
|
|
||||||
<el-option label="一级" value="1" />
|
|
||||||
<el-option label="二级" value="2" />
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="线索来源">
|
|
||||||
<el-select v-model="listQuery.xsly" placeholder="请选择线线索来源">
|
|
||||||
<el-option label="一级" value="1" />
|
|
||||||
<el-option label="二级" value="2" />
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="线索风险等级">
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.xsfxdj"
|
|
||||||
placeholder="请选择线索风险等级"
|
|
||||||
>
|
|
||||||
<el-option label="类型1" value="1" />
|
|
||||||
<el-option label="类型2" value="2" />
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="线索备注">
|
|
||||||
<el-input v-model="listQuery.xsbz" placeholder="请输入线索备注" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="市内外">
|
|
||||||
<el-input v-model="listQuery.snw" placeholder="请输入市内外" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="是否涉及外地">
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.fxdj"
|
|
||||||
placeholder="请选择线索风险等级"
|
|
||||||
>
|
|
||||||
<el-option label="是" value="1" />
|
|
||||||
<el-option label="否" value="0" />
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="指向地点">
|
|
||||||
<el-select v-model="listQuery.zxdd" placeholder="请选择指向地点">
|
|
||||||
<el-option label="一级" value="1" />
|
|
||||||
<el-option label="二级" value="2" />
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-divider content-position="left">相关人员</el-divider>
|
|
||||||
<div class="mt10 mb10">
|
|
||||||
<el-button type="primary" size="small">添加人员</el-button>
|
|
||||||
</div>
|
|
||||||
<div class="form-row">
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageForm.tableData"
|
|
||||||
:tableColumn="pageForm.tableColumn"
|
|
||||||
:tableHeight="pageForm.tableHeight"
|
|
||||||
:key="pageForm.keyCount"
|
|
||||||
:tableConfiger="pageForm.tableConfiger"
|
|
||||||
:controlsWidth="pageForm.controlsWidth"
|
|
||||||
@chooseData="chooseData"
|
|
||||||
>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-link
|
|
||||||
size="small"
|
|
||||||
type="primary"
|
|
||||||
@click="addEdit('detail', row)"
|
|
||||||
>详情</el-link
|
|
||||||
>
|
|
||||||
<el-link size="small" type="success" @click="addEdit('edit', row)"
|
|
||||||
>编辑</el-link
|
|
||||||
>
|
|
||||||
<el-link size="small" type="danger" @click="deleteRow(row)"
|
|
||||||
>删除</el-link
|
|
||||||
>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-divider content-position="left">申请人</el-divider>
|
|
||||||
<div class="form-row">
|
|
||||||
<el-form-item label="申请单位">
|
|
||||||
<el-input v-model="listQuery.sqdw" placeholder="请输入申请单位" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="申请人">
|
|
||||||
<el-input v-model="listQuery.sqr" placeholder="请输入申请人" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="审核单位">
|
|
||||||
<el-input v-model="listQuery.shdw" placeholder="请输入审核单位" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="审核人">
|
|
||||||
<el-input v-model="listQuery.shr" placeholder="请输入审核人" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="审批单位">
|
|
||||||
<el-input v-model="listQuery.spdw" placeholder="请输入审批单位" />
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="审批人">
|
|
||||||
<el-input v-model="listQuery.spr" placeholder="请输入审批人" />
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
</div>
|
||||||
|
<!-- 人员 -->
|
||||||
|
<AddPeo ref="showAdd" :dic="props.dic" :title="peoTitle" @change="getPeo"></AddPeo>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import AddPeo from './addPeo.vue'
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
import { ref,reactive } from "vue";
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
|
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
||||||
const dialogForm = ref(false);
|
import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, nextTick } from "vue";
|
||||||
const title = ref("");
|
const emit = defineEmits(["change"]);
|
||||||
const listQuery = ref({
|
const props = defineProps({
|
||||||
xgry: []
|
dic: Object
|
||||||
});
|
});
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const dialogForm = ref(false); //弹窗
|
||||||
|
const rules = reactive({
|
||||||
|
xsMc: [{ required: true, message: "请输入线索名称", trigger: "blur" }],
|
||||||
|
xlLx: [{ required: true, message: "请选择线索类型", trigger: "change" }],
|
||||||
|
qbLy: [{ required: true, message: "请选择情报来源", trigger: "change" }],
|
||||||
|
});
|
||||||
|
const formData = ref([
|
||||||
|
{ prop: "gapdive", type: "slot",width:'100%' },
|
||||||
|
{ label: "线索名称", prop: "xsMc", type: "input" },
|
||||||
|
{ label: "线索类型", prop: "xlLx", type: "select", options:props.dic.D_GS_XS_LX },
|
||||||
|
{ label: "情报来源", prop: "qbLy", type: "select", options:props.dic.D_GS_XS_LY},
|
||||||
|
{ label: "指向开始时间", prop: "zxkssj", type: "datetime"},
|
||||||
|
{ label: "指向结束时间", prop: "zxjssj", type: "datetime"},
|
||||||
|
{ label: "指向地点", prop: "zxdz", type: "input"},
|
||||||
|
{ label: "所属专题", prop: "sszt", type: "select",options:props.dic.D_BZ_SSZT},
|
||||||
|
{ prop: "gapline", type: "slot",width:'100%' },
|
||||||
|
{ prop: "scfj", type: "slot",width:'100%'},
|
||||||
|
{ label: "线索内容", prop: "xs_nr", type: "textarea",width:'100%'},
|
||||||
|
{ label: "群体类型", prop: "qtlx", type: "select",options:props.dic.D_GS_XS_QTLX },
|
||||||
|
{ label: "群体名称", prop: "qtmc", type: "input"},
|
||||||
|
{ label: "涉及人数", prop: "sjrs", type: "inputNumber"},
|
||||||
|
{ label: "线索报送单位", prop: "xsbsdwdm", type: "department"},
|
||||||
|
]);
|
||||||
|
const listQuery = ref({}); //表单
|
||||||
|
const loading = ref(false);
|
||||||
|
const elform = ref();
|
||||||
|
const title = ref("");
|
||||||
const pageForm = reactive({
|
const pageForm = reactive({
|
||||||
tableData: [
|
tableData: [],
|
||||||
{
|
|
||||||
xm: "张三",
|
|
||||||
xb: "男",
|
|
||||||
sfzh: "51018319969699999",
|
|
||||||
hjd: "",
|
|
||||||
hjdpcs: "",
|
|
||||||
bq: "重点人员"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
keyCount: 0,
|
||||||
tableConfiger: {
|
tableConfiger: {
|
||||||
rowHieght: 61,
|
rowHieght: 61,
|
||||||
@ -203,81 +106,103 @@ const pageForm = reactive({
|
|||||||
controlsWidth: 220,
|
controlsWidth: 220,
|
||||||
tableColumn: [
|
tableColumn: [
|
||||||
{ label: "姓名", prop: "xm" },
|
{ label: "姓名", prop: "xm" },
|
||||||
{ label: "性别", prop: "xb" },
|
{ label: "性别", prop: "xb",showSolt:true },
|
||||||
{ label: "身份证号", prop: "sfzh" },
|
{ label: "身份证号", prop: "sfzh" },
|
||||||
{ label: "户籍地", prop: "hjd" },
|
{ label: "户籍地", prop: "hjdz" },
|
||||||
{ label: "户籍地派出所", prop: "hjdpcs" },
|
{ label: "户籍地派出所", prop: "hjdpcs" },
|
||||||
{ label: "标签", prop: "bq" }
|
{ label: "标签", prop: "bqList",showSolt:true }
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
|
const showAdd = ref()
|
||||||
|
onMounted(()=>{
|
||||||
|
tabHeightFn()
|
||||||
|
})
|
||||||
|
|
||||||
// 初始化数据
|
// 初始化数据
|
||||||
const init = (type, row) => {
|
const init = (type, row) => {
|
||||||
|
tabHeightFn()
|
||||||
dialogForm.value = true;
|
dialogForm.value = true;
|
||||||
title.value = type === "add" ? "新增" : "编辑";
|
title.value = type == "add" ? "新增" : type == "info" ? "详情" : "编辑";
|
||||||
if (type === "edit" && row) {
|
// 初始化表单数据，并根据详情页设置禁用状态
|
||||||
listQuery.value = { ...row };
|
// if (row) getDataById(row.id);
|
||||||
} else {
|
};
|
||||||
listQuery.value = {
|
// 根据id查询详情
|
||||||
xgry: []
|
const getDataById = (id) => {
|
||||||
};
|
// qcckGet({}, "/mosty-gsxt/tbGsxtRqfjNr/" + id).then((res) => {
|
||||||
}
|
// listQuery.value = res;
|
||||||
|
// });
|
||||||
};
|
};
|
||||||
|
|
||||||
const close = () => {
|
// 打开弹窗
|
||||||
dialogForm.value = false;
|
const addEdit = (type,row) =>{
|
||||||
};
|
showAdd.value.init(type,row)
|
||||||
|
}
|
||||||
|
|
||||||
const handleAdd = () => {
|
// 新增人员
|
||||||
listQuery.value.xgry.push({
|
const getPeo = (val) =>{
|
||||||
xm: "",
|
pageForm.tableData.push(val);
|
||||||
zjhm: "",
|
}
|
||||||
lxdh: ""
|
|
||||||
|
// 提交
|
||||||
|
const submit = () => {
|
||||||
|
elform.value.submit((data) => {
|
||||||
|
let url = title.value == "新增" ? "/mosty-gsxt/qbcj/add" : "/mosty-gsxt/qbcj/update";
|
||||||
|
let params = { ...data ,ryList:pageForm.tableData};
|
||||||
|
loading.value = true;
|
||||||
|
qcckPost(params, url).then((res) => {
|
||||||
|
loading.value = false;
|
||||||
|
proxy.$message({ type: "success", message: title.value + "成功" });
|
||||||
|
emit("change");
|
||||||
|
close();
|
||||||
|
}).catch(() => {
|
||||||
|
loading.value = false;
|
||||||
|
});
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
const handleDelete = (index) => {
|
// 关闭
|
||||||
listQuery.value.xgry.splice(index, 1);
|
const close = () => {
|
||||||
|
listQuery.value = {};
|
||||||
|
dialogForm.value = false;
|
||||||
|
loading.value = false;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 表格高度计算
|
||||||
|
const tabHeightFn = () => {
|
||||||
|
pageForm.tableHeight = window.innerHeight - 720;
|
||||||
|
window.onresize = function () {
|
||||||
|
tabHeightFn();
|
||||||
|
};
|
||||||
};
|
};
|
||||||
|
|
||||||
defineExpose({ init });
|
defineExpose({ init });
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.dialog {
|
@import "~@/assets/css/layout.scss";
|
||||||
padding: 20px;
|
@import "~@/assets/css/element-plus.scss";
|
||||||
|
::v-deep .el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
|
||||||
|
color: #0072ff;
|
||||||
|
background: rgba(0, 114, 255, 0.3);
|
||||||
|
}
|
||||||
|
.boxlist {
|
||||||
|
width: 99%;
|
||||||
|
height: 225px;
|
||||||
|
margin-top: 10px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
.head_box {
|
::v-deep .avatar-uploader{
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
align-items: center;
|
||||||
align-items: center;
|
}
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo {
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.form-row {
|
::v-deep .el-upload-list{
|
||||||
display: flex;
|
margin-left: 20px;
|
||||||
flex-wrap: wrap;
|
display: flex;
|
||||||
margin-bottom: 20px;
|
align-items: center;
|
||||||
|
}
|
||||||
.el-form-item {
|
::v-deep .el-upload-list__item-name .el-icon{
|
||||||
flex: 1;
|
top: 3px;
|
||||||
min-width: 300px;
|
|
||||||
margin-right: 20px;
|
|
||||||
|
|
||||||
&.full-width {
|
|
||||||
flex: 0 0 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.el-divider__text) {
|
|
||||||
font-size: 16px;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -0,0 +1,107 @@
|
|||||||
|
<template>
|
||||||
|
<el-dialog v-model="showDialog" :destroy-on-close="true" :title="props.title" @close="close" :close-on-click-modal="false">
|
||||||
|
<FormMessage v-model="listQuery" :formList="formData" labelWidth="120px" ref="elform" :rules="rules">
|
||||||
|
<template #bqList>
|
||||||
|
<div class="marks pointer" @click="chooseMarksVisible = true">
|
||||||
|
<span style="color: rgb(175 178 184);padding-left: 10px;" v-if="!listQuery.bqList || listQuery.bqList.length == 0 ">请选择标签</span>
|
||||||
|
<span v-else >
|
||||||
|
<el-tag @close.stop="closeTag(idx)" type="success" closable v-for="(it,idx) in listQuery.bqList" :key="idx">{{ it.bqMc }}</el-tag >
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</FormMessage>
|
||||||
|
<template #footer>
|
||||||
|
<div class="flex just-center">
|
||||||
|
<el-button @click="close">取消</el-button>
|
||||||
|
<el-button type="primary" @click="submitForm">确认</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
<ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import ChooseMarks from "@/components/MyComponents/ChooseMarks/index.vue";
|
||||||
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
|
import { reactive, ref } from 'vue';
|
||||||
|
const props = defineProps({
|
||||||
|
dic:{
|
||||||
|
type:Object,
|
||||||
|
default:{}
|
||||||
|
},
|
||||||
|
title:{
|
||||||
|
type:String,
|
||||||
|
default:'新增人员'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const chooseMarksVisible = ref(false)
|
||||||
|
const roleIds = ref([])
|
||||||
|
const elform = ref()
|
||||||
|
const showDialog = ref(false)
|
||||||
|
const emit = defineEmits(['change'])
|
||||||
|
const listQuery = ref({})
|
||||||
|
const formData = ref([
|
||||||
|
{ label: "姓名", prop: "xm", type: "input" ,width:'48%'},
|
||||||
|
{ label: "性别", prop: "xb", type: "select",options:props.dic.D_BZ_XB ,width:'48%'},
|
||||||
|
{ label: "身份证号", prop: "sfzh", type: "input" ,width:'48%'},
|
||||||
|
{ label: "户籍地", prop: "hjdz", type: "input",width:'48%' },
|
||||||
|
{ label: "户籍地派出所", prop: "hjdpcs", type: "department" ,width:'48%'},
|
||||||
|
{ label: "标签", prop: "bqList", type: "slot",width:'100%' },
|
||||||
|
{ label: "是否挑头人", prop: "sfttr", type: "select",options:props.dic.D_BZ_SF ,width:'48%'},
|
||||||
|
{ label: "是否响应人", prop: "sfxyr", type: "select" ,options:props.dic.D_BZ_SF,width:'48%' },
|
||||||
|
{ label: "所属群体", prop: "ssqt", type: "input" ,width:'48%'},
|
||||||
|
{ label: "微信号", prop: "wx", type: "input" ,width:'48%'},
|
||||||
|
{ label: "QQ", prop: "qq", type: "input" ,width:'48%'},
|
||||||
|
])
|
||||||
|
const rules = reactive({
|
||||||
|
xm: [{ required: true, message: "请输入姓名", trigger: "blur" }],
|
||||||
|
xb: [{ required: true, message: "请选择性别", trigger: "change" }],
|
||||||
|
sfzh: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
|
||||||
|
hjd: [{ required: true, message: "请输入户籍地", trigger: "blur" }],
|
||||||
|
})
|
||||||
|
|
||||||
|
const init = (type,row) =>{
|
||||||
|
showDialog.value = true;
|
||||||
|
elform.value.reset();
|
||||||
|
if(row) listQuery.value = {...row};
|
||||||
|
}
|
||||||
|
|
||||||
|
// 选择标签
|
||||||
|
const choosed = (val) => {
|
||||||
|
listQuery.value.bqList = val.map(v=>{
|
||||||
|
return { bqDm:v.bqDm, bqId:v.id, bqLb:v.bqLb, bqLx:v.bqLx, bqMc:v.bqMc }
|
||||||
|
});
|
||||||
|
roleIds.value = val.map(v=>v.id)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除数据
|
||||||
|
const closeTag = (idx) =>{
|
||||||
|
listQuery.value.bqList.splice(idx,1)
|
||||||
|
roleIds.value.splice(idx,1)
|
||||||
|
}
|
||||||
|
|
||||||
|
const submitForm = () =>{
|
||||||
|
elform.value.submit((val)=>{
|
||||||
|
emit('change',val)
|
||||||
|
showDialog.value = false;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const close = () =>{
|
||||||
|
elform.value.reset();
|
||||||
|
showDialog.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
defineExpose({init})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
|
.marks{
|
||||||
|
width: 100%;
|
||||||
|
width: 100%;
|
||||||
|
min-height: 32px;
|
||||||
|
border: 1px solid #e9e9e9;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,12 +1,16 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<div class="titleBox">
|
<div class="titleBox">
|
||||||
<PageTitle title="情报信息流转">
|
<PageTitle title="情报信息采集">
|
||||||
|
<el-button type="primary">
|
||||||
|
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||||
|
<span style="vertical-align: middle">导出</span>
|
||||||
|
</el-button>
|
||||||
<el-button type="primary" @click="addEdit('add', '')">
|
<el-button type="primary" @click="addEdit('add', '')">
|
||||||
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||||
<span style="vertical-align: middle">新增</span>
|
<span style="vertical-align: middle">新增</span>
|
||||||
</el-button>
|
</el-button>
|
||||||
<el-button type="danger" @click="addEdit('add', '')">
|
<el-button type="danger">
|
||||||
<el-icon style="vertical-align: middle"><Dete /></el-icon>
|
<el-icon style="vertical-align: middle"><Dete /></el-icon>
|
||||||
<span style="vertical-align: middle">批量删除</span>
|
<span style="vertical-align: middle">批量删除</span>
|
||||||
</el-button>
|
</el-button>
|
||||||
@ -26,11 +30,21 @@
|
|||||||
:tableConfiger="pageData.tableConfiger"
|
:tableConfiger="pageData.tableConfiger"
|
||||||
:controlsWidth="pageData.controlsWidth"
|
:controlsWidth="pageData.controlsWidth"
|
||||||
@chooseData="chooseData">
|
@chooseData="chooseData">
|
||||||
|
<template #xlLx="row">
|
||||||
|
<DictTag :tag="false" :value="row.xlLx" :options="D_GS_XS_LX" />
|
||||||
|
</template>
|
||||||
|
<template #qbLy="row">
|
||||||
|
<DictTag :tag="false" :value="row.qbLy" :options="D_GS_XS_LY" />
|
||||||
|
</template>
|
||||||
|
<template #shzt="row">
|
||||||
|
<DictTag :tag="false" :value="row.shzt" :options="D_BZ_XSSHZT" />
|
||||||
|
</template>
|
||||||
<!-- 操作 -->
|
<!-- 操作 -->
|
||||||
<template #controls="{ row }">
|
<template #controls="{ row }">
|
||||||
<el-link size="small" type="primary" @click="addEdit('detail', row)">详情</el-link>
|
|
||||||
<el-link size="small" type="success" @click="addEdit('edit', row)">编辑</el-link>
|
<el-link size="small" type="success" @click="addEdit('edit', row)">编辑</el-link>
|
||||||
|
<el-link size="small" type="primary" @click="addEdit('detail', row)">审核</el-link>
|
||||||
<el-link size="small" type="danger" @click="deleteRow(row)">删除</el-link>
|
<el-link size="small" type="danger" @click="deleteRow(row)">删除</el-link>
|
||||||
|
<!-- 续报 == 编辑 -->
|
||||||
<el-link size="small" type="warning" @click="transferClue(row)">续报</el-link>
|
<el-link size="small" type="warning" @click="transferClue(row)">续报</el-link>
|
||||||
</template>
|
</template>
|
||||||
</MyTable>
|
</MyTable>
|
||||||
@ -44,8 +58,8 @@
|
|||||||
}"
|
}"
|
||||||
></Pages>
|
></Pages>
|
||||||
</div>
|
</div>
|
||||||
<!-- 详情 -->
|
<!-- 新增 -->
|
||||||
<DetailForm ref="detailDiloag" />
|
<AddForm ref="detailDiloag" @change="change" v-if="isShow" :dic="{D_BZ_SF,D_BZ_XB,D_GS_XS_LY,D_BZ_SSZT,D_GS_XS_LX ,D_GS_XS_QTLX}" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@ -54,61 +68,27 @@ import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
|||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
import Pages from "@/components/aboutTable/Pages.vue";
|
import Pages from "@/components/aboutTable/Pages.vue";
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
import Search from "@/components/aboutTable/Search.vue";
|
||||||
import DetailForm from "./components/addForm.vue";
|
import AddForm from "./components/addForm.vue";
|
||||||
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
||||||
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
|
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
|
||||||
const { proxy } = getCurrentInstance();
|
const { proxy } = getCurrentInstance();
|
||||||
|
const {D_GS_XS_LY, D_BZ_SSZT,D_BZ_SF,D_GS_XS_LX ,D_GS_XS_QTLX,D_BZ_XB,D_BZ_XSSHZT} = proxy.$dict("D_GS_XS_LY","D_BZ_SSZT","D_BZ_SF","D_GS_XS_LX","D_GS_XS_QTLX","D_BZ_XB","D_BZ_XSSHZT"); //获取字典数据
|
||||||
const detailDiloag = ref();
|
const detailDiloag = ref();
|
||||||
const searchBox = ref(); //搜索框
|
const searchBox = ref(); //搜索框
|
||||||
|
const isShow = ref(false)
|
||||||
const searchConfiger = ref([
|
const searchConfiger = ref([
|
||||||
{ label: "线索名称", prop: 'clueTitle', placeholder: "请输入线索名称", showType: "input" },
|
{ label: "线索名称", prop: 'xsMc', placeholder: "请输入线索名称", showType: "input" },
|
||||||
{ label: "语义关键字", prop: 'semanticKeywords', placeholder: "请输入语义关键字", showType: "input" },
|
{ label: "内容关键字", prop: 'xsNr', placeholder: "请输入语义关键字", showType: "input" },
|
||||||
{ label: "线索类型", prop: 'clueType', placeholder: "请选择线索类型", showType: "select" },
|
{ label: "线索类型", prop: 'xlLx', placeholder: "请选择线索类型", showType: "select" },
|
||||||
{ label: "线索来源", prop: 'clueSource', placeholder: "请选择线索来源", showType: "select" },
|
{ label: "线索来源", prop: 'qbLy', placeholder: "请选择线索来源", showType: "select" },
|
||||||
{ label: "线索状态", prop: 'xszt', placeholder: "请选择线索状态", showType: "select" },
|
{ label: "线索状态", prop: 'xszt', placeholder: "请选择线索状态", showType: "select" },
|
||||||
{ label: "处置状态", prop: 'czzt', placeholder: "请选择处置状态", showType: "select" },
|
{ label: "开始时间", prop: 'zxkssj', placeholder: "请选择开始时间", showType: "date" },
|
||||||
{ label: "开始时间", prop: 'startTime', placeholder: "请选择开始时间", showType: "date" },
|
{ label: "结束时间", prop: 'zxjssj', placeholder: "请选择结束时间", showType: "date" },
|
||||||
{ label: "结束时间", prop: 'endTime', placeholder: "请选择结束时间", showType: "date" },
|
{ label: "指向地点", prop: 'zxdz', placeholder: "请输入指向地点", showType: "input" },
|
||||||
{ label: "指向地点", prop: 'targetLocation', placeholder: "请输入指向地点", showType: "input" },
|
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const pageData = reactive({
|
const pageData = reactive({
|
||||||
tableData: [
|
tableData: [],
|
||||||
{
|
|
||||||
clueNo: "XS20240101001",
|
|
||||||
clueTitle: "可疑人员活动线索",
|
|
||||||
clueType: "人员线索",
|
|
||||||
clueSource: "群众举报",
|
|
||||||
startTime: "2024-01-01 08:00:00",
|
|
||||||
endTime: "2024-01-01 18:00:00",
|
|
||||||
targetLocation: "某市某区某街道",
|
|
||||||
clueContent: "发现多名可疑人员在该区域频繁出入，疑似从事非法活动。",
|
|
||||||
attachment: "report.pdf"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
clueNo: "XS20240101002",
|
|
||||||
clueTitle: "涉毒交易线索",
|
|
||||||
clueType: "违法犯罪线索",
|
|
||||||
clueSource: "技术侦查",
|
|
||||||
startTime: "2024-01-02 10:00:00",
|
|
||||||
endTime: "2024-01-02 16:00:00",
|
|
||||||
targetLocation: "某市某区某小区",
|
|
||||||
clueContent: "监控发现多次可疑交易活动，疑似涉及违禁物品。",
|
|
||||||
attachment: "evidence.docx"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
clueNo: "XS20240101003",
|
|
||||||
clueTitle: "非法聚集线索",
|
|
||||||
clueType: "群体性事件",
|
|
||||||
clueSource: "网络监控",
|
|
||||||
startTime: "2024-01-03 14:00:00",
|
|
||||||
endTime: "2024-01-03 22:00:00",
|
|
||||||
targetLocation: "某市某广场",
|
|
||||||
clueContent: "网络平台发现有组织策划非法聚集活动的信息。",
|
|
||||||
attachment: "online_evidence.zip"
|
|
||||||
}
|
|
||||||
],
|
|
||||||
keyCount: 0,
|
keyCount: 0,
|
||||||
tableConfiger: {
|
tableConfiger: {
|
||||||
rowHieght: 61,
|
rowHieght: 61,
|
||||||
@ -122,15 +102,17 @@ const pageData = reactive({
|
|||||||
},
|
},
|
||||||
controlsWidth: 220,
|
controlsWidth: 220,
|
||||||
tableColumn: [
|
tableColumn: [
|
||||||
{ label: "线索编号", prop: "clueNo" },
|
{ label: "线索编号", prop: "xsBh" },
|
||||||
{ label: "线索名称", prop: "clueTitle" },
|
{ label: "线索名称", prop: "xsMc" },
|
||||||
{ label: "线索类型", prop: "clueType" },
|
{ label: "线索类型", prop: "xlLx",showSolt:true },
|
||||||
{ label: "线索来源", prop: "clueSource" },
|
{ label: "线索来源", prop: "qbLy",showSolt:true },
|
||||||
{ label: "开始时间", prop: "startTime" },
|
{ label: "开始时间", prop: "zxkssj" },
|
||||||
{ label: "结束时间", prop: "endTime" },
|
{ label: "结束时间", prop: "zxjssj" },
|
||||||
{ label: "指向地点", prop: "targetLocation" },
|
{ label: "指向地点", prop: "zxdz" },
|
||||||
{ label: "线索内容", prop: "clueContent", width: 200 },
|
{ label: "线索内容", prop: "xsNr"},
|
||||||
{ label: "附件", prop: "attachment", slot: true },
|
{ label: "处置状态", prop: "czzt"},
|
||||||
|
{ label: "附件", prop: "fjdz", showSolt: true },
|
||||||
|
{ label: "审核状态", prop: "shzt", showSolt: true },
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -141,12 +123,6 @@ onMounted(() => {
|
|||||||
tabHeightFn();
|
tabHeightFn();
|
||||||
});
|
});
|
||||||
|
|
||||||
//选择类型
|
|
||||||
const handleType = (val) => {
|
|
||||||
pageData.keyCount++;
|
|
||||||
pageData.pageConfiger.pageCurrent = 1;
|
|
||||||
getList()
|
|
||||||
}
|
|
||||||
// 搜索
|
// 搜索
|
||||||
const onSearch = (val) =>{
|
const onSearch = (val) =>{
|
||||||
queryFrom.value = {...val}
|
queryFrom.value = {...val}
|
||||||
@ -164,20 +140,22 @@ const changeSize = (val) =>{
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 获取列表
|
// 获取列表
|
||||||
const getList = (val) =>{
|
const getList = () =>{
|
||||||
// pageData.tableConfiger.loading = true;
|
pageData.tableConfiger.loading = true;
|
||||||
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
||||||
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
qcckGet(data,'/mosty-gsxt/qbcj/selectPage').then(res=>{
|
||||||
// qcckPost(data,url).then(res=>{
|
pageData.tableData = res.records || [];
|
||||||
// pageData.tableData = res.records || [];
|
pageData.total = res.total;
|
||||||
// pageData.total = res.total;
|
pageData.tableConfiger.loading = false;
|
||||||
// pageData.tableConfiger.loading = false;
|
}).catch(()=>{ pageData.tableConfiger.loading = false; })
|
||||||
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// 详情
|
// 详情
|
||||||
const addEdit = (type, row) => {
|
const addEdit = (type, row) => {
|
||||||
detailDiloag.value.init(type, row);
|
isShow.value = true;
|
||||||
|
setTimeout(()=>{
|
||||||
|
detailDiloag.value.init(type, row);
|
||||||
|
},500)
|
||||||
};
|
};
|
||||||
|
|
||||||
// 表格高度计算
|
// 表格高度计算
|
||||||
|
|||||||
@ -1,506 +1,164 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="dialog" v-if="dialogForm">
|
<div class="dialog" v-if="dialogForm">
|
||||||
<div class="head_box">
|
<div class="head_box">
|
||||||
<span class="title">新增</span>
|
<span class="title">人力情报信息采集流转详情</span>
|
||||||
<div>
|
<div>
|
||||||
<el-button
|
<el-button @click="close">保存</el-button>
|
||||||
type="primary"
|
<el-button @click="close">暂存</el-button>
|
||||||
size="small"
|
<el-button @click="close">关闭</el-button>
|
||||||
:loading="loading"
|
|
||||||
@click="submit"
|
|
||||||
>保存</el-button
|
|
||||||
>
|
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="form_cnt">
|
<div class="form_cnt">
|
||||||
<FormMessage
|
<FormMessage v-model="listQuery" :formList="formData" ref="elform" :rules="rules">
|
||||||
v-model="listQuery"
|
<template #gapdive>
|
||||||
:formList="formData"
|
<div style="width: 100%;height: 10px;" class="mb20">
|
||||||
ref="elform"
|
<el-divider content-position="left">基础信息</el-divider>
|
||||||
:rules="rules"
|
|
||||||
>
|
|
||||||
<template #basic>
|
|
||||||
<el-divider content-position="left">基础信息</el-divider>
|
|
||||||
</template>
|
|
||||||
<template #sbRy>
|
|
||||||
<el-divider content-position="left">涉及人员</el-divider>
|
|
||||||
</template>
|
|
||||||
<template #jurisdiction>
|
|
||||||
<el-divider content-position="left">审批信息</el-divider>
|
|
||||||
</template>
|
|
||||||
<template #bqInfo>
|
|
||||||
<el-divider content-position="left">标签信息</el-divider>
|
|
||||||
</template>
|
|
||||||
<!-- 人员标签模型-->
|
|
||||||
<template #bqList>
|
|
||||||
<el-button @click="openDialog('01', 'bq')">选择</el-button>
|
|
||||||
<div class="boxlist">
|
|
||||||
<MyTable
|
|
||||||
:tableData="tableDate.bqList"
|
|
||||||
:tableColumn="tableDate.tableColumn"
|
|
||||||
:tableHeight="tableDate.tableHeight"
|
|
||||||
:key="tableDate.keyCount"
|
|
||||||
:tableConfiger="tableDate.tableConfiger"
|
|
||||||
:controlsWidth="tableDate.controlsWidth"
|
|
||||||
>
|
|
||||||
<template #bqLb="{ row }">
|
|
||||||
<DictTag :value="row.bqLb" :tag="false" :options="D_GS_BQ_LB" />
|
|
||||||
</template>
|
|
||||||
<template #bqLx="{ row }">
|
|
||||||
<DictTag :value="row.bqLx" :tag="false" :options="D_GS_BQ_LX" />
|
|
||||||
</template>
|
|
||||||
<template #bqZl="{ row }">
|
|
||||||
<DictTag :value="row.bqZl" :tag="false" :options="D_GS_BQ_ZL" />
|
|
||||||
</template>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-link type="danger" @click="delDictItem(row.bqId)"
|
|
||||||
>删除</el-link
|
|
||||||
>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<!-- 上报人员-->
|
<template #gapline>
|
||||||
<template #sbRyId>
|
<div style="width: 100%;height: 10px;" class="mb20">
|
||||||
<el-button @click="openDialog('01', 'ry')">选择</el-button>
|
<el-divider content-position="left">线索内容</el-divider>
|
||||||
<div class="boxlist">
|
|
||||||
<MyTable
|
|
||||||
:tableData="tableDate.ryList"
|
|
||||||
:tableColumn="tableDate.tableColumnRy"
|
|
||||||
:tableHeight="tableDate.tableHeight"
|
|
||||||
:key="tableDate.keyCountRy"
|
|
||||||
:tableConfiger="tableDate.tableConfiger"
|
|
||||||
:controlsWidth="tableDate.controlsWidth"
|
|
||||||
>
|
|
||||||
<template #ryMz="{ row }">
|
|
||||||
<DictTag :tag="false" :value="row.ryMz" :options="D_BZ_MZ" />
|
|
||||||
</template>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-link
|
|
||||||
type="danger"
|
|
||||||
@click="delDict(row.id)"
|
|
||||||
v-if="typeOf == 'edit' || typeOf == 'add'"
|
|
||||||
>删除</el-link
|
|
||||||
>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
<template #scfj>
|
||||||
<!-- 管辖单位 -->
|
<div style="width: 100%;">上传附件: <el-button size="small" type="primary">上传附件</el-button> <span class="f12">（可附电子表格、Word文档、图像、音视频文件）</span></div>
|
||||||
<template #gxSsbmdm>
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.gxSsbmdm"
|
|
||||||
placeholder="请选择管辖单位"
|
|
||||||
style="width: 240px"
|
|
||||||
@change="handleDeptChange('gxSsbmmc', $event)"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in deptList"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value.toString()"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</template>
|
|
||||||
<!-- 现住地派出所 -->
|
|
||||||
<template #xzdPcsdm>
|
|
||||||
<el-select
|
|
||||||
v-model="listQuery.xzdPcsdm"
|
|
||||||
placeholder="请选择现住地派出所"
|
|
||||||
style="width: 240px"
|
|
||||||
@change="handleDeptChange('xzdPcsmc', $event)"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="item in deptList"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value.toString()"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</template>
|
|
||||||
<!-- 线索正文 -->
|
|
||||||
<template #xsZw>
|
|
||||||
<div style="border: 1px solid #ccc">
|
|
||||||
<Toolbar
|
|
||||||
style="border-bottom: 1px solid #ccc"
|
|
||||||
:editor="editorRef"
|
|
||||||
:defaultConfig="toolbarConfig"
|
|
||||||
mode="default"
|
|
||||||
/>
|
|
||||||
<Editor
|
|
||||||
style="height: 500px; overflow-y: hidden"
|
|
||||||
v-model="valueHtml"
|
|
||||||
:defaultConfig="editorConfig"
|
|
||||||
mode="default"
|
|
||||||
@onCreated="handleCreated"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
</FormMessage>
|
</FormMessage>
|
||||||
|
<el-divider content-position="left"><span class="mr20">相关人员</span> <el-button type="primary" size="small" @click="showPeo = true,peoTitle = '新增人员'">添加人员</el-button></el-divider>
|
||||||
<!-- 列表弹窗 -->
|
<MyTable
|
||||||
<TagSelectorDialog
|
:tableData="pageForm.tableData"
|
||||||
v-model="chooseShow"
|
:tableColumn="pageForm.tableColumn"
|
||||||
ref="tagDialog"
|
:tableHeight="pageForm.tableHeight"
|
||||||
@chooseDate="handleTagSelect"
|
:key="pageForm.keyCount"
|
||||||
:dic="{ D_GS_BQ_ZL, D_GS_BQ_LB, D_GS_BQ_LX }"
|
:tableConfiger="pageForm.tableConfiger"
|
||||||
/>
|
:controlsWidth="pageForm.controlsWidth"
|
||||||
<!-- 上报人员列表弹窗 -->
|
@chooseData="chooseData"
|
||||||
<DialogList
|
>
|
||||||
v-if="ryDialog"
|
<!-- 操作 -->
|
||||||
:Single="true"
|
<template #controls="{ row }">
|
||||||
:roleIds="roleIds"
|
<el-link size="small" type="primary" @click="addEdit('detail', row)">详情</el-link >
|
||||||
@chooseDate="chooseDate"
|
<el-link size="small" type="success" @click="addEdit('edit', row)">编辑</el-link>
|
||||||
:titleValue="chooseTitle"
|
<el-link size="small" type="danger" @click="deleteRow(row)">删除</el-link>
|
||||||
v-model="ryDialog"
|
</template>
|
||||||
bqDl="02"
|
</MyTable>
|
||||||
:dic="{ D_BZ_MZ }"
|
|
||||||
></DialogList>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- 人员 -->
|
||||||
|
<AddPeo v-model="showPeo" :dic="props.dic" :title="peoTitle"></AddPeo>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import {
|
import AddPeo from './addPeo.vue'
|
||||||
ref,
|
|
||||||
defineExpose,
|
|
||||||
reactive,
|
|
||||||
onMounted,
|
|
||||||
defineEmits,
|
|
||||||
getCurrentInstance,
|
|
||||||
nextTick,
|
|
||||||
shallowRef,
|
|
||||||
onBeforeUnmount,
|
|
||||||
watch
|
|
||||||
} from "vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
import TagSelectorDialog from "@/components/aboutTable/TagSelectorDialog.vue";
|
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
||||||
import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
|
import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, nextTick } from "vue";
|
||||||
import DialogList from "./dialogList.vue";
|
const emit = defineEmits(["updateDate"]);
|
||||||
import store from "@/store";
|
const props = defineProps({
|
||||||
|
dic: Object
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
|
|
||||||
const {
|
|
||||||
D_GS_BQ_LB,
|
|
||||||
D_GS_BQ_ZL,
|
|
||||||
D_GS_BQ_LX,
|
|
||||||
D_GS_XS_SBRYLX,
|
|
||||||
D_GS_ZDQT_LB,
|
|
||||||
D_GS_XS_FXDJ,
|
|
||||||
D_BZ_MZ,
|
|
||||||
D_GS_XS_LX,
|
|
||||||
D_GS_RLQB_BJSB_BSZT,
|
|
||||||
D_BZ_SF
|
|
||||||
} = proxy.$dict(
|
|
||||||
"D_GS_BQ_LB",
|
|
||||||
"D_GS_BQ_ZL",
|
|
||||||
"D_GS_BQ_LX",
|
|
||||||
"D_GS_XS_SBRYLX",
|
|
||||||
"D_GS_ZDQT_LB",
|
|
||||||
"D_GS_XS_FXDJ",
|
|
||||||
"D_BZ_MZ",
|
|
||||||
"D_GS_XS_LX",
|
|
||||||
"D_GS_RLQB_BJSB_BSZT",
|
|
||||||
"D_BZ_SF"
|
|
||||||
); //获取字典数据
|
|
||||||
const elform = ref();
|
|
||||||
const dialogForm = ref(false);
|
|
||||||
const chooseShow = ref(false); //选择弹窗
|
|
||||||
const tagDialog = ref();
|
|
||||||
const ryDialog = ref(false); //选择弹窗
|
|
||||||
|
|
||||||
// 编辑器实例，必须用 shallowRef
|
|
||||||
const editorRef = shallowRef();
|
|
||||||
const editorConfig = ref({
|
|
||||||
placeholder: "请输入内容...",
|
|
||||||
readOnly: false,
|
|
||||||
MENU_CONF: {
|
|
||||||
// 图片上传配置
|
|
||||||
uploadImage: {
|
|
||||||
server: "http://your-server.com/api/upload-image", // 替换为你的图片上传接口
|
|
||||||
fieldName: "file", // 上传文件的字段名（根据后端接口调整）
|
|
||||||
maxFileSize: 10 * 1024 * 1024, // 10M
|
|
||||||
allowedFileTypes: ["image/*"], // 允许的图片类型
|
|
||||||
// 自定义上传参数（如 token）
|
|
||||||
meta: {
|
|
||||||
token: store.getters.token // 如果需要认证
|
|
||||||
},
|
|
||||||
// 自定义文件名
|
|
||||||
metaWithUrl: false,
|
|
||||||
// 跨域携带 Cookie
|
|
||||||
withCredentials: true
|
|
||||||
},
|
|
||||||
// 视频上传配置（类似）
|
|
||||||
uploadVideo: {
|
|
||||||
server: "http://your-server.com/api/upload-video",
|
|
||||||
fieldName: "file",
|
|
||||||
maxFileSize: 50 * 1024 * 1024 // 50M
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
const toolbarConfig = {};
|
const { proxy } = getCurrentInstance();
|
||||||
|
const dialogForm = ref(false); //弹窗
|
||||||
|
const formData = ref([
|
||||||
|
{ label: "", prop: "gapdive", type: "slot",width:'100%' },
|
||||||
|
{ label: "线索编号", prop: "xsbh", type: "input",},
|
||||||
|
{ label: "线索名称", prop: "xsmc", type: "input" },
|
||||||
|
{ label: "线索类型", prop: "xslx", type: "select", options:props.dic.D_GS_XS_LX },
|
||||||
|
{ label: "情报来源", prop: "qbly", type: "select", options:props.dic.D_GS_XS_LY},
|
||||||
|
{ label: "指向开始时间", prop: "zxkssj", type: "datetime"},
|
||||||
|
{ label: "指向结束时间", prop: "zxjssj", type: "datetime"},
|
||||||
|
{ label: "指向地点", prop: "zxdz", type: "input"},
|
||||||
|
{ label: "所属专题", prop: "sszt", type: "select",options:props.dic.D_BZ_SSZT},
|
||||||
|
{ prop: "gapline", type: "slot",width:'100%' },
|
||||||
|
{ prop: "scfj", type: "slot",width:'100%'},
|
||||||
|
{ label: "线索内容", prop: "xsnr", type: "textarea",width:'100%'},
|
||||||
|
{ label: "群体类型", prop: "qtlx", type: "select",options:props.dic.D_GS_XS_QTLX },
|
||||||
|
{ label: "群体名称", prop: "qtmc", type: "input"},
|
||||||
|
{ label: "涉及人数", prop: "sjrs", type: "inputNumber"},
|
||||||
|
{ label: "线索报送单位", prop: "fjWb", type: "department"},
|
||||||
|
]);
|
||||||
|
const listQuery = ref({}); //表单
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
// 内容 HTML
|
const elform = ref();
|
||||||
const valueHtml = ref("<p>hello</p>");
|
const title = ref("");
|
||||||
const tableDate = reactive({
|
const pageForm = reactive({
|
||||||
bqList: [], //表格数据
|
tableData: [],
|
||||||
ryList: [], //上报人员列表
|
|
||||||
keyCount: 0,
|
keyCount: 0,
|
||||||
rykeyCount: 0,
|
|
||||||
tableConfiger: {
|
tableConfiger: {
|
||||||
rowHieght: 61,
|
rowHieght: 61,
|
||||||
showSelectType: "null",
|
showSelectType: "checkBox",
|
||||||
loading: false
|
loading: false
|
||||||
},
|
},
|
||||||
total: 0,
|
controlsWidth: 220,
|
||||||
tableHeight: 225,
|
|
||||||
pageConfiger: {
|
|
||||||
pageSize: 20,
|
|
||||||
pageCurrent: 1
|
|
||||||
}, //分页
|
|
||||||
controlsWidth: 90, //操作栏宽度
|
|
||||||
tableColumn: [
|
tableColumn: [
|
||||||
{ label: "标签代码", prop: "bqDm" },
|
{ label: "姓名", prop: "xm" },
|
||||||
{ label: "标签类别", prop: "bqLb", showSolt: true },
|
{ label: "性别", prop: "xb" },
|
||||||
{ label: "标签类型", prop: "bqLx", showSolt: true },
|
{ label: "身份证号", prop: "sfzh" },
|
||||||
{ label: "标签名称", prop: "bqMc" },
|
{ label: "户籍地", prop: "hjd" },
|
||||||
{ label: "标签种类", prop: "bqZl", showSolt: true }
|
{ label: "户籍地派出所", prop: "hjdpcs" },
|
||||||
],
|
{ label: "标签", prop: "bq" }
|
||||||
tableColumnRy: [
|
|
||||||
{ label: "姓名", prop: "ryXm" },
|
|
||||||
{ label: "联系电话", prop: "ryLxdh" },
|
|
||||||
{ label: "身份证号", prop: "rySfzh" },
|
|
||||||
{ label: "民族", prop: "ryMz", showSolt: true },
|
|
||||||
{ label: "居住地址", prop: "jzdDz" }
|
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
const formData = ref([
|
const showPeo = ref(false)
|
||||||
{ label: "", prop: "basic", type: "slot", width: "100%" },
|
const peoTitle = ref('')
|
||||||
{ label: "线索名称", prop: "xsMc", type: "input" },
|
onMounted(()=>{
|
||||||
{ label: "线索来源", prop: "ryXb", type: "select" },
|
tabHeightFn()
|
||||||
{ label: "线索编号", prop: "ryMz", type: "input" },
|
})
|
||||||
{ label: "线索类型", prop: "ryLxdh", type: "select" },
|
|
||||||
{ label: "线索状态", prop: "ryCsrq", type: "select" },
|
|
||||||
{ label: "所属专题", prop: "ryMz", type: "input" },
|
|
||||||
{ label: "群体名称", prop: "ryMz", type: "input" },
|
|
||||||
{ label: "群体类型", prop: "ryMz", type: "select" },
|
|
||||||
{ label: "上报单位", prop: "ryMz", type: "select" },
|
|
||||||
{ label: "上报时间", prop: "rySfzh", type: "date" },
|
|
||||||
{ label: "线索内容", prop: "xsZw", type: "slot", width: "100%" },
|
|
||||||
{ label: "线索备注", prop: "ryJg", type: "textarea", width: "100%" },
|
|
||||||
{ label: "", prop: "bqInfo", type: "slot", width: "100%" },
|
|
||||||
{ label: "标签列表", prop: "bqList", type: "slot", width: "80%" },
|
|
||||||
{
|
|
||||||
label: "市内外",
|
|
||||||
prop: "snw",
|
|
||||||
type: "radio",
|
|
||||||
options: [
|
|
||||||
{ value: "1", label: "市内" },
|
|
||||||
{ value: "0", label: "市外" }
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "是否设计外地",
|
|
||||||
prop: "xsfxdj",
|
|
||||||
type: "radio",
|
|
||||||
options: [
|
|
||||||
{ value: "1", label: "是" },
|
|
||||||
{ value: "0", label: "否" }
|
|
||||||
]
|
|
||||||
},
|
|
||||||
{ label: "指向地点", prop: "zxdd", type: "input" },
|
|
||||||
{ label: "具体部位", prop: "jtbw", type: "input" },
|
|
||||||
{ label: "指向时间类型", prop: "sjlx", type: "select" },
|
|
||||||
{ label: "指向时间段", prop: "sjd", type: "datetimerange" },
|
|
||||||
{ label: "", prop: "sbRy", type: "slot", width: "100%" },
|
|
||||||
{
|
|
||||||
label: "上报人员",
|
|
||||||
prop: "sbRyId",
|
|
||||||
type: "slot",
|
|
||||||
width: "80%"
|
|
||||||
},
|
|
||||||
// {
|
|
||||||
// label: "姓名",
|
|
||||||
// prop: "zdrRyjb",
|
|
||||||
// type: "input"
|
|
||||||
// },
|
|
||||||
// {
|
|
||||||
// label: "身份证号",
|
|
||||||
// prop: "zdrYjdj",
|
|
||||||
// type: "input"
|
|
||||||
// },
|
|
||||||
// { label: "住址", prop: "hjdQh", type: "select" },
|
|
||||||
{ label: "", prop: "jurisdiction", type: "slot", width: "100%" },
|
|
||||||
|
|
||||||
{ label: "申请人", prop: "hjdXz", type: "input" },
|
|
||||||
{
|
|
||||||
label: "申请时间",
|
|
||||||
prop: "hjdPcsdm",
|
|
||||||
type: "date"
|
|
||||||
},
|
|
||||||
{ label: "申请原因", prop: "xzdQh", type: "textarea", width: "100%" }
|
|
||||||
]);
|
|
||||||
const listQuery = ref({});
|
|
||||||
|
|
||||||
// 打开弹窗
|
|
||||||
const openDialog = (type, value) => {
|
|
||||||
nextTick(() => {
|
|
||||||
if (value == "ry") {
|
|
||||||
ryDialog.value = true;
|
|
||||||
} else if (value == "bq") {
|
|
||||||
chooseShow.value = true;
|
|
||||||
tagDialog.value.setValues(listQuery.value.bqList);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
};
|
|
||||||
const handleTagSelect = (selectedTags) => {
|
|
||||||
tableDate.bqList = selectedTags.map((item) => ({
|
|
||||||
bqDm: item.bqDm || "",
|
|
||||||
bqId: item.bqId || "",
|
|
||||||
bqLb: item.bqLb || "",
|
|
||||||
bqLx: item.bqLx || "",
|
|
||||||
bqMc: item.bqMc || "",
|
|
||||||
bqZl: item.bqZl || ""
|
|
||||||
}));
|
|
||||||
listQuery.value.bqList = tableDate.bqList;
|
|
||||||
// 每个标签包含: bqDm, bqId, bqLb, bqLx, bqMc, bqZl 属性
|
|
||||||
};
|
|
||||||
const handleCreated = (editor) => {
|
|
||||||
editorRef.value = editor; // 记录 editor 实例，重要！
|
|
||||||
};
|
|
||||||
// 初始化数据
|
// 初始化数据
|
||||||
const init = (type, row) => {
|
const init = (type, row) => {
|
||||||
|
tabHeightFn()
|
||||||
dialogForm.value = true;
|
dialogForm.value = true;
|
||||||
// 根据type和row初始化表单数据
|
title.value = type == "add" ? "新增" : type == "info" ? "详情" : "编辑";
|
||||||
|
// 初始化表单数据，并根据详情页设置禁用状态
|
||||||
|
// if (row) getDataById(row.id);
|
||||||
|
};
|
||||||
|
// 根据id查询详情
|
||||||
|
const getDataById = (id) => {
|
||||||
|
// qcckGet({}, "/mosty-gsxt/tbGsxtRqfjNr/" + id).then((res) => {
|
||||||
|
// listQuery.value = res;
|
||||||
|
// });
|
||||||
};
|
};
|
||||||
|
|
||||||
const close = () => {
|
|
||||||
listQuery.value = {};
|
|
||||||
tableDate.bqList = [];
|
|
||||||
dialogForm.value = false;
|
|
||||||
loading.value = false;
|
|
||||||
};
|
|
||||||
// 提交
|
// 提交
|
||||||
const submit = () => {
|
const submit = () => {
|
||||||
elform.value.submit((data) => {
|
elform.value.submit((data) => {
|
||||||
// 定义仅在 report 模式下需要的字段
|
let url = title.value == "新增" ? "/mosty-gsxt/tbGsxtRqfjNr/save" : "/mosty-gsxt/tbGsxtRqfjNr/update";
|
||||||
const reportFields = [
|
let params = { ...data };
|
||||||
"bsBh",
|
// qcckPost(params, url).then((res) => {
|
||||||
"bsNr",
|
// proxy.$message({ type: "success", message: title.value + "成功" });
|
||||||
"bsRq",
|
// emit("onSearch");
|
||||||
"bsSfCb",
|
// close();
|
||||||
"bsZt",
|
// })
|
||||||
"sbDwDm",
|
// .catch(() => {});
|
||||||
"sbDwMc",
|
|
||||||
"csDwMc",
|
|
||||||
"csDwDm",
|
|
||||||
"bzDwMc",
|
|
||||||
"bzDwDm",
|
|
||||||
"cbrXm",
|
|
||||||
"cbrSfzh",
|
|
||||||
"shrXm",
|
|
||||||
"shrSfzh",
|
|
||||||
"qfrXm",
|
|
||||||
"qfrSfzh",
|
|
||||||
"hbBk",
|
|
||||||
"xsId" // 新增 xsId
|
|
||||||
];
|
|
||||||
|
|
||||||
// 准备最终提交数据
|
|
||||||
let submitData;
|
|
||||||
|
|
||||||
if (typeOf.value === "report") {
|
|
||||||
// report 模式：只提交 reportFields 里的字段 + hbBk（富文本）
|
|
||||||
submitData = {
|
|
||||||
...Object.fromEntries(
|
|
||||||
Object.entries(data).filter(([key]) => reportFields.includes(key))
|
|
||||||
),
|
|
||||||
hbBk: valueHtml.value, // 强制覆盖富文本字段
|
|
||||||
xsId: listQuery.value.id // 强制添加 xsId
|
|
||||||
};
|
|
||||||
} else {
|
|
||||||
// 非 report 模式：提交除 reportFields 外的所有字段
|
|
||||||
submitData = {
|
|
||||||
...Object.fromEntries(
|
|
||||||
Object.entries(data).filter(([key]) => !reportFields.includes(key))
|
|
||||||
),
|
|
||||||
xsNr: clueHtml.value // 强制覆盖线索内容字段
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
// 根据 title 决定请求 URL
|
|
||||||
let url =
|
|
||||||
title.value == "新增"
|
|
||||||
? "/mosty-gsxt/tbGsxtXs/save"
|
|
||||||
: title.value == "上报"
|
|
||||||
? "/mosty-gsxt/tbGsxtRlqbBjsb/save"
|
|
||||||
: "/mosty-gsxt/tbGsxtXs/update";
|
|
||||||
|
|
||||||
// 发起请求
|
|
||||||
qcckPost(submitData, url)
|
|
||||||
.then((res) => {
|
|
||||||
proxy.$message({ type: "success", message: title.value + "成功" });
|
|
||||||
emit("getList");
|
|
||||||
close();
|
|
||||||
})
|
|
||||||
.catch(() => {});
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
// 根据id查询详情
|
|
||||||
const getDataRyId = (id) => {
|
// 关闭
|
||||||
qcckGet({}, "/mosty-gsxt/tbGsxtJwry/" + id).then((res) => {
|
const close = () => {
|
||||||
tableDate.ryList = [res];
|
listQuery.value = {};
|
||||||
listQuery.value.sbRyId = res.id;
|
dialogForm.value = false;
|
||||||
});
|
loading.value = false;
|
||||||
};
|
|
||||||
// 删除
|
|
||||||
const delDictItem = (bqId) => {
|
|
||||||
tableDate.bqList = tableDate.bqList.filter((item) => item.bqId !== bqId);
|
|
||||||
listQuery.value.bqList = tableDate.bqList;
|
|
||||||
};
|
|
||||||
// 删除
|
|
||||||
const delDict = (id) => {
|
|
||||||
tableDate.ryList = tableDate.ryList.filter((item) => item.id !== id);
|
|
||||||
listQuery.value.ryList = tableDate.ryList;
|
|
||||||
};
|
|
||||||
// 选择数据
|
|
||||||
const chooseDate = (data) => {
|
|
||||||
console.log(data[0].id);
|
|
||||||
tableDate.ryList = data;
|
|
||||||
listQuery.value.sbRyId = data[0].id;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// 组件销毁时，也及时销毁编辑器
|
// 表格高度计算
|
||||||
onBeforeUnmount(() => {
|
const tabHeightFn = () => {
|
||||||
const editor = editorRef.value;
|
pageForm.tableHeight = window.innerHeight - 720;
|
||||||
if (editor == null) return;
|
window.onresize = function () {
|
||||||
editor.destroy();
|
tabHeightFn();
|
||||||
});
|
};
|
||||||
|
};
|
||||||
|
|
||||||
defineExpose({ init });
|
defineExpose({ init });
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.dialog {
|
@import "~@/assets/css/layout.scss";
|
||||||
padding: 20px;
|
@import "~@/assets/css/element-plus.scss";
|
||||||
.head_box {
|
::v-deep .el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
|
||||||
display: flex;
|
color: #0072ff;
|
||||||
justify-content: space-between;
|
background: rgba(0, 114, 255, 0.3);
|
||||||
align-items: center;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
.cntinfo {
|
|
||||||
height: calc(100% - 70px);
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.boxlist {
|
.boxlist {
|
||||||
width: 99%;
|
width: 99%;
|
||||||
|
|||||||
@ -0,0 +1,69 @@
|
|||||||
|
<template>
|
||||||
|
<el-dialog v-model="modelValue" :title="props.title" @close="close" :close-on-click-modal="false">
|
||||||
|
<FormMessage v-model="listQuery" :formList="formData" labelWidth="120px" ref="elform" :rules="rules"></FormMessage>
|
||||||
|
<template #footer>
|
||||||
|
<div class="flex just-center">
|
||||||
|
<el-button @click="close">取消</el-button>
|
||||||
|
<el-button type="primary" @click="submitForm">确认</el-button>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
|
import { reactive, ref } from 'vue';
|
||||||
|
const props = defineProps({
|
||||||
|
modelValue:{
|
||||||
|
type:Boolean,
|
||||||
|
default:false
|
||||||
|
},
|
||||||
|
dic:{
|
||||||
|
type:Object,
|
||||||
|
default:{}
|
||||||
|
},
|
||||||
|
title:{
|
||||||
|
type:String,
|
||||||
|
default:'新增人员'
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const elform = ref()
|
||||||
|
const emit = defineEmits('update:modelValue')
|
||||||
|
const listQuery = ref({})
|
||||||
|
const formData = ref([
|
||||||
|
{ label: "姓名", prop: "xm", type: "input" },
|
||||||
|
{ label: "性别", prop: "xb", type: "select",options:props.dic.D_BZ_XB },
|
||||||
|
{ label: "身份证号", prop: "sfzh", type: "input" },
|
||||||
|
{ label: "户籍地", prop: "hjd", type: "input" },
|
||||||
|
{ label: "户籍地派出所", prop: "hjdpcs", type: "input" },
|
||||||
|
{ label: "标签", prop: "bq", type: "input" },
|
||||||
|
{ label: "是否挑头人", prop: "sfdtr", type: "select",options:props.dic.D_BZ_SF },
|
||||||
|
{ label: "是否响应人", prop: "sfxyr", type: "select" ,options:props.dic.D_BZ_SF },
|
||||||
|
{ label: "所属群体", prop: "ssqt", type: "input" },
|
||||||
|
{ label: "微信号", prop: "wxh", type: "input" },
|
||||||
|
{ label: "QQ", prop: "qqh", type: "input" },
|
||||||
|
])
|
||||||
|
const rules = reactive({
|
||||||
|
xm: [{ required: true, message: "请输入姓名", trigger: "blur" }],
|
||||||
|
xb: [{ required: true, message: "请选择性别", trigger: "change" }],
|
||||||
|
sfzh: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
|
||||||
|
hjd: [{ required: true, message: "请输入户籍地", trigger: "blur" }],
|
||||||
|
})
|
||||||
|
|
||||||
|
const submitForm = () =>{
|
||||||
|
elform.value.submit(()=>{
|
||||||
|
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
const close = () =>{
|
||||||
|
elform.value.reset();
|
||||||
|
emit('update:modelValue',false)
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
::v-deep .el-form-item--default {
|
||||||
|
width: 48% !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -1,229 +0,0 @@
|
|||||||
<template>
|
|
||||||
<el-dialog
|
|
||||||
:title="titleValue"
|
|
||||||
width="900px"
|
|
||||||
:model-value="modelValue"
|
|
||||||
append-to-body
|
|
||||||
@close="closed"
|
|
||||||
>
|
|
||||||
<div>
|
|
||||||
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true">
|
|
||||||
<el-form-item label="人员姓名">
|
|
||||||
<el-input
|
|
||||||
placeholder="请输入人员姓名"
|
|
||||||
v-model="listQuery.ryXm"
|
|
||||||
clearable
|
|
||||||
></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="success" @click="handleFilter">查询</el-button>
|
|
||||||
<el-button type="info" @click="reset()"> 重置 </el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<div
|
|
||||||
class="tabBox"
|
|
||||||
:class="props.Single ? 'tabBoxRadio' : ''"
|
|
||||||
style="margin-top: 0px"
|
|
||||||
>
|
|
||||||
<el-table
|
|
||||||
v-loading="loading"
|
|
||||||
ref="multipleUserRef"
|
|
||||||
@selection-change="handleSelectionChange"
|
|
||||||
:data="tableData"
|
|
||||||
border
|
|
||||||
:row-key="keyid"
|
|
||||||
style="width: 100%"
|
|
||||||
height="450"
|
|
||||||
>
|
|
||||||
<el-table-column
|
|
||||||
type="selection"
|
|
||||||
width="55"
|
|
||||||
:reserve-selection="true"
|
|
||||||
/>
|
|
||||||
<el-table-column prop="ryXm" align="center" label="姓名" />
|
|
||||||
<el-table-column prop="ryLxdh" align="center" label="联系电话" />
|
|
||||||
<el-table-column prop="rySfzh" align="center" label="身份证号">
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="bqYs" align="center" label="民族">
|
|
||||||
<template #default="{ row }">
|
|
||||||
<DictTag
|
|
||||||
:value="row.ryMz"
|
|
||||||
:tag="false"
|
|
||||||
:options="props.dic.D_BZ_MZ"
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="jzdDz" align="center" label="居住地址">
|
|
||||||
</el-table-column>
|
|
||||||
</el-table>
|
|
||||||
</div>
|
|
||||||
<div class="fenye" :style="{ top: tableHeight + 'px' }">
|
|
||||||
<el-pagination
|
|
||||||
class="pagination"
|
|
||||||
@size-change="handleSizeChange"
|
|
||||||
@current-change="handleCurrentChange"
|
|
||||||
:current-page="listQuery.current"
|
|
||||||
:page-sizes="[10, 20, 50, 100]"
|
|
||||||
:page-size="listQuery.size"
|
|
||||||
layout="total, sizes, prev, pager, next, jumper"
|
|
||||||
:total="total"
|
|
||||||
></el-pagination>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<template #footer>
|
|
||||||
<div class="dialog-footer">
|
|
||||||
<el-button @click="closed">取消</el-button>
|
|
||||||
<el-button type="primary" @click="onComfirm">确认</el-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-dialog>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script setup>
|
|
||||||
import { defineProps, ref, onMounted } from "vue";
|
|
||||||
import { qcckGet } from "@/api/qcckApi.js";
|
|
||||||
const props = defineProps({
|
|
||||||
modelValue: {
|
|
||||||
type: Boolean,
|
|
||||||
required: true
|
|
||||||
},
|
|
||||||
dic: {
|
|
||||||
type: Object,
|
|
||||||
default: () => {}
|
|
||||||
},
|
|
||||||
bqDl: {
|
|
||||||
type: String,
|
|
||||||
default: "01"
|
|
||||||
},
|
|
||||||
bqLx: {
|
|
||||||
type: String,
|
|
||||||
default: "01"
|
|
||||||
},
|
|
||||||
titleValue: {
|
|
||||||
type: String,
|
|
||||||
default: "选择大类"
|
|
||||||
},
|
|
||||||
LeaderType: {
|
|
||||||
type: String,
|
|
||||||
default: ""
|
|
||||||
},
|
|
||||||
//是否单选
|
|
||||||
Single: {
|
|
||||||
type: Boolean,
|
|
||||||
default: true
|
|
||||||
},
|
|
||||||
roleIds: {
|
|
||||||
type: Array,
|
|
||||||
default: []
|
|
||||||
}
|
|
||||||
});
|
|
||||||
const total = ref(0);
|
|
||||||
const listQuery = ref({
|
|
||||||
current: 1,
|
|
||||||
size: 20
|
|
||||||
});
|
|
||||||
const loading = ref(false);
|
|
||||||
const tableData = ref([]);
|
|
||||||
const emits = defineEmits(["update:modelValue", "chooseDate"]);
|
|
||||||
onMounted(() => {
|
|
||||||
handleFilter();
|
|
||||||
});
|
|
||||||
const closed = () => {
|
|
||||||
emits("update:modelValue", false);
|
|
||||||
};
|
|
||||||
const reset = () => {
|
|
||||||
listQuery.value = { current: 1, size: 20 };
|
|
||||||
getDataList();
|
|
||||||
};
|
|
||||||
|
|
||||||
const keyid = (row) => {
|
|
||||||
return row.id;
|
|
||||||
};
|
|
||||||
// 为用户分配角色
|
|
||||||
const onComfirm = () => {
|
|
||||||
const userList = multipleSelectionUser.value;
|
|
||||||
let list = [];
|
|
||||||
let listId = [];
|
|
||||||
userList.forEach((val) => {
|
|
||||||
if (listId.indexOf(val.id) == -1) {
|
|
||||||
list.push(val);
|
|
||||||
listId.push(val.id);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
emits("chooseDate", list);
|
|
||||||
closed();
|
|
||||||
};
|
|
||||||
/**
|
|
||||||
* pageSize 改变触发
|
|
||||||
*/
|
|
||||||
const handleSizeChange = (currentSize) => {
|
|
||||||
listQuery.value.size = currentSize;
|
|
||||||
getDataList();
|
|
||||||
};
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 页码改变触发
|
|
||||||
*/
|
|
||||||
const handleCurrentChange = (currentPage) => {
|
|
||||||
listQuery.value.current = currentPage;
|
|
||||||
getDataList();
|
|
||||||
};
|
|
||||||
|
|
||||||
// 查询标签组合列表
|
|
||||||
const getDataList = () => {
|
|
||||||
const data = listQuery.value;
|
|
||||||
loading.value = true;
|
|
||||||
qcckGet(data, "/mosty-gsxt/tbGsxtJwry/selectPage").then((res) => {
|
|
||||||
tableData.value = res?.records;
|
|
||||||
total.value = Number(res.total);
|
|
||||||
loading.value = false;
|
|
||||||
multipleUser();
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
//列表回显
|
|
||||||
function multipleUser() {
|
|
||||||
tableData.value.forEach((item) => {
|
|
||||||
if (props.roleIds.some((id) => id == item.id)) {
|
|
||||||
multipleUserRef.value.toggleRowSelection(item, true);
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleFilter = () => {
|
|
||||||
listQuery.value.current = 1;
|
|
||||||
getDataList();
|
|
||||||
};
|
|
||||||
|
|
||||||
const multipleUserRef = ref(null);
|
|
||||||
const multipleSelectionUser = ref([]);
|
|
||||||
const handleSelectionChange = (val) => {
|
|
||||||
if (props.Single) {
|
|
||||||
if (val.length > 1) {
|
|
||||||
let del_row = val.shift();
|
|
||||||
multipleUserRef.value.toggleRowSelection(del_row, false);
|
|
||||||
}
|
|
||||||
multipleSelectionUser.value = val;
|
|
||||||
} else {
|
|
||||||
multipleSelectionUser.value = val;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
|
||||||
@import "@/assets/css/layout.scss";
|
|
||||||
@import "@/assets/css/element-plus.scss";
|
|
||||||
</style>
|
|
||||||
<style>
|
|
||||||
.tabBoxRadio .el-checkbox__inner {
|
|
||||||
border-radius: 50% !important;
|
|
||||||
}
|
|
||||||
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
:deep(.el-dialog) {
|
|
||||||
background: #fff !important;
|
|
||||||
border-radius: 8px !important;
|
|
||||||
/* 其他样式 */
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
@ -1,469 +1,203 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="intelligence-management">
|
<div>
|
||||||
<!-- 左边 -->
|
<div class="titleBox">
|
||||||
<div class="left-panel">
|
<PageTitle title="人力情报信息采集流转">
|
||||||
<div class="pl80">
|
<el-button type="primary" @click="addEdit('add', '')">
|
||||||
<el-tabs
|
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
|
||||||
v-model="activeName"
|
<span style="vertical-align: middle">导出</span>
|
||||||
class="demo-tabs"
|
</el-button>
|
||||||
@tab-click="handleClick"
|
<el-button type="danger" @click="addEdit('add', '')">
|
||||||
>
|
<el-icon style="vertical-align: middle"><Dete /></el-icon>
|
||||||
<el-tab-pane label="线索库" name="one"></el-tab-pane>
|
<span style="vertical-align: middle">批量删除</span>
|
||||||
<el-tab-pane label="人员库" name="two"></el-tab-pane>
|
</el-button>
|
||||||
</el-tabs>
|
</PageTitle>
|
||||||
</div>
|
|
||||||
<div class="search-box">
|
|
||||||
<el-input
|
|
||||||
v-model="searchQuery"
|
|
||||||
placeholder="请输入线索标题"
|
|
||||||
suffix-icon="Search"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="flex mt10 just-center">
|
|
||||||
<el-button size="small" type="primary">上报线索</el-button>
|
|
||||||
<el-button size="small" type="primary" @click="addEdit('add',null)">新增线索</el-button>
|
|
||||||
<el-button size="small" type="primary">查询</el-button>
|
|
||||||
<el-button size="small">重置</el-button>
|
|
||||||
</div>
|
|
||||||
<div class="flex flex-warp">
|
|
||||||
<span
|
|
||||||
style="color: #0386fb"
|
|
||||||
class="f12 ml10 mt4"
|
|
||||||
v-for="(it, idex) in list.leftCoutn"
|
|
||||||
:key="idex"
|
|
||||||
>{{ it.label }}({{ it.value }})</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<div class="person-list">
|
|
||||||
<div v-for="(item, index) in personList" :key="index" class="clue-item">
|
|
||||||
<div class="clue-tag" v-if="item.tag">{{ item.tag }}</div>
|
|
||||||
<span class="clue-status">处置</span>
|
|
||||||
<div class="clue-content flex align-center">
|
|
||||||
<img class="mr10" src="@/assets/images/icon100.png" alt="">
|
|
||||||
<div class="clue-info">
|
|
||||||
<div class="clue-header">*****线索</div>
|
|
||||||
<div>编号：{{ item.number }}</div>
|
|
||||||
<div>来源：{{ item.source }}</div>
|
|
||||||
<div>涉及人员数量：{{ item.personCount }}</div>
|
|
||||||
<div>指向地点：{{ item.location }}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<!-- 右边 -->
|
<!-- 搜索 -->
|
||||||
<div class="right-panel">
|
<div ref="searchBox">
|
||||||
<div class="flex just-between align-center">
|
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"/>
|
||||||
<h2 class="title" style="color: #333">xxxx线索详情</h2>
|
|
||||||
<el-button type="primary" size="small">收藏</el-button>
|
|
||||||
</div>
|
|
||||||
<div style="width: 100%">
|
|
||||||
<el-descriptions :column="2" border>
|
|
||||||
<el-descriptions-item :width="260" label="线索标题"
|
|
||||||
>*****线索</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="线索编号"
|
|
||||||
>123213113212131312</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="线索类型"
|
|
||||||
>*****线索</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="线索来源"
|
|
||||||
>123213113212131312</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="开始时间"
|
|
||||||
>2020.04.12</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="截止时间"
|
|
||||||
>2020.04.19</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="上报单位"
|
|
||||||
>*****线索</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="指向地点"
|
|
||||||
>123213113212131312</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="上报时间"
|
|
||||||
>*****线索</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="处置状态"
|
|
||||||
>123213113212131312</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="群体状态"
|
|
||||||
>2020.04.12</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="群体名称"
|
|
||||||
>2020.04.19</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="线索标签大类"
|
|
||||||
>*****线索</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="线索标签细类"
|
|
||||||
>123213113212131312</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="所属专题"
|
|
||||||
>*****线索</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="市内外"
|
|
||||||
>123213113212131312</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="是否涉及外地"
|
|
||||||
>2020.04.12</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="具体部位"
|
|
||||||
>2020.04.19</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="指向时间类型"
|
|
||||||
>*****线索</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="指向时间备注"
|
|
||||||
>123213113212131312</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="表现形式"
|
|
||||||
>*****线索</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="涉事类型"
|
|
||||||
>123213113212131312</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="获取手段"
|
|
||||||
>2020.04.12</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="线索备注"
|
|
||||||
>2020.04.19</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="线索内容" :span="2"
|
|
||||||
>张三，身份证号:123，2025年，在林某...，涉</el-descriptions-item
|
|
||||||
>
|
|
||||||
</el-descriptions>
|
|
||||||
<el-descriptions :column="5" border>
|
|
||||||
<el-descriptions-item :width="260" label="附件"
|
|
||||||
>3.xls</el-descriptions-item
|
|
||||||
>
|
|
||||||
<el-descriptions-item label="涉及地">林芝</el-descriptions-item>
|
|
||||||
<el-descriptions-item label="申请人">林芝</el-descriptions-item>
|
|
||||||
<el-descriptions-item label="审核人">林芝</el-descriptions-item>
|
|
||||||
<el-descriptions-item label="审批人">林芝</el-descriptions-item>
|
|
||||||
</el-descriptions>
|
|
||||||
</div>
|
|
||||||
<div class="flex mt10 just-center">
|
|
||||||
<el-button size="large" type="primary">核查单</el-button>
|
|
||||||
<el-button size="large" type="primary">验收</el-button>
|
|
||||||
</div>
|
|
||||||
<div class="flex align-center">
|
|
||||||
<h2 class="title" style="color: #333">******线索关联人员信息</h2>
|
|
||||||
<span
|
|
||||||
style="color: #0386fb"
|
|
||||||
class="f12 ml10"
|
|
||||||
v-for="(it, idex) in list.countList"
|
|
||||||
:key="idex"
|
|
||||||
>{{ it.label }}({{ it.value }})、</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<div style="width: 100%">
|
|
||||||
<Search
|
|
||||||
:searchArr="searchConfiger"
|
|
||||||
@submit="onSearch"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
>
|
|
||||||
<el-button type="primary">指派</el-button>
|
|
||||||
<el-button type="primary">导出</el-button>
|
|
||||||
</Search>
|
|
||||||
<MyTable
|
|
||||||
:tableData="pageData.tableData"
|
|
||||||
:tableColumn="pageData.tableColumn"
|
|
||||||
:tableHeight="pageData.tableHeight"
|
|
||||||
:key="pageData.keyCount"
|
|
||||||
:tableConfiger="pageData.tableConfiger"
|
|
||||||
:controlsWidth="pageData.controlsWidth"
|
|
||||||
@chooseData="chooseData"
|
|
||||||
>
|
|
||||||
<!-- 操作 -->
|
|
||||||
<template #controls="{ row }">
|
|
||||||
<el-button size="small">查看档案</el-button>
|
|
||||||
<el-button size="small">编辑</el-button>
|
|
||||||
<el-button size="small" type="danger">删除</el-button>
|
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
</div>
|
|
||||||
<div class="flex mt10 just-center">
|
|
||||||
<el-button size="large" type="primary">保存</el-button>
|
|
||||||
<el-button size="large" type="primary">采纳</el-button>
|
|
||||||
<el-button size="large" type="primary">处置</el-button>
|
|
||||||
<el-button size="large">取消</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<!-- 表格 -->
|
||||||
|
<div class="tabBox">
|
||||||
|
<MyTable
|
||||||
|
:tableData="pageData.tableData"
|
||||||
|
:tableColumn="pageData.tableColumn"
|
||||||
|
:tableHeight="pageData.tableHeight"
|
||||||
|
:key="pageData.keyCount"
|
||||||
|
:tableConfiger="pageData.tableConfiger"
|
||||||
|
:controlsWidth="pageData.controlsWidth"
|
||||||
|
@chooseData="chooseData">
|
||||||
|
|
||||||
|
<template #shzt="{row}">
|
||||||
|
<span>采纳（将这条信息推送到）</span>
|
||||||
|
<span>退回！</span>
|
||||||
|
</template>
|
||||||
|
<!-- 操作 -->
|
||||||
|
<template #controls="{ row }">
|
||||||
|
<el-link size="small" type="primary" @click="addEdit('detail', row)">详情</el-link>
|
||||||
|
<el-link size="small" type="danger" @click="deleteRow(row)">删除</el-link>
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
|
<Pages
|
||||||
|
@changeNo="changeNo"
|
||||||
|
@changeSize="changeSize"
|
||||||
|
:tableHeight="pageData.tableHeight"
|
||||||
|
:pageConfiger="{
|
||||||
|
...pageData.pageConfiger,
|
||||||
|
total: pageData.total
|
||||||
|
}"
|
||||||
|
></Pages>
|
||||||
|
</div>
|
||||||
|
<!-- 新增 -->
|
||||||
|
<AddForm ref="detailDiloag" :dic="{D_BZ_SF,D_BZ_XB,D_GS_XS_LY,D_BZ_SSZT,D_GS_XS_LX ,D_GS_XS_QTLX}" />
|
||||||
</div>
|
</div>
|
||||||
<!-- 新增 -->
|
|
||||||
<AddForm ref="detailDiloag" ></AddForm>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import AddForm from "./components/addForm.vue";
|
import PageTitle from "@/components/aboutTable/PageTitle.vue";
|
||||||
import Search from "@/components/aboutTable/Search.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
import { ref, reactive } from "vue";
|
import Pages from "@/components/aboutTable/Pages.vue";
|
||||||
|
import Search from "@/components/aboutTable/Search.vue";
|
||||||
|
import AddForm from "./components/addForm.vue";
|
||||||
|
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
|
||||||
|
import { reactive, ref, onMounted, getCurrentInstance, nextTick } from "vue";
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const {D_GS_XS_LY, D_BZ_SSZT,D_BZ_SF,D_GS_XS_LX ,D_GS_XS_QTLX,D_BZ_XB} = proxy.$dict("D_GS_XS_LY","D_BZ_SSZT","D_BZ_SF","D_GS_XS_LX","D_GS_XS_QTLX","D_BZ_XB"); //获取字典数据
|
||||||
const detailDiloag = ref();
|
const detailDiloag = ref();
|
||||||
const list = reactive({
|
const searchBox = ref(); //搜索框
|
||||||
leftCoutn: [
|
|
||||||
{ label: "总数", value: 100 },
|
|
||||||
{ label: "下发总数", value: 100 },
|
|
||||||
{ label: "已处置数", value: 10 },
|
|
||||||
{ label: "收藏", value: 100 },
|
|
||||||
{ label: "已反馈数量", value: 100 },
|
|
||||||
{ label: "未反馈数量", value: 100 },
|
|
||||||
{ label: "未处置数量", value: 100 }
|
|
||||||
],
|
|
||||||
countList: [
|
|
||||||
{ label: "全部", value: 100 },
|
|
||||||
{ label: "已稳控", value: 100 },
|
|
||||||
{ label: "处置中", value: 10 },
|
|
||||||
{ label: "非本地人", value: 100 },
|
|
||||||
{ label: "未开始", value: 100 },
|
|
||||||
{ label: "其他人", value: 100 }
|
|
||||||
]
|
|
||||||
});
|
|
||||||
|
|
||||||
const searchQuery = ref(""); // 搜索关键词
|
|
||||||
const searchConfiger = ref([
|
const searchConfiger = ref([
|
||||||
{
|
{ label: "线索名称", prop: 'clueTitle', placeholder: "请输入线索名称", showType: "input" },
|
||||||
label: "姓名",
|
{ label: "语义关键字", prop: 'semanticKeywords', placeholder: "请输入语义关键字", showType: "input" },
|
||||||
prop: "name",
|
{ label: "线索类型", prop: 'clueType', placeholder: "请选择线索类型", showType: "select" },
|
||||||
placeholder: "请输入姓名",
|
{ label: "线索来源", prop: 'clueSource', placeholder: "请选择线索来源", showType: "select" },
|
||||||
showType: "input"
|
{ label: "线索状态", prop: 'xszt', placeholder: "请选择线索状态", showType: "select" },
|
||||||
},
|
{ label: "处置状态", prop: 'czzt', placeholder: "请选择处置状态", showType: "select" },
|
||||||
{
|
{ label: "开始时间", prop: 'startTime', placeholder: "请选择开始时间", showType: "date" },
|
||||||
label: "身份证号",
|
{ label: "结束时间", prop: 'endTime', placeholder: "请选择结束时间", showType: "date" },
|
||||||
prop: "sfzh",
|
{ label: "指向地点", prop: 'targetLocation', placeholder: "请输入指向地点", showType: "input" },
|
||||||
placeholder: "请输入身份证号",
|
|
||||||
showType: "input"
|
|
||||||
}
|
|
||||||
]);
|
]);
|
||||||
|
|
||||||
const pageData = reactive({
|
const pageData = reactive({
|
||||||
tableData: [
|
tableData: [
|
||||||
{
|
{
|
||||||
name: "张三",
|
clueNo: "XS20240101001",
|
||||||
xb: "男",
|
clueTitle: "可疑人员活动线索",
|
||||||
sfzh: "510154545454544454",
|
clueType: "人员线索",
|
||||||
sjh: "12345678900",
|
clueSource: "群众举报",
|
||||||
jcbm: "xx公安局",
|
startTime: "2024-01-01 08:00:00",
|
||||||
zt: "已稳控"
|
endTime: "2024-01-01 18:00:00",
|
||||||
|
targetLocation: "某市某区某街道",
|
||||||
|
clueContent: "发现多名可疑人员在该区域频繁出入，疑似从事非法活动。",
|
||||||
|
attachment: "report.pdf"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "张三",
|
clueNo: "XS20240101002",
|
||||||
xb: "男",
|
clueTitle: "涉毒交易线索",
|
||||||
sfzh: "510154545454544454",
|
clueType: "违法犯罪线索",
|
||||||
sjh: "12345678900",
|
clueSource: "技术侦查",
|
||||||
jcbm: "xx公安局",
|
startTime: "2024-01-02 10:00:00",
|
||||||
zt: "已稳控"
|
endTime: "2024-01-02 16:00:00",
|
||||||
|
targetLocation: "某市某区某小区",
|
||||||
|
clueContent: "监控发现多次可疑交易活动，疑似涉及违禁物品。",
|
||||||
|
attachment: "evidence.docx"
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "张三",
|
clueNo: "XS20240101003",
|
||||||
xb: "男",
|
clueTitle: "非法聚集线索",
|
||||||
sfzh: "510154545454544454",
|
clueType: "群体性事件",
|
||||||
sjh: "12345678900",
|
clueSource: "网络监控",
|
||||||
jcbm: "xx公安局",
|
startTime: "2024-01-03 14:00:00",
|
||||||
zt: "已稳控"
|
endTime: "2024-01-03 22:00:00",
|
||||||
},
|
targetLocation: "某市某广场",
|
||||||
{
|
clueContent: "网络平台发现有组织策划非法聚集活动的信息。",
|
||||||
name: "张三",
|
attachment: "online_evidence.zip"
|
||||||
xb: "男",
|
|
||||||
sfzh: "510154545454544454",
|
|
||||||
sjh: "12345678900",
|
|
||||||
jcbm: "xx公安局",
|
|
||||||
zt: "已稳控"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
name: "张三",
|
|
||||||
xb: "男",
|
|
||||||
sfzh: "510154545454544454",
|
|
||||||
sjh: "12345678900",
|
|
||||||
jcbm: "xx公安局",
|
|
||||||
zt: "已稳控"
|
|
||||||
}
|
}
|
||||||
], //表格数据
|
],
|
||||||
keyCount: 0,
|
keyCount: 0,
|
||||||
tableConfiger: {
|
tableConfiger: {
|
||||||
rowHieght: 61,
|
rowHieght: 61,
|
||||||
showSelectType: "checkBox",
|
showSelectType: "checkBox",
|
||||||
loading: false
|
loading: false
|
||||||
},
|
},
|
||||||
tableHeight: 300,
|
|
||||||
total: 0,
|
total: 0,
|
||||||
pageConfiger: {
|
pageConfiger: {
|
||||||
pageSize: 20,
|
pageSize: 20,
|
||||||
pageCurrent: 1
|
pageCurrent: 1
|
||||||
}, //分页
|
},
|
||||||
controlsWidth: 250, //操作栏宽度
|
controlsWidth: 220,
|
||||||
tableColumn: [
|
tableColumn: [
|
||||||
{ label: "姓名", prop: "name" },
|
{ label: "线索编号", prop: "clueNo" },
|
||||||
{ label: "性别", prop: "xb" },
|
{ label: "线索名称", prop: "clueTitle" },
|
||||||
{ label: "身份证号", prop: "sfzh" },
|
{ label: "线索类型", prop: "clueType" },
|
||||||
{ label: "手机号", prop: "sjh" },
|
{ label: "线索来源", prop: "clueSource" },
|
||||||
{ label: "检查部门", prop: "jcbm" },
|
{ label: "开始时间", prop: "startTime" },
|
||||||
{ label: "状态", prop: "zt" }
|
{ label: "结束时间", prop: "endTime" },
|
||||||
|
{ label: "指向地点", prop: "targetLocation" },
|
||||||
|
{ label: "线索内容", prop: "clueContent", width: 200 },
|
||||||
|
{ label: "附件", prop: "attachment", solt: true },
|
||||||
]
|
]
|
||||||
});
|
});
|
||||||
|
|
||||||
// 选中的人员
|
const queryFrom = ref({});
|
||||||
const selectedPerson = ref(null);
|
|
||||||
|
|
||||||
// 搜所
|
onMounted(() => {
|
||||||
const onSearch = (data) => {
|
getList()
|
||||||
console.log(data);
|
tabHeightFn();
|
||||||
};
|
});
|
||||||
// 模拟人员列表数据
|
|
||||||
const personList = ref([
|
|
||||||
{
|
|
||||||
number: "12345854",
|
|
||||||
title: "*****线索",
|
|
||||||
source: "*****",
|
|
||||||
personCount: "涉及人员数量",
|
|
||||||
location: "指向地点",
|
|
||||||
tag: "待签收",
|
|
||||||
status: "处置"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
number: "12345854",
|
|
||||||
title: "*****线索",
|
|
||||||
source: "*****",
|
|
||||||
personCount: "涉及人员数量",
|
|
||||||
location: "指向地点",
|
|
||||||
status: "处置",
|
|
||||||
tag: "待签收",
|
|
||||||
}
|
|
||||||
// 更多人员数据...
|
|
||||||
]);
|
|
||||||
|
|
||||||
// 模拟相关人员数据
|
//选择类型
|
||||||
const relatedPersons = ref([
|
const handleType = (val) => {
|
||||||
{
|
pageData.keyCount++;
|
||||||
name: "李四",
|
pageData.pageConfiger.pageCurrent = 1;
|
||||||
relation: "朋友",
|
getList()
|
||||||
phone: "13900139000",
|
}
|
||||||
status: "正常"
|
// 搜索
|
||||||
}
|
const onSearch = (val) =>{
|
||||||
// 更多相关人员数据...
|
queryFrom.value = {...val}
|
||||||
]);
|
pageData.pageConfiger.pageCurrent = 1;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
|
const changeNo = (val) =>{
|
||||||
|
pageData.pageConfiger.pageNum = val;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
const changeSize = (val) =>{
|
||||||
|
pageData.pageConfiger.pageSize = val;
|
||||||
|
getList()
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取列表
|
||||||
|
const getList = (val) =>{
|
||||||
|
// pageData.tableConfiger.loading = true;
|
||||||
|
let data = { ...pageData.pageConfiger, ...queryFrom.value };
|
||||||
|
// let url = '/mosty-lzcj/tbDwMbkf/queryList';
|
||||||
|
// qcckPost(data,url).then(res=>{
|
||||||
|
// pageData.tableData = res.records || [];
|
||||||
|
// pageData.total = res.total;
|
||||||
|
// pageData.tableConfiger.loading = false;
|
||||||
|
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
|
||||||
|
}
|
||||||
|
|
||||||
// 详情
|
// 详情
|
||||||
const addEdit = (type, row) => {
|
const addEdit = (type, row) => {
|
||||||
detailDiloag.value.init(type, row);
|
nextTick(()=>{
|
||||||
|
detailDiloag.value.init(type, row);
|
||||||
|
})
|
||||||
};
|
};
|
||||||
|
|
||||||
// 选择人员
|
// 表格高度计算
|
||||||
const selectPerson = (person) => {
|
const tabHeightFn = () => {
|
||||||
selectedPerson.value = person;
|
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
|
||||||
|
window.onresize = function () {
|
||||||
|
tabHeightFn();
|
||||||
|
};
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style>
|
||||||
.intelligence-management {
|
.el-loading-mask {
|
||||||
margin-top: 10px;
|
background: rgba(0, 0, 0, 0.5) !important;
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
position: relative;
|
|
||||||
.left-panel {
|
|
||||||
width: 300px;
|
|
||||||
border-right: 1px solid #dcdfe6;
|
|
||||||
background-color: #fff;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
height: 100%;
|
|
||||||
float: left;
|
|
||||||
|
|
||||||
.search-box {
|
|
||||||
padding: 16px;
|
|
||||||
border-bottom: 1px solid #dcdfe6;
|
|
||||||
}
|
|
||||||
|
|
||||||
.person-list {
|
|
||||||
flex: 1;
|
|
||||||
overflow-y: auto;
|
|
||||||
padding: 10px;
|
|
||||||
.clue-item {
|
|
||||||
background: #f5f7fa;
|
|
||||||
border-radius: 4px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
padding: 10px;
|
|
||||||
cursor: pointer;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
.clue-status {
|
|
||||||
position: absolute;
|
|
||||||
top: 50%;
|
|
||||||
transform: translateY(-50%);
|
|
||||||
right: 10px;
|
|
||||||
color: #fff;
|
|
||||||
background: #409eff;
|
|
||||||
padding: 2px 8px;
|
|
||||||
border-radius: 2px;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
.clue-tag {
|
|
||||||
position: absolute;
|
|
||||||
top: 1px;
|
|
||||||
left: -27px;
|
|
||||||
background: #f56c6c;
|
|
||||||
color: #fff;
|
|
||||||
padding: 10px 30px;
|
|
||||||
border-radius: 2px;
|
|
||||||
font-size: 12px;
|
|
||||||
transform: rotate(-38deg);
|
|
||||||
}
|
|
||||||
|
|
||||||
.clue-header {
|
|
||||||
color: #333;
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.clue-info {
|
|
||||||
font-size: 12px;
|
|
||||||
color: #666;
|
|
||||||
line-height: 1.8;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
background: #e6f1fc;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.right-panel {
|
|
||||||
width: calc(100% - 310px);
|
|
||||||
height: 100%;
|
|
||||||
float: left;
|
|
||||||
margin-left: 10px;
|
|
||||||
padding: 10px 20px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background: #fff;
|
|
||||||
border-radius: 4px;
|
|
||||||
overflow: hidden;
|
|
||||||
overflow-y: auto;
|
|
||||||
.title {
|
|
||||||
position: relative;
|
|
||||||
&::after {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
bottom: -10px;
|
|
||||||
left: 0;
|
|
||||||
width: 78px;
|
|
||||||
height: 4px;
|
|
||||||
background: linear-gradient(
|
|
||||||
90deg,
|
|
||||||
#3596f9 0%,
|
|
||||||
rgba(53, 150, 249, 0) 100%
|
|
||||||
);
|
|
||||||
border-radius: 4px 4px 4px 4px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .el-tabs__nav-wrap::after {
|
|
||||||
background: #e9e9e9;
|
|
||||||
width: 58%;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|||||||
@ -30,16 +30,13 @@ const formData = ref([
|
|||||||
{ label: "要素名称", prop: "sfbqxl", type: "input", options: [] },
|
{ label: "要素名称", prop: "sfbqxl", type: "input", options: [] },
|
||||||
{ label: "要素描述", prop: "ysms", type: "textarea", width: "100%" },
|
{ label: "要素描述", prop: "ysms", type: "textarea", width: "100%" },
|
||||||
]);
|
]);
|
||||||
const listQuery = ref({
|
|
||||||
sfbqdj: []
|
|
||||||
}); //表单
|
|
||||||
const loading = ref(false);
|
|
||||||
const elform = ref();
|
|
||||||
const title = ref("");
|
|
||||||
const rules = reactive({
|
const rules = reactive({
|
||||||
bqmc: [{ required: true, message: "请输入标签名称", trigger: "blur" }]
|
bqmc: [{ required: true, message: "请输入标签名称", trigger: "blur" }]
|
||||||
});
|
});
|
||||||
const editpeo = ref();
|
const listQuery = ref({}); //表单
|
||||||
|
const loading = ref(false);
|
||||||
|
const elform = ref();
|
||||||
|
const title = ref("");
|
||||||
onMounted(() => {});
|
onMounted(() => {});
|
||||||
// 初始化数据
|
// 初始化数据
|
||||||
const init = (type, row,) => {
|
const init = (type, row,) => {
|
||||||
|
|||||||
@ -396,11 +396,18 @@ const toGoPage = (row) => {
|
|||||||
top: 14px;
|
top: 14px;
|
||||||
right: 14px;
|
right: 14px;
|
||||||
left: 14px;
|
left: 14px;
|
||||||
|
|
||||||
// overflow-y: scroll;
|
|
||||||
width: calc(100% - 28px);
|
width: calc(100% - 28px);
|
||||||
}
|
}
|
||||||
::v-deep .el-dialog {
|
|
||||||
--el-dialog-bg-color: #001238;
|
|
||||||
|
::v-deep .el-card__body{
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
::v-deep .el-card {
|
||||||
|
border: 1px solid #e9e9e9;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
.fenye{
|
||||||
|
background: #fff;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user