zy_oyj/sgxt_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

对接接口和更新新增表单组件

Browse Source
This commit is contained in:
zy_zr
2025-04-22 19:03:28 +08:00
parent 95d84c3b06
commit 6c694b52d3
13 changed files with 305 additions and 556 deletions
Download Patch File Download Diff File Expand all files Collapse all files

160
src/views/backOfficeSystem/fourColorManage/IdentityManage/components/editAddForm.vue
View File

@ -8,24 +8,16 @@
</div>
</div>
<div class="form_cnt">
<FormMessage :formData="formData" ref="elform" :rules="rules"></FormMessage>
<FormMessage v-model="listQuery" :formData="formData" ref="elform" :rules="rules"></FormMessage>
</div>
</div>
</template>
<script setup>
import * as rule from "@/utils/rules.js";
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";
import { ref, defineExpose, reactive, onMounted, defineEmits, getCurrentInstance, nextTick } from "vue";
const emit = defineEmits(["updateDate"]);
const props = defineProps({
dic: Object
@ -33,147 +25,51 @@ const props = defineProps({
const { proxy } = getCurrentInstance();
const dialogForm = ref(false); //弹窗
const formData = ref([
{
text: "组合标签名称",
prop: "bqmc",
type: "input",
required: true
},
{
text: "身份标签大类",
prop: "sfbqdl",
type: "select",
optionList: [
{ label: "是", value: "1" },
{ label: "否", value: "0" }
]
},
{
text: "身份标签细类",
prop: "sfbqxl",
type: "select",
optionList: [
{ label: "是", value: "1" },
{ label: "否", value: "0" }
]
},
{
text: "身份标签等级",
prop: "sfbqdj",
type: "select",
optionList: [
{ label: "是", value: "1" },
{ label: "否", value: "0" }
]
},
{
text: "身份标签颜色",
prop: "sfbqys",
type: "select",
optionList: [
{ label: "是", value: "1" },
{ label: "否", value: "0" }
]
},
{
text: "行为标签大类",
prop: "xwbqdl",
type: "select",
optionList: [
{ label: "是", value: "1" },
{ label: "否", value: "0" }
]
},
{
text: "行为标签细类",
prop: "xwbqdl",
type: "select",
optionList: [
{ label: "是", value: "1" },
{ label: "否", value: "0" }
]
},
{
text: "行为标签等级",
prop: "sfbqdj",
type: "select",
value: "",
optionList: [
{ label: "是", value: "1" },
{ label: "否", value: "0" }
]
},
{
text: "行为标签颜色",
prop: "xwbqys",
type: "select",
optionList: [
{ label: "是", value: "1" },
{ label: "否", value: "0" }
]
},
{
text: "身份标签积分",
prop: "sfbqjf",
type: "input"
},
{
text: "行为标签积分",
prop: "xwbqjf",
type: "input"
},
{
text: "组合标签积分",
prop: "zhbqjf",
type: "input"
}
{ label: "标签名称", prop: "bqMc", type: "input", required: true },
{ label: "标签代码", prop: "bqDm", type: "input", required: true },
{ label: "标签说明", prop: "bqSm", type: "input", required: true },
{ label: "组合标签名称", prop: "bqmc", type: "input", required: true },
{ label: "标签大类", prop: "bqLb", type: "select", options: props.dic.D_GS_BQ_LB },
{ label: "标签细类", prop: "bqLx", type: "select", options: props.dic.D_GS_BQ_LX },
{ label: "标签等级", prop: "bqDj", type: "select", options: props.dic.D_GS_BQ_DJ },
{ label: "标签颜色", prop: "bqYs", type: "select", options: props.dic.D_GS_SSYJ },
{ label: "标签分值", prop: "bqFz", type: "input" },
]);
const listQuery = ref({
sfbqdj: []
}); //表单
const loading = ref(false);
const elform = ref();
const title = ref("");
const rules = reactive({
bqmc: [{ required: true, message: "请输入标签名称", trigger: "blur" }]
});
const editpeo = ref();
const listQuery = ref({}); //表单
const loading = ref(false);
const elform = ref();
const title = ref("");
onMounted(() => {});
// 初始化数据
const init = (type, row, lx) => {
const init = (type, row,) => {
dialogForm.value = true;
title.value = row ? "编辑" : "新增";
if (row) getDataById(row.id);
};
// 根据id查询详情
const getDataById = (id) => {
let url = "";
qcckGet({ id }, url).then((res) => {
qcckGet({}, '/mosty-gsxt/tbGsxtBqgl/'+id).then((res) => {
listQuery.value = res;
nextTick(() => {
editpeo.value.getList();
});
});
};
const changeInput = (val) => {
listQuery.value = {
[Object.keys(val)]: val[Object.keys(val)],
...listQuery.value
};
console.log(listQuery.value, "formData.value");
};
// 提交
const submit = () => {
elform.value.submit(handleInfoFn);
};
const handleInfoFn = (val) => {
qcckPost(val, "url")
.then((res) => {
elform.value.submit((data)=>{
let url = title.value == "新增" ? '/mosty-gsxt/tbGsxtBqgl/save':'/mosty-gsxt/tbGsxtBqgl/update';
qcckPost(data, url).then((res) => {
proxy.$message({ type: "success", message: title.value + "成功" });
close();
})
.catch(() => {});
}).catch(() => {});
});
};
// 关闭
const close = () => {
listQuery.value = {};

232
src/views/backOfficeSystem/fourColorManage/IdentityManage/index.vue
View File

@ -2,6 +2,14 @@
<div>
<div class="titleBox">
<PageTitle title="身份标签管理">
<template #left>
<el-button :type="type == '标签大类'? 'success':''" @click="chooseListType('标签大类')">
<span style="vertical-align: middle">标签大类</span>
</el-button>
<el-button :type="type == '标签细类'? 'success':''" @click="chooseListType('标签细类')">
<span style="vertical-align: middle">标签细类</span>
</el-button>
</template>
<el-button type="primary" @click="addEdit('add', '')">
<el-icon style="vertical-align: middle"><CirclePlus /></el-icon>
<span style="vertical-align: middle">新增</span>
@ -10,16 +18,10 @@
</div>
<!-- 搜索 -->
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount">
<template #defaultSlot>
<el-select placeholder="请选择类型" v-model="chooseType" @change="handleType">
<el-option v-for="it in list.chooseList" :key="it" :value="it" :label="it"></el-option>
</el-select>
</template>
</Search>
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
</div>
<!-- 表格 -->
<div class="tabBox">
<div class="tabBox" :style="{height:pageData.tableHeight+20+'px'}">
<MyTable
:tableData="pageData.tableData"
:tableColumn="pageData.tableColumn"
@ -29,16 +31,22 @@
:controlsWidth="pageData.controlsWidth"
@chooseData="chooseData"
>
<template #sfjs="{ row }">
<DictTag :value="row.sfjs" :options="list.sf" />
<template #bqLx="{ row }">
<DictTag :value="row.bqLx" :options="D_GS_BQ_LX" />
</template>
<template #xxlx="{ row }">
<DictTag :value="row.xxlx" :options="list.xxlx" />
<template #bqLb="{ row }">
<DictTag :value="row.bqLb" :options=" D_GS_BQ_LB" />
</template>
<template #bqYs="{ row }">
<DictTag :value="row.bqYs" :options=" D_GS_SSYJ" />
</template>
<template #bqDj="{ row }">
<DictTag :value="row.bqDj" :options=" D_GS_BQ_DJ" />
</template>
<!-- 操作 -->
<template #controls="{ row }">
<el-button size="small" @click="addEdit('edit', row)">编辑</el-button>
<el-button size="small" @click="delDictItem([row.id])" type="danger">删除</el-button>
<el-button size="small" @click="delDictItem(row.id)" type="danger">删除</el-button>
</template>
</MyTable>
<Pages
@ -52,7 +60,7 @@
></Pages>
</div>
<!-- 编辑详情 -->
<EditAddForm ref="detailDiloag" :dic="{xxlx:list.xxlx,sf:list.sf}" @updateDate="getList" />
<EditAddForm ref="detailDiloag" :dic="{D_GS_BQ_DJ,D_GS_SSYJ,D_GS_BQ_LB,D_GS_BQ_LX}" @updateDate="getList" />
</div>
</template>
@ -65,30 +73,16 @@ import EditAddForm from "./components/editAddForm.vue";
import { qcckGet, qcckPost, qcckDelete } from "@/api/qcckApi.js";
import { reactive, ref, onMounted, getCurrentInstance } from "vue";
const { proxy } = getCurrentInstance();
const qypzDialog = ref();
const { D_GS_BQ_DJ,D_GS_SSYJ,D_GS_BQ_LB,D_GS_BQ_LX } = proxy.$dict("D_GS_BQ_DJ","D_GS_SSYJ","D_GS_BQ_LB","D_GS_BQ_LX"); //获取字典数据
const detailDiloag = ref();
const searchBox = ref(); //搜索框
const chooseType = ref('学校') //选择的类型
const list = reactive({
chooseList :['学校','医院','娱乐场所','民爆库房'],
xxlx:[
{label:'职业学校',value:'01'},
{label:'大专',value:'02'},
{label:'本科',value:'03'},
{label:'研究生',value:'04'},
{label:'博士',value:'05'},
],
sf:[
{label:'是',value:'1'},
{label:'否',value:'0'},
],
})
const type = ref('标签大类')
const searchConfiger = ref([
{ label: "标签名称",prop:'bqmc',placeholder: "请输入学校名称", showType: "input",},
{ label: "标签大类",prop:'sfbqdl' ,placeholder: "请选择标签大类", showType: "select",options:list.xxlx },
{ label: "标签细类",prop:'sfbqdl' ,placeholder: "请选择标签细类", showType: "select",options:list.xxlx },
{ label: "标签等级",prop:'sfbqdl' ,placeholder: "请选择标签等级", showType: "select",options:list.xxlx },
{ label: "标签颜色",prop:'sfbqdl' ,placeholder: "请选择标签颜色", showType: "select",options:list.xxlx },
{ label: "标签大类",prop:'sfbqdl' ,placeholder: "请输入标签大类", showType: "input"},
{ label: "标签名称",prop:'bqmc',placeholder: "请输入学校名称", showType: "input"},
{ label: "标签等级",prop:'sfbqdl' ,placeholder: "请选择标签等级", showType: "select",options:D_GS_BQ_DJ },
{ label: "标签颜色",prop:'sfbqdl' ,placeholder: "请选择标签颜色", showType: "select",options:D_GS_SSYJ },
{ label: "积分分值",prop:'bqmc',placeholder: "请输入积分分值", showType: "input",},
]);
const queryFrom = ref({});
@ -107,166 +101,84 @@ const pageData = reactive({
}, //分页
controlsWidth: 160, //操作栏宽度
tableColumn: [
{ label: "标签名称", prop: "name" },
{ label: "标签大类", prop: "xxrs" },
{ label: "标签细类", prop: "sfjs",showSolt:true},
{ label: "标签等级", prop: "xxlx",showSolt:true},
{ label: "标签颜色", prop: "xzxm"},
{ label: "积分分值", prop: "lxfs" },
{ label: "标签名称", prop: "bqMc" },
{ label: "标签代码", prop: "bqDm" },
{ label: "标签类型", prop: "bqLx",howSolt:true },
{ label: "标签类别", prop: "bqLb",howSolt:true },
{ label: "标签等级", prop: "bqDj",showSolt:true},
{ label: "标签颜色", prop: "bqYs",showSolt:true},
]
});
onMounted(() => {
getList(chooseType.value)
getList()
tabHeightFn();
});
//选择类型
const handleType = (val) => {
// 选择列表的大类和细类
const chooseListType = (val) => {
type.value = val;
pageData.keyCount++;
pageData.pageConfiger.pageCurrent = 1;
searchConfiger.value = searchConfiger.value.slice(0,1);
let arr = [],tableColumn = [];
switch(val){
case '学校':
arr = [
{ label: "学校名称" ,prop:'name', placeholder: "请输入学校名称", showType: "input" },
{ label: "学校类型" ,prop:'xxlx', placeholder: "请选择学校类型", showType: "select",options:list.xxlx },
]
tableColumn = [
{ label: "学校名称", prop: "name" },
{ label: "学校人数", prop: "xxrs" },
{ label: "是否寄宿学校", prop: "sfjs",showSolt:true},
{ label: "学校类型", prop: "xxlx",showSolt:true},
{ label: "校长", prop: "xzxm"},
{ label: "校长联系方式", prop: "lxfs" },
{ label: "要求配备保安数", prop: "pbbbs" },
{ label: "自聘保安数", prop: "zpbbs" },
{ label: "第三方保安数", prop: "sfbbs" },
]
break;
case '医院':
arr = [{ label: "医院名称" ,prop:'name',placeholder: "请输入医院名称", showType: "input" }];
tableColumn = [
{ label: "医院名称", prop: "name" },
{ label: "医院法人", prop: "frxm" },
{ label: "法人联系方式", prop: "lxfs" },
{ label: "床位数", prop: "cws" },
{ label: "医院人数", prop: "yyrs" },
{ label: "医院人流量", prop: "yyrll" },
{ label: "要求配备保安数", prop: "pbbbs" },
{ label: "自聘保安数", prop: "zpbbs" },
{ label: "第三方保安数", prop: "sfbbs" },
]
break;
case '娱乐场所':
arr = [{ label: "娱乐场所" ,prop:'name',placeholder: "请输娱乐场所名称", showType: "input" }]
tableColumn = [
{ label: "场所名称", prop: "name" },
{ label: "法人", prop: "frxm" },
{ label: "法人联系方式", prop: "lxfs" },
{ label: "面积", prop: "mj" },
{ label: "要求配备保安数", prop: "pbbbs" },
{ label: "自聘保安数", prop: "zpbbs" },
{ label: "第三方保安数", prop: "sfbbs" },
]
break;
case '民爆库房':
arr = [{ label: "民爆库房" ,prop:'bmkf',placeholder: "请输民爆库房名称", showType: "input" }]
tableColumn = [
{ label: "库房名称", prop: "name" },
{ label: "库房所有人", prop: "kfsyr" },
{ label: "所有人联系方式", prop: "syrLxfs" },
{ label: "库房使用人", prop: "kfUser" },
{ label: "使用人联系方式", prop: "userLxfs" },
{ label: "库容量", prop: "kry" },
{ label: "要求配备保安数", prop: "pbbbs" },
{ label: "自聘保安数", prop: "zpbbs" },
{ label: "第三方保安数", prop: "sfbbs" },
]
break;
case '标签大类':
let obj1 = { label: "标签大类",prop:'sfbqdl' ,placeholder: "请输入标签大类", showType: "input"}
searchConfiger.value.splice(0, 1, obj1);
break;
case '标签细类':
let obj2 = { label: "标签细类",prop:'sfbqdl' ,placeholder: "请输入标签细类", showType: "input"}
searchConfiger.value.splice(0, 1, obj2);
break;
}
searchConfiger.value = searchConfiger.value.concat(arr);
pageData.tableColumn = tableColumn;
getList(chooseType.value)
}
pageData.pageConfiger.pageCurrent = 1;
getList()
};
// 搜索
const onSearch = (val) =>{
queryFrom.value = {...val}
pageData.pageConfiger.pageCurrent = 1;
getList(chooseType.value)
getList()
}
// 分页
const changeNo = (val) =>{
pageData.pageConfiger.pageNum = val;
getList(chooseType.value)
getList()
}
// 页数
const changeSize = (val) =>{
pageData.pageConfiger.pageSize = val;
getList(chooseType.value)
getList()
}
// 获取列表
const getList = (val) =>{
let url = ''
switch(val){
case '学校':
url = '/mosty-lzcj/tbDwXx/queryList';
break;
case '医院':
url = '/mosty-lzcj/tbDwYy/queryList';
break;
case '娱乐场所':
url = '/mosty-lzcj/TbDwYlth/queryList';
break;
case '民爆库房':
url = '/mosty-lzcj/tbDwMbkf/queryList';
break;
}
pageData.tableConfiger.loading = true;
let data = { ...pageData.pageConfiger,...queryFrom.value };
qcckPost(data,url).then(res=>{
pageData.tableData = res.records || [];
pageData.total = res.total;
pageData.tableConfiger.loading = false;
}).catch(()=>{ pageData.tableConfiger.loading = false; })
// pageData.tableConfiger.loading = true;
// let data = { ...pageData.pageConfiger,...queryFrom.value };
// qcckPost(data,'/mosty-gsxt/tbGsxtBqgl/selectPage').then(res=>{
// pageData.tableData = res.records || [];
// pageData.total = res.total;
// pageData.tableConfiger.loading = false;
// }).catch(()=>{ pageData.tableConfiger.loading = false; })
}
// 删除
const delDictItem = (ids) =>{
let url = ''
switch(chooseType.value){
case '学校':
url = '/mosty-lzcj/tbDwXx/delete';
break;
case '医院':
url = '/mosty-lzcj/tbDwYy/delete';
break;
case '娱乐场所':
url = '/mosty-lzcj/TbDwYlth/delete';
break;
case '民爆库房':
url = '/mosty-lzcj/tbDwMbkf/delete';
break;
}
// proxy.$confirm("确定要删除", "警告", {type: "warning"}).then(() => {
// qcckPost(ids,url).then(()=>{
// proxy.$message({ type: "success", message: "删除成功" });
// getList(chooseType.value);
// })
// }).catch(() => {});
const delDictItem = (id) =>{
proxy.$confirm("确定要删除", "警告", {type: "warning"}).then(() => {
qcckPost({},'/mosty-gsxt/tbGsxtBqgl/'+id).then(()=>{
proxy.$message({ type: "success", message: "删除成功" });
getList();
})
}).catch(() => {});
}
// 新增
const addEdit = (type, row) => {
detailDiloag.value.init(type, row,chooseType.value);
detailDiloag.value.init(type, row);
};
// 表格高度计算
const tabHeightFn = () => {
pageData.tableHeight = window.innerHeight - searchBox.value.offsetHeight - 250;
window.onresize = function () {
tabHeightFn();
};
window.onresize = function () { tabHeightFn(); };
};
</script>