更新页面

This commit is contained in:
2025-05-21 10:24:02 +08:00
parent f155ad7066
commit 2b3f8a4ce8
6 changed files with 546 additions and 20 deletions

View File

@ -0,0 +1,109 @@
<template>
<div class="dialog" v-if="dialogForm">
<div class="head_box">
<span class="title">重点群体管理 </span>
<div>
<el-button type="primary" size="small" :loading="loading" @click="submit" >保存</el-button>
<el-button size="small" @click="close">关闭</el-button>
</div>
</div>
<div class="form_cnt">
<el-tabs v-model="activeName" type="card" class="demo-tabs" @tab-click="handleClick">
<el-tab-pane :label="title+'群体'" name="first"></el-tab-pane>
<el-tab-pane label="轨迹信息" name="second"></el-tab-pane>
<el-tab-pane label="标签信息" name="third"></el-tab-pane>
</el-tabs>
<QtDetail ref="elform" v-if="activeName == 'first'"></QtDetail>
<!-- <FormMessage :formList="formData" ref="elform" :rules="rules"></FormMessage> -->
</div>
</div>
</template>
<script setup>
import QtDetail from './qtDetail.vue'
import FormMessage from '@/components/aboutTable/FormMessage.vue'
import { qcckGet, qcckPost, qcckPut } from "@/api/qcckApi.js";
import * as rule from "@/utils/rules.js";
import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, nextTick } from "vue";
const emit = defineEmits(["updateDate"]);
const props = defineProps({
dic: Object
});
const { proxy } = getCurrentInstance();
const dialogForm = ref(false); //弹窗
const activeName = ref("first");
const formData = ref([
{ label: "线索标题", prop: "xsbt", type: "input", },
{ label: "线索编号", prop: "xsbh", type: "input" },
{ label: "线索类型", prop: "xslx", type: "select", options: [] },
{ label: "线索来源", prop: "xsly", type: "input" },
{ label: "开始时间", prop: "kssj", type: "datetime"},
{ label: "结束时间", prop: "jssj", type: "datetime"},
{ label: "指向地点", prop: "zxdd", type: "input" },
{ label: "群体名称", prop: "qtmc", type: "input" },
{ label: "群体类型", prop: "qtlx", type: "input" },
{ label: "线索细类", prop: "xslx", type: "input" },
{ label: "风险等级", prop: "fxdj", type: "input" },
{ label: "是否初报", prop: "qtmc", type: "input" },
{ label: "线索内容", prop: "nr", type: "textarea",width: '100%' },
{ label: "报送编号", prop: "bsbh", type: "input",},
{ label: "上报单位", prop: "sbdw", type: "input",},
{ label: "抄送单位", prop: "csdw", type: "input",},
{ label: "承办人", prop: "cbr", type: "input",},
{ label: "审核人", prop: "shr", type: "input",},
{ label: "签发人", prop: "qfr", type: "input",},
]);
const listQuery = ref({
sfbqdj: []
}); //表单
const loading = ref(false);
const elform = ref();
const title = ref("");
const rules = reactive({
xsbt: [{ required: true, message: "请输入线索标题", trigger: "blur" }]
});
const editpeo = ref();
onMounted(() => {});
// 初始化数据
const init = (type, row,) => {
dialogForm.value = true;
title.value = type == 'add' ? "新增" : "编辑";
if (row) getDataById(row.id);
};
// 根据id查询详情
const getDataById = (id) => {
// qcckGet({}, '/mosty-gsxt/tbGsxtBqgl/'+id).then((res) => {
// listQuery.value = res;
// });
};
// 提交
const submit = () => {
elform.value.submit((data)=>{
// let url = title.value == "新增" ? '/mosty-gsxt/tbGsxtBqgl/save':'/mosty-gsxt/tbGsxtBqgl/update';
// let params = { ...data }
// qcckPost(params, url).then((res) => {
// proxy.$message({ type: "success", message: title.value + "成功" });
// emit("updateDate");
// close();
// }).catch(() => {});
});
};
// 关闭
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);
}
</style>

View File

@ -0,0 +1,137 @@
<template>
<el-form ref="elform" :model="listQuery" :rules="rules" :inline="true" label-position="right">
<el-divider content-position="left">群体信息</el-divider>
<el-form-item prop="qtmc" label="群体名称">
<MOSTY.Other width="100%" clearable v-model="listQuery.qtmc" :placeholder="`请输入群体名称`"/>
</el-form-item>
<el-form-item prop="qtbm" label="群体别名">
<MOSTY.Other width="100%" clearable v-model="listQuery.qtbm" :placeholder="`请输入群体别名`"/>
</el-form-item>
<el-form-item prop="qtjc" label="群体简称">
<MOSTY.Other width="100%" clearable v-model="listQuery.qtjc" :placeholder="`请输入群体简称`"/>
</el-form-item>
<el-form-item prop="qtlb" label="群体类别">
<MOSTY.Other width="100%" clearable v-model="listQuery.qtlb" :placeholder="`请输入群体类别`"/>
</el-form-item>
<el-form-item prop="clsj" label="成立时间">
<el-date-picker v-model="listQuery.clsj" type="date" value-format="YYYY-MM-DD" placeholder="请选择日期" style="width:100%;" />
</el-form-item>
<el-form-item prop="fxdj" label="风险等级">
<MOSTY.Select filterable v-model="listQuery.fxdj" :dictEnum="[]" width="100%" clearable :placeholder="`请选择风险等级`"/>
</el-form-item>
<el-form-item prop="fxjc" label="风险检测" style="width:100%">
<div class="flex align-center">
<MOSTY.Other filterable v-model="listQuery.fxjc" readonly />
<span class="ml5"><el-icon color="#0072FF" style="top:4px" size="20px"><CirclePlus /></el-icon></span>
</div>
</el-form-item>
<el-form-item prop="ybjc" label="一般监测" style="width:100%">
<div class="flex align-center">
<MOSTY.Other filterable v-model="listQuery.ybjc" readonly />
<span class="ml5"><el-icon color="#0072FF" style="top:4px" size="20px"><CirclePlus /></el-icon></span>
</div>
</el-form-item>
<el-form-item prop="ybjc" label="重点监测" style="width:100%">
<div class="flex align-center">
<MOSTY.Other filterable v-model="listQuery.zdjc" readonly />
<span class="ml5"><el-icon color="#0072FF" style="top:4px" size="20px"><CirclePlus /></el-icon></span>
</div>
</el-form-item>
<el-form-item prop="ybjc" label="背景资料" style="width:100%">
<MOSTY.Other filterable v-model="listQuery.bjzl" style="width:100%" />
</el-form-item>
<el-form-item prop="ybjc" label="两群采集录入" style="width:100%">
<MyTable
:tableData="pageData.tableData"
:tableColumn="pageData.tableColumn"
:tableHeight="pageData.tableHeight"
:key="pageData.keyCount"
:tableConfiger="pageData.tableConfiger"
/>
</el-form-item>
<el-divider content-position="left">群体管辖信息</el-divider>
<el-form-item prop="gxdw" label="管辖单位">
<MOSTY.Other width="100%" clearable v-model="listQuery.gxdw" :placeholder="`请输入管辖单位`"/>
</el-form-item>
<el-form-item prop="gxxq" label="管辖辖区">
<MOSTY.Other width="100%" clearable v-model="listQuery.gxxq" :placeholder="`请输入管辖辖区`"/>
</el-form-item>
<el-form-item prop="lxr" label="联系人">
<MOSTY.Other width="100%" clearable v-model="listQuery.lxr" :placeholder="`请输入联系人`"/>
</el-form-item>
<el-form-item prop="lxfs" label="联系方式">
<MOSTY.Other width="100%" clearable v-model="listQuery.lxfs" :placeholder="`请输入联系方式`"/>
</el-form-item>
<el-divider content-position="left">审批信息</el-divider>
<el-form-item prop="sqr" label="申请人">
<MOSTY.Other width="100%" clearable v-model="listQuery.sqr" :placeholder="`请输入申请人`"/>
</el-form-item>
<el-form-item prop="sqdw" label="申请单位">
<MOSTY.Other width="100%" clearable v-model="listQuery.sqdw" :placeholder="`请输入申请单位`"/>
</el-form-item>
<el-form-item prop="shr" label="审核人">
<MOSTY.Other width="100%" clearable v-model="listQuery.shr" :placeholder="`请输入审核人`"/>
</el-form-item>
<el-form-item prop="shdw" label="审核单位">
<MOSTY.Other width="100%" clearable v-model="listQuery.shdw" :placeholder="`请输入审核单位`"/>
</el-form-item>
<el-form-item prop="spr" label="审批人">
<MOSTY.Other width="100%" clearable v-model="listQuery.spr" :placeholder="`请输入审批人`"/>
</el-form-item>
<el-form-item prop="spdw" label="审批单位">
<MOSTY.Other width="100%" clearable v-model="listQuery.spdw" :placeholder="`请输入审批单位`"/>
</el-form-item>
<el-form-item prop="jsdw" label="接收单位">
<MOSTY.Other width="100%" clearable v-model="listQuery.jsdw" :placeholder="`请输入接收单位`"/>
</el-form-item>
<el-form-item prop="sffk" label="是否反馈">
<MOSTY.Other width="100%" clearable v-model="listQuery.sffk" :placeholder="`请输入是否反馈`"/>
</el-form-item>
</el-form>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import MyTable from "@/components/aboutTable/MyTable.vue";
import { reactive,defineEmits,ref , defineExpose,} from 'vue'
const emits = defineEmits(["update:modelValue"]);
const elform = ref();
const listQuery = ref({});
const rules = reactive({
qtmc: [{ required: true, message: '请输入群体名称', trigger: 'blur' }],
})
const pageData = reactive({
tableData: [],
tableConfiger: {
rowHieght: 30,
showSelectType: "null",
loading: false,
haveControls:false,
showIndex:false
},
tableHeight:200,
tableColumn: [
{ label: "微信群", prop: "wxq"},
{ label: "QQ群", prop: "qqq"},
{ label: "群主", prop: "qz"},
{ label: "联系电话", prop: "lxdh"},
{ label: "群重要内容", prop: "zynr"},
]
});
const submit = (resfun) => {
elform.value.validate((valid) => {
if (!valid) return false;
resfun(listQuery.value);
});
};
defineExpose({ submit });
</script>
<style>
</style>