提交
This commit is contained in:
给我
240
src/pages/views/Declaration/addEdit copy.vue
Normal file
240
src/pages/views/Declaration/addEdit copy.vue
Normal file
@ -0,0 +1,240 @@
|
||||
<template>
|
||||
<div style="padding-top: 13vw">
|
||||
<TopNav :navTitle="title" />
|
||||
<van-form @submit="onSubmit" style="height: calc(100vh - 13vw);">
|
||||
<div class="infoBox">
|
||||
<ul class="cardInfo">
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.sbsj" required name="申报时间" readonly label="申报时间" input-align="right"
|
||||
:rules="[{ required: true, message: '请选择时间' }]" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.sblxmc" required name="申报类型" is-link readonly label="申报类型" placeholder="点击设置"
|
||||
input-align="right" :rules="[{ required: true, message: '请选择申报类型' }]" @click="getCommonPop('sblx')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field required name="申报原因" readonly label="申报原因" />
|
||||
</li>
|
||||
<van-field placeholder="请输入相关内容" v-model="normalForm.sbyy" rows="4" autosize accept=".txt,.png,.zip,jpg,jpeg"
|
||||
maxlength="500" show-word-limit type="textarea"></van-field>
|
||||
<li class="item">
|
||||
<div><span class="mark"></span>添加附件</div>
|
||||
</li>
|
||||
<!-- 附件 -->
|
||||
<div class="fjBox">
|
||||
<van-uploader v-model="fileList" multiline :max-count="3" :after-read="afterRead"></van-uploader>
|
||||
</div>
|
||||
</ul>
|
||||
<div class="footer">
|
||||
<van-button round block type="primary" native-type="submit" :loading="isLoading" loading-type="spinner"
|
||||
loading-text="登录中...">提交</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-form>
|
||||
<!-- 弹窗 -->
|
||||
<van-popup v-model:show="isShowCommonPicker" round position="bottom">
|
||||
<van-picker v-if="clickType == 'sblx'" :columns="columns" @cancel="isShowCommonPicker = false"
|
||||
@confirm="onConfirm" />
|
||||
</van-popup>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { baseUrl2 } from "@/utils/request.js";
|
||||
import { upImage } from "@/api/common";
|
||||
import ImageCompressor from "image-compressor.js";
|
||||
import TopNav from "../../../components/topNav.vue";
|
||||
import { getDictList, setDict } from "@/utils/dict";
|
||||
import { timeValidate ,hintToast} from "@/utils/tools.js";
|
||||
import { zgDetail, editDataZg, addDataZg } from "../../../api/xfgl.js";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { ref, onMounted, reactive, defineProps } from "vue";
|
||||
const urlImg = `${baseUrl2}/mosty-api/mosty-base/minio/image/download/`;
|
||||
const { D_SB_SBLX } = getDictList("D_SB_SBLX");
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const message = ref("");
|
||||
const normalForm = ref({
|
||||
sbsj:timeValidate(),
|
||||
ssbmdm:JSON.parse(window.localStorage.getItem("userInfo")).deptList[0].deptCode
|
||||
});
|
||||
const isLoading = ref(false)
|
||||
const isShowCommonPicker = ref(false);
|
||||
const clickType = ref('');
|
||||
const columns = ref([]);
|
||||
const fileList = ref([])
|
||||
const wpTpIdList = ref([])
|
||||
const title = ref('')
|
||||
onMounted(()=>{
|
||||
title.value = route.query.id ? "编辑战果申报" : "新增战果申报";
|
||||
if (route.query.id) {
|
||||
_getDetailById(); //根据id获取详情
|
||||
}
|
||||
})
|
||||
//根据id获取详情
|
||||
function _getDetailById() {
|
||||
zgDetail(route.query.id).then((res) => {
|
||||
D_SB_SBLX.value.forEach((element) => {
|
||||
if (element.dm == res.sblx) res.sblxmc = element.text;
|
||||
});
|
||||
let ids = res.sbfjid.split(',')
|
||||
fileList.value = []
|
||||
ids.forEach(item => {
|
||||
let img = baseUrl2 + "/mosty-api/mosty-base/minio/image/download/" + item;
|
||||
let obj = {
|
||||
url: img,
|
||||
codeId: item,
|
||||
isImage: true,
|
||||
status: "done",
|
||||
message: "上传成功",
|
||||
};
|
||||
fileList.value.push(obj)
|
||||
});
|
||||
normalForm.value = res;
|
||||
});
|
||||
}
|
||||
// 选择
|
||||
function getCommonPop(val) {
|
||||
clickType.value = val;
|
||||
switch (val) {
|
||||
case "sblx":
|
||||
columns.value = D_SB_SBLX.value;
|
||||
break;
|
||||
}
|
||||
isShowCommonPicker.value = true;
|
||||
}
|
||||
|
||||
// 确定选择
|
||||
function onConfirm(val) {
|
||||
isShowCommonPicker.value = false;
|
||||
switch (clickType.value) {
|
||||
case "sblx":
|
||||
normalForm.value.sblx = val.dm;
|
||||
normalForm.value.sblxmc = val.zdmc;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// 提交
|
||||
function onSubmit(){
|
||||
let params = { ...normalForm.value }
|
||||
delete params.sblxmc
|
||||
let ids1 = fileList.value.filter(item=>{return item.codeId}).map(v=>{return v.codeId})
|
||||
let ids2 = wpTpIdList.value.join(',')
|
||||
params.sbfjid = (ids1.concat(ids2)).join(',')
|
||||
|
||||
isLoading.value = true;
|
||||
if(title.value == '编辑战果申报'){
|
||||
editDataZg(params).then(res=>{
|
||||
hintToast('编辑成功')
|
||||
router.go(-1);
|
||||
})
|
||||
}else{
|
||||
addDataZg(params).then(res=>{
|
||||
hintToast('新增成功')
|
||||
router.go(-1);
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 文件预览
|
||||
async function afterRead(file) {
|
||||
file.message = "上传中...";
|
||||
let fileBlob = await _compressImage(file.file);
|
||||
let fileData = new File([fileBlob], fileBlob.name, { type: fileBlob.type });
|
||||
const data = new FormData();
|
||||
data.append("file", fileData);
|
||||
file.status = "uploading";
|
||||
upImage(data).then((res) => {
|
||||
file.status = "done";
|
||||
file.message = "上传成功";
|
||||
if (!wpTpIdList.value.includes(res)) wpTpIdList.value.push(res);
|
||||
});
|
||||
}
|
||||
|
||||
//压缩图片
|
||||
const _compressImage = (file) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
new ImageCompressor(file, {
|
||||
quality: 0.6, //压缩质量
|
||||
success(res) {
|
||||
resolve(res);
|
||||
},
|
||||
error(e) {
|
||||
reject(e);
|
||||
},
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.infoBox {
|
||||
height: 100%;
|
||||
position: relative;
|
||||
|
||||
.cardInfo {
|
||||
height: calc(100vh - 13vw);
|
||||
padding: 1vw 4vw;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
|
||||
.item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 8vw;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
|
||||
.mark {
|
||||
margin: 0 10px;
|
||||
color: red;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #767676;
|
||||
}
|
||||
}
|
||||
|
||||
.item::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
background: #0066ff;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
z-index: 11;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
|
||||
.btn {
|
||||
padding: 2vw 6vw;
|
||||
background: #1989fa;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .van-field__control {
|
||||
background: #f8fafd;
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.fjBox {
|
||||
padding: 4vw;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
529
src/pages/views/Declaration/addEdit.vue
Normal file
529
src/pages/views/Declaration/addEdit.vue
Normal file
@ -0,0 +1,529 @@
|
||||
<template>
|
||||
<div style="padding-top: 13vw">
|
||||
<TopNav :navTitle="title" />
|
||||
<van-form @submit="onSubmit" style="height: calc(100vh - 13vw);">
|
||||
<div class="infoBox">
|
||||
<ul class="cardInfo">
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xfsj" required name="时间" is-link readonly label="时间" placeholder="点击设置"
|
||||
input-align="right" :rules="[{ required: true, message: '请选择时间' }]" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xfzzXm" required name="巡访主责人" is-link readonly label="巡访主责人"
|
||||
placeholder="点击设置" input-align="right" :rules="[{ required: true, message: '请选择巡访主责人' }]"
|
||||
@click="showDialogfn('xfzz')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xfzzSfzh" required name="身份证号" readonly input-align="right" label="身份证号"
|
||||
:rules="[{ required: true, message: '请输入组长身份证号' }]" />
|
||||
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xfmj" name="巡访同行人(民警)" is-link label-width="108px" readonly label="巡访同行人(民警)"
|
||||
placeholder="点击设置" input-align="right" @click="showDialogfn('xfmj')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xffj" name="巡访同行人(辅警)" is-link label-width="108px" readonly label="巡访同行人(辅警)"
|
||||
placeholder="点击设置" input-align="right" @click="showDialogfn('xffj')" />
|
||||
</li>
|
||||
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.sfdw" name="巡访单位" is-link readonly label="巡访单位" placeholder="点击设置"
|
||||
input-align="right" required :rules="[{ required: true, message: '请选择巡访单位' }]"
|
||||
@click="showDialogfn('xfdw')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.dz" required name="巡访地点" label="巡访地点" placeholder="输入地点" input-align="right"
|
||||
:rules="[{ required: true, message: '请选择巡访地点' }]" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xflxmc" required name="巡访类型" is-link readonly label="巡访类型" placeholder="点击设置"
|
||||
input-align="right" :rules="[{ required: true, message: '请选择巡访类型' }]" @click="getCommonPop('xflx')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.rwztmc" name="任务状态" is-link readonly label="任务状态" placeholder="选择任务状态"
|
||||
input-align="right" @click="getCommonPop('rwzt')" />
|
||||
</li>
|
||||
|
||||
<li class="item">
|
||||
<van-field name="巡访内容" @click="showDialogfn('xfnr')" readonly label="巡访内容" />
|
||||
</li>
|
||||
<div class="textarea">
|
||||
<van-field placeholder="请输相关内容" v-model="normalForm.xfnr" rows="4" autosize maxlength="500" show-word-limit
|
||||
type="textarea"></van-field>
|
||||
</div>
|
||||
<li class="item">
|
||||
<div class="itemlabel"><span class="mark"></span>拍照打卡</div>
|
||||
</li>
|
||||
|
||||
<!-- 附件 -->
|
||||
<div class="fjBox">
|
||||
<van-uploader v-model="fileList" multiline :max-count="3" :after-read="afterRead"
|
||||
:before-delete="deleteFj"></van-uploader>
|
||||
</div>
|
||||
<li class="item">
|
||||
<van-field v-model="sbsj" required name="申报时间" readonly label="申报时间" input-align="right"
|
||||
:rules="[{ required: true, message: '请选择时间' }]" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.sblxmc" required name="申报类型" is-link readonly label="申报类型" placeholder="点击设置"
|
||||
input-align="right" :rules="[{ required: true, message: '请选择申报类型' }]" @click="getCommonPop('sblx')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field required name="申报原因" readonly label="申报原因" />
|
||||
</li>
|
||||
<van-field placeholder="请输入相关内容" v-model="normalForm.sbyy" rows="4" autosize accept=".txt,.png,.zip,jpg,jpeg"
|
||||
maxlength="500" show-word-limit type="textarea"></van-field>
|
||||
<li class="item">
|
||||
<div class="itemlabel"><span class="mark"></span>添加附件</div>
|
||||
</li>
|
||||
<!-- 附件 -->
|
||||
<div class="fjBox">
|
||||
<van-uploader v-model="fjData" multiline :max-count="3" accept="" :after-read="afterReadFjsb"
|
||||
:before-delete="beforeDeletefJ">
|
||||
</van-uploader>
|
||||
</div>
|
||||
|
||||
<li class="item">
|
||||
<div class="itemlabel"><span class="mark"></span>附件列表</div>
|
||||
</li>
|
||||
<div class="fjBox">
|
||||
<div v-for="(it, idex) in fileBoxs" :key="idex" class="listitem">
|
||||
<span class="name">{{ it.name }}</span>
|
||||
<span> <van-icon name="close" color="#ff0000" @click="deletDate(it, idex)"></van-icon> </span>
|
||||
</div>
|
||||
</div>
|
||||
</ul>
|
||||
<div class="footer">
|
||||
<van-button round block type="primary" native-type="submit" :loading="isLoading" loading-type="spinner"
|
||||
loading-text="登录中...">提交</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-form>
|
||||
|
||||
<!-- 弹窗 -->
|
||||
<van-popup v-model:show="isShowCommonPicker" round position="bottom">
|
||||
<van-picker :columns="columns" @cancel="isShowCommonPicker = false" @confirm="onConfirm" />
|
||||
</van-popup>
|
||||
|
||||
<!-- 弹窗 -->
|
||||
<Select v-if="showSelect" :checked="r_checked" :selectType="selectType" :show="showSelect"
|
||||
:checkedList="hasCheckedList" @update:cancel="showSelect = false" @update:confirm="onComfirm"
|
||||
:key="selectIndex" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { baseUrl2 } from "@/utils/request.js";
|
||||
import ImageCompressor from "image-compressor.js";
|
||||
import { upImage } from "@/api/common";
|
||||
import Select from "./components/Select.vue";
|
||||
import { hintToast, timeValidate } from "../../../utils/tools";
|
||||
import { rwDetail, eidtRw, addRw } from "../../../api/xfgl.js";
|
||||
import TopNav from "../../../components/topNav.vue";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { getDictList, setDict } from "../../../utils/dict";
|
||||
import { ref, onMounted, reactive, defineProps, nextTick } from "vue";
|
||||
const { D_BZ_XFLX, D_BZ_RWZT, D_SB_SBLX } = getDictList("D_BZ_XFLX", "D_BZ_RWZT", "D_SB_SBLX");
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const fileList = ref([]);
|
||||
const fjData = ref([]) //附件
|
||||
const normalForm = ref({
|
||||
xfsj: timeValidate(),
|
||||
sbsj: timeValidate(),
|
||||
rwztmc: '正常',
|
||||
rwzt: 0,
|
||||
ssbmdm: JSON.parse(window.localStorage.getItem("userInfo")).deptList[0].deptCode
|
||||
});
|
||||
const sbsj = timeValidate()
|
||||
const title = ref("新增巡防任务");
|
||||
const clickType = ref(""); //点击选择
|
||||
const columns = ref([]);
|
||||
const time = ref();
|
||||
const isShowCommonPicker = ref(false);
|
||||
const showSelect = ref(false);
|
||||
const selectType = ref(""); //选择的类型
|
||||
const r_checked = ref(""); //选择的类型
|
||||
const hasCheckedList = ref([]); //选择的类型
|
||||
const selectIndex = ref(1); //选择器组件KEY
|
||||
const wpTpIdList = ref([]);
|
||||
const sbTpIdList = ref([]);
|
||||
const isLoading = ref(false)
|
||||
const fileBoxs = ref([]) //附件其他类型
|
||||
const urlImg = `${baseUrl2}/mosty-api/mosty-base/minio/image/download/`;
|
||||
|
||||
const dataList = reactive({
|
||||
fzrList: [], //巡访组长
|
||||
nrList: [], //巡访内容
|
||||
mjList: [], //组员民警
|
||||
fjList: [], //组员辅警
|
||||
xfdwList: [],//巡访单位
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
title.value = route.query.id ? "编辑战果申报" : "新增战果申报";
|
||||
if (route.query.id) {
|
||||
nextTick(() => {
|
||||
_getDetailById(); //根据id获取详情
|
||||
});
|
||||
}
|
||||
});
|
||||
// 打开弹窗
|
||||
function showDialogfn(type) {
|
||||
selectType.value = type; //选取的类型
|
||||
showSelect.value = true; //打开弹窗
|
||||
hasCheckedList.value = [];
|
||||
r_checked.value = "";
|
||||
selectIndex.value++;
|
||||
hasChooseData();
|
||||
}
|
||||
// 已经选取的数据回显
|
||||
function hasChooseData() {
|
||||
switch (selectType.value) {
|
||||
case "xfzz":
|
||||
if (!dataList.fzrList.length) return false;
|
||||
r_checked.value = dataList.fzrList[0].key;
|
||||
break;
|
||||
case "xfnr":
|
||||
if (!dataList.nrList.length) return false;
|
||||
r_checked.value = dataList.nrList[0].key;
|
||||
break;
|
||||
case "xfmj":
|
||||
if (!dataList.mjList.length) return false;
|
||||
hasCheckedList.value = dataList.mjList.map((item) => {
|
||||
return item.key;
|
||||
});
|
||||
break;
|
||||
case "xffj":
|
||||
if (!dataList.fjList.length) return false;
|
||||
hasCheckedList.value = dataList.fjList.map((item) => {
|
||||
return item.key;
|
||||
});
|
||||
break;
|
||||
case "xfdw":
|
||||
if (!dataList.xfdwList.length) return false;
|
||||
hasCheckedList.value = dataList.xfdwList.map((item) => {
|
||||
return item.key;
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
//确认选择
|
||||
function onComfirm(val) {
|
||||
if (val.length <= 0) return false;
|
||||
switch (selectType.value) {
|
||||
case "xfzz":
|
||||
dataList.fzrList = val; //选取的负责人数据
|
||||
normalForm.value.xfzzXm = val[0].xm;
|
||||
normalForm.value.xfzzSfzh = val[0].sfzh;
|
||||
break;
|
||||
case "xfnr":
|
||||
dataList.nrList = val; //巡防内容
|
||||
normalForm.value.xfnr = val[0].nr;
|
||||
break;
|
||||
case "xfmj":
|
||||
dataList.mjList = val; //选取的组员民警
|
||||
normalForm.value.xfmj = val.map(v => { return v.xm }).join(',')
|
||||
break;
|
||||
case "xffj":
|
||||
dataList.fjList = val; //选取的组员辅警
|
||||
normalForm.value.xffj = val.map(v => { return v.xm }).join(',')
|
||||
break;
|
||||
case "xfdw":
|
||||
dataList.xfdwList = val; //选取的单位
|
||||
normalForm.value.sfdw = val.map(v => { return v.dwmc }).join(',')
|
||||
normalForm.value.dz = val[0].dz
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
//根据id获取详情
|
||||
function _getDetailById() {
|
||||
rwDetail(route.query.id).then((res) => {
|
||||
let List = JSON.parse(res.xfzy);
|
||||
dataList.mjList = List.filter(v => { return v.fl == '01' })
|
||||
res.xfmj = dataList.mjList.map(it => { return it.xm }).join(',')
|
||||
dataList.fjList = List.filter(v => { return v.fl == '02' })
|
||||
res.xffj = dataList.fjList.map(it => { return it.xm }).join(',')
|
||||
dataList.xfdwList = JSON.parse(res.xfdw)
|
||||
res.sfdw = dataList.xfdwList.map(it => { return it.dwmc }).join(',')
|
||||
res.dz = dataList.xfdwList.length > 0 ? dataList.xfdwList[0].dz : '';
|
||||
let ids = res.xfzp ? res.xfzp.split(',') : []
|
||||
fileList.value = []
|
||||
wpTpIdList.value = []
|
||||
ids.forEach(item => {
|
||||
wpTpIdList.value.push(item)
|
||||
let img = baseUrl2 + "/mosty-api/mosty-base/minio/image/download/" + item;
|
||||
let obj = {
|
||||
url: img,
|
||||
codeId: item,
|
||||
isImage: true,
|
||||
status: "done",
|
||||
message: "上传成功",
|
||||
};
|
||||
fileList.value.push(obj)
|
||||
});
|
||||
|
||||
fjData.value = []
|
||||
fileBoxs.value = []
|
||||
sbTpIdList.value = []
|
||||
let fjarr = res.sbfj ? JSON.parse(res.sbfj) : [];
|
||||
let imgType = ['image/png', 'image/jpeg', 'image/jpg']
|
||||
fjarr.forEach(item => {
|
||||
sbTpIdList.value.push(item)
|
||||
if (imgType.includes(item.type)) {
|
||||
let img1 = baseUrl2 + "/mosty-api/mosty-base/minio/image/download/" + item.id;
|
||||
let obj1 = {
|
||||
url: img1,
|
||||
codeId: item.id,
|
||||
isImage: true,
|
||||
status: "done",
|
||||
message: "上传成功",
|
||||
};
|
||||
fjData.value.push(obj1)
|
||||
} else {
|
||||
fileBoxs.value.push(item)
|
||||
}
|
||||
})
|
||||
normalForm.value = res;
|
||||
setTimeout(() => {
|
||||
D_SB_SBLX.value.forEach((element) => {
|
||||
if (element.dm == res.sblx) normalForm.value.sblxmc = element.text;
|
||||
});
|
||||
D_BZ_XFLX.value.forEach((element) => {
|
||||
if (element.dm == res.xflx) normalForm.value.xflxmc = element.text;
|
||||
});
|
||||
D_BZ_RWZT.value.forEach((element) => {
|
||||
if (element.dm == res.rwzt) normalForm.value.rwztmc = element.text;
|
||||
});
|
||||
}, 500)
|
||||
});
|
||||
}
|
||||
|
||||
// 删除其他文件
|
||||
function deletDate(it, idex) {
|
||||
fileBoxs.value.splice(idex, 1)
|
||||
let index = sbTpIdList.value.findIndex(item => {
|
||||
return item.id == it.id
|
||||
})
|
||||
if (index != -1) sbTpIdList.value.splice(index, 1)
|
||||
}
|
||||
|
||||
// 打开弹窗
|
||||
function getCommonPop(val) {
|
||||
clickType.value = val;
|
||||
switch (val) {
|
||||
case "xflx":
|
||||
columns.value = D_BZ_XFLX.value;
|
||||
break;
|
||||
case "rwzt":
|
||||
columns.value = D_BZ_RWZT.value;
|
||||
break;
|
||||
case "sblx":
|
||||
columns.value = D_SB_SBLX.value;
|
||||
break;
|
||||
}
|
||||
isShowCommonPicker.value = true;
|
||||
}
|
||||
|
||||
// 确定选择
|
||||
function onConfirm(val) {
|
||||
isShowCommonPicker.value = false;
|
||||
switch (clickType.value) {
|
||||
case "xflx":
|
||||
normalForm.value.xflxmc = val.text;
|
||||
normalForm.value.xflx = val.dm;
|
||||
break;
|
||||
case "rwzt":
|
||||
normalForm.value.rwztmc = val.text;
|
||||
normalForm.value.rwzt = val.dm;
|
||||
break;
|
||||
case "sblx":
|
||||
normalForm.value.sblx = val.dm;
|
||||
normalForm.value.sblxmc = val.zdmc;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// 删除神宝宝附件
|
||||
const beforeDeletefJ = (url, val) => {
|
||||
fjData.value.splice(val.index, 1)
|
||||
let index = sbTpIdList.value.findIndex(item => {
|
||||
return item.id == url.codeId
|
||||
})
|
||||
if (index != -1) sbTpIdList.value.splice(index, 1)
|
||||
}
|
||||
|
||||
// 申报附件
|
||||
async function afterReadFjsb(file) {
|
||||
file.message = "上传中...";
|
||||
let imgType = ['image/png', 'image/jpeg', 'image/jpg']
|
||||
let type = file.file.type;
|
||||
const data = new FormData();
|
||||
if (imgType.includes(type)) {
|
||||
let fileBlob = await _compressImage(file.file);
|
||||
let fileData = new File([fileBlob], fileBlob.name, { type: fileBlob.type });
|
||||
data.append("file", fileData);
|
||||
} else {
|
||||
data.append("file", file.file);
|
||||
}
|
||||
file.status = "uploading";
|
||||
upImage(data).then((res) => {
|
||||
file.status = "done";
|
||||
file.message = "上传成功";
|
||||
sbTpIdList.value.push({ id: res, type: type, name: file.file.name });
|
||||
});
|
||||
}
|
||||
|
||||
// 删除照片上传
|
||||
const deleteFj = (url, val) => {
|
||||
fileList.value.splice(val.index, 1)
|
||||
wpTpIdList.value.splice(val.index, 1)
|
||||
}
|
||||
|
||||
// 文件预览
|
||||
async function afterRead(file) {
|
||||
file.message = "上传中...";
|
||||
let fileBlob = await _compressImage(file.file);
|
||||
let fileData = new File([fileBlob], fileBlob.name, { type: fileBlob.type });
|
||||
const data = new FormData();
|
||||
data.append("file", fileData);
|
||||
file.status = "uploading";
|
||||
upImage(data).then((res) => {
|
||||
file.status = "done";
|
||||
file.message = "上传成功";
|
||||
if (!wpTpIdList.value.includes(res)) wpTpIdList.value.push(res);
|
||||
});
|
||||
}
|
||||
//压缩图片
|
||||
const _compressImage = (file) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
new ImageCompressor(file, {
|
||||
quality: 0.6, //压缩质量
|
||||
success(res) {
|
||||
resolve(res);
|
||||
},
|
||||
error(e) {
|
||||
reject(e);
|
||||
},
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
// 提交
|
||||
function onSubmit() {
|
||||
let arr = [...dataList.mjList, ...dataList.fjList]
|
||||
let params = {
|
||||
...normalForm.value,
|
||||
xfzy: JSON.stringify(arr),
|
||||
xfdw: JSON.stringify(dataList.xfdwList),
|
||||
}
|
||||
params.xfzp = wpTpIdList.value.join(',')
|
||||
params.sbfj = JSON.stringify(sbTpIdList.value)
|
||||
isLoading.value = true;
|
||||
if (title.value == '编辑战果申报') {
|
||||
eidtRw(params).then(res => {
|
||||
hintToast('编辑成功')
|
||||
router.go(-1);
|
||||
}).catch(() => {
|
||||
isLoading.value = false
|
||||
})
|
||||
} else {
|
||||
addRw(params).then(res => {
|
||||
hintToast('新增成功')
|
||||
router.go(-1);
|
||||
}).catch(() => {
|
||||
isLoading.value = false
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.infoBox {
|
||||
height: 100%;
|
||||
position: relative;
|
||||
|
||||
.cardInfo {
|
||||
height: calc(100vh - 13vw);
|
||||
padding: 1vw 4vw;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
|
||||
.item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
|
||||
.itemlabel {
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
font-size: 14px;
|
||||
color: #646566;
|
||||
}
|
||||
|
||||
.mark {
|
||||
margin: 0 10px;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #767676;
|
||||
}
|
||||
}
|
||||
|
||||
.item::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
left: 0;
|
||||
top: 32%;
|
||||
background: #0066ff;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
z-index: 11;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
|
||||
.btn {
|
||||
padding: 2vw 6vw;
|
||||
background: #1989fa;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.textarea {
|
||||
::v-deep .van-field__control {
|
||||
background: #f8fafd;
|
||||
padding-left: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.fjBox {
|
||||
padding: 4vw;
|
||||
box-sizing: border-box;
|
||||
|
||||
.listitem {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 4vw;
|
||||
font-size: 16px;
|
||||
|
||||
.name {
|
||||
color: blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
213
src/pages/views/Declaration/addEditCyry.vue
Normal file
213
src/pages/views/Declaration/addEditCyry.vue
Normal file
@ -0,0 +1,213 @@
|
||||
<template>
|
||||
<div style="padding-top: 13vw">
|
||||
<TopNav :navTitle="title" />
|
||||
<van-form @submit="onSubmit" style="height: calc(100vh - 13vw);">
|
||||
<div class="infoBox">
|
||||
<ul class="cardInfo">
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xm" required name="姓名" label="姓名" :disabled="disabled" placeholder="输入姓名"
|
||||
input-align="right" :rules="[{ required: true, message: '请输入姓名' }]" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.sfzh" required :disabled="disabled" name="身份证号" label="身份证号"
|
||||
placeholder="输入身份证号" input-align="right" :rules="sfzhRuls" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xbmc" required :disabled="disabled" name="性别" label="性别" placeholder="请选择性别"
|
||||
input-align="right" readonly :rules="[{ required: true, message: '请选择性别' }]"
|
||||
@click="getCommonPop('sex')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.csrq" :disabled="disabled" required name="出生日期" label="出生日期"
|
||||
placeholder="点击设置" input-align="right" :rules="[{ required: true, message: '请选择出生日期' }]"
|
||||
@click="getCommonPop('time')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.lxdh" required name="联系电话" label="联系电话" placeholder="请输入联系电话"
|
||||
input-align="right" :rules="lxdhRuls" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xxdz" required name="现住址" label="现住址" placeholder="请输入住址名称"
|
||||
input-align="right" :rules="[{ required: true, message: '请输入住址名称' }]" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field name="备注" readonly label="备注" />
|
||||
</li>
|
||||
<div class="textarea">
|
||||
<van-field placeholder="请输备注" v-model="normalForm.bz" rows="4" autosize maxlength="500" show-word-limit
|
||||
type="textarea"></van-field>
|
||||
</div>
|
||||
</ul>
|
||||
<div class="footer">
|
||||
<van-button round block type="primary" native-type="submit" :loading="isLoading" loading-type="spinner"
|
||||
loading-text="登录中...">提交</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-form>
|
||||
</div>
|
||||
|
||||
<!-- 弹窗 -->
|
||||
<van-popup v-model:show="isShowCommonPicker" round position="bottom">
|
||||
<van-picker v-if="clickType == 'sex'" :columns="columns" @cancel="isShowCommonPicker = false" @confirm="onConfirm" />
|
||||
<van-datetime-picker @cancel="isShowCommonPicker = false" @confirm="onConfirm" v-if="clickType == 'time'" v-model="time" type="date" title="选择年月日">
|
||||
</van-datetime-picker>
|
||||
</van-popup>
|
||||
</template>
|
||||
<script setup>
|
||||
import { IdCardValidator, phoneValidator } from "../../../utils/rules.js"
|
||||
import { cyryDetail, editDetail, addDetail } from "../../../api/xfgl.js";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import TopNav from "../../../components/topNav.vue";
|
||||
import { hintToast, timeValidate } from "../../../utils/tools";
|
||||
import { getDictList, setDict } from "../../../utils/dict";
|
||||
import { ref, onMounted, reactive, defineProps } from "vue";
|
||||
const { D_BZ_XB } = getDictList("D_BZ_XB");
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const message = ref("");
|
||||
const normalForm = ref({});
|
||||
const columns = ref([]);
|
||||
const time = ref();
|
||||
const isLoading = ref(false);
|
||||
const disabled = ref(false)
|
||||
const isShowCommonPicker = ref(false);
|
||||
const clickType = ref(""); //点击选择
|
||||
const title = ref("新增人员");
|
||||
const sfzhRuls = ref([
|
||||
{ required: true, message: '身份证号码不能为空', trigger: 'onChange/onBlur' },
|
||||
{ validator: (value) => { return IdCardValidator(value) }, trigger: 'onChange/onBlur' }
|
||||
])
|
||||
const lxdhRuls = ref([
|
||||
{ required: true, message: '联系电话不能为空', trigger: 'onChange/onBlur' },
|
||||
{ validator: (value) => { return phoneValidator(value) }, trigger: 'onChange/onBlur' }
|
||||
])
|
||||
|
||||
onMounted(() => {
|
||||
title.value = route.query.id ? "编辑人员" : "新增人员";
|
||||
disabled.value = route.query.id ? true : false;
|
||||
if (route.query.id) _getDetailById(); //根据id获取详情
|
||||
});
|
||||
//根据id获取详情
|
||||
function _getDetailById() {
|
||||
cyryDetail(route.query.id).then((res) => {
|
||||
normalForm.value = res;
|
||||
D_BZ_XB.value.forEach((element) => {
|
||||
if (element.dm == res.xb) normalForm.value.xbmc = element.text;
|
||||
});
|
||||
});
|
||||
}
|
||||
// 选择性别
|
||||
function getCommonPop(val) {
|
||||
if (disabled.value) return false;
|
||||
clickType.value = val;
|
||||
switch (val) {
|
||||
case "sex":
|
||||
columns.value = D_BZ_XB.value;
|
||||
break;
|
||||
}
|
||||
isShowCommonPicker.value = true;
|
||||
}
|
||||
// 确定选择
|
||||
function onConfirm(val) {
|
||||
isShowCommonPicker.value = false;
|
||||
switch (clickType.value) {
|
||||
case "sex":
|
||||
normalForm.value.xbmc = val.text;
|
||||
normalForm.value.xb = val.dm;
|
||||
break;
|
||||
case "time":
|
||||
normalForm.value.csrq = timeValidate(val, "ymd");
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// 提交
|
||||
function onSubmit() {
|
||||
isLoading.value = true;
|
||||
delete normalForm.value.xbmc
|
||||
if (title.value == '编辑人员') {
|
||||
editDetail(normalForm.value).then(res => {
|
||||
hintToast('编辑成功')
|
||||
router.go(-1);
|
||||
})
|
||||
} else {
|
||||
addDetail(normalForm.value).then(res => {
|
||||
hintToast('新增成功')
|
||||
router.go(-1);
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.infoBox {
|
||||
height: 100%;
|
||||
position: relative;
|
||||
|
||||
.cardInfo {
|
||||
height: calc(100vh - 13vw);
|
||||
padding: 1vw 4vw;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
|
||||
.item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
// height: 8vw;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
|
||||
.mark {
|
||||
margin: 0 10px;
|
||||
color: red;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #767676;
|
||||
}
|
||||
}
|
||||
|
||||
.item::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
left: 0;
|
||||
top: 20%;
|
||||
// transform: translateY(-50%);
|
||||
background: #0066ff;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
z-index: 11;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
|
||||
.btn {
|
||||
padding: 2vw 6vw;
|
||||
background: #1989fa;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.textarea {
|
||||
::v-deep .van-field__control {
|
||||
background: #f8fafd;
|
||||
padding-left: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.fjBox {
|
||||
padding: 4vw;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
348
src/pages/views/Declaration/addEditDw.vue
Normal file
348
src/pages/views/Declaration/addEditDw.vue
Normal file
@ -0,0 +1,348 @@
|
||||
<template>
|
||||
<div style="padding-top: 13vw">
|
||||
<TopNav :navTitle="title" />
|
||||
<van-form @submit="onSubmit" style="height: calc(100vh - 13vw);">
|
||||
<div class="infoBox">
|
||||
<ul class="cardInfo">
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.dwlxmc" required name="单位类型" label="单位类型" :disabled="disabled"
|
||||
placeholder="请选择单位类型" input-align="right" readonly is-link
|
||||
:rules="[{ required: true, message: '请选择单位类型' }]" @click="getCommonPop('dwlx')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.dwmc" required name="单位名称" label="单位名称" :disabled="disabled"
|
||||
placeholder="请输入单位名称" input-align="right" :rules="[{ required: true, message: '请输入单位名称' }]" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.dwflmc" required name="单位分类" label="单位分类" is-link :disabled="disabled"
|
||||
placeholder="请选择单位分类" input-align="right" readonly :rules="[{ required: true, message: '请选择单位分类' }]"
|
||||
@click="getCommonPop('dwfl')" />
|
||||
</li>
|
||||
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.lxdh" required :disabled="disabled" name="联系电话" label="联系电话"
|
||||
placeholder="请输入联系电话" input-align="right" :rules="[{ required: true, message: '请输入联系电话' }]" />
|
||||
</li>
|
||||
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.dws" required :disabled="disabled" name="单位数" label="单位数"
|
||||
placeholder="请输入单位数" input-align="right" type="digit" :rules="[{ required: true, message: '请输入单位数' }]" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.addreess" required :disabled="disabled" name="地址" label="地址" readonly />
|
||||
<div @click="addDz"><van-icon name="location" color="#4788e1" size="6vw" /></div>
|
||||
</li>
|
||||
<ul>
|
||||
<li class="item-li" v-for="(it, idx) in dzList" :key="idx">
|
||||
<span class="text">地址{{ idx + 1 }}：</span>
|
||||
<span class="info"><van-field v-model="it.dz" /></span>
|
||||
<span @click="deletItem('dz', idx)" class="iconClose"><van-icon name="close" color="red" size="6vw" /></span>
|
||||
</li>
|
||||
</ul>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.addreess" required :disabled="disabled" name="从业人员" label="从业人员" readonly />
|
||||
<div @click="showDialogfn('cyry')"><van-icon name="add-o" color="#4788e1" size="6vw" /></div>
|
||||
</li>
|
||||
<ul>
|
||||
<li class="item-li" v-for="(it, idx) in dataList.ryList" :key="idx">
|
||||
<span class="text">人员：</span>
|
||||
<span class="info"><van-field readonly v-model="it.info" /></span>
|
||||
<span @click="deletItem('ry', idx)" class="iconClose"><van-icon name="close" color="red" size="6vw" /></span>
|
||||
</li>
|
||||
</ul>
|
||||
<li class="item">
|
||||
<van-field name="备注" readonly label="备注" />
|
||||
</li>
|
||||
<div class="textarea">
|
||||
<van-field placeholder="请输备注" v-model="normalForm.bz" :disabled="disabled" rows="4" autosize maxlength="500" show-word-limit type="textarea"></van-field>
|
||||
</div>
|
||||
</ul>
|
||||
<div class="footer">
|
||||
<van-button round block type="primary" native-type="submit" :loading="isLoading" loading-type="spinner" loading-text="登录中...">提交</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-form>
|
||||
</div>
|
||||
|
||||
<!-- 弹窗 -->
|
||||
<van-popup v-model:show="isShowCommonPicker" round position="bottom">
|
||||
<van-picker v-if="clickType == 'dwlx' || clickType == 'dwfl'" :columns="columns"
|
||||
@cancel="isShowCommonPicker = false" @confirm="onConfirm" />
|
||||
</van-popup>
|
||||
<!-- 弹窗 -->
|
||||
<Select v-if="showSelect" :checked="r_checked" :selectType="selectType" :show="showSelect"
|
||||
:checkedList="hasCheckedList" @update:cancel="showSelect = false" @update:confirm="onComfirm" :key="selectIndex" />
|
||||
</template>
|
||||
<script setup>
|
||||
import Select from "./components/Select.vue";
|
||||
import { dwglDetail, editDwgl, addDwgl } from "../../../api/xfgl.js";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import TopNav from "../../../components/topNav.vue";
|
||||
import { hintToast, timeValidate } from "../../../utils/tools";
|
||||
import { getDictList, setDict } from "../../../utils/dict";
|
||||
import { ref, onMounted, reactive, defineProps } from "vue";
|
||||
const { D_BZ_DWLX, D_BZ_DWFL } = getDictList("D_BZ_DWLX", "D_BZ_DWFL");
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const message = ref("");
|
||||
const normalForm = ref({
|
||||
ssbmdm: JSON.parse(window.localStorage.getItem("userInfo")).deptList[0].deptCode
|
||||
});
|
||||
const columns = ref([]);
|
||||
const isLoading = ref(false);
|
||||
const disabled = ref(false)
|
||||
const isShowCommonPicker = ref(false);
|
||||
const clickType = ref(""); //点击选择
|
||||
const showSelect = ref(false);
|
||||
const r_checked = ref(""); //选择的类型
|
||||
const hasCheckedList = ref([]); //选择的类型
|
||||
const selectIndex = ref(1); //选择器组件KEY
|
||||
const title = ref("新增单位");
|
||||
const dzList = ref([])
|
||||
const selectType = ref('')
|
||||
const dataList = reactive({
|
||||
ryList: [], //人员
|
||||
});
|
||||
onMounted(() => {
|
||||
title.value = route.query.id ? "编辑单位" : "新增单位";
|
||||
// disabled.value = route.query.id ? true : false;
|
||||
if (route.query.id) _getDetailById(); //根据id获取详情
|
||||
});
|
||||
//根据id获取详情
|
||||
function _getDetailById() {
|
||||
dwglDetail(route.query.id).then((res) => {
|
||||
normalForm.value = res;
|
||||
D_BZ_DWLX.value.forEach((element) => {
|
||||
if (element.dm == res.dwlx) normalForm.value.dwlxmc = element.text;
|
||||
});
|
||||
D_BZ_DWFL.value.forEach((element) => {
|
||||
if (element.dm == res.dwfl) normalForm.value.dwflmc = element.text;
|
||||
});
|
||||
let list = res.cyry ? JSON.parse(res.cyry) : []
|
||||
dataList.ryList = list.map(item => {
|
||||
if (!item.info) item.xm + '(' + item.sfzh + ')'
|
||||
return item
|
||||
})
|
||||
hasCheckedList.value = dataList.ryList.map((item) => {
|
||||
return item.key;
|
||||
});
|
||||
dzList.value = []
|
||||
for (let key in res) {
|
||||
if (key.search('dz') != -1) dzList.value.push({ dz: res[key] });
|
||||
}
|
||||
});
|
||||
}
|
||||
// 新增地址
|
||||
function addDz() {
|
||||
if (disabled.value) return false;
|
||||
dzList.value.push({ dz: '' })
|
||||
}
|
||||
// 打开弹窗
|
||||
function showDialogfn(type) {
|
||||
if (disabled.value) return false;
|
||||
selectType.value = type; //选取的类型
|
||||
showSelect.value = true; //打开弹窗
|
||||
hasCheckedList.value = [];
|
||||
r_checked.value = "";
|
||||
selectIndex.value++;
|
||||
hasChooseData();
|
||||
}
|
||||
// 已经选取的数据回显
|
||||
function hasChooseData() {
|
||||
switch (selectType.value) {
|
||||
case "cyry":
|
||||
if (!dataList.ryList.length) return false;
|
||||
hasCheckedList.value = dataList.ryList.map((item) => {
|
||||
return item.key;
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
//确认选择
|
||||
function onComfirm(val) {
|
||||
if (val.length <= 0) return false;
|
||||
switch (selectType.value) {
|
||||
case "cyry":
|
||||
dataList.ryList = val.map(v => {
|
||||
v.info = v.xm + '(' + v.sfzh + ')'
|
||||
return v
|
||||
}); //选取的组员
|
||||
normalForm.value.cyry = JSON.stringify(val)
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// 选择
|
||||
function getCommonPop(val) {
|
||||
if (disabled.value) return false;
|
||||
clickType.value = val;
|
||||
switch (val) {
|
||||
case "dwlx":
|
||||
columns.value = D_BZ_DWLX.value;
|
||||
break;
|
||||
case "dwfl":
|
||||
columns.value = D_BZ_DWFL.value;
|
||||
break;
|
||||
}
|
||||
isShowCommonPicker.value = true;
|
||||
}
|
||||
// 确定选择
|
||||
function onConfirm(val) {
|
||||
isShowCommonPicker.value = false;
|
||||
switch (clickType.value) {
|
||||
case "dwlx":
|
||||
normalForm.value.dwlxmc = val.text;
|
||||
normalForm.value.dwlx = val.dm;
|
||||
break;
|
||||
case "dwfl":
|
||||
normalForm.value.dwflmc = val.text;
|
||||
normalForm.value.dwfl = val.dm;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// 删除选择的人员-地址
|
||||
function deletItem(type, index) {
|
||||
if (disabled.value) return false;
|
||||
switch (type) {
|
||||
case 'dz':
|
||||
dzList.value.splice(index, 1)
|
||||
break;
|
||||
case 'cyry':
|
||||
dataList.ryList.splice(index, 1);
|
||||
hasCheckedList.value = dataList.ryList.map((item) => {
|
||||
return item.key;
|
||||
});
|
||||
normalForm.value.cyry = JSON.stringify(dataList.ryList)
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// 提交
|
||||
function onSubmit() {
|
||||
let pramas = {
|
||||
...normalForm.value
|
||||
}
|
||||
dzList.value.forEach((item, idex) => {
|
||||
if (idex > 0) {
|
||||
pramas['dz' + idex] = item.dz
|
||||
} else {
|
||||
pramas['dz'] = item.dz
|
||||
}
|
||||
})
|
||||
isLoading.value = true;
|
||||
if (title.value == '编辑单位') {
|
||||
editDwgl(pramas).then(res => {
|
||||
hintToast('编辑成功')
|
||||
router.push({ path: "/Declaration" });
|
||||
})
|
||||
} else {
|
||||
addDwgl(pramas).then(res => {
|
||||
hintToast('新增成功')
|
||||
router.push({ path: "/Declaration" });
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.infoBox {
|
||||
height: 100%;
|
||||
position: relative;
|
||||
|
||||
.cardInfo {
|
||||
height: calc(100vh - 13vw);
|
||||
padding: 1vw 4vw;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
|
||||
.item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
// height: 8vw;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
|
||||
.mark {
|
||||
margin: 0 10px;
|
||||
color: red;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #767676;
|
||||
}
|
||||
}
|
||||
|
||||
.item::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
background: #0066ff;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
z-index: 11;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
|
||||
.btn {
|
||||
padding: 2vw 6vw;
|
||||
background: #1989fa;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item-li {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 2vw 4vw;
|
||||
box-sizing: border-box;
|
||||
|
||||
.info {
|
||||
margin: 0 10px;
|
||||
flex: 1;
|
||||
|
||||
::v-deep .van-cell__value {
|
||||
background: #e5eff5;
|
||||
padding-left: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
::v-deep .van-cell {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #8b8b94;
|
||||
width: 16vw;
|
||||
}
|
||||
|
||||
.iconClose {
|
||||
display: inline-block;
|
||||
width: 6vw;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.textarea {
|
||||
::v-deep .van-field__control {
|
||||
background: #f8fafd;
|
||||
padding-left: 4px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
386
src/pages/views/Declaration/addEditRw.vue
Normal file
386
src/pages/views/Declaration/addEditRw.vue
Normal file
@ -0,0 +1,386 @@
|
||||
<template>
|
||||
<div style="padding-top: 13vw">
|
||||
<TopNav :navTitle="title" />
|
||||
<van-form @submit="onSubmit" style="height: calc(100vh - 13vw);">
|
||||
<div class="infoBox">
|
||||
<ul class="cardInfo">
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xfsj" required name="时间" is-link readonly label="时间" placeholder="点击设置"
|
||||
input-align="right" :rules="[{ required: true, message: '请选择时间' }]" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xfzzXm" required name="巡访主责人" is-link readonly label="巡访主责人"
|
||||
placeholder="点击设置" input-align="right" :rules="[{ required: true, message: '请选择巡访主责人' }]"
|
||||
@click="showDialogfn('xfzz')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xfzzSfzh" required name="身份证号" readonly input-align="right" label="身份证号"
|
||||
:rules="[{ required: true, message: '请输入组长身份证号' }]" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xfmj" name="巡访同行人(民警)" is-link label-width="108px" readonly label="巡访同行人(民警)"
|
||||
placeholder="点击设置" input-align="right" @click="showDialogfn('xfmj')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xffj" name="巡访同行人(辅警)" is-link label-width="108px" readonly label="巡访同行人(辅警)"
|
||||
placeholder="点击设置" input-align="right" @click="showDialogfn('xffj')" />
|
||||
</li>
|
||||
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.sfdw" name="巡访单位" is-link readonly label="巡访单位" placeholder="点击设置"
|
||||
input-align="right" required :rules="[{ required: true, message: '请选择巡访单位' }]"
|
||||
@click="showDialogfn('xfdw')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.dz" required name="巡访地点" label="巡访地点" placeholder="输入地点" input-align="right"
|
||||
:rules="[{ required: true, message: '请选择巡访地点' }]" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.xflxmc" required name="巡访类型" is-link readonly label="巡访类型" placeholder="点击设置"
|
||||
input-align="right" :rules="[{ required: true, message: '请选择巡访类型' }]" @click="getCommonPop('xflx')" />
|
||||
</li>
|
||||
<li class="item">
|
||||
<van-field v-model="normalForm.rwztmc" name="任务状态" is-link readonly label="任务状态" placeholder="选择任务状态"
|
||||
input-align="right" @click="getCommonPop('rwzt')" />
|
||||
</li>
|
||||
|
||||
<li class="item">
|
||||
<van-field name="巡访内容" @click="showDialogfn('xfnr')" readonly label="巡访内容" />
|
||||
</li>
|
||||
<div class="textarea">
|
||||
<van-field placeholder="请输相关内容" v-model="normalForm.xfnr" rows="4" autosize maxlength="500" show-word-limit type="textarea"></van-field>
|
||||
</div>
|
||||
<li class="item">
|
||||
<div><span class="mark"></span>拍照打卡</div>
|
||||
</li>
|
||||
<!-- 附件 -->
|
||||
<div class="fjBox">
|
||||
<van-uploader v-model="fileList" multiline :max-count="3" :after-read="afterRead"></van-uploader>
|
||||
</div>
|
||||
</ul>
|
||||
<div class="footer">
|
||||
<van-button round block type="primary" native-type="submit" :loading="isLoading" loading-type="spinner" loading-text="登录中...">提交</van-button>
|
||||
</div>
|
||||
</div>
|
||||
</van-form>
|
||||
<!-- 弹窗 -->
|
||||
<van-popup v-model:show="isShowCommonPicker" round position="bottom">
|
||||
<van-picker :columns="columns" @cancel="isShowCommonPicker = false" @confirm="onConfirm" />
|
||||
</van-popup>
|
||||
|
||||
<!-- 弹窗 -->
|
||||
<Select v-if="showSelect" :checked="r_checked" :selectType="selectType" :show="showSelect"
|
||||
:checkedList="hasCheckedList" @update:cancel="showSelect = false" @update:confirm="onComfirm"
|
||||
:key="selectIndex" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { baseUrl2 } from "@/utils/request.js";
|
||||
import ImageCompressor from "image-compressor.js";
|
||||
import { upImage } from "@/api/common";
|
||||
import Select from "./components/Select.vue";
|
||||
import { hintToast, timeValidate } from "../../../utils/tools";
|
||||
import { rwDetail, eidtRw, addRw } from "../../../api/xfgl.js";
|
||||
import TopNav from "../../../components/topNav.vue";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { getDictList, setDict } from "../../../utils/dict";
|
||||
import { ref, onMounted, reactive, defineProps, nextTick } from "vue";
|
||||
const { D_BZ_XFLX, D_BZ_RWZT } = getDictList("D_BZ_XFLX", "D_BZ_RWZT");
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const fileList = ref([]);
|
||||
|
||||
const normalForm = ref({
|
||||
xfsj: timeValidate(),
|
||||
rwztmc: '正常',
|
||||
rwzt: 0
|
||||
});
|
||||
const title = ref("新增巡防任务");
|
||||
const clickType = ref(""); //点击选择
|
||||
const columns = ref([]);
|
||||
const time = ref();
|
||||
const isShowCommonPicker = ref(false);
|
||||
const showSelect = ref(false);
|
||||
const selectType = ref(""); //选择的类型
|
||||
const r_checked = ref(""); //选择的类型
|
||||
const hasCheckedList = ref([]); //选择的类型
|
||||
const selectIndex = ref(1); //选择器组件KEY
|
||||
const wpTpIdList = ref([]);
|
||||
const isLoading = ref(false)
|
||||
const urlImg = `${baseUrl2}/mosty-api/mosty-base/minio/image/download/`;
|
||||
|
||||
const dataList = reactive({
|
||||
fzrList: [], //巡访组长
|
||||
nrList: [], //巡访内容
|
||||
mjList: [], //组员民警
|
||||
fjList: [], //组员辅警
|
||||
xfdwList: [],//巡访单位
|
||||
});
|
||||
onMounted(() => {
|
||||
title.value = route.query.id ? "编辑巡防任务" : "新增巡防任务";
|
||||
if (route.query.id) {
|
||||
nextTick(() => {
|
||||
_getDetailById(); //根据id获取详情
|
||||
});
|
||||
}
|
||||
});
|
||||
// 打开弹窗
|
||||
function showDialogfn(type) {
|
||||
selectType.value = type; //选取的类型
|
||||
showSelect.value = true; //打开弹窗
|
||||
hasCheckedList.value = [];
|
||||
r_checked.value = "";
|
||||
selectIndex.value++;
|
||||
hasChooseData();
|
||||
}
|
||||
// 已经选取的数据回显
|
||||
function hasChooseData() {
|
||||
switch (selectType.value) {
|
||||
case "xfzz":
|
||||
if (!dataList.fzrList.length) return false;
|
||||
r_checked.value = dataList.fzrList[0].key;
|
||||
break;
|
||||
case "xfnr":
|
||||
if (!dataList.nrList.length) return false;
|
||||
r_checked.value = dataList.nrList[0].key;
|
||||
break;
|
||||
case "xfmj":
|
||||
if (!dataList.mjList.length) return false;
|
||||
hasCheckedList.value = dataList.mjList.map((item) => {
|
||||
return item.key;
|
||||
});
|
||||
break;
|
||||
case "xffj":
|
||||
if (!dataList.fjList.length) return false;
|
||||
hasCheckedList.value = dataList.fjList.map((item) => {
|
||||
return item.key;
|
||||
});
|
||||
break;
|
||||
case "xfdw":
|
||||
if (!dataList.xfdwList.length) return false;
|
||||
hasCheckedList.value = dataList.xfdwList.map((item) => {
|
||||
return item.key;
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
//确认选择
|
||||
function onComfirm(val) {
|
||||
if (val.length <= 0) return false;
|
||||
switch (selectType.value) {
|
||||
case "xfzz":
|
||||
dataList.fzrList = val; //选取的负责人数据
|
||||
normalForm.value.xfzzXm = val[0].xm;
|
||||
normalForm.value.xfzzSfzh = val[0].sfzh;
|
||||
break;
|
||||
case "xfnr":
|
||||
dataList.nrList = val; //巡防内容
|
||||
normalForm.value.xfnr = val[0].nr;
|
||||
break;
|
||||
case "xfmj":
|
||||
dataList.mjList = val; //选取的组员民警
|
||||
normalForm.value.xfmj = val.map(v => { return v.xm }).join(',')
|
||||
break;
|
||||
case "xffj":
|
||||
dataList.fjList = val; //选取的组员辅警
|
||||
normalForm.value.xffj = val.map(v => { return v.xm }).join(',')
|
||||
break;
|
||||
case "xfdw":
|
||||
dataList.xfdwList = val; //选取的单位
|
||||
normalForm.value.sfdw = val.map(v => { return v.dwmc }).join(',')
|
||||
normalForm.value.dz = val[0].dz
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
//根据id获取详情
|
||||
function _getDetailById() {
|
||||
rwDetail(route.query.id).then((res) => {
|
||||
let List = JSON.parse(res.xfzy);
|
||||
dataList.mjList = List.filter(v => { return v.fl == '01' })
|
||||
res.xfmj = dataList.mjList.map(it => { return it.xm }).join(',')
|
||||
dataList.fjList = List.filter(v => { return v.fl == '02' })
|
||||
res.xffj = dataList.fjList.map(it => { return it.xm }).join(',')
|
||||
|
||||
D_BZ_XFLX.value.forEach((element) => {
|
||||
if (element.dm == res.xflx) res.xflxmc = element.text;
|
||||
});
|
||||
D_BZ_RWZT.value.forEach((element) => {
|
||||
if (element.dm == res.rwzt) res.rwztmc = element.text;
|
||||
});
|
||||
dataList.xfdwList = JSON.parse(res.xfdw)
|
||||
res.sfdw = dataList.xfdwList.map(it => { return it.dwmc }).join(',')
|
||||
res.dz = dataList.xfdwList.length > 0 ? dataList.xfdwList[0].dz : '';
|
||||
let ids = res.xfzp.split(',')
|
||||
fileList.value = []
|
||||
ids.forEach(item => {
|
||||
let img = baseUrl2 + "/mosty-api/mosty-base/minio/image/download/" + item;
|
||||
let obj = {
|
||||
url: img,
|
||||
codeId: item,
|
||||
isImage: true,
|
||||
status: "done",
|
||||
message: "上传成功",
|
||||
};
|
||||
fileList.value.push(obj)
|
||||
});
|
||||
normalForm.value = res;
|
||||
});
|
||||
}
|
||||
|
||||
// 打开弹窗
|
||||
function getCommonPop(val) {
|
||||
clickType.value = val;
|
||||
switch (val) {
|
||||
case "xflx":
|
||||
columns.value = D_BZ_XFLX.value;
|
||||
break;
|
||||
case "rwzt":
|
||||
columns.value = D_BZ_RWZT.value;
|
||||
break;
|
||||
}
|
||||
isShowCommonPicker.value = true;
|
||||
}
|
||||
|
||||
// 确定选择
|
||||
function onConfirm(val) {
|
||||
isShowCommonPicker.value = false;
|
||||
switch (clickType.value) {
|
||||
case "xflx":
|
||||
normalForm.value.xflxmc = val.text;
|
||||
normalForm.value.xflx = val.dm;
|
||||
break;
|
||||
case "rwzt":
|
||||
normalForm.value.rwztmc = val.text;
|
||||
normalForm.value.rwzt = val.dm;
|
||||
break;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// 文件预览
|
||||
async function afterRead(file) {
|
||||
file.message = "上传中...";
|
||||
let fileBlob = await _compressImage(file.file);
|
||||
let fileData = new File([fileBlob], fileBlob.name, { type: fileBlob.type });
|
||||
const data = new FormData();
|
||||
data.append("file", fileData);
|
||||
file.status = "uploading";
|
||||
upImage(data).then((res) => {
|
||||
file.status = "done";
|
||||
file.message = "上传成功";
|
||||
if (!wpTpIdList.value.includes(res)) wpTpIdList.value.push(res);
|
||||
});
|
||||
}
|
||||
//压缩图片
|
||||
const _compressImage = (file) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
new ImageCompressor(file, {
|
||||
quality: 0.6, //压缩质量
|
||||
success(res) {
|
||||
resolve(res);
|
||||
},
|
||||
error(e) {
|
||||
reject(e);
|
||||
},
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
// 提交
|
||||
function onSubmit() {
|
||||
let arr = [...dataList.mjList, ...dataList.fjList]
|
||||
let params = {
|
||||
...normalForm.value,
|
||||
xfzy: JSON.stringify(arr),
|
||||
xfdw: JSON.stringify(dataList.xfdwList),
|
||||
}
|
||||
let ids1 = fileList.value.filter(item => { return item.codeId }).map(v => { return v.codeId })
|
||||
let ids2 = wpTpIdList.value.join(',')
|
||||
params.xfzp = (ids1.concat(ids2)).join(',')
|
||||
isLoading.value = true;
|
||||
if (title.value == '编辑巡防任务') {
|
||||
eidtRw(params).then(res => {
|
||||
hintToast('编辑成功')
|
||||
router.go(-1);
|
||||
})
|
||||
} else {
|
||||
addRw(params).then(res => {
|
||||
hintToast('新增成功')
|
||||
router.go(-1);
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.infoBox {
|
||||
height: 100%;
|
||||
position: relative;
|
||||
|
||||
.cardInfo {
|
||||
height: calc(100vh - 13vw);
|
||||
padding: 1vw 4vw;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
|
||||
.item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
|
||||
.mark {
|
||||
margin: 0 10px;
|
||||
color: red;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #767676;
|
||||
}
|
||||
}
|
||||
|
||||
.item::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
left: 0;
|
||||
top: 32%;
|
||||
background: #0066ff;
|
||||
width: 2px;
|
||||
height: 12px;
|
||||
z-index: 11;
|
||||
}
|
||||
}
|
||||
|
||||
.footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
text-align: center;
|
||||
|
||||
.btn {
|
||||
padding: 2vw 6vw;
|
||||
background: #1989fa;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.textarea {
|
||||
::v-deep .van-field__control {
|
||||
background: #f8fafd;
|
||||
padding-left: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.fjBox {
|
||||
padding: 4vw;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
327
src/pages/views/Declaration/components/Select.vue
Normal file
327
src/pages/views/Declaration/components/Select.vue
Normal file
@ -0,0 +1,327 @@
|
||||
<template>
|
||||
<van-popup v-model:show="props.show" style="width: 90%">
|
||||
<div class="popupTitle">{{ popupTitle }}</div>
|
||||
<van-search v-model="kwd" :placeholder="placeholder" @search="onUpdate" @clear="onClear" />
|
||||
<div class="check-data-box" ref="listBox" :loading="loading">
|
||||
<!-- 单选 -->
|
||||
<van-radio-group v-model="radioChecked" v-if="isRadio">
|
||||
<van-cell-group>
|
||||
<van-cell v-for="item in list.mulChooseList" clickable :key="item" :title="`${item.value}`" :border="false">
|
||||
<template #right-icon>
|
||||
<van-radio :name="item.key" @click="onRadionChange(item.key)" />
|
||||
</template>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
</van-radio-group>
|
||||
<!-- 多选 -->
|
||||
<van-checkbox-group v-model="checkedLists" v-else @change="onCheckboxnChange">
|
||||
<van-cell-group>
|
||||
<van-cell v-for="item in list.mulChooseList" clickable :key="item" :title="`${item.value}`">
|
||||
<template #right-icon>
|
||||
<van-checkbox shape="square" :name="item.key" />
|
||||
</template>
|
||||
<template #label v-if="title === '选择警用器械'">
|
||||
数量：
|
||||
<van-stepper v-model="item.sl" integer />
|
||||
</template>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
</van-checkbox-group>
|
||||
<van-empty description="没有数据" image="default" v-if="list.mulChooseList.length <= 0 && showEmpty" />
|
||||
</div>
|
||||
<div class="popbtn-box">
|
||||
<van-button style="flex: 1" type="default" @click="onCancel">取消
|
||||
</van-button>
|
||||
<van-button style="flex: 1" type="primary" @click="onConfirm">确定</van-button>
|
||||
</div>
|
||||
</van-popup>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { getBBData } from "@/api/xfbbAndZbbb.js";
|
||||
import { defineProps, ref, defineEmits, watch, reactive, onMounted } from "vue";
|
||||
import { dateFormat, hintToast } from "@/utils/tools";
|
||||
const props = defineProps({
|
||||
selectType: String, //查询的类型 详情见watch 监听
|
||||
show: Boolean, //是否显示
|
||||
checkedList: Array, //默认选中 多选
|
||||
checked: String, //单选
|
||||
});
|
||||
const emits = defineEmits([
|
||||
"update:cancel",
|
||||
"update:confirm",
|
||||
"update:kwd",
|
||||
"update:tabs",
|
||||
"update:tag",
|
||||
]);
|
||||
const hasChoosZb = ref([]);
|
||||
const listBox = ref(null);
|
||||
const page = ref(1);
|
||||
const size = ref(10);
|
||||
const total = ref(0);
|
||||
const radioChecked = ref("");
|
||||
const checkedLists = ref([]);
|
||||
const loading = ref(false);
|
||||
const finished = ref(false);
|
||||
const selectObj = ref([]); //选中的数据
|
||||
const tagCode = ref(""); //智能设备选中状态
|
||||
const placeholder = ref(""); //占位字符
|
||||
const showEmpty = ref(false);
|
||||
const kwd = ref(""); //选择器关键字
|
||||
const selectType = ref(""); //选择的类型
|
||||
const znzbCode = ref(""); //智能装备类型筛选
|
||||
const popupTitle = ref(""); //标题
|
||||
const isRadio = ref(false); //是否是单选
|
||||
const list = reactive({
|
||||
mulChooseList: []
|
||||
});
|
||||
|
||||
watch(
|
||||
() => props.selectType,
|
||||
(newValue) => {
|
||||
checkedLists.value = props.checkedList;
|
||||
radioChecked.value = props.checked;
|
||||
},
|
||||
{ immediate: true, deep: true }
|
||||
);
|
||||
onMounted(() => {
|
||||
_getSelectData(props.selectType);
|
||||
scroll();
|
||||
});
|
||||
|
||||
//触底加载
|
||||
function scroll() {
|
||||
let scrollTargetBox = listBox.value;
|
||||
if (!scrollTargetBox) return false;
|
||||
scrollTargetBox.onscroll = (e) => {
|
||||
var scrollHeight = scrollTargetBox.scrollHeight; //251
|
||||
var scrollTop = scrollTargetBox.scrollTop; //0-18
|
||||
var clientHeight = scrollTargetBox.clientHeight; //233
|
||||
if (scrollHeight - clientHeight == scrollTop) {
|
||||
//滚动条滚到最底部
|
||||
if (list.mulChooseList.length < total.value) {
|
||||
page.value++;
|
||||
_getSelectData(props.selectType);
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
//获取数据
|
||||
function _getSelectData(val) {
|
||||
let obj = {}; //亲求路径及参数
|
||||
switch (val) {
|
||||
case "xfzz":
|
||||
case "xfmj":
|
||||
case "xffj":
|
||||
popupTitle.value = "选择民警";
|
||||
placeholder.value = "请输入姓名";
|
||||
obj["url"] = "/mosty-jcgl/tbJcglXfll/getXfllList";
|
||||
obj["jllx"] = "01";
|
||||
if (val == 'xffj') {
|
||||
popupTitle.value = "选择辅警";
|
||||
obj["jllx"] = "02";
|
||||
}
|
||||
isRadio.value = false;
|
||||
if (val == "xfzz") isRadio.value = true;
|
||||
break;
|
||||
case "xfdw":
|
||||
popupTitle.value = "选择巡访单位";
|
||||
placeholder.value = "请输入单位名称";
|
||||
obj["url"] = "/mosty-jcgl/tbJcglXfDwgl";
|
||||
isRadio.value = false;
|
||||
break;
|
||||
case "xfnr":
|
||||
popupTitle.value = "选择巡访内容";
|
||||
placeholder.value = "请输入巡访内容";
|
||||
obj["url"] = "/mosty-jcgl/tbJcglXfNrmb";
|
||||
isRadio.value = true;
|
||||
break;
|
||||
case "cyry":
|
||||
popupTitle.value = "选择从业人员";
|
||||
placeholder.value = "选择从业人员";
|
||||
obj["url"] = "/mosty-jcgl/tbJcglXfCyry";
|
||||
isRadio.value = false;
|
||||
break;
|
||||
}
|
||||
if (Object.keys(obj).length > 0) _getBBData(obj, val);
|
||||
}
|
||||
//获取数据
|
||||
function _getBBData(obj, type) {
|
||||
//url 请求地址，jllx 警力类型 有需要就传，scode 智能装备筛选条件 有需要就传
|
||||
let { url, jllx, xz } = obj;
|
||||
loading.value = true;
|
||||
let data = { keyword: kwd.value, jllx, pageCurrent: page.value, pageSize: size.value };
|
||||
if (type == 'xfnr') {
|
||||
data = { nr: kwd.value, pageCurrent: page.value, pageSize: size.value }
|
||||
}
|
||||
getBBData(url, data)
|
||||
.then((res) => {
|
||||
loading.value = false;
|
||||
total.value = res.total;
|
||||
if (jllx) {
|
||||
if (res && res.records && res.records.length > 0) {
|
||||
_setData(res.records, type);
|
||||
} else {
|
||||
showEmpty.value = true;
|
||||
}
|
||||
} else {
|
||||
if (res && res.length > 0 && !res.records) {
|
||||
_setData(res, type);
|
||||
} else if (res && res.records) {
|
||||
_setData(res.records, type);
|
||||
} else {
|
||||
showEmpty.value = true;
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch((err) => {
|
||||
loading.value = false;
|
||||
showEmpty.value = true;
|
||||
});
|
||||
}
|
||||
|
||||
//搜索关键词
|
||||
function onUpdate(val) {
|
||||
page.value = 1;
|
||||
list.mulChooseList = [];
|
||||
_getSelectData(props.selectType);
|
||||
}
|
||||
//清空关键字
|
||||
function onClear() {
|
||||
list.mulChooseList = [];
|
||||
_getSelectData(props.selectType);
|
||||
}
|
||||
//关闭弹窗
|
||||
function onCancel() {
|
||||
emits("update:cancel", false);
|
||||
}
|
||||
//点击单选
|
||||
function onRadionChange(val) {
|
||||
_backData(val);
|
||||
}
|
||||
//点击多选
|
||||
function onCheckboxnChange(val) {
|
||||
_backData(val);
|
||||
}
|
||||
|
||||
//确认选择
|
||||
function onConfirm() {
|
||||
emits("update:confirm", selectObj.value);
|
||||
emits("update:cancel", false);
|
||||
}
|
||||
//处理返回父组件数据
|
||||
function _backData(val) {
|
||||
if (typeof val == "string") {
|
||||
//单选数据
|
||||
let obj = list.mulChooseList.find((item) => {
|
||||
return item.key == val;
|
||||
});
|
||||
selectObj.value = [obj];
|
||||
} else {
|
||||
//多选数据
|
||||
let arr = [];
|
||||
for (let i = 0; i < val.length; i++) {
|
||||
for (let j = 0; j < list.mulChooseList.length; j++) {
|
||||
if (val[i] == list.mulChooseList[j].key) {
|
||||
arr.push(list.mulChooseList[j]);
|
||||
}
|
||||
}
|
||||
}
|
||||
selectObj.value = arr;
|
||||
}
|
||||
}
|
||||
|
||||
//设置数据
|
||||
function _setData(res, type) {
|
||||
for (let i = 0; i < res.length; i++) {
|
||||
switch (type) {
|
||||
case "xfzz":
|
||||
case "xfzy":
|
||||
case "xfmj":
|
||||
res[i].value = `${res[i].ssbm}-${res[i].xm}`;
|
||||
res[i].key = res[i].ryid;
|
||||
break;
|
||||
case "xffj":
|
||||
res[i].value = `${res[i].ssbm}-${res[i].xm}`;
|
||||
res[i].key = res[i].id;
|
||||
break;
|
||||
case "xfdw":
|
||||
res[i].value = `${res[i].dwmc}（电话：${res[i].lxdh}）`;
|
||||
res[i].key = res[i].id;
|
||||
break;
|
||||
case "xfnr":
|
||||
res[i].value = `${res[i].nr}`;
|
||||
res[i].key = res[i].id;
|
||||
break;
|
||||
case "cyry":
|
||||
res[i].value = `${res[i].xm}（${res[i].sfzh}）`;
|
||||
res[i].key = res[i].id;
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (page.value == 1) {
|
||||
list.mulChooseList = res;
|
||||
} else {
|
||||
list.mulChooseList = list.mulChooseList.concat(res);
|
||||
}
|
||||
loading.value = false;
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
@import "@/assets/styles/mixin.scss";
|
||||
|
||||
.popupTitle {
|
||||
text-align: center;
|
||||
background-color: rgb(11, 137, 247);
|
||||
height: 6vh;
|
||||
line-height: 6vh;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.popbtn-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding-top: 2vw;
|
||||
}
|
||||
|
||||
.check-data-box {
|
||||
height: 100vw;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
::v-deep .van-stepper__input {
|
||||
width: 100px;
|
||||
}
|
||||
|
||||
.zn_tag_select {
|
||||
padding: 2vw 3.5vw;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.squre {
|
||||
display: inline-block;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
border: 1px solid #cccccc;
|
||||
border-radius: 4px;
|
||||
margin-left: 10px;
|
||||
text-align: center;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.isActiveAll {
|
||||
background: #1989fa;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .van-cell {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
::v-deep .van-cell__title,
|
||||
.van-cell__value {
|
||||
margin-right: 1vw;
|
||||
}
|
||||
</style>
|
||||
71
src/pages/views/Declaration/components/cyryItem.vue
Normal file
71
src/pages/views/Declaration/components/cyryItem.vue
Normal file
@ -0,0 +1,71 @@
|
||||
<template>
|
||||
<van-swipe-cell>
|
||||
<div class="XFItem-box">
|
||||
<div class="name">
|
||||
{{props.data.xm}}
|
||||
<span v-for="v in props.dic.D_BZ_XB " :key="v">
|
||||
<span class="xb" v-if="v.dm == props.data.xb">{{v.text}}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="text">
|
||||
身份证号：<span class="mess">{{props.data.sfzh}}</span>
|
||||
</div>
|
||||
<div class="text">籍贯：<span class="mess">{{props.data.jg}}</span></div>
|
||||
<div class="text">联系电话：<span class="mess">{{props.data.lxdh}}</span></div>
|
||||
</div>
|
||||
<template #right>
|
||||
<van-button style="height: 100%; width: 60px" type="primary" @click="gotoEdit">编辑</van-button>
|
||||
<van-button style="height: 100%; width: 60px" type="danger" @click="deleteItem" >删除</van-button>
|
||||
</template>
|
||||
</van-swipe-cell>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { useRouter } from "vue-router";
|
||||
import { ref, onMounted, reactive, defineEmits, defineProps } from "vue";
|
||||
const emits = defineEmits(["deletedata"]);
|
||||
const router = useRouter();
|
||||
const props = defineProps({
|
||||
data: {
|
||||
type: Object,
|
||||
default: {},
|
||||
},
|
||||
dic:{
|
||||
type: Object,
|
||||
default: {},
|
||||
}
|
||||
});
|
||||
|
||||
// 编辑
|
||||
function gotoEdit() {
|
||||
localStorage.setItem('XF_Active',0)
|
||||
router.push({ path: "/Declaration/addEditCyry", query: { id: props.data.id } });
|
||||
}
|
||||
// 删除
|
||||
function deleteItem() {
|
||||
emits("deletedata", props.data.id);
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.XFItem-box {
|
||||
padding: 3vw 4vw;
|
||||
box-sizing: border-box;
|
||||
background-color: #f6fafd;
|
||||
position: relative;
|
||||
.name {
|
||||
color: #4788e1;
|
||||
line-height: 6vw;
|
||||
.xb {
|
||||
margin: 0 14px;
|
||||
}
|
||||
}
|
||||
.text {
|
||||
color: #9f9f9f;
|
||||
line-height: 6vw;
|
||||
.mess {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
96
src/pages/views/Declaration/components/dwglItem.vue
Normal file
96
src/pages/views/Declaration/components/dwglItem.vue
Normal file
@ -0,0 +1,96 @@
|
||||
<template>
|
||||
<van-swipe-cell>
|
||||
<div class="XFItem-box">
|
||||
<div class="item-tip" :class="changeBq(props.data.dwlx)">{{ setDict(props.data.dwlx, props.dic.D_BZ_DWLX) }}</div>
|
||||
<div class="text">归属单位：<span class="mess">{{props.data.dwmc}}</span></div>
|
||||
<div class="text">单位名称：<span class="mess">{{props.data.ssbm}}</span></div>
|
||||
<div class="text">单位地址：<span class="mess">{{props.data.dz}}</span></div>
|
||||
<div class="text">单位分类：<span class="mess">{{ setDict(props.data.dwfl, props.dic.D_BZ_DWFL) }}</span></div>
|
||||
</div>
|
||||
<template #right>
|
||||
<van-button style="height:100%;width:60px;" type="primary" @click="gotoEdit">编辑</van-button>
|
||||
<van-button style="height:100%;width:60px;" type="danger" @click="deleteItem">删除</van-button>
|
||||
</template>
|
||||
</van-swipe-cell>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { useRouter } from "vue-router";
|
||||
import { setDict } from "../../../../utils/dict";
|
||||
import { ref, onMounted, reactive, defineEmits,defineProps } from "vue";
|
||||
const emits = defineEmits(['deletedata'])
|
||||
const router = useRouter();
|
||||
const props = defineProps({
|
||||
data:{
|
||||
type:Object,
|
||||
default:{}
|
||||
},
|
||||
dic:{
|
||||
type:Object,
|
||||
default:{}
|
||||
}
|
||||
});
|
||||
|
||||
// 编辑
|
||||
function gotoEdit(){
|
||||
localStorage.setItem('XF_Active',1)
|
||||
router.push({path: "/Declaration/addEditDw", query: {id:props.data.id}});
|
||||
}
|
||||
// 删除
|
||||
function deleteItem(){
|
||||
emits('deletedata',props.data.id)
|
||||
}
|
||||
// 标签
|
||||
function changeBq(val){
|
||||
switch(val){
|
||||
case '02':
|
||||
return 'green';
|
||||
break;
|
||||
case '01':
|
||||
return 'blue';
|
||||
break;
|
||||
default:
|
||||
return 'blue';
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.XFItem-box {
|
||||
padding: 3vw 4vw;
|
||||
box-sizing: border-box;
|
||||
background-color: #f6fafd;
|
||||
position: relative;
|
||||
.item-tip {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 60px;
|
||||
height: 26px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
line-height: 26px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.red {
|
||||
background: url("../../../../assets/images/red.png") no-repeat;
|
||||
}
|
||||
.green {
|
||||
background: url("../../../../assets/images/green.png") no-repeat;
|
||||
}
|
||||
.blue {
|
||||
background: url("../../../../assets/images/blue.png") no-repeat;
|
||||
}
|
||||
.orange {
|
||||
background: url("../../../../assets/images/orange.png") no-repeat;
|
||||
}
|
||||
.text {
|
||||
color: #9f9f9f;
|
||||
line-height: 6vw;
|
||||
.mess {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
81
src/pages/views/Declaration/components/rwItem.vue
Normal file
81
src/pages/views/Declaration/components/rwItem.vue
Normal file
@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<van-swipe-cell>
|
||||
<div class="XFItem-box">
|
||||
<div class="time"><van-icon name="clock-o" />{{props.data.xfsj}}</div>
|
||||
<div class="text">巡防主责人：<span class="mess">{{props.data.xfzzXm}}</span></div>
|
||||
<div class="text">巡防商铺：
|
||||
<span class="mess">
|
||||
<span class="tag" v-for="it in props.data.xfdw" :key="it.id" style="margin:0 4px;">{{it.dwmc}}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="text">巡防类型：
|
||||
<span class="mess">{{ setDict(props.data.xflx, props.dic.D_BZ_XFLX) }}</span></div>
|
||||
<div class="text text_detail">
|
||||
巡防内容：<span class="mess">{{props.data.xfnr}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<template #right>
|
||||
<van-button style="height:100%;width:60px;" type="primary" @click="gotoEdit">编辑</van-button>
|
||||
<van-button style="height:100%;width:60px;" type="danger" @click="deleteItem">删除</van-button>
|
||||
</template>
|
||||
</van-swipe-cell>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { setDict } from "../../../../utils/dict";
|
||||
import { useRouter } from "vue-router";
|
||||
import { ref, onMounted, reactive, defineEmits,defineProps } from "vue";
|
||||
const emits = defineEmits(['deletedata'])
|
||||
const router = useRouter();
|
||||
const props = defineProps({
|
||||
data:{
|
||||
type:Object,
|
||||
default:{}
|
||||
},
|
||||
dic:{
|
||||
type:Object,
|
||||
default:{}
|
||||
}
|
||||
});
|
||||
|
||||
// 编辑
|
||||
function gotoEdit(){
|
||||
localStorage.setItem('XF_Active',2)
|
||||
router.push({path: "/Declaration/addEditRw", query: {id:props.data.id}});
|
||||
}
|
||||
// 删除
|
||||
function deleteItem(){
|
||||
emits('deletedata',props.data.id)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.XFItem-box {
|
||||
padding: 3vw 4vw;
|
||||
box-sizing: border-box;
|
||||
background-color: #f6fafd;
|
||||
position: relative;
|
||||
.time {
|
||||
font-size: 16px;
|
||||
line-height: 5vw;
|
||||
.van-icon-clock-o {
|
||||
margin-right: 2vw;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
.text {
|
||||
color: #9f9f9f;
|
||||
line-height: 6vw;
|
||||
.mess {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
.tag{
|
||||
border: 1px solid #5e9fdd;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
color: #409eff;
|
||||
padding: 1px 4px;
|
||||
}
|
||||
</style>
|
||||
110
src/pages/views/Declaration/components/zgItem copy.vue
Normal file
110
src/pages/views/Declaration/components/zgItem copy.vue
Normal file
@ -0,0 +1,110 @@
|
||||
<template>
|
||||
<van-swipe-cell>
|
||||
<div class="XFItem-box">
|
||||
<!-- <div class="item-tip" :class="changeBq(props.data.lx)">{{props.data.ztmc}}</div> -->
|
||||
<div class="time"><van-icon name="clock-o" />{{props.data.sbsj}}</div>
|
||||
<div class="text">申报类型：<span class="mess">{{ setDict(props.data.sblx, props.dic.D_SB_SBLX) }}</span></div>
|
||||
<div class="text text_detail">
|
||||
申报内容：<span class="mess">{{props.data.sbyy}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<template #right>
|
||||
<van-button style="height:100%;width:60px;" type="primary" @click="gotoEdit">编辑</van-button>
|
||||
<van-button style="height:100%;width:60px;" type="danger" @click="deleteItem">删除</van-button>
|
||||
</template>
|
||||
</van-swipe-cell>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { useRouter } from "vue-router";
|
||||
import { setDict } from "../../../../utils/dict";
|
||||
import { ref, onMounted, reactive, defineEmits,defineProps } from "vue";
|
||||
const emits = defineEmits(['deletedata'])
|
||||
const router = useRouter();
|
||||
const props = defineProps({
|
||||
data:{
|
||||
type:Object,
|
||||
default:{lx:0}
|
||||
} ,
|
||||
dic:{
|
||||
type:Object,
|
||||
default:{}
|
||||
}
|
||||
});
|
||||
// 标签
|
||||
function changeBq(val){
|
||||
switch(val){
|
||||
case 0:
|
||||
return 'orange';
|
||||
break;
|
||||
case 1:
|
||||
return 'green';
|
||||
break;
|
||||
case 2:
|
||||
return 'red';
|
||||
break;
|
||||
case 3:
|
||||
return 'blue';
|
||||
break;
|
||||
default:
|
||||
return 'blue';
|
||||
}
|
||||
|
||||
}
|
||||
// 编辑
|
||||
function gotoEdit(){
|
||||
localStorage.setItem('XF_Active',3)
|
||||
router.push({path: "/Declaration/addEdit", query: {id:props.data.id}});
|
||||
}
|
||||
// 删除
|
||||
function deleteItem(){
|
||||
emits('deletedata',props.data.id)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.XFItem-box {
|
||||
padding: 3vw 4vw;
|
||||
box-sizing: border-box;
|
||||
background-color: #f6fafd;
|
||||
position: relative;
|
||||
.time {
|
||||
font-size: 16px;
|
||||
line-height: 5vw;
|
||||
.van-icon-clock-o {
|
||||
margin-right: 2vw;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
.text {
|
||||
color: #9f9f9f;
|
||||
line-height: 6vw;
|
||||
.mess {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
.item-tip {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 60px;
|
||||
height: 26px;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
line-height: 26px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.red {
|
||||
background: url("../../../../assets/images/red.png") no-repeat;
|
||||
}
|
||||
.green {
|
||||
background: url("../../../../assets/images/green.png") no-repeat;
|
||||
}
|
||||
.blue {
|
||||
background: url("../../../../assets/images/blue.png") no-repeat;
|
||||
}
|
||||
.orange {
|
||||
background: url("../../../../assets/images/orange.png") no-repeat;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
100
src/pages/views/Declaration/components/zgItem.vue
Normal file
100
src/pages/views/Declaration/components/zgItem.vue
Normal file
@ -0,0 +1,100 @@
|
||||
<template>
|
||||
<van-swipe-cell>
|
||||
<div class="XFItem-box" @click.stop="handleItem(props.data)">
|
||||
<div class="isCheck" v-show="props.data.isCheck" :class="props.data.isCheck ? 'isCheck-y':''"><van-icon name="success" color="#ffffff"></van-icon></div>
|
||||
<div class="time"><van-icon name="clock-o" />{{props.data.xfsj}}</div>
|
||||
<div class="text">巡防主责人：<span class="mess">{{props.data.xfzzXm}}</span></div>
|
||||
<div class="text">巡防商铺：
|
||||
<span class="mess">
|
||||
<span class="tag" v-for="it in props.data.xfdw" :key="it.id" style="margin:0 4px;">{{it.dwmc}}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div class="text">巡防类型：
|
||||
<span class="mess">{{ setDict(props.data.xflx, props.dic.D_BZ_XFLX) }}</span></div>
|
||||
<div class="text text_detail">
|
||||
巡防内容：<span class="mess">{{props.data.xfnr}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<template #right>
|
||||
<van-button style="height:100%;width:60px;" type="primary" @click="gotoEdit">编辑</van-button>
|
||||
<van-button style="height:100%;width:60px;" type="danger" @click="deleteItem">删除</van-button>
|
||||
</template>
|
||||
</van-swipe-cell>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { setDict } from "../../../../utils/dict";
|
||||
import { useRouter } from "vue-router";
|
||||
import { ref, onMounted, reactive, defineEmits,defineProps } from "vue";
|
||||
const emits = defineEmits(['deletedata','chooseData'])
|
||||
const router = useRouter();
|
||||
const props = defineProps({
|
||||
data:{
|
||||
type:Object,
|
||||
default:{}
|
||||
},
|
||||
dic:{
|
||||
type:Object,
|
||||
default:{}
|
||||
}
|
||||
});
|
||||
|
||||
// 编辑
|
||||
function gotoEdit(){
|
||||
localStorage.setItem('XF_Active',3)
|
||||
router.push({path: "/Declaration/addEdit", query: {id:props.data.id}});
|
||||
}
|
||||
// 删除
|
||||
function deleteItem(){
|
||||
emits('deletedata',props.data.id)
|
||||
}
|
||||
// 点击
|
||||
function handleItem(item){
|
||||
emits('chooseData',item)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.XFItem-box {
|
||||
padding: 3vw 4vw;
|
||||
box-sizing: border-box;
|
||||
background-color: #f6fafd;
|
||||
position: relative;
|
||||
.isCheck{
|
||||
position: absolute;
|
||||
top: 0vw;
|
||||
right: 0vw;
|
||||
width: 6vw;
|
||||
height: 6vw;
|
||||
border-radius: 50%;
|
||||
border: 1px solid #c8c9cc;
|
||||
text-align: center;
|
||||
line-height: 6vw;
|
||||
}
|
||||
.isCheck-y{
|
||||
background: #1989fa;
|
||||
}
|
||||
.time {
|
||||
font-size: 16px;
|
||||
line-height: 5vw;
|
||||
.van-icon-clock-o {
|
||||
margin-right: 2vw;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
.text {
|
||||
color: #9f9f9f;
|
||||
line-height: 6vw;
|
||||
.mess {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
.tag{
|
||||
border: 1px solid #5e9fdd;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
color: #409eff;
|
||||
padding: 1px 4px;
|
||||
}
|
||||
</style>
|
||||
515
src/pages/views/Declaration/index.vue
Normal file
515
src/pages/views/Declaration/index.vue
Normal file
@ -0,0 +1,515 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<TopNav navTitle="巡访管理" :rightTitle="rightTitle" @clickRight="clickRight" />
|
||||
<div>
|
||||
<Tabs :checked="isActive" :list="zdModule" @onYjjb="changeTab" />
|
||||
<Search placeholder="请输入关键字" v-model="keyWord" :isSx="true" @update:sx="handleSx" @update:modelValue="onSearch">
|
||||
</Search>
|
||||
<SxPopup :showPopup="showPopup" :list="sxList" :p_top="145" :showTime="isShowTime" @update:close="showPopup = false" @update:onConfirm="onConfirm" @reset="reset">
|
||||
</SxPopup>
|
||||
|
||||
<!-- 列表数据 -->
|
||||
<ul class="listBox" :loading="isLoading" ref="dateScroll">
|
||||
<li style="margin-bottom: 2vw" v-for="(item, idex) in list" :key="idex">
|
||||
<CyryItem v-if="isActive == 0" @deletedata="deletedata" :dic="{ D_BZ_XB }" :data="item" />
|
||||
<DwglItem v-if="isActive == 1" @deletedata="deletedata" :dic="{ D_BZ_DWLX, D_BZ_DWFL }" :data="item" />
|
||||
<RwItem v-if="isActive == 2" @deletedata="deletedata" :data="item" :dic="{ D_BZ_XFLX }" />
|
||||
<ZgItem v-if="isActive == 3" @deletedata="deletedata" @chooseData="chooseData" :data="item"
|
||||
:dic="{ D_BZ_XFLX }" />
|
||||
<!-- <ZgItem v-if="isActive == 3" @deletedata="deletedata" :data="item" :dic="{D_SB_SBLX}" /> -->
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import TopNav from "../../../components/topNav.vue";
|
||||
import Tabs from "../../../components/tabs.vue";
|
||||
import Search from "../../../components/search.vue";
|
||||
import SxPopup from "../../../components/SxPopupNew.vue";
|
||||
import ZgItem from "./components/zgItem.vue";
|
||||
import CyryItem from "./components/cyryItem.vue";
|
||||
import RwItem from "./components/rwItem.vue";
|
||||
import DwglItem from "./components/dwglItem.vue";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { Dialog, Notify } from "vant";
|
||||
import { getdataCyry, deletedataCyry, getdataDwgl, deletedataDw, deletedataZg, getdataRw, plsbData, deletedataRw, getdataZg } from "../../../api/xfgl.js";
|
||||
import { getDictList, setDict } from "../../../utils/dict";
|
||||
import { setTimeQuantum, dateFormat, hintToast } from "../../../utils/tools.js";
|
||||
import { ref, reactive, watch, onMounted, nextTick } from "vue";
|
||||
const { D_BZ_XB, D_BZ_DWFL, D_BZ_DWLX, D_BZ_XFLX, D_SB_SBLX } = getDictList("D_BZ_XB", "D_BZ_DWFL", "D_BZ_DWLX", "D_BZ_XFLX", "D_SB_SBLX");
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const dateScroll = ref(null)
|
||||
const isLoading = ref(false) //加载
|
||||
const zdModule = ref([
|
||||
{ name: "从业人员管理" },
|
||||
{ name: "单位管理" },
|
||||
{ name: "巡防任务" },
|
||||
{ name: "战果管理" },
|
||||
]);
|
||||
const keyWord = ref(""); //关键字搜索
|
||||
const showPopup = ref(false); //赛选条件窗口
|
||||
const dateForm = ref({
|
||||
sblxmc: "",
|
||||
sblxdm: "",
|
||||
});
|
||||
const isShowTime = ref(true);
|
||||
const selectList = ref([]); //选择类型
|
||||
const List1 = ref([
|
||||
{ label: "类型1", value: "01" },
|
||||
{ label: "类型2", value: "02" },
|
||||
{ label: "类型3", value: "03" },
|
||||
]);
|
||||
|
||||
const chooseType = ref(false); //选择类型
|
||||
|
||||
const rightTitle = ref('新增')
|
||||
const sxList = ref([]); //筛选条件数据
|
||||
const pageCurrent = ref(1); //分页
|
||||
const total = ref(0); //总数
|
||||
const showEmpty = ref(false); //数据状态
|
||||
const list = ref([]); //列表数据
|
||||
const searchDate = ref({}); //查询条件
|
||||
const isActive = ref(); //当前位置
|
||||
const haschooseList = ref([]) //已选中的数据
|
||||
onMounted(() => {
|
||||
let ac = localStorage.getItem('XF_Active')
|
||||
isActive.value = ac ? parseInt(ac) : 0;
|
||||
rightTitle.value = isActive.value == 3 ? '批量申报' : '新增'
|
||||
nextTick(() => { getOtherDate(); })
|
||||
scroll()
|
||||
});
|
||||
|
||||
//触底加载
|
||||
function scroll() {
|
||||
let scrollTargetBox = dateScroll.value;
|
||||
if (!scrollTargetBox) return false;
|
||||
scrollTargetBox.onscroll = (e) => {
|
||||
var scrollHeight = scrollTargetBox.scrollHeight; //251
|
||||
var scrollTop = scrollTargetBox.scrollTop; //0-18
|
||||
var clientHeight = scrollTargetBox.clientHeight; //233
|
||||
if (scrollHeight - clientHeight == scrollTop) {
|
||||
//滚动条滚到最底部
|
||||
if (list.value.length < total.value) {
|
||||
pageCurrent.value++;
|
||||
getOtherDate(); //根据不同类型掉接口
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
// 处理筛选
|
||||
function handleSx() {
|
||||
isShowTime.value = true;
|
||||
switch (isActive.value) {
|
||||
case 0: //从业人员管理
|
||||
isShowTime.value = false;
|
||||
sxList.value = [
|
||||
{
|
||||
title: "身份证号",
|
||||
type: "input",
|
||||
lebel: "sfzh",
|
||||
placeholder: "请输入身份证号",
|
||||
},
|
||||
{
|
||||
title: "姓名",
|
||||
type: "input",
|
||||
lebel: "xm",
|
||||
placeholder: "请输入姓名",
|
||||
},
|
||||
];
|
||||
break;
|
||||
case 1: //单位管理
|
||||
D_BZ_DWFL.value.forEach((element) => {
|
||||
element.isCheck = false;
|
||||
element.key = element.dm;
|
||||
});
|
||||
D_BZ_DWLX.value.forEach((element) => {
|
||||
element.isCheck = false;
|
||||
element.key = element.dm;
|
||||
});
|
||||
isShowTime.value = false;
|
||||
sxList.value = [
|
||||
{
|
||||
title: "单位名称",
|
||||
type: "input",
|
||||
lebel: "dwmc",
|
||||
placeholder: "请输入单位名称",
|
||||
},
|
||||
{
|
||||
title: "单位分类",
|
||||
isCheckBox: false,
|
||||
type: "checkBox",
|
||||
lebel: "dwfl",
|
||||
array: D_BZ_DWFL.value,
|
||||
},
|
||||
{
|
||||
title: "单位类型",
|
||||
isCheckBox: false,
|
||||
type: "checkBox",
|
||||
lebel: "dwlx",
|
||||
array: D_BZ_DWLX.value,
|
||||
},
|
||||
];
|
||||
break;
|
||||
case 2: //寻巡访任务
|
||||
D_BZ_XFLX.value.forEach((element) => {
|
||||
element.isCheck = false;
|
||||
element.key = element.dm;
|
||||
});
|
||||
sxList.value = [
|
||||
{ type: "checkBox", ...setTimeQuantum() },
|
||||
{
|
||||
type: "checkBox",
|
||||
title: "巡防类型",
|
||||
array: D_BZ_XFLX.value,
|
||||
},
|
||||
];
|
||||
break;
|
||||
case 3: //战果申报
|
||||
sxList.value = [
|
||||
{ type: "checkBox", ...setTimeQuantum() },
|
||||
{
|
||||
title: "申报类型",
|
||||
type: "checkBox",
|
||||
lebel: "sblx",
|
||||
array: [
|
||||
{ isCheck: false, name: "类型1", value: "01", key: "fl1" },
|
||||
{ isCheck: false, name: "类型2", value: "02", key: "fl2" },
|
||||
],
|
||||
},
|
||||
];
|
||||
selectList.value = List1.value;
|
||||
break;
|
||||
}
|
||||
showPopup.value = !showPopup.value;
|
||||
}
|
||||
|
||||
// 搜索
|
||||
function onConfirm(val) {
|
||||
|
||||
searchDate.value = val;
|
||||
getOtherDate();
|
||||
}
|
||||
// 选择类型
|
||||
function changeTab(val) {
|
||||
pageCurrent.value = 1
|
||||
isActive.value = val;
|
||||
showPopup.value = false;
|
||||
list.value = []
|
||||
rightTitle.value = val == 3 ? '批量申报' : '新增'
|
||||
getOtherDate() //获取列表数据
|
||||
}
|
||||
// 更具类型获取数据
|
||||
function getOtherDate() {
|
||||
switch (isActive.value) {
|
||||
case 0:
|
||||
_getList_Cyry(); //从业人员管理
|
||||
break;
|
||||
case 1:
|
||||
_getList_Dwgl()//单位管理
|
||||
break;
|
||||
case 2:
|
||||
_getList_Rw()//寻巡访任务
|
||||
break;
|
||||
case 3:
|
||||
_getList_Rw()//寻巡访任务
|
||||
// _getList_Zg()//战果申报
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// 获取从业人员列表
|
||||
function _getList_Cyry() {
|
||||
let pramas = {
|
||||
pageSize: 10,
|
||||
pageCurrent: pageCurrent.value,
|
||||
...searchDate.value.data,
|
||||
};
|
||||
if (!searchDate.value.data) pramas.xm = keyWord.value;
|
||||
if (searchDate.value.data && !searchDate.value.data.xm) pramas.xm = keyWord.value;
|
||||
isLoading.value = true
|
||||
getdataCyry(pramas).then((res) => {
|
||||
let arr = res.records || [];
|
||||
isLoading.value = false;
|
||||
list.value = pageCurrent.value == 1 ? arr : list.value.concat(arr);
|
||||
total.value = res.total;
|
||||
}).catch(() => {
|
||||
isLoading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
// 获取单位管理
|
||||
function _getList_Dwgl() {
|
||||
let pramas = {
|
||||
pageSize: 10,
|
||||
pageCurrent: pageCurrent.value,
|
||||
...searchDate.value.data,
|
||||
};
|
||||
let brr = searchDate.value.list ? searchDate.value.list : []
|
||||
let arr = brr.filter(item => {
|
||||
return item.type == 'checkBox'
|
||||
})
|
||||
arr.forEach(v => {
|
||||
v.array.forEach(it => {
|
||||
if (it.isCheck) pramas[v.lebel] = it.value
|
||||
})
|
||||
})
|
||||
|
||||
if (!searchDate.value.data || (searchDate.value.data && !searchDate.value.data.dwmc)) {
|
||||
pramas.dwmc = keyWord.value;
|
||||
}
|
||||
isLoading.value = true;
|
||||
getdataDwgl(pramas).then((res) => {
|
||||
let arr = res.records || [];
|
||||
list.value = pageCurrent.value == 1 ? arr : list.value.concat(arr);
|
||||
total.value = res.total;
|
||||
isLoading.value = false;
|
||||
}).catch(() => {
|
||||
isLoading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
// 获取任务
|
||||
function _getList_Rw() {
|
||||
let pramas = {
|
||||
pageSize: 10,
|
||||
pageCurrent: pageCurrent.value,
|
||||
...searchDate.value,
|
||||
};
|
||||
if (!searchDate.value.data) pramas.xfdw = keyWord.value;
|
||||
if (searchDate.value.data && !searchDate.value.xfdw) pramas.xfdw = keyWord.value;
|
||||
if (isActive.value == 2) {
|
||||
pramas.xfnr = keyWord.value;
|
||||
delete pramas.xfdw;
|
||||
delete pramas.data;
|
||||
}
|
||||
if (pramas.list) {
|
||||
let arr = pramas.list[0].array
|
||||
let obj = arr.find(item => { return item.isCheck == true })
|
||||
pramas.rwzt = obj.dm
|
||||
}
|
||||
isLoading.value = true;
|
||||
getdataRw(pramas).then((res) => {
|
||||
let arr = res.records || [];
|
||||
isLoading.value = false;
|
||||
arr.forEach(item => {
|
||||
item.isCheck = false
|
||||
item.xfdw = JSON.parse(item.xfdw)
|
||||
item.xfzy = JSON.parse(item.xfzy)
|
||||
})
|
||||
list.value = pageCurrent.value == 1 ? arr : list.value.concat(arr);
|
||||
total.value = res.total;
|
||||
}).catch(() => {
|
||||
isLoading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
// 点击内容
|
||||
function chooseData(item) {
|
||||
if (isActive.value == 3) {
|
||||
list.value.forEach(it => {
|
||||
if (it.id == item.id) it.isCheck = !it.isCheck;
|
||||
})
|
||||
haschooseList.value = list.value.filter(v => { return v.isCheck == true })
|
||||
}
|
||||
}
|
||||
// 获取任务
|
||||
function _getList_Zg() {
|
||||
let pramas = {
|
||||
pageSize: 10,
|
||||
pageCurrent: pageCurrent.value,
|
||||
};
|
||||
if (searchDate.value) {
|
||||
let kssj = searchDate.value.startTime
|
||||
let jssj = searchDate.value.startTime
|
||||
pramas.kssj = kssj ? kssj + ' 00:00:00' : '';
|
||||
pramas.kssj = jssj ? jssj + ' 23:59:59' : '';
|
||||
let arr = searchDate.value.list
|
||||
if (arr) {
|
||||
let list = arr[0].array.filter(v => { return v.isCheck == true }).map(it => { return it.value })
|
||||
pramas.sblx = list.join(',');
|
||||
}
|
||||
}
|
||||
isLoading.value = true;
|
||||
getdataZg(pramas).then((res) => {
|
||||
let arr = res.records || [];
|
||||
isLoading.value = false;
|
||||
list.value = pageCurrent.value == 1 ? arr : list.value.concat(arr);
|
||||
total.value = res.total;
|
||||
}).catch(() => {
|
||||
isLoading.value = false;
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// 点击新增
|
||||
function clickRight() {
|
||||
localStorage.setItem('XF_Active', isActive.value)
|
||||
switch (isActive.value) {
|
||||
case 0: //从业人员管理
|
||||
router.push({ path: "/Declaration/addEditCyry" });
|
||||
break;
|
||||
case 1: //单位管理
|
||||
router.push({ path: "/Declaration/addEditDw" });
|
||||
break;
|
||||
case 2: //寻巡访任务
|
||||
router.push({ path: "/Declaration/addEditRw" });
|
||||
break;
|
||||
case 3: //战果申报
|
||||
plsbDate()// 批量申报
|
||||
// router.push({ path: "/Declaration/addEdit"});
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
// 批量申报
|
||||
function plsbDate() {
|
||||
if (haschooseList.value.length == 0) return Notify({ type: 'warning', message: '请选择申报的内容' });
|
||||
let isTrue = true; //判断内容是否填完
|
||||
haschooseList.value.forEach(item => {
|
||||
if (!item.sbyy) isTrue = false
|
||||
})
|
||||
if (!isTrue) Notify({ type: 'warning', message: '请核实申报数据核实原因是否填写!' });
|
||||
if (isTrue) {
|
||||
let ids = haschooseList.value.map(it => { return it.id })
|
||||
plsbData(ids).then(res => {
|
||||
hintToast('申报成功')
|
||||
_getList_Rw()
|
||||
})
|
||||
// 查询接口
|
||||
}
|
||||
}
|
||||
//关键字查询
|
||||
function onSearch(e) {
|
||||
keyWord.value = e;
|
||||
pageCurrent.value = 1;
|
||||
showEmpty.value = false;
|
||||
getOtherDate();//更具类型获取数据
|
||||
}
|
||||
// 选择类型
|
||||
function chooseItem(val) {
|
||||
dateForm.value.sblxmc = val.label;
|
||||
dateForm.value.sblxdm = val.value;
|
||||
chooseType.value = false;
|
||||
}
|
||||
// 重置
|
||||
function reset() {
|
||||
dateForm.value.sblxmc = "";
|
||||
dateForm.value.sblxdm = "";
|
||||
searchDate.value = {};
|
||||
keyWord.value = ''
|
||||
getOtherDate();
|
||||
}
|
||||
// 删除数据
|
||||
function deletedata(id) {
|
||||
Dialog.confirm({
|
||||
title: "提示",
|
||||
message: "是否确认删除该数据！",
|
||||
confirmButtonColor: "#3e6ee8",
|
||||
}).then((res) => {
|
||||
switch (isActive.value) {
|
||||
case 0: //从业人员管理
|
||||
deletedataCyry([id]).then(res => {
|
||||
hintToast('删除成功')
|
||||
_getList_Cyry()
|
||||
})
|
||||
break;
|
||||
case 1: //单位管理
|
||||
deletedataDw([id]).then(res => {
|
||||
hintToast('删除成功')
|
||||
_getList_Dwgl()
|
||||
})
|
||||
break;
|
||||
case 2: //寻巡访任务
|
||||
case 3: //战果申报
|
||||
deletedataRw([id]).then(res => {
|
||||
hintToast('删除成功')
|
||||
_getList_Rw()
|
||||
})
|
||||
break;
|
||||
// case 3: //战果申报
|
||||
// deletedataZg([id]).then(res=>{
|
||||
// hintToast('删除成功')
|
||||
// _getList_Zg()
|
||||
// })
|
||||
// break;
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.chooseBox {
|
||||
position: relative;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
align-content: center;
|
||||
padding: 2vw 1vw;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #507ce9;
|
||||
border-radius: 4px;
|
||||
color: #d3d0d0;
|
||||
font-size: 14px;
|
||||
|
||||
.outBox {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 38px;
|
||||
background: #fff;
|
||||
padding-top: 4vw;
|
||||
z-index: 999;
|
||||
border-radius: 4px;
|
||||
|
||||
.selectBox {
|
||||
width: 100%;
|
||||
padding: 4vw;
|
||||
box-sizing: border-box;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
|
||||
.selectItem {
|
||||
padding-left: 4vw;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
line-height: 30px;
|
||||
color: #4a4646;
|
||||
}
|
||||
}
|
||||
|
||||
.selectBox::before {
|
||||
position: absolute;
|
||||
content: "";
|
||||
top: -4px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
width: 0;
|
||||
height: 0;
|
||||
border: 10px solid;
|
||||
border-color: transparent transparent #ccc transparent;
|
||||
}
|
||||
}
|
||||
|
||||
.hoverClose {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.listBox {
|
||||
height: calc(100vh - 20vw);
|
||||
overflow: hidden;
|
||||
overflow-y: auto;
|
||||
padding: 1vw 4vw;
|
||||
padding-bottom: 0;
|
||||
box-sizing: border-box;
|
||||
|
||||
.listItem {
|
||||
background-color: rgba(241, 241, 241, 0.5);
|
||||
padding: 2vw;
|
||||
border: 1px solid;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user