You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 

378 lines
9.7 KiB

<template>
<div class="address_edit">
<!-- 导航栏 -->
<div class="header_body">
<header-nav
:slefBack="true"
@goBack="goBack"
:titelText="`执法检查计划`"
>
</header-nav>
</div>
<!-- 中间 -->
<div class="warp_body">
<van-cell-group>
<van-field
v-model="submitData.planYear"
required
label="计划年度"
placeholder="必填"
readonly
:rules="[{ required: true, message: '请选择年度计划' }]"
@click="selectDate"
/>
<van-popup v-model:show="data.showDatePicker" position="bottom">
<van-date-picker
title="选择日期"
v-model="data.currentDate"
:min-date="data.minDate"
:max-date="data.maxDate"
:columns-type="data.columnsType"
@confirm="onDateConfirm"
@cancel="cancelSelectDate"
/>
</van-popup>
<van-field
v-model="submitData.planName"
label="计划名称"
placeholder="请输入"
required
:rules="[{ required: true, message: '请输入计划名称' }]"
/>
<van-field
v-model="submitData.enforcementDepartment"
label="执法部门"
placeholder="请选择"
@click=""
required
:rules="[{ required: true, message: '请选择执法部门'}]"
/>
<!-- <van-field
v-model="submitData.enforcementTime"
label="执法时间"
placeholder="请选择"
clickable
is-link
readonly
required
:rules="[{ required: true, message: '请选择执法时间'}]"
@click="selectEnforcementTime"
/> -->
<van-popup v-model:show="data.showPicker" position="bottom">
<van-date-picker
title="选择日期"
v-model="data.currentDate1"
:min-date="data.minDate"
:max-date="data.maxDate"
:columns-type="data.columnsTypes"
@confirm="onEnforcementTimeConfirm"
@cancel="cancelEnforcementTime"
/>
</van-popup>
<van-field
v-model="submitData.enforcementArea"
label="执法区域"
placeholder="请输入"
required
:rules="[{ required: true, message: '请输入执法区域'}]"
/>
<div class="file-upload">
<div class="file-upload-center">
文件上传 <span>(不多于9张)</span>
</div>
<van-uploader v-model="submitData.fileListObj" class="file" :after-read="uploadFiles" multiple @oversize="onOversize" :before-delete="deleteFile" accept=".pdf">
<template #preview-cover="{ file }">
<div class="preview-cover van-ellipsis">{{ file.name }}</div>
</template>
</van-uploader>
</div>
</van-cell-group>
<van-action-bar>
<van-action-bar-button text="提交" @click="submit" />
</van-action-bar>
</div>
</div>
</template>
<script setup name="register">
import { showSuccessToast,showLoadingToast,closeToast } from 'vant';
import {addEnforcementInspectionProgram,queryUserInfo} from '@/api/enforce'
import {getDict} from '../../api/Home'
import {uploadFile} from '../../util/fileUpload'
import { reactive, ref } from "vue";
import { showConfirmDialog } from 'vant';
const { useCommon, useMy } = $globalStore;
const router = useRouter();
const route = useRoute();
let queryaddressId = ref("");
const data = reactive({
searchResult: [],
showPicker: false,
columns: [],
selectTypeValue : ref[0],
showDatePicker: ref(false),
columnsType :['year'],
columnsTypes :['year','month','day'],
currentDate: ref(['2024']),
minDate: new Date(2020, 0, 1),
maxDate: new Date(2125, 5, 1),
currentDate1: ref(['2024','03','01']),
});
//保存参数
const submitData = reactive({
//关联案件ID
relId:"",
//计划年度
planYear:"",
//计划名称
planName:"",
//执法部门
enforcementDepartment:"",
//执法部门ID
enforcementDepartmentId:"",
//执法时间
enforcementTime:"",
//执法区域
enforcementArea:"",
//是否发布年度执法计划
isPublish:0,
//后台保存图片列表
fileList:[],
//vant组件上传照片列表
fileListObj:[],
})
// 返回
const goBack = () => {
router.go(-1);
};
const submit = () =>{
showConfirmDialog({
title: '公布执法计划',
message: '对外公布本部门年度执法计划',
}).then(() => {
console.log(1)
submitData.isPublish = 1
addEnforcementInspectionProgram(submitData,success =>{
console.log(success)
//跳转企业二维码地址
if(success.success){
console.log("保存成功");
showSuccessToast('保存成功');
goBack();
}
},error=>{
console.log("保存失败")
})
}).catch(() => {
console.log(0)
showSuccessToast('保存成功');
submitData.isPublish = 0
addEnforcementInspectionProgram(submitData,success =>{
console.log(success)
//跳转企业二维码地址
if(success.success){
console.log("保存成功");
showSuccessToast('保存成功');
goBack();
}
},error=>{
console.log("保存失败")
})
});
}
//消息提醒
// const toast = showLoadingToast({
// duration: 0,
// forbidClick: true,
// message: '提交成功',
// });
// let second = 3;
// const timer = setInterval(() => {
// second--;
// if (second) {
// } else {
// clearInterval(timer);
// closeToast();
// }
// }, 1000);
// 保存地址操作
const onSave = () => {
router.replace({ name: "addressList" });
};
const onConfirm = (value)=> {
data.showPicker = false;
console.log(value)
submitData.enforceType = value.selectedValues[0];
submitData.enforceTypeText = value.selectedOptions[0].text;
}
const selectType = () =>{
data.showPicker = true;
// console.log(data)
}
const uploadFiles = (file) =>{
uploadFile(file,(res) =>{
console.log(file.fileName);
submitData.fileList.push({
fileUrl:res.url,
fileName: file.file.name
})
console.log(submitData.fileList);
});
}
const deleteFile = (file,index) =>{
console.log(index);
submitData.fileListObj.filter((item, indexs) => {
if (index.index == indexs) {
submitData.fileListObj.splice(indexs, 1);//splice 删除
}
});
submitData.fileList.filter((item, indexs) => {
if (index.index == indexs) {
submitData.fileList.splice(indexs, 1);//splice 删除
}
});
console.log(submitData.fileList);
return true;
}
onMounted(() => {
console.log(route?.query?.id);
console.log(route?.query?.lawEnforcementIncident);
submitData.relId = route?.query?.id;
submitData.lawEnforcementIncident = route?.query?.lawEnforcementIncident;
getDict({"dictType": "caseType"},success =>{
console.log(success);
success.data.forEach(res =>{
console.log(res)
var obj = { text: res.dictLabel, value: res.dictValue };
data.columns.push(obj)
})
},error =>{
})
//查询企业信息
queryUserInfo(useCommon.userId,success =>{
submitData.enforcementDepartment = success.data.dept.deptName;
submitData.enforcementDepartmentId = success.data.dept.deptId;
},error=>{
})
});
const selectDate = () =>{
data.showDatePicker = true;
console.log(data.showDatePicker)
}
const onDateConfirm = (value)=> {
console.log(value);
value.selectedValues.forEach((item,index) => {
console.log(item);
submitData.planYear = item;
});
// submitData.establishmentTime = "2023-04-21"
data.showDatePicker = false;
}
//取消日期选择
const cancelSelectDate = () =>{
data.showDatePicker = false;
}
//取消
const cancelEnforcementTime = () =>{
data.showPicker = false;
}
const selectEnforcementTime = () =>{
data.showPicker = true;
}
const onEnforcementTimeConfirm = (value)=> {
console.log(value);
value.selectedValues.forEach((item,index) => {
console.log(item);
});
submitData.enforcementTime = value.selectedValues[0] + "-" + value.selectedValues[1] + "-" + value.selectedValues[2] + " 00:00:00";
data.showPicker = false;
}
</script>
<style lang="less" scoped>
.address_edit {
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
background-color: #f4f4f4;
}
/* vant4的 Toast 和 Popup 样式冲突,会导致 Toast 变成白底 */
// .van-popup.van-toast{
// background: var(--van-toast-background) !important;
// box-sizing: content-box !important;
// /* 下面3条css,影响不大 */
// transition: all var(--van-duration-fast) !important;
// width: var(--van-toast-default-width) !important;
// max-width: var(--van-toast-max-width) !important;
// }
// .van-popup.van-toast .van-toast__icon{
// font-size: var(--van-toast-icon-size) !important;
// }
.file-upload{
height: 165px;
position: relative;
}
.file-upload-center{
position: absolute;
height: 20%;
top: 10%;
left: 2%;
font-size: 18px;
span {
font-size: 13px;
color: rgb(221, 229, 227);
}
}
.file{
position: absolute;
bottom: 10%;
left: 2%;
}
.preview-cover {
position: absolute;
bottom: 0;
box-sizing: border-box;
width: 100%;
padding: 4px;
color: #fff;
font-size: 12px;
text-align: center;
background: rgba(0, 0, 0, 0.3);
}
/deep/ .van-button {
margin: 5% 3%;
padding: 0;
width: 94%;
height: 1rem;
color: #fff;
font-size: 0.4rem;
border-radius: 1rem;
background: #1367fe;
border: 0.02667rem solid #1367fe;
text-align: center;
}
:root {
--van-dialog-width: 600px;
}
</style>