lcw
This commit is contained in:
@ -3,14 +3,8 @@
|
||||
<div class="backinfo-container">
|
||||
<div class="headClass" style="">
|
||||
<h3>背景信息</h3>
|
||||
<el-button type="primary" v-if="showBut" :disabled="disabled" @click="ClickSave">保存</el-button>
|
||||
<el-button type="primary" v-if="showBut" :disabled="disabled" @click="submitForm(ruleFormRef)">保存</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>
|
||||
<!-- 全部输入框 -->
|
||||
<el-form class="record" ref="ruleFormRef" :model="ruleForm" :rules="rules">
|
||||
@ -19,17 +13,16 @@
|
||||
<div>拘留所记录：</div>
|
||||
<div>
|
||||
<div v-for="(item, i) in ruleForm.detentionCenterRecords" :key="item.id" class="detentionFacilityArr">
|
||||
<el-form-item :prop="'detentionCenterRecords.' + i + '.str'" :rules="rules.str">
|
||||
|
||||
<el-input v-model="ruleForm.detentionCenterRecords[i].str" class="detentionFacilityInput"
|
||||
placeholder="请输入拘留所记录" />
|
||||
<el-form-item :prop="'detentionCenterRecords.' + i + '.str'" :rules="rules.str">
|
||||
<el-input v-model="ruleForm.detentionCenterRecords[i].str" type="textarea"
|
||||
class="detentionFacilityInput" placeholder="请输入拘留所记录" />
|
||||
</el-form-item>
|
||||
|
||||
<el-button type="primary"
|
||||
v-if="ruleForm.detentionCenterRecords.length > 1 && i != ruleForm.detentionCenterRecords.length - 1"
|
||||
@click="decreaseRecord(i, '拘留所')">−</el-button>
|
||||
<el-button type="primary" @click="addRecord(i, '拘留所')"
|
||||
v-if="ruleForm.detentionCenterRecords.length - 1 == i">+</el-button>
|
||||
<div style="width: 100px;">
|
||||
<el-button type="primary" v-if="ruleForm.detentionCenterRecords.length != 1"
|
||||
@click="decreaseRecord(i, '拘留所')">−</el-button>
|
||||
<el-button type="primary" @click="addRecord(i, '拘留所')"
|
||||
v-if="i == ruleForm.detentionCenterRecords.length - 1">+</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -38,21 +31,20 @@
|
||||
<div>看守所记录：</div>
|
||||
<div>
|
||||
<div v-for="(item, i) in ruleForm.prison" :key="item.id" class="detentionFacilityArr">
|
||||
<el-form-item :prop="'prison.' + i + '.str'" :rules="rules.str">
|
||||
<el-input v-model="ruleForm.prison[i].str"
|
||||
class="detentionFacilityInput" placeholder="请输入拘留所记录"
|
||||
@input="changeprison(ruleForm.prison[i].str)"
|
||||
/>
|
||||
<el-form-item :prop="'prison.' + i + '.str'" :rules="rules.str">
|
||||
<el-input v-model="ruleForm.prison[i].str" type="textarea" class="detentionFacilityInput"
|
||||
placeholder="请输入拘留所记录" />
|
||||
</el-form-item>
|
||||
<el-button type="primary" v-if="ruleForm.prison.length > 1 && i != ruleForm.prison.length - 1"
|
||||
<div style="width: 100px;">
|
||||
<el-button type="primary" v-if="ruleForm.prison.length != 1"
|
||||
@click="decreaseRecord(i, '看守所')">−</el-button>
|
||||
<el-button type="primary" @click="addRecord(i, '看守所')" v-if="ruleForm.prison.length - 1 == i">+</el-button>
|
||||
<el-button type="primary" @click="addRecord(i, '看守所')"
|
||||
v-if="i == ruleForm.prison.length - 1">+</el-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="sumbitBtnBOX">
|
||||
<el-button type="primary" @click="submitForm(ruleFormRef)" class="sumbitBtn">确认提交</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
@ -60,9 +52,9 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch, onMounted } from "vue";
|
||||
import { Delete, Download } from '@element-plus/icons';
|
||||
// import { tbGsxtZdryUpdate } from '@/api/zdr.js'
|
||||
import { reactive, ref, watch, onMounted, getCurrentInstance } from "vue";
|
||||
import { tbGsxtZdryUpdate } from '@/api/zdr.js'
|
||||
const { proxy } = getCurrentInstance();
|
||||
const props = defineProps({
|
||||
dataList: {
|
||||
type: Object,
|
||||
@ -76,7 +68,6 @@ const props = defineProps({
|
||||
default: false
|
||||
},
|
||||
})
|
||||
const jljl = ref([])
|
||||
const ruleFormRef = ref()
|
||||
const ruleForm = reactive({
|
||||
detentionCenterRecords: [{ id: 0, str: "" }],
|
||||
@ -84,33 +75,28 @@ const ruleForm = reactive({
|
||||
})
|
||||
// 表单校验
|
||||
const rules = reactive({
|
||||
str: [
|
||||
{ required: true, message: '请输入具体信息', trigger: 'blur' },
|
||||
{ min: 3, max: 20, message: '请最少输入3个字,最多输入20个字', trigger: 'blur' },
|
||||
],
|
||||
// str: [
|
||||
// { required: true, message: '请输入具体信息', trigger: 'blur' },
|
||||
// { min: 3, max: 20, message: '请最少输入3个字,最多输入20个字', trigger: 'blur' },
|
||||
// ],
|
||||
})
|
||||
watch(() => props.dataList, (val) => {
|
||||
if (val) {
|
||||
// qtbjxx.value = val.qtBjzl
|
||||
ruleForm.detentionCenterRecords = val.jlsJl && val.kssJl.length > 0 ? val.jlsJl.map((item, index) => {
|
||||
return {
|
||||
id: index,
|
||||
str: item
|
||||
}
|
||||
}) : [{ id: 0, str: "" }],
|
||||
ruleForm.prison = val.kssJl && val.kssJl.length > 0 ? val.kssJl.map((item, index) => {
|
||||
return {
|
||||
id: index,
|
||||
str: item
|
||||
}
|
||||
}) : [{ id: 0, str: "" }]
|
||||
}
|
||||
}, { deep: true })
|
||||
onMounted(() => {
|
||||
console.log('组件已挂载')
|
||||
|
||||
})
|
||||
const throwData = () => {
|
||||
return new Promise((resolve) => {
|
||||
// 基本验证：确保背景信息不为空
|
||||
if (!qtbjxx.value.trim()) {
|
||||
throw new Error('请输入群体背景信息');
|
||||
}
|
||||
|
||||
resolve({
|
||||
qtbjxx: qtbjxx.value,
|
||||
fileList: fileList.value
|
||||
});
|
||||
});
|
||||
}
|
||||
// 增加输入记录输入框
|
||||
const addRecord = (val, type) => {
|
||||
if (type == '拘留所') {
|
||||
@ -118,7 +104,6 @@ const addRecord = (val, type) => {
|
||||
} else {
|
||||
ruleForm.prison.push({ id: val })
|
||||
}
|
||||
|
||||
}
|
||||
// 减少输入记录输入框
|
||||
const decreaseRecord = (val, type) => {
|
||||
@ -129,25 +114,33 @@ const decreaseRecord = (val, type) => {
|
||||
}
|
||||
|
||||
}
|
||||
const changeprison=(value)=>{
|
||||
console.log(value,"jafahfahf");
|
||||
|
||||
}
|
||||
|
||||
//提交数据校验表单
|
||||
const submitForm = async (formEl) => {
|
||||
console.log(formEl,"formElformEl");
|
||||
|
||||
if (!formEl) return
|
||||
await formEl.validate((valid, fields) => {
|
||||
console.log(valid,fields,"22222222");
|
||||
|
||||
if (valid) {
|
||||
const promes = {
|
||||
id: props.dataList.id,
|
||||
jlsJl: ruleForm.detentionCenterRecords.map(item => item.str),
|
||||
kssJl: ruleForm.prison.map(item => item.str),
|
||||
}
|
||||
tbGsxtZdryUpdate(promes).then((res) => {
|
||||
proxy.$message.success('保存成功')
|
||||
}).catch((err) => {
|
||||
proxy.$message.error('保存失败')
|
||||
});
|
||||
console.log('submit!')
|
||||
} else {
|
||||
console.log('error submit!', fields)
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
const throwData = () => {
|
||||
return new Promise((resolve) => {
|
||||
resolve(ruleForm);
|
||||
});
|
||||
}
|
||||
defineExpose({
|
||||
throwData
|
||||
})
|
||||
@ -202,7 +195,7 @@ defineExpose({
|
||||
|
||||
.detentionFacilityArr {
|
||||
display: flex;
|
||||
|
||||
|
||||
margin-top: 20px;
|
||||
justify-content: space-between;
|
||||
|
||||
|
||||
@ -0,0 +1,296 @@
|
||||
<template>
|
||||
<div class="backinfo-container">
|
||||
<div class="headClass">
|
||||
<h3>行为信息</h3>
|
||||
</div>
|
||||
|
||||
<!-- 搜索区域 -->
|
||||
<!-- <div class="search-container">
|
||||
<el-form :inline="true" :model="searchForm" class="demo-form-inline">
|
||||
<el-form-item label="行为类型">
|
||||
<el-select v-model="searchForm.behaviorType" placeholder="请选择">
|
||||
<el-option label="全部" value=""></el-option>
|
||||
<el-option label="购票" value="ticket"></el-option>
|
||||
<el-option label="入住" value="hotel"></el-option>
|
||||
<el-option label="出入境" value="border"></el-option>
|
||||
<el-option label="基站认证" value="baseStation"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="时间范围">
|
||||
<el-date-picker
|
||||
v-model="searchForm.timeRange"
|
||||
type="daterange"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
format="YYYY-MM-DD HH:mm:ss"
|
||||
value-format="YYYY-MM-DD HH:mm:ss"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleSearch">搜索</el-button>
|
||||
<el-button @click="resetSearch">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div> -->
|
||||
|
||||
<!-- 列表区域 -->
|
||||
<div class="list-container">
|
||||
<div v-loading="loading" class="behavior-list">
|
||||
<div class="behavior-list-inner">
|
||||
<div
|
||||
v-for="(item, index) in behaviorList"
|
||||
:key="item.id"
|
||||
class="behavior-item"
|
||||
>
|
||||
<div class="behavior-item-header">
|
||||
<span class="behavior-index">{{ index + 1 }}.</span>
|
||||
<el-tag :type="getTagType(item.behaviorType)">{{ item.behaviorTypeName }}</el-tag>
|
||||
<span class="behavior-time">{{ item.time }}</span>
|
||||
</div>
|
||||
<div class="behavior-item-content">
|
||||
<p class="behavior-description">{{ item.description }}</p>
|
||||
<p class="behavior-location"><i class="el-icon-location-outline"></i> {{ item.location }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div v-if="!loading && behaviorList.length === 0" class="empty-state">
|
||||
<el-empty description="暂无行为记录" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, getCurrentInstance, onMounted } from 'vue'
|
||||
import GdMap from "@/components/GdMap/index.vue";
|
||||
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_ZJLX } = proxy.$dict("D_BZ_ZJLX")
|
||||
|
||||
// 搜索表单
|
||||
const searchForm = ref({
|
||||
behaviorType: '',
|
||||
timeRange: null
|
||||
})
|
||||
|
||||
// 列表数据
|
||||
const behaviorList = ref([])
|
||||
const loading = ref(false)
|
||||
|
||||
// 获取标签类型
|
||||
const getTagType = (type) => {
|
||||
const typeMap = {
|
||||
'ticket': 'success',
|
||||
'hotel': 'primary',
|
||||
'border': 'warning',
|
||||
'baseStation': 'info'
|
||||
}
|
||||
return typeMap[type] || 'default'
|
||||
}
|
||||
|
||||
// 搜索
|
||||
const handleSearch = () => {
|
||||
fetchData()
|
||||
}
|
||||
|
||||
// 重置搜索
|
||||
const resetSearch = () => {
|
||||
searchForm.value = {
|
||||
behaviorType: '',
|
||||
timeRange: null
|
||||
}
|
||||
fetchData()
|
||||
}
|
||||
|
||||
// 获取数据
|
||||
const fetchData = () => {
|
||||
loading.value = true
|
||||
|
||||
// 模拟API请求延迟
|
||||
setTimeout(() => {
|
||||
// 模拟数据
|
||||
const mockData = [
|
||||
{
|
||||
id: 1,
|
||||
behaviorType: 'baseStation',
|
||||
behaviorTypeName: '基站认证',
|
||||
description: '2025-5-22 14:30:20出现在南宁市青秀区云网网咖',
|
||||
location: '广西壮族自治区南宁市青秀区',
|
||||
time: '2025-05-22 14:30:20'
|
||||
}
|
||||
]
|
||||
|
||||
// 根据搜索条件过滤数据
|
||||
let filteredData = [...mockData]
|
||||
if (searchForm.value.behaviorType) {
|
||||
filteredData = filteredData.filter(item => item.behaviorType === searchForm.value.behaviorType)
|
||||
}
|
||||
|
||||
if (searchForm.value.timeRange && searchForm.value.timeRange.length === 2) {
|
||||
const [startTime, endTime] = searchForm.value.timeRange
|
||||
filteredData = filteredData.filter(item => {
|
||||
const itemTime = new Date(item.time)
|
||||
return itemTime >= new Date(startTime) && itemTime <= new Date(endTime)
|
||||
})
|
||||
}
|
||||
|
||||
behaviorList.value = filteredData
|
||||
|
||||
loading.value = false
|
||||
}, 500)
|
||||
}
|
||||
|
||||
// 页面加载时获取数据
|
||||
onMounted(() => {
|
||||
fetchData()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@import "~@/assets/css/layout.scss";
|
||||
@import "~@/assets/css/element-plus.scss";
|
||||
|
||||
.backinfo-container {
|
||||
padding: 20px;
|
||||
width: 100%;
|
||||
background-color: #f5f7fa;
|
||||
}
|
||||
|
||||
.headClass {
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin: 0 0 20px 0;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: 2px solid #409eff;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.search-container {
|
||||
background-color: #fff;
|
||||
padding: 16px;
|
||||
border-radius: 6px;
|
||||
margin-bottom: 16px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
|
||||
|
||||
}
|
||||
|
||||
.demo-form-inline {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.list-container {
|
||||
background-color: #fff;
|
||||
padding: 16px;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.behavior-list {
|
||||
max-height: 600px;
|
||||
overflow: hidden; /* 完全禁止滚动条 */
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.behavior-list-inner {
|
||||
max-height: 600px;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
padding-right: 10px; /* 为滚动条留出空间但不显示 */
|
||||
}
|
||||
|
||||
.behavior-item {
|
||||
padding: 16px;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
transition: all 0.3s ease;
|
||||
position: relative;
|
||||
left: 0; /* 初始位置 */
|
||||
}
|
||||
|
||||
.behavior-item:hover {
|
||||
background-color: #fafafa;
|
||||
left: 5px; /* 使用left属性代替transform，避免触发滚动条 */
|
||||
}
|
||||
|
||||
.behavior-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.behavior-item-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.behavior-index {
|
||||
font-weight: 600;
|
||||
color: #606266;
|
||||
margin-right: 12px;
|
||||
min-width: 20px;
|
||||
}
|
||||
|
||||
.behavior-time {
|
||||
margin-left: auto;
|
||||
color: #909399;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.behavior-item-content {
|
||||
padding-left: 32px;
|
||||
}
|
||||
|
||||
.behavior-description {
|
||||
margin: 0 0 8px 0;
|
||||
color: #303133;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.behavior-location {
|
||||
margin: 0;
|
||||
color: #606266;
|
||||
font-size: 13px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.empty-state {
|
||||
padding: 60px 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
::v-deep .el-tag {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
::v-deep .el-date-editor .el-range-separator {
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.backinfo-container {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.demo-form-inline {
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
}
|
||||
|
||||
.demo-form-inline .el-form-item {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.pagination-container {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -36,7 +36,7 @@ import { identityCardRule } from "@/utils/rules"
|
||||
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, tbGsxtZdryAjxxselectAjxx, tbZdryClxxUpdate } from '@/api/zdr.js'
|
||||
import {tbGsxtZdryAjxxSaveOrUpdateAjxx, tbGsxtZdryAjxx, tbGsxtZdryAjxxselectAjxx } 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"); //获取字典数据
|
||||
@ -66,16 +66,16 @@ watch(() => props.dataList, (val) => {
|
||||
const pageData = reactive({
|
||||
tableData: [],
|
||||
tableColumn: [{
|
||||
prop: 'cph',
|
||||
prop: 'ajbm',
|
||||
label: '案件编号',
|
||||
}, {
|
||||
prop: 'cllx',
|
||||
prop: 'ajmc',
|
||||
label: '案件名称',
|
||||
showSolt: true,
|
||||
prop: 'clpp',
|
||||
}, {
|
||||
showSolt: true,
|
||||
prop: 'clys',
|
||||
prop: 'sasj',
|
||||
label: '受案时间',
|
||||
},],
|
||||
tableHeight: '200px',
|
||||
@ -93,12 +93,6 @@ const pageData = reactive({
|
||||
},
|
||||
controlsWidth: 200,
|
||||
})
|
||||
// 表单数据
|
||||
const formData = reactive({
|
||||
username: "",
|
||||
ID: ""
|
||||
})
|
||||
const rulesForm = ref(identityCardRule({ validator: true }, 'rySfzh'))
|
||||
// 修改数据接口
|
||||
const dataModel = ref()
|
||||
const addMarks = (val) => {
|
||||
@ -108,7 +102,7 @@ const addMarks = (val) => {
|
||||
}
|
||||
if (props.showBut && !props.disabled) {
|
||||
if (addUpd.value) {
|
||||
tbZdryClxxAdd(params).then(res => {
|
||||
tbGsxtZdryAjxxSaveOrUpdateAjxx(params).then(res => {
|
||||
gettbZdryClxxSelectPage()
|
||||
proxy.$message({
|
||||
message: '关联车辆添加成功',
|
||||
@ -130,14 +124,12 @@ const addMarks = (val) => {
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
// console.log(identityCardRule,"dadad1");
|
||||
|
||||
})
|
||||
// 删除车辆
|
||||
const delDictItem = (val) => {
|
||||
if (!props.disabled && props.showBut) {
|
||||
ElMessageBox.confirm(
|
||||
'是否删除关联车辆',
|
||||
'是否删除案件信息',
|
||||
'提示',
|
||||
{
|
||||
confirmButtonText: '确认',
|
||||
@ -146,10 +138,10 @@ const delDictItem = (val) => {
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
tbZdryClxxDelete({ ids: [val] }).then(res => {
|
||||
tbGsxtZdryAjxx(val).then(res => {
|
||||
gettbZdryClxxSelectPage()
|
||||
proxy.$message({
|
||||
message: '关联车辆删除成功',
|
||||
message: '案件信息删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
})
|
||||
@ -179,13 +171,9 @@ const AddPore = () => {
|
||||
// 查询车辆
|
||||
const gettbZdryClxxSelectPage = () => {
|
||||
const promes = {
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
zdrid: listData.value.id
|
||||
}
|
||||
tbGsxtZdryAjxxselectAjxx(promes).then(res => {
|
||||
console.log(res, "案件信息");
|
||||
|
||||
pageData.tableData = res.records
|
||||
})
|
||||
}
|
||||
|
||||
@ -2,63 +2,50 @@
|
||||
<div>
|
||||
<div class="headClass" style="">
|
||||
<h3>密切联系人</h3>
|
||||
<!-- <el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button> -->
|
||||
|
||||
<el-button type="primary" @click="openDialog('新增密切联系人', {}, true)">新增</el-button>
|
||||
</div>
|
||||
<div class="headSelect">
|
||||
<el-form :model="formData" :inline="true" ref="formRef" :rules="rulesForm" class="form-inline">
|
||||
<!-- 姓名 -->
|
||||
<el-form-item label="姓名" prop="username" :rules="[
|
||||
{ required: true, message: '请输入用户名', trigger: 'blur' },
|
||||
{ min: 2, max: 4, message: '长度在 2 到 4 个字符', trigger: 'blur' }
|
||||
]">
|
||||
<el-input v-model="formData.username" placeholder="请输入姓名" style="width: 120px;" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- <el-form-item label="姓名">
|
||||
<el-input v-model="formData.username" placeholder="请输入姓名" />
|
||||
</el-form-item> -->
|
||||
<!-- 身份证号码 -->
|
||||
<el-form-item label="身份证号码" prop="cardID" :rules="[
|
||||
{ required: true, message: '请输入身份证号码', trigger: 'blur' }
|
||||
]">
|
||||
<el-input v-model="formData.ID" placeholder="请输入身份证号码" style="width: 200px;" />
|
||||
<el-form-item label="身份证号码">
|
||||
<el-input v-model="formData.rySfzh" placeholder="请输入身份证号码" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 按钮组：统一放在一个 item 中 -->
|
||||
<el-form-item class="form-actions">
|
||||
<el-button type="primary" @click="check">查询</el-button>
|
||||
<el-button @click="resetForm">重置</el-button>
|
||||
<el-button @click="openDialog('新增密切联系人')">新增</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
|
||||
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
|
||||
<!-- <template #ryXm="{ row }">
|
||||
<DictTag :tag="false" :value="row.clys" :options="D_BZ_CLYS" />
|
||||
</template> -->
|
||||
<template #dygx="{ row }">
|
||||
<DictTag :tag="false" :value="row.dygx" :options="D_BZ_QSGXDM" />
|
||||
</template>
|
||||
<!-- 操作 -->
|
||||
<template #controls="{ row }">
|
||||
<el-link type="danger" @click="delDictItem(row.id)">删除</el-link>
|
||||
<el-link type="danger" @click="openDialog('修改密切联系人', row)">修改</el-link>
|
||||
<el-link type="danger" @click="openDialog('修改密切联系人', row, false)">修改</el-link>
|
||||
</template>
|
||||
</MyTable>
|
||||
<diaLogForm v-model:visible="dialogVisible" :diaLogRules="diaLogRules" :diaLogRuleForm="diaLogRuleForm"
|
||||
@submit="addPersonOrModifica" :Tips="Tips">
|
||||
<diaLogForm v-model="dialogVisible" :data="diaLogRuleForm" @submit="addPersonOrModifica" :title="Tips"
|
||||
:dict="{ D_BZ_QSGXDM }">
|
||||
</diaLogForm>
|
||||
</div>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { identityCardRule } from "@/utils/rules"
|
||||
import { ref, reactive, watch, toRaw, getCurrentInstance, onMounted, onUnmounted } from "vue";
|
||||
import MyTable from "@/components/aboutTable/MyTable.vue";
|
||||
import diaLogForm from "../components/diaLogForm.vue";
|
||||
import { tbGsxtZdryLxrsaveOrUpdateLxr, tbZdryClxxBatchAdd, tbZdryClxxDelete, tbGsxtZdryLxrselectLxrBy, tbZdryClxxUpdate } from '@/api/zdr.js'
|
||||
import diaLogForm from "../component/diaLogForm.vue";
|
||||
import { tbZdryClxxUpdate, tbGsxtZdryLxrsaveOrUpdateLxr,tbGsxtZdryLxrselectLxrBy ,tbGsxtZdryLxr} 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 { D_BZ_QSGXDM } = proxy.$dict("D_BZ_QSGXDM"); //获取字典数据
|
||||
const props = defineProps({
|
||||
dataList: {
|
||||
type: Object,
|
||||
@ -72,37 +59,25 @@ const props = defineProps({
|
||||
default: false
|
||||
},
|
||||
})
|
||||
const ruleForm = ref({
|
||||
name: '',
|
||||
cardID: '',
|
||||
relation: '',
|
||||
phone: '',
|
||||
})
|
||||
const dialogVisible = ref(false)
|
||||
const listData = ref({})
|
||||
const Tips = ref(false)
|
||||
const addUpd = ref(true)
|
||||
const Tips = ref("密切联系人")
|
||||
// 表格数据
|
||||
const pageData = reactive({
|
||||
tableData: [],
|
||||
tableColumn: [{
|
||||
prop: 'ryXm',
|
||||
label: '人员姓名',
|
||||
|
||||
}, {
|
||||
prop: 'rySfzh',
|
||||
label: '身份证号码',
|
||||
width: 200
|
||||
|
||||
}, {
|
||||
|
||||
prop: 'dygx',
|
||||
label: '关系',
|
||||
showSolt: true,
|
||||
}, {
|
||||
|
||||
prop: 'lxrDh',
|
||||
label: '联系电话',
|
||||
width: 120
|
||||
}],
|
||||
tableHeight: '200px',
|
||||
keyCount: 0,
|
||||
@ -120,171 +95,104 @@ const pageData = reactive({
|
||||
controlsWidth: 200,
|
||||
})
|
||||
// 表单数据
|
||||
const formData = reactive({
|
||||
const formData = ref({
|
||||
username: "",
|
||||
ID: ""
|
||||
})
|
||||
const touchIn = ref(true)
|
||||
const rulesForm = ref(identityCardRule({ validator: true }, 'rySfzh'))
|
||||
const diaLogRuleForm = reactive([{ prop: 'username', label: '姓名', type: 'input', value: '' },
|
||||
{ prop: 'cardID', label: '身份证号', type: 'input', value: '' },
|
||||
{ prop: 'relation', label: '关系', type: 'input', value: '' },
|
||||
{ prop: 'phone', label: '联系电话', type: 'input', value: '' }
|
||||
])
|
||||
const diaLogRuleForm = ref({})
|
||||
watch(() => props.dataList, (val) => {
|
||||
if (val) {
|
||||
console.log(val, 'listData.value');
|
||||
|
||||
listData.value = val
|
||||
|
||||
getContact()
|
||||
}
|
||||
}, { deep: true })
|
||||
// 弹出增加或者修改弹窗
|
||||
const openDialog = (type, formVal) => {
|
||||
const openDialog = (type, formVal, bool) => {
|
||||
touchIn.value = bool
|
||||
dialogVisible.value = true
|
||||
Tips.value = type
|
||||
console.log(formVal, "formVal");
|
||||
|
||||
console.log(dialogVisible.value, "dialogVisible.value")
|
||||
if (type === '新增密切联系人') {
|
||||
diaLogRuleForm.forEach(item => {
|
||||
item.value = ''
|
||||
})
|
||||
} else {
|
||||
diaLogRuleForm[0].value = formVal.ryXm
|
||||
diaLogRuleForm[1].value = formVal.rySfzh
|
||||
diaLogRuleForm[2].value = formVal.dygx
|
||||
diaLogRuleForm[3].value = formVal.lxrDh
|
||||
}
|
||||
|
||||
diaLogRuleForm.value = { ...formVal }
|
||||
}
|
||||
// 增加或修改数据接口
|
||||
const dataModel = ref()
|
||||
const addPersonOrModifica = async (val) => {
|
||||
console.log('dafafaf', val)
|
||||
let params = {
|
||||
id: listData.value.id
|
||||
}
|
||||
val.forEach(item => {
|
||||
switch (item.label) {
|
||||
case '姓名':
|
||||
params.ryXm = item.value
|
||||
break
|
||||
case '身份证号':
|
||||
params.rySfzh = item.value
|
||||
break
|
||||
case '关系':
|
||||
params.dygx = item.value
|
||||
break
|
||||
case '联系电话':
|
||||
params.lxrDh = item.value
|
||||
break
|
||||
default:
|
||||
break
|
||||
// 提交表单
|
||||
const addPersonOrModifica = (val) => {
|
||||
if (touchIn.value) {
|
||||
const item = pageData.tableData.findIndex(item => item.rySfzh == val.rySfzh)
|
||||
if (item != -1) {
|
||||
proxy.$message({
|
||||
message: '该人员已存在',
|
||||
type: 'warning'
|
||||
})
|
||||
return
|
||||
}
|
||||
})
|
||||
console.log(params, "fafafafaff");
|
||||
|
||||
if (props.showBut && !props.disabled) {
|
||||
const res = await tbGsxtZdryLxrsaveOrUpdateLxr(params)
|
||||
console.log(res, "联系人增加res");
|
||||
|
||||
// if (type) {
|
||||
|
||||
// if (res.code == 200) {
|
||||
// gettbZdryClxxSelectPage()
|
||||
// proxy.$message({
|
||||
// message: '密切联系人添加成功',
|
||||
// type: 'success'
|
||||
// })
|
||||
// } else {
|
||||
// proxy.$message({
|
||||
// message: '密切联系人添加失败',
|
||||
// type: 'error'
|
||||
// })
|
||||
// }
|
||||
|
||||
|
||||
// } else {
|
||||
// if (res.code == 200) {
|
||||
// gettbZdryClxxSelectPage()
|
||||
// proxy.$message({
|
||||
// message: '密切联系人添加成功',
|
||||
// type: 'success'
|
||||
// })
|
||||
// } else {
|
||||
// proxy.$message({
|
||||
// message: '密切联系人添加失败',
|
||||
// type: 'error'
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
|
||||
} else {
|
||||
pageData.tableData.push(val)
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
// console.log(identityCardRule,"dadad1");
|
||||
|
||||
})
|
||||
// 删除车辆
|
||||
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
|
||||
...val,
|
||||
zdryId: listData.value.id
|
||||
}
|
||||
tbGsxtZdryLxrselectLxrBy(promes).then(res => {
|
||||
tbGsxtZdryLxrsaveOrUpdateLxr(promes).then((res) => {
|
||||
proxy.$message({
|
||||
message: '操作成功',
|
||||
type: 'success'
|
||||
})
|
||||
getContact()
|
||||
}).catch((err) => {
|
||||
proxy.$message({
|
||||
message: '操作失败',
|
||||
type: 'error'
|
||||
})
|
||||
});
|
||||
}
|
||||
const delDictItem = (val) => {
|
||||
ElMessageBox.confirm(
|
||||
'是否删除该联系人',
|
||||
'提示',
|
||||
{
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
|
||||
tbGsxtZdryLxr(val).then((res) => {
|
||||
proxy.$message({
|
||||
message: '删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
getContact()
|
||||
}).catch((err) => {
|
||||
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
proxy.$message({
|
||||
message: '删除失败',
|
||||
type: 'info',
|
||||
})
|
||||
})
|
||||
}
|
||||
const getContact = () => {
|
||||
const promes = { zdryId: listData.value.id }
|
||||
tbGsxtZdryLxrselectLxrBy(promes).then((res) => {
|
||||
pageData.tableData = res
|
||||
console.log(pageData.tableData, "表格原生数据");
|
||||
|
||||
})
|
||||
}
|
||||
const resetForm = () => {
|
||||
formData.value = {}
|
||||
getContact()
|
||||
}
|
||||
const check = () => {
|
||||
if (formData.value.rySfzh) {
|
||||
// 模糊查询：检查身份证号码是否包含输入的内容
|
||||
pageData.tableData = pageData.tableData.filter(item => item.rySfzh && item.rySfzh.includes(formData.value.rySfzh))
|
||||
} else {
|
||||
// 如果输入为空，显示所有数据
|
||||
getContact()
|
||||
}
|
||||
}
|
||||
|
||||
// 抛出数据并验证标签列表不为空
|
||||
const throwData = () => {
|
||||
return new Promise((resolve) => {
|
||||
@ -335,7 +243,9 @@ defineExpose({
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 2px solid #409eff;
|
||||
position: relative;
|
||||
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.headSelect {
|
||||
|
||||
@ -1,51 +1,41 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="headClass" style="">
|
||||
<h3>动态轨迹</h3>
|
||||
<!-- <el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button> -->
|
||||
</div>
|
||||
<div class="headSelect">
|
||||
<el-select v-model="value" placeholder="身份证号码" style="width: 100px">
|
||||
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
<el-select v-model="value" placeholder="请输入内容" style="width: 240px">
|
||||
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
<div class="demo-datetime-picker">
|
||||
<div class="block">
|
||||
<el-date-picker v-model="value2" type="datetimerange" start-placeholder="Start date"
|
||||
end-placeholder="End date" format="YYYY-MM-DD HH:mm:ss" date-format="YYYY/MM/DD ddd"
|
||||
time-format="A hh:mm:ss" />
|
||||
</div>
|
||||
</div>
|
||||
<el-button type="primary" @click="check">查询</el-button>
|
||||
<el-button @click="resetForm">重置</el-button>
|
||||
</div>
|
||||
<div class="mapBox">地图</div>
|
||||
|
||||
<div>
|
||||
<div class="headClass" style="">
|
||||
<h3>动态轨迹</h3>
|
||||
</div>
|
||||
<div class="headSelect">
|
||||
<el-select v-model="listData.zjlx" placeholder="身份证号码" style="width: 240px">
|
||||
<el-option v-for="item in D_BZ_ZJLX" :key="item.dm" :label="item.zdmc" :value="item.dm" />
|
||||
</el-select>
|
||||
<el-input v-model="listData.msg" placeholder="请输入证件号码" style="width: 300px" />
|
||||
<div class="demo-datetime-picker">
|
||||
<div class="block">
|
||||
<el-date-picker v-model="listData.time" type="datetimerange" start-placeholder="开始时间"
|
||||
end-placeholder="结束时间" format="YYYY-MM-DD HH:mm:ss" date-format="YYYY/MM/DD ddd"/>
|
||||
</div>
|
||||
</div>
|
||||
<el-button type="primary" @click="check">查询</el-button>
|
||||
<el-button @click="resetForm">重置</el-button>
|
||||
</div>
|
||||
<div class="mapBox">
|
||||
<!-- <GdMap /> -->
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
|
||||
const value = ref('')
|
||||
|
||||
const options = [
|
||||
{
|
||||
value: '1',
|
||||
label: '身份证号码',
|
||||
},
|
||||
{
|
||||
value: '2',
|
||||
label: '港澳台通行证',
|
||||
},
|
||||
{
|
||||
value: 'Option3',
|
||||
label: 'Option3',
|
||||
},
|
||||
]
|
||||
import { ref, getCurrentInstance } from 'vue'
|
||||
import GdMap from "@/components/GdMap/index.vue";
|
||||
// import
|
||||
const { proxy } = getCurrentInstance();
|
||||
const { D_BZ_ZJLX } = proxy.$dict("D_BZ_ZJLX")
|
||||
const listData= ref({})
|
||||
const check = () => { }
|
||||
const resetForm = () => {
|
||||
listData.value = {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
@ -53,60 +43,64 @@ const options = [
|
||||
@import "~@/assets/css/element-plus.scss";
|
||||
|
||||
.backinfo-container {
|
||||
padding: 10px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
::v-deep(.el-form) {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.left_box {
|
||||
width: 200px;
|
||||
border: 1px solid #c8c8c89a;
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
width: 200px;
|
||||
border: 1px solid #c8c8c89a;
|
||||
border-radius: 5px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.right_box {
|
||||
width: calc(100% - 230px);
|
||||
overflow-y: auto;
|
||||
padding: 5px;
|
||||
width: calc(100% - 230px);
|
||||
overflow-y: auto;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
::v-deep .el-form-item__content {
|
||||
display: block !important;
|
||||
display: block !important;
|
||||
}
|
||||
::v-deep .el-range-input{
|
||||
color: #000 !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;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin: 0 0 10px 0;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 2px solid #409eff;
|
||||
position: relative;
|
||||
|
||||
}
|
||||
|
||||
.headSelect {
|
||||
width: 100%;
|
||||
margin: 20px 0;
|
||||
padding:0 16px;
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid #eee;
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
justify-content: space-between;
|
||||
|
||||
width: 100%;
|
||||
margin: 20px 0;
|
||||
padding: 0 16px;
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid #eee;
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
justify-content: space-between;
|
||||
|
||||
}
|
||||
.mapBox{
|
||||
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
background-color: rgba(0, 123, 255, 0.5);
|
||||
}
|
||||
|
||||
.mapBox {
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
position: relative;
|
||||
background-color: rgba(0, 123, 255, 0.5);
|
||||
}
|
||||
|
||||
h3 {
|
||||
margin: 0;
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
||||
@ -1,11 +1,11 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="headClass">
|
||||
<h3>群体背景信息</h3>
|
||||
<h3>人员信息</h3>
|
||||
<!-- @click="gettbGsxtZdqtUpdate" -->
|
||||
<el-button type="primary" v-if="showBut" :disabled="disabled" @click="submit">保存</el-button>
|
||||
</div>
|
||||
<div class="form_cnt">
|
||||
<div>
|
||||
<FormMessage :disabled="disabled" v-model="listQuery" :formList="formData" labelWidth="100px" ref="elform"
|
||||
:rules="rules">
|
||||
<template #ryzp>
|
||||
@ -18,13 +18,13 @@
|
||||
<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="primary" :icon="Plus" circle @click="addPhone" title="添加电话号码" v-if=" listQuery.ryLxdh.length-1 ==index"/>
|
||||
<el-button type="success" :icon="Minus" circle @click="removePhone(index)" title="删除电话号码" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #tags>
|
||||
<!-- <template #tags>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<el-button type="primary" :disabled="disabled" @click="chooseMarksVisible = true">
|
||||
选择标签
|
||||
@ -33,12 +33,12 @@
|
||||
已选择 {{ roleIds.length }} 个标签
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</template> -->
|
||||
|
||||
</FormMessage>
|
||||
</div>
|
||||
</div>
|
||||
<ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" />
|
||||
<!-- <ChooseMarks v-model="chooseMarksVisible" @choosed="choosed" :roleIds="roleIds" /> -->
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
@ -50,8 +50,8 @@ 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 { D_BZ_XB, D_BZ_ZZMM, D_BZ_HYZK, D_BZ_MZ, D_BZ_XZQHDM, D_ZDRY_RYLX,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_ZDRY_RYLX",'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,
|
||||
@ -77,7 +77,8 @@ const rules = reactive({
|
||||
ryCsrq: [{ required: true, message: "请选择出生日期", trigger: "change" }],
|
||||
ryJg: [{ required: true, message: "请选择籍贯", trigger: "change" }],
|
||||
zdrRyjb: [{ required: true, message: "请选择人员级别", trigger: "change" }],
|
||||
zdrYjdj: [{ required: true, message: "请选择预警等级", trigger: "change" }]
|
||||
zdrYjdj: [{ required: true, message: "请选择预警等级", trigger: "change" }],
|
||||
rylx: [{ required: true, message: "请选择人员类型", trigger: "change" }]
|
||||
});
|
||||
const listQuery = ref({ryLxdh:[""]}); //表单
|
||||
const chooseMarksVisible = ref(false); // 控制标签选择弹窗显示
|
||||
@ -110,11 +111,12 @@ const formData = ref([
|
||||
{ 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: "rylx", type: "select", options: D_ZDRY_RYLX },
|
||||
{ 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: "tags", type: "slot", width: "100%" },
|
||||
{ label: "管控原因", prop: "zdrLkyy", type: "textarea", width: "100%" },
|
||||
]);
|
||||
const loading = ref(false);
|
||||
@ -147,6 +149,7 @@ watch(() => props.dataList, (val) => {
|
||||
listQuery.value = deepClone(val);
|
||||
// 处理照片数据
|
||||
listQuery.value.ryzp = val.ryzp == null || val.ryzp == '' ? [] : [val.ryzp];
|
||||
listQuery.value.zdrSjjz = val.zdrSjjz == null || val.zdrSjjz == '' ? [] :JSON.parse(val.zdrSjjz);
|
||||
// 处理标签ID数据，确保数据回显
|
||||
if (val.tagIds && Array.isArray(val.tagIds) && val.tagIds.length > 0) {
|
||||
roleIds.value = [...val.tagIds];
|
||||
@ -155,7 +158,6 @@ watch(() => props.dataList, (val) => {
|
||||
} else {
|
||||
roleIds.value = [];
|
||||
}
|
||||
// listQuery.value.ryLxdh =listQuery.value.ryLxdh.length>0?listQuery.value.ryLxdh:['11'];
|
||||
}
|
||||
}, { deep: true })
|
||||
// 提交
|
||||
@ -163,23 +165,12 @@ 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 = []
|
||||
@ -228,9 +219,8 @@ const throwData = () => {
|
||||
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
|
||||
ryLxdh: validPhones,
|
||||
zdrSjjz:JSON.stringify(listQuery.value.zdrSjjz),
|
||||
});
|
||||
} else {
|
||||
reject(new Error('表单验证失败，请检查输入信息'));
|
||||
@ -246,9 +236,8 @@ const throwData = () => {
|
||||
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
|
||||
ryLxdh: validPhones,
|
||||
zdrSjjz:JSON.stringify(listQuery.value.zdrSjjz),
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
@ -2,24 +2,10 @@
|
||||
<div>
|
||||
<div class="headClass" style="">
|
||||
<h3>走访记录</h3>
|
||||
<!-- <el-button type="primary" :disabled="disabled" @click="AddPore">选择</el-button> -->
|
||||
|
||||
</div>
|
||||
<div class="headSelect">
|
||||
|
||||
<el-button @click="add" type="primary">新增</el-button>
|
||||
<el-button @click="AddPore" type="primary">新增</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>
|
||||
@ -27,24 +13,21 @@
|
||||
</template>
|
||||
</MyTable>
|
||||
</div>
|
||||
<VehiclDoing v-model="chooseMarksVisible" @comfirm="addMarks" :data="dataModel"
|
||||
:dict="{ D_BZ_CLLX, D_BZ_CLYS, D_BZ_CLPP }" />
|
||||
<InterLoding v-model="chooseMarksVisible" @comfirm="addMarks" :data="dataModel" />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { identityCardRule } from "@/utils/rules"
|
||||
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, tbGsxtZdryZfjlselectZfjl, tbZdryClxxUpdate } from '@/api/zdr.js'
|
||||
import InterLoding from "../component/interLoding.vue";
|
||||
import { tbGsxtZdryZfjlsaveOrUpdateZfjl,tbGsxtZdryZfjlselectZfjl,tbGsxtZdryZfjl } 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: () => { },
|
||||
default: () => {},
|
||||
}, disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
@ -58,9 +41,7 @@ const listData = ref({})
|
||||
const addUpd = ref(true)
|
||||
watch(() => props.dataList, (val) => {
|
||||
if (val) {
|
||||
listData.value = val
|
||||
|
||||
|
||||
listData.value = {...val}
|
||||
gettbZdryClxxSelectPage()
|
||||
}
|
||||
}, { deep: true })
|
||||
@ -68,26 +49,21 @@ watch(() => props.dataList, (val) => {
|
||||
const pageData = reactive({
|
||||
tableData: [],
|
||||
tableColumn: [{
|
||||
prop: 'cph',
|
||||
prop: 'zfmjXm',
|
||||
width: 150,
|
||||
label: '走访民警/辅警',
|
||||
label: '走访民警',
|
||||
}, {
|
||||
prop: 'cllx',
|
||||
prop: 'zffs',
|
||||
label: '走访方式',
|
||||
showSolt: true,
|
||||
prop: 'clpp',
|
||||
}, {
|
||||
showSolt: true,
|
||||
prop: 'clys',
|
||||
prop: 'zfsj',
|
||||
label: '走访时间',
|
||||
}, {
|
||||
showSolt: true,
|
||||
prop: 'clpp',
|
||||
prop: 'zfdz',
|
||||
label: '走访地址',
|
||||
},
|
||||
{
|
||||
showSolt: true,
|
||||
prop: 'clpp',
|
||||
prop: 'zfqk',
|
||||
label: '走访情况',
|
||||
}],
|
||||
tableHeight: '200px',
|
||||
@ -105,51 +81,39 @@ const pageData = reactive({
|
||||
},
|
||||
controlsWidth: 200,
|
||||
})
|
||||
// 表单数据
|
||||
const formData = reactive({
|
||||
username: "",
|
||||
ID: ""
|
||||
})
|
||||
const rulesForm = ref(identityCardRule({ validator: true }, 'rySfzh'))
|
||||
|
||||
// 修改数据接口
|
||||
const dataModel = ref()
|
||||
const addMarks = (val) => {
|
||||
const params = {
|
||||
...val,
|
||||
zdrid: listData.value.id,
|
||||
zdryId: listData.value.id,
|
||||
}
|
||||
if (props.showBut && !props.disabled) {
|
||||
if (addUpd.value) {
|
||||
tbZdryClxxAdd(params).then(res => {
|
||||
tbGsxtZdryZfjlsaveOrUpdateZfjl(params).then(res => {
|
||||
gettbZdryClxxSelectPage()
|
||||
proxy.$message({
|
||||
message: '关联车辆添加成功',
|
||||
message: '走访记录添加成功',
|
||||
type: 'success'
|
||||
})
|
||||
})
|
||||
}
|
||||
else {
|
||||
tbZdryClxxUpdate(params).then(res => {
|
||||
tbGsxtZdryZfjlsaveOrUpdateZfjl(params).then(res => {
|
||||
gettbZdryClxxSelectPage()
|
||||
proxy.$message({
|
||||
message: '关联车辆修改成功',
|
||||
message: '走访记录修改成功',
|
||||
type: 'success'
|
||||
})
|
||||
})
|
||||
}
|
||||
} else {
|
||||
pageData.tableData.push(val)
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
|
||||
|
||||
})
|
||||
// 删除车辆
|
||||
// 删除走访记录
|
||||
const delDictItem = (val) => {
|
||||
if (!props.disabled && props.showBut) {
|
||||
ElMessageBox.confirm(
|
||||
'是否删除关联车辆',
|
||||
'是否删除走访记录',
|
||||
'提示',
|
||||
{
|
||||
confirmButtonText: '确认',
|
||||
@ -158,10 +122,10 @@ const delDictItem = (val) => {
|
||||
}
|
||||
)
|
||||
.then(() => {
|
||||
tbZdryClxxDelete({ ids: [val] }).then(res => {
|
||||
tbGsxtZdryZfjl(val).then(res => {
|
||||
gettbZdryClxxSelectPage()
|
||||
proxy.$message({
|
||||
message: '关联车辆删除成功',
|
||||
message: '走访记录删除成功',
|
||||
type: 'success'
|
||||
})
|
||||
})
|
||||
@ -188,11 +152,9 @@ const AddPore = () => {
|
||||
dataModel.value = {}
|
||||
addUpd.value = true
|
||||
}
|
||||
// 查询车辆
|
||||
// 查询走访记录
|
||||
const gettbZdryClxxSelectPage = () => {
|
||||
const promes = {
|
||||
pageCurrent: 1,
|
||||
pageSize: 20,
|
||||
zdrid: listData.value.id
|
||||
}
|
||||
tbGsxtZdryZfjlselectZfjl(promes).then(res => {
|
||||
@ -203,10 +165,6 @@ const gettbZdryClxxSelectPage = () => {
|
||||
// 抛出数据并验证标签列表不为空
|
||||
const throwData = () => {
|
||||
return new Promise((resolve) => {
|
||||
// // 验证：确保标签列表不为空
|
||||
// if (!pageData.tableData || pageData.tableData.length === 0) {
|
||||
// throw new Error('请录入车辆信息');
|
||||
// }
|
||||
resolve(pageData.tableData);
|
||||
});
|
||||
}
|
||||
@ -246,13 +204,16 @@ defineExpose({
|
||||
}
|
||||
|
||||
.headClass {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
color: #303133;
|
||||
margin: 20px 0 10px 0;
|
||||
padding-bottom: 10px;
|
||||
border-bottom: 2px solid #409eff;
|
||||
position: relative;
|
||||
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user