chenrui
2 years ago
4 changed files with 532 additions and 9 deletions
@ -0,0 +1,514 @@ |
|||
<template> |
|||
<div class="address_edit"> |
|||
<!-- 导航栏 --> |
|||
<div class="header_body"> |
|||
<header-nav :slefBack="true" @goBack="goBack" :titelText="`执法信息编辑`"></header-nav> |
|||
</div> |
|||
<span class="tohome" @click="toEnforceHomeView"><i class="van-badge__wrapper van-icon van-icon-wap-home-o"></i></span> |
|||
<!-- 中间 --> |
|||
<div class="warp_body"> |
|||
<van-form @failed="onFailed"> |
|||
<van-cell-group> |
|||
<div style="font-size:large" class="zf-name">执法信息</div> |
|||
<van-field |
|||
v-model="submitData.lawEnforcement" |
|||
label="执法部门" |
|||
readonly |
|||
/> |
|||
<van-field |
|||
v-model="submitData.lawCertificateNumText" |
|||
label="执法人员" |
|||
readonly |
|||
/> |
|||
<van-field |
|||
v-model="submitData.lawCertificateNumTwoText" |
|||
label="执法人员" |
|||
readonly |
|||
placeholder="请选择" |
|||
right-icon="add-o" |
|||
@click="showPopup" |
|||
/> |
|||
<van-field |
|||
v-model="submitData.subsidiaryerText" |
|||
label="辅助人员" |
|||
readonly |
|||
placeholder="请选择" |
|||
right-icon="add-o" |
|||
@click="showPopup2" |
|||
/> |
|||
<van-field |
|||
v-model="submitData.enforcementTime" |
|||
label="执法时间" |
|||
readonly |
|||
placeholder="请选择" |
|||
/> |
|||
<van-field |
|||
v-model="data.lawEnforcementItemText" |
|||
required |
|||
readonly |
|||
label="执法事项" |
|||
:rules="[{ required: true, message: '必填项' }]" |
|||
placeholder="必填 执法事项" |
|||
@click="data.showItem = true" |
|||
type="textarea" |
|||
rows="1" |
|||
autosize |
|||
/> |
|||
<van-field v-model="submitData.lawEnforcementItem" v-show="false" /> |
|||
<van-field |
|||
v-model="data.lawEnforcementBasisText" |
|||
required |
|||
readonly |
|||
label="执法依据" |
|||
:rules="[{ required: true, message: '必填项' }]" |
|||
placeholder="必填 执法依据" |
|||
@click="data.showGA = true" |
|||
type="textarea" |
|||
rows="1" |
|||
autosize |
|||
/> |
|||
<van-field v-model="submitData.lawEnforcementBasis" v-show="false" /> |
|||
<van-field |
|||
v-model="submitData.reslut" |
|||
required |
|||
label="执法结果" |
|||
:rules="[{ required: true, message: '必填项' }]" |
|||
> |
|||
<template #input> |
|||
<div> |
|||
<van-tag :color="data.good" @click="tapGood">合格</van-tag> |
|||
<van-tag :color="data.bad" @click="tapBad" style="margin-left: 15px;">不合格</van-tag> |
|||
</div> |
|||
</template> |
|||
</van-field> |
|||
<van-field |
|||
v-model="submitData.remark" |
|||
label="备注" |
|||
rows="2" |
|||
autosize |
|||
type="textarea" |
|||
maxlength="50" |
|||
placeholder="请输入备注" |
|||
show-word-limit |
|||
/> |
|||
|
|||
<van-divider class="divdsty" /> |
|||
|
|||
<div class="file-upload"> |
|||
<div class="file-upload-center"> |
|||
<label>上传附件</label> <span>(不多于9张)</span> |
|||
</div> |
|||
<van-uploader v-model="submitData.fileListObj" accept="" class="file" multiple :max-size="500 * 1024" :after-read="uploadFiles" :before-delete="deleteFile"> |
|||
<template #preview-cover="{ file }"> |
|||
<div class="preview-cover van-ellipsis">{{ file.name }}</div> |
|||
</template> |
|||
</van-uploader> |
|||
</div> |
|||
</van-cell-group> |
|||
|
|||
<van-divider class="divdsty" /> |
|||
|
|||
<van-cell-group> |
|||
<div style="padding-top:10px; font-size:large" class="qy-name">企业信息</div> |
|||
<van-field |
|||
v-model="submitData.enterpriseName" |
|||
required |
|||
label="企业名称" |
|||
:rules="[{ required: true, message: '必填项' }]" |
|||
placeholder="必填 企业名称" |
|||
/> |
|||
<van-field |
|||
v-model="submitData.enterpriseNumber" |
|||
required |
|||
label="统一社会信用代码" |
|||
:rules="[{ required: true, message: '必填项' }]" |
|||
placeholder="必填 统一社会信用代码" |
|||
/> |
|||
</van-cell-group> |
|||
|
|||
<van-action-bar> |
|||
<van-button v-if="submitData.isSubmit != 0 " round block type="info" native-type="submit" @click="submit(0)">保存</van-button> |
|||
<van-button round block type="info" native-type="submit" @click="submit(1)">提交</van-button> |
|||
</van-action-bar> |
|||
</van-form> |
|||
</div> |
|||
|
|||
<Popup :visible="data.popupVisible" :content="data.popupContent" @close="closePopup" @reciveData="reciveData" /> |
|||
<Popup :visible="data.popupVisible2" :content="data.popupContent2" @close="closePopup" @reciveData="reciveData2" /> |
|||
|
|||
|
|||
<van-popup v-model:show="data.showItem" position="bottom" :style="{ height: '30%' }"> |
|||
<van-picker title="事项" |
|||
:columns="data.item_columns" |
|||
@confirm="itemConfirm" |
|||
@change="itemChange" |
|||
@cancel="gaCancel" |
|||
/> |
|||
</van-popup> |
|||
<van-popup v-model:show="data.showGA" position="bottom" :style="{ height: '30%' }"> |
|||
<van-picker title="依据" |
|||
:columns="data.ga_columns" |
|||
@confirm="gaConfirm" |
|||
@cancel="gaCancel" |
|||
/> |
|||
</van-popup> |
|||
</div> |
|||
</template> |
|||
|
|||
<script setup name="register"> |
|||
|
|||
import { showSuccessToast } from 'vant'; |
|||
import {addEnforcementRegistration,queryRegistrationById} from '@/api/enforce' |
|||
import { reactive, ref } from "vue"; |
|||
import {uploadFile} from "@/util/fileUpload"; |
|||
import {formattedTime} from "@/util/util"; |
|||
//用户筛选弹窗 |
|||
import Popup from '@/views/enforce/userFilter'; |
|||
import { queryLinkage, queryLinkageDictByValueAndParentId } from "@/api/linkage"; |
|||
|
|||
const { useMy } = $globalStore |
|||
|
|||
const router = useRouter(); |
|||
//路由参数 |
|||
const route = useRoute(); |
|||
let queryaddressId = ref(""); |
|||
const data = reactive({ |
|||
showLawEnforcerFlag:false, |
|||
currentPage: 1, |
|||
good:"", |
|||
bad:"", |
|||
popupVisible: false, |
|||
popupContent: '', |
|||
popupVisible2: false, |
|||
popupContent2: '', |
|||
showGA:false, |
|||
showItem:false, |
|||
lawEnforcementBasisText:"", |
|||
lawEnforcementItemText: "", |
|||
ga_columns: [], |
|||
item_columns: [], |
|||
}); |
|||
//保存参数 |
|||
const submitData = reactive({ |
|||
//执法部门 |
|||
lawEnforcement:"", |
|||
lawEnforcementId:"", |
|||
//执法人员1 |
|||
lawEnforcer:"", |
|||
lawEnforcerId:"", |
|||
lawCertificateNumText:"", |
|||
|
|||
//执法人员2 |
|||
lawEnforcerTwo: "", |
|||
lawEnforcerIdTwo: "", |
|||
lawCertificateNumTwoText: "", |
|||
//辅助人员 |
|||
subsidiaryer: "", |
|||
subsidiaryerId: "", |
|||
subsidiaryerText: "", |
|||
//执法事项 |
|||
lawEnforcementItem:"", |
|||
//执法依据 |
|||
lawEnforcementBasis:"", |
|||
//执法结果 |
|||
reslut:0, |
|||
//备注 |
|||
remark:"", |
|||
//企业名称 |
|||
enterpriseName:"", |
|||
//统一信用码 |
|||
enterpriseNumber:"", |
|||
//执法时间 |
|||
enforcementTime:"", |
|||
//后台保存图片列表 |
|||
fileList:[], |
|||
//vant组件上传照片列表 |
|||
fileListObj:[], |
|||
// 数据保存或提交 0 保存 1提交 |
|||
isSubmit: 0, |
|||
}) |
|||
|
|||
const tapGood = () => { |
|||
data.good = "#13c11a"; |
|||
data.bad = "#D3D3D3"; |
|||
submitData.reslut = 0; |
|||
} |
|||
const tapBad = () => { |
|||
data.good = "#D3D3D3"; |
|||
data.bad = "#ff0000"; |
|||
submitData.reslut = 1; |
|||
} |
|||
|
|||
const getLinkageByValueAndParentId = (value, parentId) => { |
|||
// 查询检查要求字典信息 |
|||
queryLinkageDictByValueAndParentId({"value":value, "parentId": parentId}, success => { |
|||
getLinkageByParentIdToItem(success.id) |
|||
},error=>{}); |
|||
} |
|||
|
|||
const getLinkageByParentIdToItem = (parentId) => { |
|||
// 查询检查要求字典信息 |
|||
queryLinkage({"parentId": parentId}, success => { |
|||
for(var i=0; i<success.length; i++) { |
|||
data.item_columns.push({ text: success[i].title, value: success[i].id, id: success[i].id }) |
|||
// if (i==0) { |
|||
// data.lawEnforcementItemText = success[i].title; |
|||
// submitData.lawEnforcementItem = success[i].id; |
|||
// getLinkageByParentIdToGA(success[i].id); |
|||
// } |
|||
} |
|||
},error=>{}); |
|||
} |
|||
|
|||
const getLinkageByParentIdToGA = (parentId) => { |
|||
// 查询检查要求字典信息 |
|||
data.ga_columns = []; |
|||
queryLinkage({"parentId": parentId}, success => { |
|||
for(var i=0; i<success.length; i++) { |
|||
data.ga_columns.push({ text: success[i].title, value: success[i].id, id: success[i].id }) |
|||
// if (i==0) { |
|||
// data.lawEnforcementBasisText = success[i].title; |
|||
// submitData.lawEnforcementBasis = success[i].id; |
|||
// } |
|||
} |
|||
},error=>{}); |
|||
} |
|||
|
|||
//3a0096181c184e5aa56f70923680856d$6e74ceda1463c165fd43eeeadce4f7cd |
|||
//初始化参数，获取扫码的企业统一信用编码 |
|||
onMounted(() =>{ |
|||
//查询企业信息 |
|||
queryRegistrationById(route?.query?.id,success =>{ |
|||
if (null != success.data) { |
|||
console.log(success.data) |
|||
submitData.lawEnforcement = success.data.lawEnforcement; |
|||
submitData.lawEnforcementId = success.data.lawEnforcementId; |
|||
submitData.lawEnforcementBasis = success.data.lawEnforcementBasis; |
|||
data.lawEnforcementBasisText = success.data.lawEnforcementBasisText; |
|||
submitData.lawEnforcementItem = success.data.lawEnforcementItem; |
|||
data.lawEnforcementItemText = success.data.lawEnforcementItemText; |
|||
submitData.lawCertificateNumText = success.data.lawEnforcer; |
|||
submitData.lawEnforcerId = success.data.lawEnforcerId; |
|||
submitData.lawCertificateNumTwoText = success.data.lawEnforcerTwo; |
|||
submitData.lawEnforcerIdTwo = success.data.lawEnforcerId; |
|||
submitData.subsidiaryer = success.data.subsidiaryer; |
|||
submitData.subsidiaryerId = success.data.subsidiaryerId; |
|||
submitData.reslut = success.data.reslut; |
|||
submitData.isSubmit = success.data.isSubmit; |
|||
if(submitData.reslut == 0){ |
|||
data.good = "#13c11a"; |
|||
data.bad = "#D3D3D3"; |
|||
}else{ |
|||
data.good = "#D3D3D3"; |
|||
data.bad = "#13c11a"; |
|||
} |
|||
} |
|||
},error=>{}) |
|||
|
|||
//初始化时间 |
|||
submitData.enforcementTime = formattedTime(new Date()); |
|||
}) |
|||
|
|||
// 返回 |
|||
const goBack = () => { |
|||
router.go(-1); |
|||
}; |
|||
|
|||
// 返回首页 |
|||
const toEnforceHomeView = () =>{ |
|||
router.push({ |
|||
path: "/enforceHome", |
|||
}); |
|||
}; |
|||
|
|||
const uploadFiles = (file) =>{ |
|||
uploadFile(file,(res) =>{ |
|||
submitData.fileList.push(res.url) |
|||
}); |
|||
|
|||
} |
|||
|
|||
const deleteFile = (file,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 删除 |
|||
} |
|||
}); |
|||
return true; |
|||
} |
|||
|
|||
/* 检查要求 start */ |
|||
const gaConfirm = ({ selectedOptions }) => { |
|||
data.lawEnforcementBasisText = selectedOptions[0].text; |
|||
submitData.lawEnforcementBasis = selectedOptions[0].value; |
|||
data.showGA = false; |
|||
data.showItem = false; |
|||
}; |
|||
|
|||
/* 检查要求 start */ |
|||
const itemConfirm = ({ selectedOptions }) => { |
|||
data.lawEnforcementItemText = selectedOptions[0].text; |
|||
submitData.lawEnforcementItem = selectedOptions[0].value; |
|||
data.showGA = false; |
|||
data.showItem = false; |
|||
|
|||
getLinkageByParentIdToGA(selectedOptions[0].id); |
|||
}; |
|||
const itemChange =({ selectedOptions }) => { |
|||
// getLinkageByParentIdToGA(selectedOptions[0].id); |
|||
} |
|||
const gaCancel = () => { |
|||
data.showGA = false; |
|||
data.showItem = false; |
|||
} |
|||
/* 检查要求 end */ |
|||
|
|||
const submit = (type) =>{ |
|||
submitData.isSubmit = type; |
|||
addEnforcementRegistration(submitData,success =>{ |
|||
//跳转首页 |
|||
if(success.success){ |
|||
showSuccessToast('登记成功'); |
|||
router.push({ path: "/enforceHome" }); |
|||
} |
|||
},error=>{ |
|||
console.log("登记失败") |
|||
}) |
|||
} |
|||
|
|||
const showPopup = () =>{ |
|||
data.popupVisible = true; |
|||
} |
|||
const showPopup2 = () =>{ |
|||
data.popupVisible2 = true; |
|||
} |
|||
const closePopup = () =>{ |
|||
data.popupVisible = false; |
|||
data.popupVisible2 = false; |
|||
} |
|||
const reciveData = (item) =>{ |
|||
submitData.lawEnforcerTwo = item.userName; |
|||
submitData.lawCertificateNumTwoText = item.userName + " " + item.lawCertificateNum |
|||
submitData.lawEnforcerIdTwo = item.userId; |
|||
} |
|||
const reciveData2 = (item) =>{ |
|||
submitData.subsidiaryer = item.userName; |
|||
submitData.subsidiaryerId = item.userId; |
|||
submitData.subsidiaryerText = item.userName + " " + item.lawCertificateNum; |
|||
} |
|||
|
|||
</script> |
|||
|
|||
<style lang="less" scoped> |
|||
.tohome { |
|||
position: absolute; |
|||
top: 1.25%; |
|||
right: 5%; |
|||
font-size: 0.5rem; |
|||
} |
|||
.address_edit { |
|||
display: flex; |
|||
flex-direction: column; |
|||
height: 100%; |
|||
overflow: hidden; |
|||
background-color: #ebf3fb; |
|||
} |
|||
|
|||
.warp_body { |
|||
margin: 0 3%; |
|||
padding-bottom: 3rem; |
|||
width: 94%; |
|||
height: 100%; |
|||
//border-radius: 0.25rem; |
|||
background-image: linear-gradient(to bottom, #ebf3fb, #fff); |
|||
overflow-y: auto; |
|||
} |
|||
|
|||
.qy-name{ |
|||
font-size: large; |
|||
margin-left: 5%; |
|||
height: 34px; |
|||
margin-top: 0%; |
|||
font-weight: 600; |
|||
} |
|||
.zf-name{ |
|||
font-size: 15px; |
|||
height: 33px; |
|||
background-color: white; |
|||
padding-left: 4%; |
|||
padding-top: 2%; |
|||
font-weight: 600; |
|||
} |
|||
|
|||
/* 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; |
|||
} |
|||
|
|||
.divdsty { |
|||
margin: auto; |
|||
width: 100%; |
|||
height: 0.25rem; |
|||
background-color: #f4f4f4; |
|||
border: 0; |
|||
} |
|||
.file-upload{ |
|||
min-height: 4.5rem; |
|||
position: relative; |
|||
} |
|||
.file-upload-center{ |
|||
position: absolute; |
|||
height: 20%; |
|||
top: 10%; |
|||
left: 2%; |
|||
font-size: 0.38rem; |
|||
span { |
|||
font-size: 0.32rem; |
|||
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: 0.32rem; |
|||
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; |
|||
} |
|||
|
|||
</style> |
|||
Loading…
Reference in new issue