lcw
This commit is contained in:
61
src/api/zdr.js
Normal file
61
src/api/zdr.js
Normal file
@ -0,0 +1,61 @@
|
|||||||
|
import request from "@/utils/request";
|
||||||
|
const api = "/mosty-api/mosty-gsxt";
|
||||||
|
// 群体性质新增
|
||||||
|
export const tbGsxtZdrySelectVoById = (params) => {
|
||||||
|
return request({
|
||||||
|
url: api + `/tbGsxtZdry/getZyryById`,
|
||||||
|
method: "get",
|
||||||
|
params
|
||||||
|
});
|
||||||
|
}
|
||||||
|
// 修改
|
||||||
|
export const tbGsxtZdryUpdate = (data) => {
|
||||||
|
return request({
|
||||||
|
url: api + `/tbGsxtZdry/update`,
|
||||||
|
method: "post",
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 重点人员车辆信息-（新增）
|
||||||
|
export const tbZdryClxxAdd = (data) => {
|
||||||
|
return request({
|
||||||
|
url: api + `/tbZdry/clxx/add`,
|
||||||
|
method: "post",
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 重点人员车辆信息-（批量新增）
|
||||||
|
export const tbZdryClxxBatchAdd = (data) => {
|
||||||
|
return request({
|
||||||
|
url: api + `/tbZdry/clxx/batchAdd`,
|
||||||
|
method: "post",
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
// 重点人员车辆信息-（删除）
|
||||||
|
export const tbZdryClxxDelete = (data) => {
|
||||||
|
return request({
|
||||||
|
url: api + `/tbZdry/clxx/delete`,
|
||||||
|
method: "post",
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
// 重点人员车辆信息-（查询）
|
||||||
|
export const tbZdryClxxSelectPage = (params) => {
|
||||||
|
return request({
|
||||||
|
url: api + `/tbZdry/clxx/selectPage`,
|
||||||
|
method: "get",
|
||||||
|
params,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
// 重点人员车辆信息-（修改）
|
||||||
|
export const tbZdryClxxUpdate = (data) => {
|
||||||
|
return request({
|
||||||
|
url: api + `/tbZdry/clxx/update`,
|
||||||
|
method: "post",
|
||||||
|
data,
|
||||||
|
});
|
||||||
|
}
|
||||||
@ -173,15 +173,26 @@ const getListData = () => {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
//列表回显
|
//列表回显 - 优化版，确保已选择数据正确回显
|
||||||
function multipleUser() {
|
function multipleUser() {
|
||||||
|
if (!multipleUserRef.value || !tableData.value || tableData.value.length === 0) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 先清除所有选中状态
|
||||||
tableData.value.forEach((item) => {
|
tableData.value.forEach((item) => {
|
||||||
multipleUserRef.value.toggleRowSelection(item, false);
|
multipleUserRef.value.toggleRowSelection(item, false);
|
||||||
|
});
|
||||||
|
|
||||||
|
// 再根据roleIds重新设置选中状态
|
||||||
|
if (props.roleIds && Array.isArray(props.roleIds) && props.roleIds.length > 0) {
|
||||||
|
tableData.value.forEach((item) => {
|
||||||
if (props.roleIds.some((id) => id == item.id)) {
|
if (props.roleIds.some((id) => id == item.id)) {
|
||||||
multipleUserRef.value.toggleRowSelection(item, true);
|
multipleUserRef.value.toggleRowSelection(item, true);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
const handleFilter = () => {
|
const handleFilter = () => {
|
||||||
listQuery.value.pageCurrent = 1;
|
listQuery.value.pageCurrent = 1;
|
||||||
@ -200,13 +211,28 @@ const handleSelectionChange = (val) => {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// 监听弹窗打开状态，打开时重新加载数据
|
||||||
watch(
|
watch(
|
||||||
() => props.modelValue,
|
() => props.modelValue,
|
||||||
(val) => {
|
(val) => {
|
||||||
if (val) handleFilter();
|
if (val) {
|
||||||
|
handleFilter();
|
||||||
|
}
|
||||||
},
|
},
|
||||||
{ immediate: true }
|
{ immediate: true }
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// 监听roleIds变化，确保数据回显正确
|
||||||
|
watch(
|
||||||
|
() => props.roleIds,
|
||||||
|
(newRoleIds) => {
|
||||||
|
// 使用setTimeout确保在表格数据加载完成后再进行选择
|
||||||
|
setTimeout(() => {
|
||||||
|
multipleUser();
|
||||||
|
}, 100);
|
||||||
|
},
|
||||||
|
{ deep: true }
|
||||||
|
);
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
|||||||
@ -78,9 +78,8 @@ const init = (type, row) => {
|
|||||||
} else {
|
} else {
|
||||||
portrayal.value = true
|
portrayal.value = true
|
||||||
if (type == 'edit') {
|
if (type == 'edit') {
|
||||||
disabled.value = false
|
|
||||||
showBut.value = true
|
showBut.value = true
|
||||||
|
disabled.value = false
|
||||||
title.value = '修改'
|
title.value = '修改'
|
||||||
} else {
|
} else {
|
||||||
disabled.value = true
|
disabled.value = true
|
||||||
|
|||||||
@ -0,0 +1,235 @@
|
|||||||
|
<template>
|
||||||
|
<el-dialog :title="titleValue" width="800px" :model-value="modelValue" append-to-body @close="closed">
|
||||||
|
<el-form ref="historyForm" style="max-width: 600px" :model="ruleForm" :rules="rules" label-width="auto">
|
||||||
|
<el-form-item label="车牌号" prop="cph">
|
||||||
|
<el-input v-model="ruleForm.cph" placeholder="请输入车牌号" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="车辆识别码" prop="clsbm">
|
||||||
|
<el-input v-model="ruleForm.clsbm" placeholder="请输入车辆识别码" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="车辆型号" prop="cllx">
|
||||||
|
<el-select v-model="ruleForm.cllx" placeholder="请选择车辆型号">
|
||||||
|
<el-option :label="item.zdmc" :value="item.dm" v-for="(item,index) in dict.D_BZ_CLLX" :key="index"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="车辆颜色" prop="clys">
|
||||||
|
<el-select v-model="ruleForm.clys" placeholder="请选择车辆颜色">
|
||||||
|
<el-option :label="item.zdmc" :value="item.dm" v-for="(item,index) in dict.D_BZ_CLYS" :key="index"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="车辆品牌" prop="clpp">
|
||||||
|
<el-select v-model="ruleForm.clpp" placeholder="请选择车辆品牌">
|
||||||
|
<el-option :label="item.zdmc" :value="item.dm" v-for="(item,index) in dict.D_BZ_CLPP" :key="index"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<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 { ref, onMounted, reactive, watch, getCurrentInstance } from "vue";
|
||||||
|
import { generateRandom10Digits } from '@/utils/tools'
|
||||||
|
|
||||||
|
const { proxy } = getCurrentInstance()
|
||||||
|
|
||||||
|
const props = defineProps({
|
||||||
|
modelValue: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
titleValue: {
|
||||||
|
type: String,
|
||||||
|
default: "关联车辆"
|
||||||
|
},
|
||||||
|
data: {
|
||||||
|
type: Object,
|
||||||
|
default: () => { }
|
||||||
|
}, dict: {
|
||||||
|
type: Object,
|
||||||
|
default: () => { }
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const emits = defineEmits(["update:modelValue", "comfirm"]);
|
||||||
|
const historyForm = ref(null)
|
||||||
|
const ruleForm = ref({})
|
||||||
|
const rules = reactive({
|
||||||
|
cph: [
|
||||||
|
{ required: true, message: '请输入车牌号', trigger: 'blur' },
|
||||||
|
],
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
const onComfirm = () => {
|
||||||
|
const promes = {...ruleForm.value,
|
||||||
|
id: ruleForm.value.id ? ruleForm.value.id : generateRandom10Digits(),
|
||||||
|
}
|
||||||
|
console.log(promes);
|
||||||
|
|
||||||
|
emits("comfirm", { ...promes });
|
||||||
|
closed()
|
||||||
|
|
||||||
|
}
|
||||||
|
watch(() => props.modelValue, (val) => {
|
||||||
|
ruleForm.value = props.data
|
||||||
|
},{deep: true})
|
||||||
|
|
||||||
|
|
||||||
|
const closed = () => {
|
||||||
|
ruleForm.value = {}
|
||||||
|
emits("update:modelValue", false);
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "@/assets/css/layout.scss";
|
||||||
|
@import "@/assets/css/element-plus.scss";
|
||||||
|
|
||||||
|
.tabBoxRadio .el-checkbox__inner {
|
||||||
|
border-radius: 50% !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabBoxRadio .el-table__header-wrapper .el-checkbox {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-attachment-section {
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-title {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #303133;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
padding-bottom: 5px;
|
||||||
|
border-bottom: 1px solid #ebeef5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-list-container {
|
||||||
|
max-height: 100px;
|
||||||
|
overflow-y: auto;
|
||||||
|
border: 1px solid #ebeef5;
|
||||||
|
border-radius: 4px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 自定义滚动条样式 */
|
||||||
|
.file-list-container::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-list-container::-webkit-scrollbar-track {
|
||||||
|
background: #f1f1f1;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-list-container::-webkit-scrollbar-thumb {
|
||||||
|
background: #c0c4cc;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-list-container::-webkit-scrollbar-thumb:hover {
|
||||||
|
background: #909399;
|
||||||
|
}
|
||||||
|
|
||||||
|
.empty-file-list {
|
||||||
|
padding: 20px;
|
||||||
|
text-align: center;
|
||||||
|
color: #909399;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-list {
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-item {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 8px 10px;
|
||||||
|
margin-bottom: 2px;
|
||||||
|
background-color: #f8f9fa;
|
||||||
|
border-radius: 4px;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-item:hover {
|
||||||
|
background-color: #e6f7ff;
|
||||||
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-info {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 15px;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-name {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #303133;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-size {
|
||||||
|
font-size: 11px;
|
||||||
|
color: #909399;
|
||||||
|
min-width: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-time {
|
||||||
|
font-size: 11px;
|
||||||
|
color: #909399;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-actions {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 5px;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-actions .el-button {
|
||||||
|
padding: 0 5px;
|
||||||
|
margin: 0;
|
||||||
|
color: #606266;
|
||||||
|
transition: color 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-actions .el-button:hover {
|
||||||
|
color: #409eff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.delete-btn:hover {
|
||||||
|
color: #f56c6c !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload-btn-container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.butHandle {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-range-input {
|
||||||
|
color: #000 !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,371 @@
|
|||||||
|
<template>
|
||||||
|
<div class="dialog" v-if="dialogForm">
|
||||||
|
<div class="head_box">
|
||||||
|
<span class="title">{{ title }}重点人管理</span>
|
||||||
|
<div>
|
||||||
|
<el-button type="primary" size="small" v-if="!disabled" :loading="loading" @click="submit">保存</el-button>
|
||||||
|
<el-button size="small" @click="close">关闭</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form_cnt">
|
||||||
|
<FormMessage :disabled="disabled" v-model="listQuery" :formList="formData" labelWidth="100px" ref="elform"
|
||||||
|
:rules="rules"></FormMessage>
|
||||||
|
<div class="ml50 mr50">
|
||||||
|
<span class="mr10">人员标签模型 : </span><el-button type="primary" v-if="!disabled"
|
||||||
|
@click="chooseMarksVisible = true">选择</el-button>
|
||||||
|
</div>
|
||||||
|
<div class="boxlist ml50 mr50">
|
||||||
|
<MyTable :tableData="listQuery.bqList" :tableColumn="tableDate.tableColumn" :key="tableDate.keyCount"
|
||||||
|
:tableConfiger="tableDate.tableConfiger" :controlsWidth="tableDate.controlsWidth">
|
||||||
|
<template #bqLb="{ row }">
|
||||||
|
<DictTag :value="row.bqLb" :tag="false" :options="props.dic.D_GS_BQ_LB" />
|
||||||
|
</template>
|
||||||
|
<template #bqLx="{ row }">
|
||||||
|
<DictTag :value="row.bqLx" :tag="false" :options="props.dic.D_GS_BQ_LX" />
|
||||||
|
</template>
|
||||||
|
<template #bqZl="{ row }">
|
||||||
|
<DictTag :value="row.bqZl" :tag="false" :options="props.dic.D_GS_BQ_ZL" />
|
||||||
|
</template>
|
||||||
|
<template #controls="{ row }">
|
||||||
|
<el-link type="danger" @click="delDictItem(row.bqId)">删除</el-link>
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
|
</div>
|
||||||
|
<!-- 选择审核人 -->
|
||||||
|
<div class="ww100 mt20 ml50 mr50">
|
||||||
|
<el-steps direction="vertical" :active="listQuery.wccz" space="500" finish-status="success">
|
||||||
|
<el-step title="发起申请">
|
||||||
|
<template #description>
|
||||||
|
<div class="flex align-center ww100 mt10 mb20">
|
||||||
|
<el-input v-model="listQuery.sqrXm" readonly class="ww20"></el-input>
|
||||||
|
<el-input v-model="listQuery.sqrSsbmmc" readonly class="ww20 ml10 mr10"></el-input>
|
||||||
|
<span class="f12" style="color: #333333">
|
||||||
|
备注发起人和部门根据登陆人自动填写</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-step>
|
||||||
|
<el-step title="审核确认">
|
||||||
|
<template #description>
|
||||||
|
<div class="flex align-center ww100 mt10 mb20 depBox">
|
||||||
|
<span class="mr4">审核部门 : </span>
|
||||||
|
<MOSTY.Department :isAll="true" @getDepValue="getShdep" v-model="listQuery.shSsbmdm" clearable :placeholder="listQuery.shSsbmmc ? listQuery.shSsbmmc : ''" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-step>
|
||||||
|
<el-step title="审批确认">
|
||||||
|
<template #description>
|
||||||
|
<div class="flex align-center ww100 mt10 mb20 depBox">
|
||||||
|
<span lass="mr4">审批部门 : </span>
|
||||||
|
<MOSTY.Department :isAll="true" @getDepValue="getSPdep" v-model="listQuery.spSsbmdm" clearable :placeholder="listQuery.spSsbmmc ? listQuery.spSsbmmc : ''" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-step>
|
||||||
|
</el-steps>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import * as rule from "@/utils/rules.js";
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import { getItem } from "@/utils/storage";
|
||||||
|
import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
|
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
|
||||||
|
import {
|
||||||
|
ref,
|
||||||
|
defineExpose,
|
||||||
|
reactive,
|
||||||
|
onMounted,
|
||||||
|
defineEmits,
|
||||||
|
getCurrentInstance,
|
||||||
|
watch
|
||||||
|
} from "vue";
|
||||||
|
const emit = defineEmits(["updateDate"]);
|
||||||
|
const props = defineProps({
|
||||||
|
dic: Object
|
||||||
|
});
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const roleIds = ref([]);
|
||||||
|
const chooseMarksVisible = ref(false);
|
||||||
|
const dialogForm = ref(false); //弹窗
|
||||||
|
const pcsList = ref([]);
|
||||||
|
const rules = reactive({
|
||||||
|
ryXm: [{ required: true, message: "请输入姓名", trigger: "blur" }],
|
||||||
|
...rule.identityCardRule({ validator: true },'rySfzh'), //身份证校验
|
||||||
|
...rule.phoneRule({ validator: true }, "ryLxdh"), // 是否必填 是否进行校验,
|
||||||
|
rySfzh: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
|
||||||
|
ryLxdh: [{ required: true, message: "请输入联系电话", trigger: "blur" }],
|
||||||
|
ryXb: [{ required: true, message: "请选择性别", trigger: "change" }],
|
||||||
|
ryMz: [{ required: true, message: "请选择民族", trigger: "change" }],
|
||||||
|
ryCsrq: [{ required: true, message: "请选择出生日期", trigger: "change" }],
|
||||||
|
ryJg: [{ required: true, message: "请选择籍贯", trigger: "change" }],
|
||||||
|
zdrRyjb: [{ required: true, message: "请选择人员级别", trigger: "change" }],
|
||||||
|
zdrYjdj: [{ required: true, message: "请选择预警等级", trigger: "change" }]
|
||||||
|
});
|
||||||
|
const listQuery = ref({}); //表单
|
||||||
|
const formData = ref([]);
|
||||||
|
watch(() => props.dic,(val) => {
|
||||||
|
formData.value = [
|
||||||
|
{ label: "姓名", prop: "ryXm", type: "input" },
|
||||||
|
{
|
||||||
|
label: "性别",
|
||||||
|
prop: "ryXb",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_BZ_XB
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "民族",
|
||||||
|
prop: "ryMz",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_BZ_MZ
|
||||||
|
},
|
||||||
|
{ label: "身份证号", prop: "rySfzh", type: "input" },
|
||||||
|
{ label: "联系电话", prop: "ryLxdh", type: "input" },
|
||||||
|
{ label: "出生日期", prop: "ryCsrq", type: "date" },
|
||||||
|
{
|
||||||
|
label: "籍贯",
|
||||||
|
prop: "ryJg",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_BZ_XZQHDM
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "人员级别",
|
||||||
|
prop: "zdrRyjb",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_GS_ZDR_RYJB
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "预警等级",
|
||||||
|
prop: "zdrYjdj",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_GS_ZDR_YJDJ
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "户籍地区划",
|
||||||
|
prop: "hjdQh",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_BZ_XZQHDM
|
||||||
|
},
|
||||||
|
{ label: "户籍地详址", prop: "hjdXz", type: "input" },
|
||||||
|
{
|
||||||
|
label: "户籍地派出所",
|
||||||
|
prop: "hjdPcsdm",
|
||||||
|
type: "select",
|
||||||
|
options: pcsList
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "现住地区划",
|
||||||
|
prop: "xzdQh",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_BZ_XZQHDM
|
||||||
|
},
|
||||||
|
{ label: "现住地详址", prop: "xzdXz", type: "input" },
|
||||||
|
{
|
||||||
|
label: "现住地派出所",
|
||||||
|
prop: "xzdPcsdm",
|
||||||
|
type: "select",
|
||||||
|
options: pcsList
|
||||||
|
},
|
||||||
|
{ label: "管辖单位", prop: "gxSsbmdm",depMc:'gxSsbmmc', type: "department" },
|
||||||
|
{ label: "诉求单位", prop: "sqSsbmdm",depMc:'sqSsbmmc', type: "department" },
|
||||||
|
{ label: "责任单位", prop: "zrSsbmdm",depMc:'zrSsbmmc', type: "department" },
|
||||||
|
{
|
||||||
|
label: "所属警种",
|
||||||
|
prop: "zdrSsjz",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_GS_BK_SSJZ
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: "涉及警种",
|
||||||
|
prop: "zdrSjjz",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_GS_BK_SSJZ,
|
||||||
|
multiple: true
|
||||||
|
},
|
||||||
|
{ label: "管控民警姓名", prop: "gkMjXm", type: "input" },
|
||||||
|
{ label: "管控民警警号", prop: "gkMjJh", type: "input" },
|
||||||
|
{ label: "管控原因", prop: "zdrLkyy", type: "textarea", width: "100%" },
|
||||||
|
{
|
||||||
|
label: "处置状态",
|
||||||
|
prop: "zdrCzzt",
|
||||||
|
type: "select",
|
||||||
|
options: props.dic.D_GS_ZDR_CZZT
|
||||||
|
},
|
||||||
|
{ label: "入库开始时间", prop: "zdrRkkssj", type: "datetime" },
|
||||||
|
{ label: "入库结束时间", prop: "zdrRkjssj", type: "datetime" }
|
||||||
|
];
|
||||||
|
},
|
||||||
|
{ immediate: true, deep: true }
|
||||||
|
);
|
||||||
|
|
||||||
|
const tableDate = reactive({
|
||||||
|
tableConfiger: {
|
||||||
|
rowHieght: 61,
|
||||||
|
showSelectType: "null",
|
||||||
|
loading: false
|
||||||
|
},
|
||||||
|
controlsWidth: 90, //操作栏宽度
|
||||||
|
keyCount: 0,
|
||||||
|
tableColumn: [
|
||||||
|
{ label: "标签名称", prop: "bqMc" },
|
||||||
|
{ label: "标签代码", prop: "bqDm" },
|
||||||
|
{ label: "标签种类", prop: "bqZl", showSolt: true },
|
||||||
|
{ label: "标签类型", prop: "bqLx", showSolt: true },
|
||||||
|
{ label: "标签类别", prop: "bqLb", showSolt: true }
|
||||||
|
]
|
||||||
|
});
|
||||||
|
const loading = ref(false);
|
||||||
|
const elform = ref();
|
||||||
|
const title = ref("");
|
||||||
|
const showInfo = ref(false);
|
||||||
|
const disabled = ref(false);
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
chooseDep();
|
||||||
|
});
|
||||||
|
|
||||||
|
const chooseDep = () => {
|
||||||
|
qcckPost({ orgLevel: 40 }, "/mosty-base/deptFeign/queryListByDept").then(
|
||||||
|
(res) => {
|
||||||
|
pcsList.value = res.map((item) => {
|
||||||
|
return { zdmc: item.orgName, dm: item.orgCode, value: item.orgCode };
|
||||||
|
});
|
||||||
|
}
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 初始化数据
|
||||||
|
const init = (type, row) => {
|
||||||
|
dialogForm.value = true;
|
||||||
|
title.value = type == "add" ? "新增" : type == "detail" ? "详情" : "编辑";
|
||||||
|
disabled.value = type == "detail" ? true : false;
|
||||||
|
tableDate.tableConfiger.haveControls = type == "detail" ? false : true;
|
||||||
|
if (type == "add") {
|
||||||
|
listQuery.value.sqrXm = getItem("USERNAME");
|
||||||
|
listQuery.value.bkfqrSfzh = getItem("idEntityCard");
|
||||||
|
listQuery.value.sqrSsbmmc = getItem("deptId")[0].deptName;
|
||||||
|
listQuery.value.sqrSsbmdm = getItem("deptId")[0].deptCode;
|
||||||
|
}
|
||||||
|
setTimeout(() => {
|
||||||
|
showInfo.value = true;
|
||||||
|
}, 5);
|
||||||
|
if (row) getDataById(row.id);
|
||||||
|
};
|
||||||
|
// 根据id查询详情
|
||||||
|
const getDataById = (id) => {
|
||||||
|
qcckGet({}, "/mosty-gsxt/tbGsxtZdry/selectVoById/" + id).then((res) => {
|
||||||
|
listQuery.value = res;
|
||||||
|
listQuery.value.zdrSjjz = listQuery.value.zdrSjjz.split(",");
|
||||||
|
tableDate.bqList = res.bqList;
|
||||||
|
listQuery.value.sqrXm = getItem("USERNAME");
|
||||||
|
listQuery.value.bkfqrSfzh = getItem("idEntityCard");
|
||||||
|
listQuery.value.sqrSsbmmc = getItem("deptId")[0].deptName;
|
||||||
|
listQuery.value.sqrSsbmdm = getItem("deptId")[0].deptCode;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 选择标签
|
||||||
|
const choosed = (val) => {
|
||||||
|
listQuery.value.bqList = val.map((v) => {
|
||||||
|
return { bqZl: v.bqLb, bqId: v.id, bqLx: v.bqLx, bqLb: v.bqLb, bqMc: v.bqMc, bqDm: v.bqDm };
|
||||||
|
});
|
||||||
|
roleIds.value = val.map((v) => v.id);
|
||||||
|
};
|
||||||
|
|
||||||
|
// 删除
|
||||||
|
const delDictItem = (bqId) => {
|
||||||
|
listQuery.value.bqList = listQuery.value.bqList.filter((v) => v.bqId != bqId);
|
||||||
|
tableDate.keyCount++;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 提交
|
||||||
|
const submit = () => {
|
||||||
|
|
||||||
|
elform.value.submit((data) => {
|
||||||
|
console.log("xxxxx");
|
||||||
|
|
||||||
|
console.log(data);
|
||||||
|
|
||||||
|
data.zdrSjjz = data.zdrSjjz.join(",");
|
||||||
|
let url = title.value == "新增" ? "/mosty-gsxt/tbGsxtZdry/save" : "/mosty-gsxt/tbGsxtZdry/update";
|
||||||
|
let params = { ...data };
|
||||||
|
if (params.hjdPcsdm) {
|
||||||
|
let obj = pcsList.value.find((v) => v.dm == params.hjdPcsdm);
|
||||||
|
params.hjdPcsmc = obj ? obj.zdmc : "";
|
||||||
|
}
|
||||||
|
if (params.xzdPcsdm) {
|
||||||
|
let obj1 = pcsList.value.map((v) => v.dm == params.xzdPcsdm);
|
||||||
|
params.xzdPcsmc = obj1 ? obj1.zdmc : "";
|
||||||
|
}
|
||||||
|
loading.value = true;
|
||||||
|
qcckPost(params, url).then(() => {
|
||||||
|
loading.value = false;
|
||||||
|
proxy.$message({ type: "success", message: title.value + "成功" });
|
||||||
|
emit("updateDate");
|
||||||
|
close();
|
||||||
|
}).catch(() => {
|
||||||
|
loading.value = false;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
|
||||||
|
const getShdep = (val) =>{
|
||||||
|
listQuery.value.shSsbmmc = val ? val.orgName : ''
|
||||||
|
}
|
||||||
|
const getSPdep = (val) =>{
|
||||||
|
listQuery.value.spSsbmmc = val ? val.orgName : ''
|
||||||
|
}
|
||||||
|
|
||||||
|
// 关闭
|
||||||
|
const close = () => {
|
||||||
|
listQuery.value = {};
|
||||||
|
dialogForm.value = false;
|
||||||
|
loading.value = false;
|
||||||
|
};
|
||||||
|
|
||||||
|
defineExpose({ init });
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "~@/assets/css/layout.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 {
|
||||||
|
width: calc(99% - 50px);
|
||||||
|
margin-top: 10px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.depBox {
|
||||||
|
border: 1px solid #e9e9e9;
|
||||||
|
width: 305px;
|
||||||
|
padding: 0 0 0 4px;
|
||||||
|
border-radius: 4px;
|
||||||
|
|
||||||
|
::v-deep .el-input__inner {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-cascader .el-input.is-focus .el-input__inner {
|
||||||
|
border-color: transparent !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-input__inner:focus {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-input.is-disabled .el-input__inner {
|
||||||
|
border-color: transparent !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,228 @@
|
|||||||
|
<template>
|
||||||
|
<div class="dialog" v-if="dialogForm">
|
||||||
|
<div class="head_box">
|
||||||
|
<span class="title">流线索</span>
|
||||||
|
<div>
|
||||||
|
<el-button type="primary" :loading="loading" @click="submit">保存</el-button>
|
||||||
|
<el-button @click="close">关闭</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="form_cnt">
|
||||||
|
<FormMessage v-model="listQuery" :formList="formData" ref="elform" :rules="rules">
|
||||||
|
<template #gapdive>
|
||||||
|
<div style="width: 100%; height: 10px" class="mb20">
|
||||||
|
<el-divider content-position="left">基础信息</el-divider>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template #gapline>
|
||||||
|
<div style="width: 100%; height: 10px" class="mb20">
|
||||||
|
<el-divider content-position="left">线索内容</el-divider>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template #scfj>
|
||||||
|
<div style="width: 100%; padding-left: 50px">
|
||||||
|
<div>
|
||||||
|
上传附件:<span class="f12">（可附电子表格、Word文档、图像、音视频文件）</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<MOSTY.Upload :showBtn="true" :limit="10" v-model="fjdz" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</FormMessage>
|
||||||
|
<el-divider content-position="left"><span class="mr20">相关人员</span>
|
||||||
|
</el-divider>
|
||||||
|
<MyTable :tableData="pageForm.tableData" :tableColumn="pageForm.tableColumn" :tableHeight="pageForm.tableHeight"
|
||||||
|
:key="pageForm.keyCount" :tableConfiger="pageForm.tableConfiger" :controlsWidth="pageForm.controlsWidth">
|
||||||
|
<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>
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
|
import { qcckPost } from "@/api/qcckApi.js";
|
||||||
|
import {
|
||||||
|
ref,
|
||||||
|
defineExpose,
|
||||||
|
reactive,
|
||||||
|
onMounted,
|
||||||
|
defineEmits,
|
||||||
|
getCurrentInstance,
|
||||||
|
nextTick
|
||||||
|
} from "vue";
|
||||||
|
const emit = defineEmits(["change"]);
|
||||||
|
const props = defineProps({
|
||||||
|
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: "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: "ssbmdm", type: "department" }
|
||||||
|
]);
|
||||||
|
const fjdz = ref();
|
||||||
|
const listQuery = ref({}); //表单
|
||||||
|
const loading = ref(false);
|
||||||
|
const elform = ref();
|
||||||
|
const pageForm = reactive({
|
||||||
|
tableData: [],
|
||||||
|
keyCount: 0,
|
||||||
|
tableConfiger: {
|
||||||
|
rowHieght: 61,
|
||||||
|
showSelectType: "null",
|
||||||
|
loading: false,
|
||||||
|
haveControls: false
|
||||||
|
},
|
||||||
|
controlsWidth: 220,
|
||||||
|
tableColumn: [
|
||||||
|
{ label: "姓名", prop: "xm" },
|
||||||
|
{ label: "性别", prop: "xb", showSolt: true },
|
||||||
|
{ label: "身份证号", prop: "sfzh" },
|
||||||
|
{ label: "户籍地", prop: "hjdz" },
|
||||||
|
{ label: "户籍地派出所", prop: "hjdpcs" },
|
||||||
|
{ label: "标签", prop: "bqList", showSolt: true }
|
||||||
|
]
|
||||||
|
});
|
||||||
|
onMounted(() => {
|
||||||
|
tabHeightFn();
|
||||||
|
});
|
||||||
|
|
||||||
|
// 初始化数据
|
||||||
|
const init = (list) => {
|
||||||
|
fjdz.value = [];
|
||||||
|
tabHeightFn();
|
||||||
|
dialogForm.value = true;
|
||||||
|
pageForm.tableData = list.map((it) => {
|
||||||
|
return {
|
||||||
|
xm: it.ryXm,
|
||||||
|
xb: it.ryXb,
|
||||||
|
sfzh: it.rySfzh,
|
||||||
|
hjdz: it.xzdXz,
|
||||||
|
hjdpcs: it.hjdPcsmc,
|
||||||
|
hjdpcsdm: it.hjdPcsdm,
|
||||||
|
bqList: it.bqList || []
|
||||||
|
};
|
||||||
|
});
|
||||||
|
pageForm.keyCount++;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 提交
|
||||||
|
const submit = () => {
|
||||||
|
elform.value.submit((data) => {
|
||||||
|
let params = { ...data, ryList: pageForm.tableData, cjLx: "0" };
|
||||||
|
params.fjdz = fjdz.value.length > 0 ? fjdz.value.join(",") : "";
|
||||||
|
loading.value = true;
|
||||||
|
qcckPost(params, "/mosty-gsxt/qbcj/add")
|
||||||
|
.then((res) => {
|
||||||
|
loading.value = false;
|
||||||
|
proxy.$message({ type: "success", message: "成功" });
|
||||||
|
emit("change");
|
||||||
|
close();
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
loading.value = false;
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// 关闭
|
||||||
|
const close = () => {
|
||||||
|
fjdz.value = [];
|
||||||
|
listQuery.value = {};
|
||||||
|
dialogForm.value = false;
|
||||||
|
loading.value = false;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 表格高度计算
|
||||||
|
const tabHeightFn = () => {
|
||||||
|
pageForm.tableHeight = window.innerHeight - 720;
|
||||||
|
window.onresize = function () {
|
||||||
|
tabHeightFn();
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
defineExpose({ init });
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "~@/assets/css/layout.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 {
|
||||||
|
width: 99%;
|
||||||
|
height: 225px;
|
||||||
|
margin-top: 10px;
|
||||||
|
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>
|
||||||
@ -3,327 +3,163 @@
|
|||||||
<div class="head_box">
|
<div class="head_box">
|
||||||
<span class="title">{{ title }}重点人管理</span>
|
<span class="title">{{ title }}重点人管理</span>
|
||||||
<div>
|
<div>
|
||||||
<el-button type="primary" size="small" v-if="!disabled" :loading="loading" @click="submit">保存</el-button>
|
<el-button type="primary" size="small" v-if="butShow" :loading="loading" @click="submit">保存</el-button>
|
||||||
<el-button size="small" @click="close">关闭</el-button>
|
<el-button size="small" @click="close">关闭</el-button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="form_cnt">
|
<div class="form_cnt flex just-between">
|
||||||
<FormMessage :disabled="disabled" v-model="listQuery" :formList="formData" labelWidth="100px" ref="elform"
|
<div class="left_box">
|
||||||
:rules="rules"></FormMessage>
|
<ul class="anchor-list">
|
||||||
<div class="ml50 mr50">
|
<li @click="scrollToSection('info-section')" :class="activeSection === 'info-section' ? 'active' : ''">基本信息</li>
|
||||||
<span class="mr10">人员标签模型 : </span><el-button type="primary" v-if="!disabled"
|
<li @click="scrollToSection('backinfo-section')" :class="activeSection === 'backinfo-section' ? 'active' : ''">人员标签</li>
|
||||||
@click="chooseMarksVisible = true">选择</el-button>
|
<li @click="scrollToSection('groupLabels-section')" :class="activeSection === 'groupLabels-section' ? 'active' : ''">群体标签</li>
|
||||||
|
<li @click="scrollToSection('character-section')" :class="activeSection === 'character-section' ? 'active' : ''">群体性质</li>
|
||||||
|
<li @click="scrollToSection('controlInfo-section')" :class="activeSection === 'controlInfo-section' ? 'active' : ''">管控信息</li>
|
||||||
|
<li @click="scrollToSection('featinfo-section')" :class="activeSection === 'featinfo-section' ? 'active' : ''">群体特征</li>
|
||||||
|
<li @click="scrollToSection('demandsInfo-section')" :class="activeSection === 'demandsInfo-section' ? 'active' : ''">主要诉求</li>
|
||||||
|
<li @click="scrollToSection('requestInfo-section')" :class="activeSection === 'requestInfo-section' ? 'active' : ''">诉求信息</li>
|
||||||
|
<li @click="scrollToSection('personnel-section')" :class="activeSection === 'personnel-section' ? 'active' : ''">重点人员</li>
|
||||||
|
<li @click="scrollToSection('judgmentRecord-section')" :class="activeSection === 'judgmentRecord-section' ? 'active' : ''">研判记录</li>
|
||||||
|
<li @click="scrollToSection('historyAssembly-section')" :class="activeSection === 'historyAssembly-section' ? 'active' : ''">历史汇集</li>
|
||||||
|
<li @click="scrollToSection('joblogging-section')" :class="activeSection === 'joblogging-section' ? 'active' : ''">工作记录</li>
|
||||||
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div class="boxlist ml50 mr50">
|
<div class="right_box" ref="rightBox">
|
||||||
<MyTable :tableData="listQuery.bqList" :tableColumn="tableDate.tableColumn" :key="tableDate.keyCount"
|
<div id="info-section"><Info ref="info" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
|
||||||
:tableConfiger="tableDate.tableConfiger" :controlsWidth="tableDate.controlsWidth">
|
<div id="backinfo-section"><PersonnelTags ref="personnelTags" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
|
||||||
<template #bqLb="{ row }">
|
<div id="groupLabels-section"><Vehicle ref="vehicle" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
|
||||||
<DictTag :value="row.bqLb" :tag="false" :options="props.dic.D_GS_BQ_LB" />
|
<div id="character-section"><BackInfo ref="backInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
|
||||||
</template>
|
<!-- <div id="controlInfo-section"><ControlInfo ref="controlInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
|
||||||
<template #bqLx="{ row }">
|
<div id="featinfo-section"><Featinfo ref="featinfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
|
||||||
<DictTag :value="row.bqLx" :tag="false" :options="props.dic.D_GS_BQ_LX" />
|
<div id="demandsInfo-section"><DemandsInfo ref="demandsInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
|
||||||
</template>
|
<div id="requestInfo-section"><RequestInfo ref="requestInfo" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
|
||||||
<template #bqZl="{ row }">
|
<div id="portrayal-section" v-if="portrayal"><Portrayal :disabled="disabled" :dataList="listQuery" /></div>
|
||||||
<DictTag :value="row.bqZl" :tag="false" :options="props.dic.D_GS_BQ_ZL" />
|
<div id="personnel-section"><Personnel ref="personnel" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
|
||||||
</template>
|
<div id="judgmentRecord-section"><JudgmentRecord ref="judgmentRecord" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
|
||||||
<template #controls="{ row }">
|
<div id="historyAssembly-section"><HistoryAssembly ref="historyAssembly" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div>
|
||||||
<el-link type="danger" @click="delDictItem(row.bqId)">删除</el-link>
|
<div id="joblogging-section"><Joblogging ref="joblogging" :disabled="disabled" :showBut="showBut" :dataList="listQuery" /></div> -->
|
||||||
</template>
|
|
||||||
</MyTable>
|
|
||||||
</div>
|
|
||||||
<!-- 选择审核人 -->
|
|
||||||
<div class="ww100 mt20 ml50 mr50">
|
|
||||||
<el-steps direction="vertical" :active="listQuery.wccz" space="500" finish-status="success">
|
|
||||||
<el-step title="发起申请">
|
|
||||||
<template #description>
|
|
||||||
<div class="flex align-center ww100 mt10 mb20">
|
|
||||||
<el-input v-model="listQuery.sqrXm" readonly class="ww20"></el-input>
|
|
||||||
<el-input v-model="listQuery.sqrSsbmmc" readonly class="ww20 ml10 mr10"></el-input>
|
|
||||||
<span class="f12" style="color: #333333">
|
|
||||||
备注发起人和部门根据登陆人自动填写</span>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-step>
|
|
||||||
<el-step title="审核确认">
|
|
||||||
<template #description>
|
|
||||||
<div class="flex align-center ww100 mt10 mb20 depBox">
|
|
||||||
<span class="mr4">审核部门 : </span>
|
|
||||||
<MOSTY.Department :isAll="true" @getDepValue="getShdep" v-model="listQuery.shSsbmdm" clearable :placeholder="listQuery.shSsbmmc ? listQuery.shSsbmmc : ''" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-step>
|
|
||||||
<el-step title="审批确认">
|
|
||||||
<template #description>
|
|
||||||
<div class="flex align-center ww100 mt10 mb20 depBox">
|
|
||||||
<span lass="mr4">审批部门 : </span>
|
|
||||||
<MOSTY.Department :isAll="true" @getDepValue="getSPdep" v-model="listQuery.spSsbmdm" clearable :placeholder="listQuery.spSsbmmc ? listQuery.spSsbmmc : ''" />
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
</el-step>
|
|
||||||
</el-steps>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" />
|
<!-- <ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" /> -->
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import * as rule from "@/utils/rules.js";
|
|
||||||
import * as MOSTY from "@/components/MyComponents/index";
|
|
||||||
import { getItem } from "@/utils/storage";
|
import { getItem } from "@/utils/storage";
|
||||||
import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
|
|
||||||
import MyTable from "@/components/aboutTable/MyTable.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 {
|
import { tbGsxtZdrySelectVoById } from "@/api/zdr.js";
|
||||||
ref,
|
|
||||||
defineExpose,
|
import Info from "../model/info.vue";
|
||||||
reactive,
|
import PersonnelTags from '../model/personnelTags.vue'
|
||||||
onMounted,
|
import Vehicle from '../model/vehicle.vue'
|
||||||
defineEmits,
|
import BackInfo from '../model/bakInfo.vue'
|
||||||
getCurrentInstance,
|
import { ref,onUnmounted} from "vue";
|
||||||
watch
|
|
||||||
} from "vue";
|
|
||||||
const emit = defineEmits(["updateDate"]);
|
const emit = defineEmits(["updateDate"]);
|
||||||
const props = defineProps({
|
|
||||||
dic: Object
|
|
||||||
});
|
|
||||||
const { proxy } = getCurrentInstance();
|
|
||||||
const roleIds = ref([]);
|
|
||||||
const chooseMarksVisible = ref(false);
|
const chooseMarksVisible = ref(false);
|
||||||
const dialogForm = ref(false); //弹窗
|
const dialogForm = ref(false); //弹窗
|
||||||
const pcsList = ref([]);
|
|
||||||
const rules = reactive({
|
|
||||||
ryXm: [{ required: true, message: "请输入姓名", trigger: "blur" }],
|
|
||||||
...rule.identityCardRule({ validator: true },'rySfzh'), //身份证校验
|
|
||||||
...rule.phoneRule({ validator: true }, "ryLxdh"), // 是否必填 是否进行校验,
|
|
||||||
rySfzh: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
|
|
||||||
ryLxdh: [{ required: true, message: "请输入联系电话", trigger: "blur" }],
|
|
||||||
ryXb: [{ required: true, message: "请选择性别", trigger: "change" }],
|
|
||||||
ryMz: [{ required: true, message: "请选择民族", trigger: "change" }],
|
|
||||||
ryCsrq: [{ required: true, message: "请选择出生日期", trigger: "change" }],
|
|
||||||
ryJg: [{ required: true, message: "请选择籍贯", trigger: "change" }],
|
|
||||||
zdrRyjb: [{ required: true, message: "请选择人员级别", trigger: "change" }],
|
|
||||||
zdrYjdj: [{ required: true, message: "请选择预警等级", trigger: "change" }]
|
|
||||||
});
|
|
||||||
const listQuery = ref({}); //表单
|
|
||||||
const formData = ref([]);
|
|
||||||
watch(() => props.dic,(val) => {
|
|
||||||
formData.value = [
|
|
||||||
{ label: "姓名", prop: "ryXm", type: "input" },
|
|
||||||
{
|
|
||||||
label: "性别",
|
|
||||||
prop: "ryXb",
|
|
||||||
type: "select",
|
|
||||||
options: props.dic.D_BZ_XB
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "民族",
|
|
||||||
prop: "ryMz",
|
|
||||||
type: "select",
|
|
||||||
options: props.dic.D_BZ_MZ
|
|
||||||
},
|
|
||||||
{ label: "身份证号", prop: "rySfzh", type: "input" },
|
|
||||||
{ label: "联系电话", prop: "ryLxdh", type: "input" },
|
|
||||||
{ label: "出生日期", prop: "ryCsrq", type: "date" },
|
|
||||||
{
|
|
||||||
label: "籍贯",
|
|
||||||
prop: "ryJg",
|
|
||||||
type: "select",
|
|
||||||
options: props.dic.D_BZ_XZQHDM
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "人员级别",
|
|
||||||
prop: "zdrRyjb",
|
|
||||||
type: "select",
|
|
||||||
options: props.dic.D_GS_ZDR_RYJB
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "预警等级",
|
|
||||||
prop: "zdrYjdj",
|
|
||||||
type: "select",
|
|
||||||
options: props.dic.D_GS_ZDR_YJDJ
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "户籍地区划",
|
|
||||||
prop: "hjdQh",
|
|
||||||
type: "select",
|
|
||||||
options: props.dic.D_BZ_XZQHDM
|
|
||||||
},
|
|
||||||
{ label: "户籍地详址", prop: "hjdXz", type: "input" },
|
|
||||||
{
|
|
||||||
label: "户籍地派出所",
|
|
||||||
prop: "hjdPcsdm",
|
|
||||||
type: "select",
|
|
||||||
options: pcsList
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "现住地区划",
|
|
||||||
prop: "xzdQh",
|
|
||||||
type: "select",
|
|
||||||
options: props.dic.D_BZ_XZQHDM
|
|
||||||
},
|
|
||||||
{ label: "现住地详址", prop: "xzdXz", type: "input" },
|
|
||||||
{
|
|
||||||
label: "现住地派出所",
|
|
||||||
prop: "xzdPcsdm",
|
|
||||||
type: "select",
|
|
||||||
options: pcsList
|
|
||||||
},
|
|
||||||
{ label: "管辖单位", prop: "gxSsbmdm",depMc:'gxSsbmmc', type: "department" },
|
|
||||||
{ label: "诉求单位", prop: "sqSsbmdm",depMc:'sqSsbmmc', type: "department" },
|
|
||||||
{ label: "责任单位", prop: "zrSsbmdm",depMc:'zrSsbmmc', type: "department" },
|
|
||||||
{
|
|
||||||
label: "所属警种",
|
|
||||||
prop: "zdrSsjz",
|
|
||||||
type: "select",
|
|
||||||
options: props.dic.D_GS_BK_SSJZ
|
|
||||||
},
|
|
||||||
{
|
|
||||||
label: "涉及警种",
|
|
||||||
prop: "zdrSjjz",
|
|
||||||
type: "select",
|
|
||||||
options: props.dic.D_GS_BK_SSJZ,
|
|
||||||
multiple: true
|
|
||||||
},
|
|
||||||
{ label: "管控民警姓名", prop: "gkMjXm", type: "input" },
|
|
||||||
{ label: "管控民警警号", prop: "gkMjJh", type: "input" },
|
|
||||||
{ label: "管控原因", prop: "zdrLkyy", type: "textarea", width: "100%" },
|
|
||||||
{
|
|
||||||
label: "处置状态",
|
|
||||||
prop: "zdrCzzt",
|
|
||||||
type: "select",
|
|
||||||
options: props.dic.D_GS_ZDR_CZZT
|
|
||||||
},
|
|
||||||
{ label: "入库开始时间", prop: "zdrRkkssj", type: "datetime" },
|
|
||||||
{ label: "入库结束时间", prop: "zdrRkjssj", type: "datetime" }
|
|
||||||
];
|
|
||||||
},
|
|
||||||
{ immediate: true, deep: true }
|
|
||||||
);
|
|
||||||
|
|
||||||
const tableDate = reactive({
|
|
||||||
tableConfiger: {
|
|
||||||
rowHieght: 61,
|
|
||||||
showSelectType: "null",
|
|
||||||
loading: false
|
|
||||||
},
|
|
||||||
controlsWidth: 90, //操作栏宽度
|
|
||||||
keyCount: 0,
|
|
||||||
tableColumn: [
|
|
||||||
{ label: "标签名称", prop: "bqMc" },
|
|
||||||
{ label: "标签代码", prop: "bqDm" },
|
|
||||||
{ label: "标签种类", prop: "bqZl", showSolt: true },
|
|
||||||
{ label: "标签类型", prop: "bqLx", showSolt: true },
|
|
||||||
{ label: "标签类别", prop: "bqLb", showSolt: true }
|
|
||||||
]
|
|
||||||
});
|
|
||||||
const loading = ref(false);
|
const loading = ref(false);
|
||||||
const elform = ref();
|
const disabled = ref(false)
|
||||||
const title = ref("");
|
const showBut = ref(false)
|
||||||
const showInfo = ref(false);
|
const listQuery = ref({});
|
||||||
const disabled = ref(false);
|
const butShow=ref(false)
|
||||||
|
const title = ref('新增')
|
||||||
onMounted(() => {
|
|
||||||
chooseDep();
|
|
||||||
});
|
|
||||||
|
|
||||||
const chooseDep = () => {
|
|
||||||
qcckPost({ orgLevel: 40 }, "/mosty-base/deptFeign/queryListByDept").then(
|
|
||||||
(res) => {
|
|
||||||
pcsList.value = res.map((item) => {
|
|
||||||
return { zdmc: item.orgName, dm: item.orgCode, value: item.orgCode };
|
|
||||||
});
|
|
||||||
}
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 初始化数据
|
// 初始化数据
|
||||||
const init = (type, row) => {
|
const init = (type, row) => {
|
||||||
dialogForm.value = true;
|
dialogForm.value = true;
|
||||||
title.value = type == "add" ? "新增" : type == "detail" ? "详情" : "编辑";
|
if (type == 'add') {
|
||||||
disabled.value = type == "detail" ? true : false;
|
butShow.value=true
|
||||||
tableDate.tableConfiger.haveControls = type == "detail" ? false : true;
|
title.value = '新增'
|
||||||
if (type == "add") {
|
disabled.value = false
|
||||||
listQuery.value.sqrXm = getItem("USERNAME");
|
showBut.value=false
|
||||||
listQuery.value.bkfqrSfzh = getItem("idEntityCard");
|
} else {
|
||||||
listQuery.value.sqrSsbmmc = getItem("deptId")[0].deptName;
|
butShow.value=false
|
||||||
listQuery.value.sqrSsbmdm = getItem("deptId")[0].deptCode;
|
tbGsxtZdrySelectVoById({id:row.id}).then(res => {
|
||||||
|
listQuery.value = res
|
||||||
|
})
|
||||||
|
if (type == 'edit') {
|
||||||
|
showBut.value = true
|
||||||
|
disabled.value = false
|
||||||
|
title.value = '编辑'
|
||||||
|
} else {
|
||||||
|
disabled.value = true
|
||||||
|
showBut.value = false
|
||||||
|
title.value = '详情'
|
||||||
|
}
|
||||||
}
|
}
|
||||||
setTimeout(() => {
|
|
||||||
showInfo.value = true;
|
|
||||||
}, 5);
|
|
||||||
if (row) getDataById(row.id);
|
|
||||||
};
|
};
|
||||||
// 根据id查询详情
|
|
||||||
const getDataById = (id) => {
|
const activeSection = ref('info-section')
|
||||||
qcckGet({}, "/mosty-gsxt/tbGsxtZdry/selectVoById/" + id).then((res) => {
|
const rightBox = ref(null)
|
||||||
listQuery.value = res;
|
// 滚动到指定区域
|
||||||
listQuery.value.zdrSjjz = listQuery.value.zdrSjjz.split(",");
|
const scrollToSection = (sectionId) => {
|
||||||
tableDate.bqList = res.bqList;
|
const element = document.getElementById(sectionId);
|
||||||
listQuery.value.sqrXm = getItem("USERNAME");
|
if (element && rightBox.value) {
|
||||||
listQuery.value.bkfqrSfzh = getItem("idEntityCard");
|
// 计算需要滚动的距离
|
||||||
listQuery.value.sqrSsbmmc = getItem("deptId")[0].deptName;
|
const elementTop = element.offsetTop;
|
||||||
listQuery.value.sqrSsbmdm = getItem("deptId")[0].deptCode;
|
rightBox.value.scrollTo({
|
||||||
|
top: elementTop - 150, // 减去一些偏移量，让内容更好看
|
||||||
|
behavior: 'smooth' // 平滑滚动
|
||||||
});
|
});
|
||||||
};
|
activeSection.value = sectionId;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
// 选择标签
|
// 监听滚动，更新当前激活的锚点
|
||||||
const choosed = (val) => {
|
const handleScroll = () => {
|
||||||
listQuery.value.bqList = val.map((v) => {
|
if (!rightBox.value) return;
|
||||||
return { bqZl: v.bqLb, bqId: v.id, bqLx: v.bqLx, bqLb: v.bqLb, bqMc: v.bqMc, bqDm: v.bqDm };
|
|
||||||
|
const scrollPosition = rightBox.value.scrollTop + 50;
|
||||||
|
const sections = [
|
||||||
|
'info-section', 'backinfo-section', 'groupLabels-section',
|
||||||
|
'character-section', 'controlInfo-section', 'featinfo-section',
|
||||||
|
'demandsInfo-section', 'requestInfo-section', 'personnel-section',
|
||||||
|
'judgmentRecord-section', 'historyAssembly-section', 'joblogging-section'
|
||||||
|
];
|
||||||
|
|
||||||
|
for (let i = sections.length - 1; i >= 0; i--) {
|
||||||
|
const section = document.getElementById(sections[i]);
|
||||||
|
if (section && section.offsetTop <= scrollPosition) {
|
||||||
|
activeSection.value = sections[i];
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 监听右侧区域的滚动事件
|
||||||
|
if (typeof window !== 'undefined') {
|
||||||
|
window.addEventListener('load', () => {
|
||||||
|
if (rightBox.value) {
|
||||||
|
rightBox.value.addEventListener('scroll', handleScroll);
|
||||||
|
}
|
||||||
});
|
});
|
||||||
roleIds.value = val.map((v) => v.id);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 删除
|
// 组件卸载时移除事件监听
|
||||||
const delDictItem = (bqId) => {
|
onUnmounted(() => {
|
||||||
listQuery.value.bqList = listQuery.value.bqList.filter((v) => v.bqId != bqId);
|
if (rightBox.value) {
|
||||||
tableDate.keyCount++;
|
rightBox.value.removeEventListener('scroll', handleScroll);
|
||||||
};
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const info=ref()
|
||||||
|
const personnelTags=ref()
|
||||||
// 提交
|
// 提交
|
||||||
const submit = () => {
|
const submit =async () => {
|
||||||
|
console.log(info.value.throwData());
|
||||||
|
console.log(personnelTags.value.throwData());
|
||||||
|
// 使用Promise.all处理所有子组件的验证和数据获取
|
||||||
|
const [infoData, personnelTagsData] = await Promise.all([
|
||||||
|
info.value.throwData(),
|
||||||
|
personnelTags.value.throwData(),
|
||||||
|
]);
|
||||||
|
|
||||||
elform.value.submit((data) => {
|
console.log(infoData, personnelTagsData);
|
||||||
console.log("xxxxx");
|
|
||||||
|
|
||||||
console.log(data);
|
|
||||||
|
|
||||||
data.zdrSjjz = data.zdrSjjz.join(",");
|
|
||||||
let url = title.value == "新增" ? "/mosty-gsxt/tbGsxtZdry/save" : "/mosty-gsxt/tbGsxtZdry/update";
|
|
||||||
let params = { ...data };
|
|
||||||
if (params.hjdPcsdm) {
|
|
||||||
let obj = pcsList.value.find((v) => v.dm == params.hjdPcsdm);
|
|
||||||
params.hjdPcsmc = obj ? obj.zdmc : "";
|
|
||||||
}
|
|
||||||
if (params.xzdPcsdm) {
|
|
||||||
let obj1 = pcsList.value.map((v) => v.dm == params.xzdPcsdm);
|
|
||||||
params.xzdPcsmc = obj1 ? obj1.zdmc : "";
|
|
||||||
}
|
|
||||||
loading.value = true;
|
|
||||||
qcckPost(params, url).then(() => {
|
|
||||||
loading.value = false;
|
|
||||||
proxy.$message({ type: "success", message: title.value + "成功" });
|
|
||||||
emit("updateDate");
|
|
||||||
close();
|
|
||||||
}).catch(() => {
|
|
||||||
loading.value = false;
|
|
||||||
});
|
|
||||||
});
|
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
const getShdep = (val) =>{
|
|
||||||
listQuery.value.shSsbmmc = val ? val.orgName : ''
|
|
||||||
}
|
|
||||||
const getSPdep = (val) =>{
|
|
||||||
listQuery.value.spSsbmmc = val ? val.orgName : ''
|
|
||||||
}
|
|
||||||
|
|
||||||
// 关闭
|
// 关闭
|
||||||
const close = () => {
|
const close = () => {
|
||||||
listQuery.value = {};
|
|
||||||
dialogForm.value = false;
|
dialogForm.value = false;
|
||||||
loading.value = false;
|
loading.value = false;
|
||||||
};
|
};
|
||||||
@ -368,4 +204,149 @@ defineExpose({ init });
|
|||||||
border-color: transparent !important;
|
border-color: transparent !important;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.left_box {
|
||||||
|
width: 220px;
|
||||||
|
background-color: #fafafa;
|
||||||
|
border: 1px solid #ebeef5;
|
||||||
|
border-radius: 6px;
|
||||||
|
padding: 15px;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left_box:hover {
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
|
||||||
|
border-color: #409eff;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 锚点列表样式
|
||||||
|
.anchor-list {
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.anchor-list li {
|
||||||
|
padding: 10px 15px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
cursor: pointer;
|
||||||
|
border-radius: 4px;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #606266;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.anchor-list li:hover {
|
||||||
|
background-color: #e6f7ff;
|
||||||
|
color: #409eff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.anchor-list li.active {
|
||||||
|
background-color: #409eff;
|
||||||
|
color: #ffffff;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.anchor-list li.active::before {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 3px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-radius: 0 2px 2px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right_box {
|
||||||
|
width: calc(100% - 240px);
|
||||||
|
overflow-y: auto;
|
||||||
|
// padding: 15px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
// border: 1px solid #ebeef5;
|
||||||
|
border-radius: 6px;
|
||||||
|
|
||||||
|
.right_box>div {
|
||||||
|
background-color: #f8f9fa;
|
||||||
|
border-radius: 6px;
|
||||||
|
padding: 20px;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right_box>div:hover {
|
||||||
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
|
||||||
|
}
|
||||||
|
|
||||||
|
.right_box h3 {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #303133;
|
||||||
|
margin: 0 0 10px 0;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 2px solid #409eff;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right_box h3::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: -2px;
|
||||||
|
width: 60px;
|
||||||
|
height: 2px;
|
||||||
|
background-color: #409eff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headline {
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #303133;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 按钮样式优化
|
||||||
|
.el-button {
|
||||||
|
margin-left: 8px;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-button:first-child {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 响应式设计
|
||||||
|
@media screen and (max-width: 768px) {
|
||||||
|
.form_cnt {
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left_box {
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right_box {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.anchor-list {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.anchor-list li {
|
||||||
|
flex: 1 1 calc(33.333% - 10px);
|
||||||
|
margin-bottom: 5px;
|
||||||
|
text-align: center;
|
||||||
|
padding: 8px 5px;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .avatar-uploader {
|
||||||
|
display: flex
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@ -0,0 +1,225 @@
|
|||||||
|
<template>
|
||||||
|
|
||||||
|
<div class="backinfo-container">
|
||||||
|
<div class="headClass" style="">
|
||||||
|
<h3>群体信息</h3>
|
||||||
|
<el-button type="primary" v-if="showBut" :disabled="disabled" @click="ClickSave">保存</el-button>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div>拘留记录：</div>
|
||||||
|
<div v-for="(item,index) in jljl" :key="index">
|
||||||
|
<el-input v-model="jljl[index]" :autosize="{ minRows: 4, maxRows: 10 }" type="textarea" placeholder="请输入背景信息"
|
||||||
|
class="background-info-input" :disabled="disabled" /></div>
|
||||||
|
</div>
|
||||||
|
<div></div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, watch } from "vue";
|
||||||
|
import { Delete, Download } from '@element-plus/icons';
|
||||||
|
// import { tbGsxtZdryUpdate } from '@/api/zdr.js'
|
||||||
|
const props = defineProps({
|
||||||
|
dataList: {
|
||||||
|
type: Object,
|
||||||
|
default: () => { },
|
||||||
|
}, disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
showBut: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
})
|
||||||
|
const jljl=ref([])
|
||||||
|
watch(() => props.dataList, (val) => {
|
||||||
|
if (val) {
|
||||||
|
// qtbjxx.value = val.qtBjzl
|
||||||
|
}
|
||||||
|
}, { deep: true })
|
||||||
|
|
||||||
|
const throwData = () => {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
// 基本验证：确保背景信息不为空
|
||||||
|
if (!qtbjxx.value.trim()) {
|
||||||
|
throw new Error('请输入群体背景信息');
|
||||||
|
}
|
||||||
|
|
||||||
|
resolve({
|
||||||
|
qtbjxx: qtbjxx.value,
|
||||||
|
fileList: fileList.value
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
defineExpose({
|
||||||
|
throwData
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "~@/assets/css/layout.scss";
|
||||||
|
@import "~@/assets/css/element-plus.scss";
|
||||||
|
|
||||||
|
.backinfo-container {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.background-info-input {
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-attachment-section {
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section-title {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #303133;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
padding-bottom: 5px;
|
||||||
|
border-bottom: 1px solid #ebeef5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-list-container {
|
||||||
|
max-height: 100px;
|
||||||
|
overflow-y: auto;
|
||||||
|
border: 1px solid #ebeef5;
|
||||||
|
border-radius: 4px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 自定义滚动条样式 */
|
||||||
|
.file-list-container::-webkit-scrollbar {
|
||||||
|
width: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-list-container::-webkit-scrollbar-track {
|
||||||
|
background: #f1f1f1;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-list-container::-webkit-scrollbar-thumb {
|
||||||
|
background: #c0c4cc;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-list-container::-webkit-scrollbar-thumb:hover {
|
||||||
|
background: #909399;
|
||||||
|
}
|
||||||
|
|
||||||
|
.empty-file-list {
|
||||||
|
padding: 20px;
|
||||||
|
text-align: center;
|
||||||
|
color: #909399;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-list {
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-item {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 8px 10px;
|
||||||
|
margin-bottom: 2px;
|
||||||
|
background-color: #f8f9fa;
|
||||||
|
border-radius: 4px;
|
||||||
|
transition: all 0.3s ease;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-item:hover {
|
||||||
|
background-color: #e6f7ff;
|
||||||
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-info {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 15px;
|
||||||
|
min-width: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-name {
|
||||||
|
flex: 1;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #303133;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-size {
|
||||||
|
font-size: 11px;
|
||||||
|
color: #909399;
|
||||||
|
min-width: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-time {
|
||||||
|
font-size: 11px;
|
||||||
|
color: #909399;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-actions {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 5px;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-actions .el-button {
|
||||||
|
padding: 0 5px;
|
||||||
|
margin: 0;
|
||||||
|
color: #606266;
|
||||||
|
transition: color 0.3s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.file-actions .el-button:hover {
|
||||||
|
color: #409eff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.delete-btn:hover {
|
||||||
|
color: #f56c6c !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload-btn-container {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headClass {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #303133;
|
||||||
|
margin: 0 0 10px 0;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 2px solid #409eff;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headClass::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: -2px;
|
||||||
|
width: 60px;
|
||||||
|
height: 2px;
|
||||||
|
background-color: #409eff;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,352 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="headClass">
|
||||||
|
<h3>群体背景信息</h3>
|
||||||
|
<!-- @click="gettbGsxtZdqtUpdate" -->
|
||||||
|
<el-button type="primary" v-if="showBut" :disabled="disabled" @click="submit">保存</el-button>
|
||||||
|
</div>
|
||||||
|
<div class="form_cnt">
|
||||||
|
<FormMessage :disabled="disabled" v-model="listQuery" :formList="formData" labelWidth="100px" ref="elform"
|
||||||
|
:rules="rules">
|
||||||
|
<template #ryzp>
|
||||||
|
<div style="width: 100%; padding-left: 50px">
|
||||||
|
<MOSTY.Upload :showBtn="false" :limit="1" v-model="listQuery.ryzp" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template #ryLxdh>
|
||||||
|
<div class="phone-input-container">
|
||||||
|
<div class="inputGroup" v-for="(item,index) in listQuery.ryLxdh" :key="index">
|
||||||
|
<el-input v-model="listQuery.ryLxdh[index]" class="group" placeholder="请输入电话号码" />
|
||||||
|
<div class="flex align-center but">
|
||||||
|
<el-button type="primary" :icon="Plus" circle @click="addPhone" title="添加电话号码" />
|
||||||
|
<el-button type="success" :icon="Minus" circle @click="removePhone(index)" title="删除电话号码" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template #tags>
|
||||||
|
<div style="display: flex; align-items: center;">
|
||||||
|
<el-button type="primary" :disabled="disabled" @click="chooseMarksVisible = true">
|
||||||
|
选择标签
|
||||||
|
</el-button>
|
||||||
|
<div v-if="roleIds.length > 0" style="margin-left: 10px; color: #606266;">
|
||||||
|
已选择 {{ roleIds.length }} 个标签
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
</FormMessage>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import * as rule from "@/utils/rules.js";
|
||||||
|
import * as MOSTY from "@/components/MyComponents/index";
|
||||||
|
import { Plus ,Minus} from "@element-plus/icons-vue";
|
||||||
|
import FormMessage from "@/components/aboutTable/FormMessage.vue";
|
||||||
|
import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
|
||||||
|
import { ref, reactive, onMounted, getCurrentInstance, watch } from "vue";
|
||||||
|
import { tbGsxtZdryUpdate } from "@/api/zdr.js";
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const { D_BZ_XB, D_BZ_ZZMM, D_BZ_HYZK, D_BZ_MZ, D_BZ_XZQHDM, D_BZ_RCBKZT, D_GS_ZDR_RYJB, D_GS_ZDR_YJDJ, D_GS_BK_SSJZ, D_GS_ZDR_CZZT, D_BZ_WHCD, D_ZDRY_ZYLB } =
|
||||||
|
proxy.$dict('D_BZ_XB', 'D_BZ_ZZMM', 'D_BZ_HYZK', 'D_BZ_MZ', 'D_BZ_XZQHDM', 'D_BZ_RCBKZT', 'D_GS_ZDR_RYJB', 'D_GS_ZDR_YJDJ', 'D_GS_BK_SSJZ', 'D_GS_ZDR_CZZT', 'D_BZ_WHCD', 'D_ZDRY_ZYLB')
|
||||||
|
const props = defineProps({
|
||||||
|
dataList: {
|
||||||
|
type: Object,
|
||||||
|
default: () => { },
|
||||||
|
}, disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
showBut: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
})
|
||||||
|
const rules = reactive({
|
||||||
|
ryXm: [{ required: true, message: "请输入姓名", trigger: "blur" }],
|
||||||
|
...rule.identityCardRule({ validator: true }, 'rySfzh'), //身份证校验
|
||||||
|
...rule.phoneRule({ validator: true }, "ryLxdh"), // 是否必填 是否进行校验,
|
||||||
|
rySfzh: [{ required: true, message: "请输入身份证号", trigger: "blur" }],
|
||||||
|
ryLxdh: [{ required: true, message: "请输入联系电话", trigger: "blur" }],
|
||||||
|
ryXb: [{ required: true, message: "请选择性别", trigger: "change" }],
|
||||||
|
zyBm: [{ required: true, message: "请选择职业", trigger: "change" }],
|
||||||
|
ryMz: [{ required: true, message: "请选择民族", trigger: "change" }],
|
||||||
|
ryCsrq: [{ required: true, message: "请选择出生日期", trigger: "change" }],
|
||||||
|
ryJg: [{ required: true, message: "请选择籍贯", trigger: "change" }],
|
||||||
|
zdrRyjb: [{ required: true, message: "请选择人员级别", trigger: "change" }],
|
||||||
|
zdrYjdj: [{ required: true, message: "请选择预警等级", trigger: "change" }]
|
||||||
|
});
|
||||||
|
const listQuery = ref({ryLxdh:[""]}); //表单
|
||||||
|
const chooseMarksVisible = ref(false); // 控制标签选择弹窗显示
|
||||||
|
const roleIds = ref([]); // 已选择的标签ID
|
||||||
|
const formData = ref([
|
||||||
|
{ label: "人员照片", prop: "ryzp", type: "slot", width: "100%" },
|
||||||
|
{ label: "姓名", prop: "ryXm", type: "input" },
|
||||||
|
{ label: "性别", prop: "ryXb", type: "select", options: D_BZ_XB },
|
||||||
|
{ label: "身份证号", prop: "rySfzh", type: "input" },
|
||||||
|
{ label: "籍贯", prop: "ryJg", type: "select", options: D_BZ_XZQHDM },
|
||||||
|
{ label: "曾用名", prop: "cym", type: "input" },
|
||||||
|
{ label: "文化程度", prop: "whcdBm", type: "select", options: D_BZ_WHCD },
|
||||||
|
{ label: "民族", prop: "ryMz", type: "select", options: D_BZ_MZ },
|
||||||
|
{ label: "政治面貌", prop: "zzmm", type: "select", options: D_BZ_ZZMM },
|
||||||
|
{ label: "职业", prop: "zyBm", type: "select", options: D_ZDRY_ZYLB },
|
||||||
|
{ label: "人员级别", prop: "zdrRyjb", type: "select", options: D_GS_ZDR_RYJB },
|
||||||
|
{ label: "预警等级", prop: "zdrYjdj", type: "select", options: D_GS_ZDR_YJDJ },
|
||||||
|
{ label: "出生日期", prop: "ryCsrq", type: "date" },
|
||||||
|
{ label: "户籍地区划", prop: "hjdQh", type: "select", options: D_BZ_XZQHDM },
|
||||||
|
{ label: "户籍地详址", prop: "hjdXz", type: "input" },
|
||||||
|
{ label: "户籍地派出所", prop: "hjdPcsdm", type: "department" },
|
||||||
|
{ label: "现住地区划", prop: "xzdQh", type: "select", options: D_BZ_XZQHDM },
|
||||||
|
{ label: "现住地详址", prop: "xzdXz", type: "input" },
|
||||||
|
{ label: "现住地派出所", prop: "xzdPcsdm", type: "department" },
|
||||||
|
{ label: "管辖单位", prop: "gxSsbmdm", depMc: 'gxSsbmmc', type: "department" },
|
||||||
|
{ label: "诉求单位", prop: "sqSsbmdm", depMc: 'sqSsbmmc', type: "department" },
|
||||||
|
{ label: "责任单位", prop: "zrSsbmdm", depMc: 'zrSsbmmc', type: "department" },
|
||||||
|
{ label: "所属警种", prop: "zdrSsjz", type: "select", options: D_GS_BK_SSJZ },
|
||||||
|
{ label: "涉及警种", prop: "zdrSjjz", type: "select", options: D_GS_BK_SSJZ, multiple: true },
|
||||||
|
{ label: "婚姻状态", prop: "hyzk", type: "select", options: D_BZ_HYZK },
|
||||||
|
{ label: "处置状态", prop: "zdrCzzt", type: "select", options: D_GS_ZDR_CZZT },
|
||||||
|
{ label: "布控状态", prop: "zdrBkZt", type: "select", options: D_BZ_RCBKZT },
|
||||||
|
{ label: "入库开始时间", prop: "zdrRkkssj", type: "datetime" },
|
||||||
|
{ label: "入库结束时间", prop: "zdrRkjssj", type: "datetime" },
|
||||||
|
{ label: "Mac地址", prop: "macDz", type: "input" },
|
||||||
|
{ label: "联系电话", prop: "ryLxdh", type: "slot", width: "100%" },
|
||||||
|
{ label: "标签选择", prop: "tags", type: "slot", width: "100%" },
|
||||||
|
{ label: "管控原因", prop: "zdrLkyy", type: "textarea", width: "100%" },
|
||||||
|
]);
|
||||||
|
const loading = ref(false);
|
||||||
|
const elform = ref();
|
||||||
|
const disabled = ref(false);
|
||||||
|
// phoneList已重构为listQuery.value.ryLxdh
|
||||||
|
// 创建一个工具函数进行深拷贝
|
||||||
|
const deepClone = (obj) => {
|
||||||
|
if (obj === null || typeof obj !== 'object') {
|
||||||
|
return obj;
|
||||||
|
}
|
||||||
|
if (obj instanceof Date) {
|
||||||
|
return new Date(obj.getTime());
|
||||||
|
}
|
||||||
|
if (obj instanceof Array) {
|
||||||
|
return obj.map(item => deepClone(item));
|
||||||
|
}
|
||||||
|
const clonedObj = {};
|
||||||
|
for (const key in obj) {
|
||||||
|
if (obj.hasOwnProperty(key)) {
|
||||||
|
clonedObj[key] = deepClone(obj[key]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return clonedObj;
|
||||||
|
};
|
||||||
|
// 监听props.dataList变化，处理初始化数据
|
||||||
|
watch(() => props.dataList, (val) => {
|
||||||
|
if (val) {
|
||||||
|
// 使用深拷贝避免直接引用同一个对象
|
||||||
|
listQuery.value = deepClone(val);
|
||||||
|
// 处理照片数据
|
||||||
|
listQuery.value.ryzp = val.ryzp == null || val.ryzp == '' ? [] : [val.ryzp];
|
||||||
|
// 处理标签ID数据，确保数据回显
|
||||||
|
if (val.tagIds && Array.isArray(val.tagIds) && val.tagIds.length > 0) {
|
||||||
|
roleIds.value = [...val.tagIds];
|
||||||
|
} else if (val.bqIds && Array.isArray(val.bqIds) && val.bqIds.length > 0) {
|
||||||
|
roleIds.value = [...val.bqIds];
|
||||||
|
} else {
|
||||||
|
roleIds.value = [];
|
||||||
|
}
|
||||||
|
// listQuery.value.ryLxdh =listQuery.value.ryLxdh.length>0?listQuery.value.ryLxdh:['11'];
|
||||||
|
}
|
||||||
|
}, { deep: true })
|
||||||
|
// 提交
|
||||||
|
const submit = () => {
|
||||||
|
loading.value = true
|
||||||
|
gettbGsxtZdryUpdate()
|
||||||
|
};
|
||||||
|
|
||||||
|
// 处理标签选择结果
|
||||||
|
const choosed = (selectedTags) => {
|
||||||
|
// 存储选择的标签ID用于回显
|
||||||
|
roleIds.value = selectedTags.map(tag => tag.id);
|
||||||
|
// 这里可以根据实际需求处理选择的标签数据
|
||||||
|
};
|
||||||
|
|
||||||
|
//
|
||||||
|
const gettbGsxtZdryUpdate = () => {
|
||||||
|
const promes = {
|
||||||
|
...listQuery.value,
|
||||||
|
ryzp: listQuery.value.ryzp.length > 0 ? listQuery.value.ryzp.toString() : "",
|
||||||
|
ryLxdh: listQuery.value.ryLxdh,
|
||||||
|
tagIds: roleIds.value,
|
||||||
|
bqIds: roleIds.value,
|
||||||
|
|
||||||
|
}
|
||||||
|
tbGsxtZdryUpdate(promes).then((res) => {
|
||||||
|
listQuery.value.ryzp = []
|
||||||
|
proxy.$message({
|
||||||
|
message: '更新成功',
|
||||||
|
type: 'success',
|
||||||
|
})
|
||||||
|
}).catch((err) => {
|
||||||
|
|
||||||
|
}).finally(() => {
|
||||||
|
loading.value = false
|
||||||
|
});
|
||||||
|
}
|
||||||
|
// 添加电话号码
|
||||||
|
const addPhone = () => {
|
||||||
|
// 确保新添加的电话号码与现有数据结构一致
|
||||||
|
// 创建深拷贝以避免响应式更新问题
|
||||||
|
const newPhoneList = [...listQuery.value.ryLxdh];
|
||||||
|
newPhoneList.push('');
|
||||||
|
// 用全新数组替换现有数组，确保Vue正确检测到变化
|
||||||
|
listQuery.value.ryLxdh = newPhoneList;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除电话号码
|
||||||
|
const removePhone = (index) => {
|
||||||
|
if (listQuery.value.ryLxdh .length > 1) {
|
||||||
|
listQuery.value.ryLxdh .splice(index, 1);
|
||||||
|
} else {
|
||||||
|
// 清空输入但保留输入框
|
||||||
|
listQuery.value.ryLxdh[0] = '';
|
||||||
|
proxy.$message.warning('至少保留一个联系电话');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const throwData = () => {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
if (elform.value && elform.value.validate) {
|
||||||
|
elform.value.validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
// 过滤掉空的电话号码
|
||||||
|
const validPhones = listQuery.value.ryLxdh.filter(phone => phone && phone.trim());
|
||||||
|
if (validPhones.length === 0) {
|
||||||
|
reject(new Error('请至少输入一个有效的联系电话'));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
resolve({
|
||||||
|
...listQuery.value,
|
||||||
|
ryzp: listQuery.value.ryzp && listQuery.value.ryzp.length > 0 ? listQuery.value.ryzp.toString() : '',
|
||||||
|
ryLxdh: JSON.stringify(validPhones),
|
||||||
|
tagIds: roleIds.value,
|
||||||
|
bqIds: roleIds.value
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
reject(new Error('表单验证失败，请检查输入信息'));
|
||||||
|
}
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
// 如果没有验证方法，直接返回数据
|
||||||
|
const validPhones = listQuery.value.ryLxdh.filter(phone => phone && phone.trim());
|
||||||
|
if (validPhones.length === 0) {
|
||||||
|
reject(new Error('请至少输入一个有效的联系电话'));
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
resolve({
|
||||||
|
...listQuery.value,
|
||||||
|
ryzp: listQuery.value.ryzp && listQuery.value.ryzp.length > 0 ? listQuery.value.ryzp.toString() : '',
|
||||||
|
ryLxdh: JSON.stringify(validPhones),
|
||||||
|
tagIds: roleIds.value,
|
||||||
|
bqIds: roleIds.value
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
defineExpose({
|
||||||
|
throwData,
|
||||||
|
});
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "~@/assets/css/layout.scss";
|
||||||
|
@import "~@/assets/css/element-plus.scss";
|
||||||
|
|
||||||
|
.left_box {
|
||||||
|
width: 200px;
|
||||||
|
border: 1px solid #c8c8c89a;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right_box {
|
||||||
|
width: calc(100% - 230px);
|
||||||
|
overflow-y: auto;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-form-item__content {
|
||||||
|
display: block !important;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .form-item-box {
|
||||||
|
width: 100% !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headClass {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #303133;
|
||||||
|
margin: 0 0 10px 0;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 2px solid #409eff;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headClass::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: -2px;
|
||||||
|
width: 60px;
|
||||||
|
height: 2px;
|
||||||
|
background-color: #409eff;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.phone-input-container {
|
||||||
|
display: flex;
|
||||||
|
// flex-direction: column;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.inputGroup{
|
||||||
|
margin-left: 10px;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 400px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
.group{
|
||||||
|
width: 250px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.but{
|
||||||
|
display: flex;
|
||||||
|
gap: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-button--primary {
|
||||||
|
background-color: #409eff !important;
|
||||||
|
border-color: #409eff !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-button--success {
|
||||||
|
background-color: #67c23a !important;
|
||||||
|
border-color: #67c23a !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
@ -0,0 +1,210 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="headClass" style="">
|
||||||
|
<h3>人员标签</h3>
|
||||||
|
<el-button type="primary" :disabled="disabled" @click="chooseMarksVisible = true">选择</el-button>
|
||||||
|
</div>
|
||||||
|
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||||
|
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||||
|
<template #bqLx="{ row }">
|
||||||
|
<DictTag :tag="false" :value="row.bqLx" :options="D_GS_BQ_DJ" />
|
||||||
|
</template>
|
||||||
|
<template #bqLb="{ row }">
|
||||||
|
<DictTag :tag="false" :value="row.bqLb" :options="D_GS_SSYJ" />
|
||||||
|
</template>
|
||||||
|
<!-- 操作 -->
|
||||||
|
<template #controls="{ row }">
|
||||||
|
<el-link type="danger" @click="delDictItem(row.bqId)">删除</el-link>
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
|
</div>
|
||||||
|
<ChooseMarks v-model="chooseMarksVisible" @choosed="addMarks" :roleIds="roleIds" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import ChooseMarks from "@/components/ChooseList/ChooseMarks/index.vue";
|
||||||
|
import { tbGsxtZdryUpdate } from '@/api/zdr.js'
|
||||||
|
import { ElMessage, ElMessageBox } from "element-plus";
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const { D_GS_BQ_DJ, D_GS_SSYJ } = proxy.$dict("D_GS_BQ_DJ", "D_GS_SSYJ"); //获取字典数据
|
||||||
|
const chooseMarksVisible = ref(false)
|
||||||
|
const props = defineProps({
|
||||||
|
dataList: {
|
||||||
|
type: Object,
|
||||||
|
default: () => { },
|
||||||
|
}, disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
showBut: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
})
|
||||||
|
const listData = ref({})
|
||||||
|
watch(() => props.dataList, (val) => {
|
||||||
|
if (val) {
|
||||||
|
listData.value = val
|
||||||
|
pageData.tableData = val.bqList
|
||||||
|
roleIds.value = val.bqList.map(v => v.bqId)
|
||||||
|
console.log(roleIds.value);
|
||||||
|
|
||||||
|
}
|
||||||
|
}, { deep: true })
|
||||||
|
const roleIds = ref([])
|
||||||
|
// 表格数据
|
||||||
|
const pageData = reactive({
|
||||||
|
tableData: [],
|
||||||
|
tableColumn: [{
|
||||||
|
prop: 'bqMc',
|
||||||
|
label: '标签名称',
|
||||||
|
showOverflowTooltip: true
|
||||||
|
}, {
|
||||||
|
prop: 'bqDm',
|
||||||
|
label: '标签代码',
|
||||||
|
}, {
|
||||||
|
showSolt: true,
|
||||||
|
prop: 'bqLx',
|
||||||
|
label: '标签类型',
|
||||||
|
}, {
|
||||||
|
showSolt: true,
|
||||||
|
prop: 'bqLb',
|
||||||
|
label: '标签类别',
|
||||||
|
}],
|
||||||
|
tableHeight: '200px',
|
||||||
|
keyCount: 0,
|
||||||
|
tableConfiger: {
|
||||||
|
border: true,
|
||||||
|
stripe: true,
|
||||||
|
showHeader: true,
|
||||||
|
showIndex: true,
|
||||||
|
indexLabel: '序号',
|
||||||
|
indexWidth: 60,
|
||||||
|
align: 'center',
|
||||||
|
showOverflowTooltip: true,
|
||||||
|
haveControls: !props.disabled
|
||||||
|
},
|
||||||
|
controlsWidth: 200,
|
||||||
|
})
|
||||||
|
// 修改数据接口
|
||||||
|
const zdqtUpdate = (val) => {
|
||||||
|
const params = {
|
||||||
|
id: listData.value.id,
|
||||||
|
bqList: pageData.tableData
|
||||||
|
}
|
||||||
|
tbGsxtZdryUpdate(params).then(res => {
|
||||||
|
proxy.$message({
|
||||||
|
message: val,
|
||||||
|
type: 'success'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 新增标签
|
||||||
|
const addMarks = (val) => {
|
||||||
|
pageData.tableData = 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)
|
||||||
|
if (!props.disabled && props.showBut) {
|
||||||
|
zdqtUpdate("标签添加成功")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 删除标签
|
||||||
|
const delDictItem = (val) => {
|
||||||
|
if (!props.disabled && props.showBut) {
|
||||||
|
ElMessageBox.confirm(
|
||||||
|
'是否删除标签',
|
||||||
|
'提示',
|
||||||
|
{
|
||||||
|
confirmButtonText: '确认',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning',
|
||||||
|
}
|
||||||
|
)
|
||||||
|
.then(() => {
|
||||||
|
pageData.tableData = pageData.tableData.filter(v => v.bqId != val)
|
||||||
|
roleIds.value = roleIds.value.filter(v => v != val)
|
||||||
|
zdqtUpdate("标签删除成功")
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
ElMessage({
|
||||||
|
type: 'info',
|
||||||
|
message: '取消删除',
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
} else {
|
||||||
|
pageData.tableData = pageData.tableData.filter(v => v.bqId != val)
|
||||||
|
roleIds.value = roleIds.value.filter(v => v != val)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
// 抛出数据并验证标签列表不为空
|
||||||
|
const throwData = () => {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
// 验证：确保标签列表不为空
|
||||||
|
if (!pageData.tableData || pageData.tableData.length === 0) {
|
||||||
|
throw new Error('请选择群体标签');
|
||||||
|
}
|
||||||
|
resolve(pageData.tableData);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
defineExpose({
|
||||||
|
throwData
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "~@/assets/css/layout.scss";
|
||||||
|
@import "~@/assets/css/element-plus.scss";
|
||||||
|
|
||||||
|
.backinfo-container {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left_box {
|
||||||
|
width: 200px;
|
||||||
|
border: 1px solid #c8c8c89a;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right_box {
|
||||||
|
width: calc(100% - 230px);
|
||||||
|
overflow-y: auto;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-form-item__content {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headClass {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #303133;
|
||||||
|
margin: 0 0 10px 0;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 2px solid #409eff;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headClass::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: -2px;
|
||||||
|
width: 60px;
|
||||||
|
height: 2px;
|
||||||
|
background-color: #409eff;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -0,0 +1,247 @@
|
|||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="headClass" style="">
|
||||||
|
<h3>关联车辆</h3>
|
||||||
|
<el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button>
|
||||||
|
</div>
|
||||||
|
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||||
|
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||||
|
<template #clys="{ row }">
|
||||||
|
<DictTag :tag="false" :value="row.clys" :options="D_BZ_CLYS" />
|
||||||
|
</template>
|
||||||
|
<template #cllx="{ row }">
|
||||||
|
<DictTag :tag="false" :value="row.cllx" :options="D_BZ_CLLX" />
|
||||||
|
</template>
|
||||||
|
<template #clpp="{ row }">
|
||||||
|
<DictTag :tag="false" :value="row.clpp" :options="D_BZ_CLPP" />
|
||||||
|
</template>
|
||||||
|
<!-- 操作 -->
|
||||||
|
<template #controls="{ row }">
|
||||||
|
<el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
|
||||||
|
<el-link type="danger" @click="updDictItem(row)">修改</el-link>
|
||||||
|
</template>
|
||||||
|
</MyTable>
|
||||||
|
</div>
|
||||||
|
<VehiclDoing v-model="chooseMarksVisible" @comfirm="addMarks" :data="dataModel"
|
||||||
|
:dict="{ D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP }" />
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
|
||||||
|
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||||
|
import VehiclDoing from "../component/vehiclDoing.vue";
|
||||||
|
import { tbZdryClxxAdd, tbZdryClxxBatchAdd, tbZdryClxxDelete, tbZdryClxxSelectPage, tbZdryClxxUpdate } from '@/api/zdr.js'
|
||||||
|
import { ElMessage, ElMessageBox } from "element-plus";
|
||||||
|
const { proxy } = getCurrentInstance();
|
||||||
|
const { D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP } = proxy.$dict("D_BZ_CLLX", "D_BZ_CLYS", "D_BZ_CLPP"); //获取字典数据
|
||||||
|
const chooseMarksVisible = ref(false)
|
||||||
|
const props = defineProps({
|
||||||
|
dataList: {
|
||||||
|
type: Object,
|
||||||
|
default: () => { },
|
||||||
|
}, disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
showBut: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
})
|
||||||
|
const listData = ref({})
|
||||||
|
const addUpd = ref(true)
|
||||||
|
watch(() => props.dataList, (val) => {
|
||||||
|
if (val) {
|
||||||
|
listData.value = val
|
||||||
|
gettbZdryClxxSelectPage()
|
||||||
|
}
|
||||||
|
}, { deep: true })
|
||||||
|
// 表格数据
|
||||||
|
const pageData = reactive({
|
||||||
|
tableData: [],
|
||||||
|
tableColumn: [{
|
||||||
|
prop: 'cph',
|
||||||
|
label: '车牌号',
|
||||||
|
}, {
|
||||||
|
prop: 'cllx',
|
||||||
|
label: '车辆类型',
|
||||||
|
showSolt: true,
|
||||||
|
prop: 'clpp',
|
||||||
|
}, {
|
||||||
|
showSolt: true,
|
||||||
|
prop: 'clys',
|
||||||
|
label: '车辆颜色',
|
||||||
|
}, {
|
||||||
|
showSolt: true,
|
||||||
|
prop: 'clpp',
|
||||||
|
label: '车辆品牌',
|
||||||
|
|
||||||
|
prop: 'clsbm',
|
||||||
|
label: '车辆识别码',
|
||||||
|
}],
|
||||||
|
tableHeight: '200px',
|
||||||
|
keyCount: 0,
|
||||||
|
tableConfiger: {
|
||||||
|
border: true,
|
||||||
|
stripe: true,
|
||||||
|
showHeader: true,
|
||||||
|
showIndex: true,
|
||||||
|
indexLabel: '序号',
|
||||||
|
indexWidth: 60,
|
||||||
|
align: 'center',
|
||||||
|
showOverflowTooltip: true,
|
||||||
|
haveControls: !props.disabled
|
||||||
|
},
|
||||||
|
controlsWidth: 200,
|
||||||
|
})
|
||||||
|
// 修改数据接口
|
||||||
|
const dataModel = ref()
|
||||||
|
const addMarks = (val) => {
|
||||||
|
const params = {
|
||||||
|
...val,
|
||||||
|
zdrid: listData.value.id,
|
||||||
|
}
|
||||||
|
if (props.showBut && !props.disabled) {
|
||||||
|
if (addUpd.value) {
|
||||||
|
tbZdryClxxAdd(params).then(res => {
|
||||||
|
gettbZdryClxxSelectPage()
|
||||||
|
proxy.$message({
|
||||||
|
message: '关联车辆添加成功',
|
||||||
|
type: 'success'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
tbZdryClxxUpdate(params).then(res => {
|
||||||
|
gettbZdryClxxSelectPage()
|
||||||
|
proxy.$message({
|
||||||
|
message: '关联车辆修改成功',
|
||||||
|
type: 'success'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
pageData.tableData.push(val)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 删除车辆
|
||||||
|
const delDictItem = (val) => {
|
||||||
|
if (!props.disabled && props.showBut) {
|
||||||
|
ElMessageBox.confirm(
|
||||||
|
'是否删除关联车辆',
|
||||||
|
'提示',
|
||||||
|
{
|
||||||
|
confirmButtonText: '确认',
|
||||||
|
cancelButtonText: '取消',
|
||||||
|
type: 'warning',
|
||||||
|
}
|
||||||
|
)
|
||||||
|
.then(() => {
|
||||||
|
tbZdryClxxDelete({ ids: [val] }).then(res => {
|
||||||
|
gettbZdryClxxSelectPage()
|
||||||
|
proxy.$message({
|
||||||
|
message: '关联车辆删除成功',
|
||||||
|
type: 'success'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
})
|
||||||
|
.catch(() => {
|
||||||
|
ElMessage({
|
||||||
|
type: 'info',
|
||||||
|
message: '取消删除',
|
||||||
|
})
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
pageData.tableData = pageData.tableData.filter(v => v.id != val)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
const updDictItem = (val) => {
|
||||||
|
chooseMarksVisible.value = true
|
||||||
|
addUpd.value = false
|
||||||
|
dataModel.value = val
|
||||||
|
}
|
||||||
|
const AddPore = () => {
|
||||||
|
chooseMarksVisible.value = true
|
||||||
|
dataModel.value = {}
|
||||||
|
addUpd.value = true
|
||||||
|
}
|
||||||
|
// 查询车辆
|
||||||
|
const gettbZdryClxxSelectPage = () => {
|
||||||
|
const promes = {
|
||||||
|
pageCurrent: 1,
|
||||||
|
pageSize: 20,
|
||||||
|
zdrid: listData.value.id
|
||||||
|
}
|
||||||
|
tbZdryClxxSelectPage(promes).then(res => {
|
||||||
|
pageData.tableData = res.records
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 抛出数据并验证标签列表不为空
|
||||||
|
const throwData = () => {
|
||||||
|
return new Promise((resolve) => {
|
||||||
|
// // 验证：确保标签列表不为空
|
||||||
|
// if (!pageData.tableData || pageData.tableData.length === 0) {
|
||||||
|
// throw new Error('请录入车辆信息');
|
||||||
|
// }
|
||||||
|
resolve(pageData.tableData);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
defineExpose({
|
||||||
|
throwData
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import "~@/assets/css/layout.scss";
|
||||||
|
@import "~@/assets/css/element-plus.scss";
|
||||||
|
|
||||||
|
.backinfo-container {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left_box {
|
||||||
|
width: 200px;
|
||||||
|
border: 1px solid #c8c8c89a;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right_box {
|
||||||
|
width: calc(100% - 230px);
|
||||||
|
overflow-y: auto;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .el-form-item__content {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headClass {
|
||||||
|
font-size: 18px;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #303133;
|
||||||
|
margin: 0 0 10px 0;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 2px solid #409eff;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.headClass::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: -2px;
|
||||||
|
width: 60px;
|
||||||
|
height: 2px;
|
||||||
|
background-color: #409eff;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@ -4,8 +4,8 @@ function resolve(dir) {
|
|||||||
return path.join(__dirname, dir);
|
return path.join(__dirname, dir);
|
||||||
}
|
}
|
||||||
|
|
||||||
// const serverHost = "http://192.168.1.32:8006"//波哥
|
const serverHost = "http://192.168.1.32:8006"//波哥
|
||||||
const serverHost = "http://192.168.0.231:8006"//线上
|
// const serverHost = "http://192.168.0.231:8006"//线上
|
||||||
// const serverHost = "http://192.168.1.117:8006"//周
|
// const serverHost = "http://192.168.1.117:8006"//周
|
||||||
// const serverHost = "http://192.168.1.98:8006"//毛毛
|
// const serverHost = "http://192.168.1.98:8006"//毛毛
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user