zdxtLawEnforcementCodeView/src/views/administrative/appointment.vue

<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-form @failed="onFailed" @submit="submit">
                <!--            <van-field-->
                <!--              v-model="submitData.lawEnforcementCode"-->
                <!--              label="登记编号"-->
                <!--            />-->
                <van-field
                        v-model="submitData.enterpriseName"
                        label="企业名称"
                        required
                        :rules="[{ required: true, message: '必填项' }]"
                        readonly
                        @click="showPopupCompony"
                />
                <Popup :visible="popupVisible" :content="popupContent" @close="closePopupCompony"
                       @reciveData="reciveData"/>
                <van-field
                        v-model="submitData.linkMan"
                        required
                        :rules="[{ required: true, message: '必填项' }]"
                        label="企业联系人"
                />
                <van-field
                        v-model="submitData.linkTel"
                        label="联系人电话"
                        required
                        :rules="[{ validator, message: '请输入正确内容' }]"
                />
                <van-field
                        v-model="submitData.checkTime"
                        required
                        readonly
                        label="检查时间"
                        :rules="[{ required: true, message: '必填项' }]"
                        @click="data.showTimePicker = true"
                />

                <van-field
                        v-model="submitData.checkItemText"
                        label="检查事项"
                        rows="2"
                        autosize
                        type="textarea"
                        maxlength="50"
                        placeholder="请输入检查事项"
                        show-word-limit
                />
                <van-field
                        v-model="submitData.checkRequireText"
                        label="检查要求"
                        rows="2"
                        autosize
                        type="textarea"
                        maxlength="50"
                        placeholder="请输入检查要求"
                        show-word-limit
                />

<!--                <van-field-->
<!--                        v-model="data.checkItemText"-->
<!--                        required-->
<!--                        readonly-->
<!--                        label="检查事项"-->
<!--                        :rules="[{ required: true, message: '必填项' }]"-->
<!--                        @click="data.showItem = true"-->
<!--                        type="textarea"-->
<!--                        rows="1"-->
<!--                        autosize-->
<!--                />-->
<!--                <van-field v-model="submitData.checkItem" v-show="false"/>-->
<!--                <van-field-->
<!--                        v-model="data.checkRequireText"-->
<!--                        required-->
<!--                        readonly-->
<!--                        label="检查要求"-->
<!--                        :rules="[{ required: true, message: '必填项' }]"-->
<!--                        @click="data.showGA = true"-->
<!--                        type="textarea"-->
<!--                        rows="1"-->
<!--                        autosize-->
<!--                />-->
<!--                <van-field v-model="submitData.checkRequire" v-show="false"/>-->
                <van-field
                        v-model="submitData.lawEnforcement"
                        readonly
                        label="执法部门"
                />
                <van-field
                        v-model="submitData.lawEnforcerText"
                        readonly
                        label="执法人员"
                />
                <van-field
                        v-model="submitData.lawEnforcerTextTwo"
                        readonly
                        label="执法人员"
                        right-icon="add-o"
                        @click="showPopup"
                />
                <van-field
                        v-model="submitData.remark"
                        label="备注"
                        rows="2"
                        autosize
                        type="textarea"
                        maxlength="50"
                        placeholder="请输入备注"
                        show-word-limit
                />

                <van-cell center title="开启联合检查">
                    <template #right-icon>
                        <van-switch v-model="data.checked" @click="!data.checked"/>
                    </template>
                </van-cell>
                <van-field
                        v-if="data.checked"
                        v-model="submitData.deptTexts"
                        label="检查部门"
                        rows="2"
                        autosize
                        type="textarea"
                        placeholder="请选择"
                        show-word-limit
                        readonly
                        @click="data.deptChecked=true"
                />



                <van-action-bar>
                        <van-button round block type="info" native-type="submit" @click="tmpSave">提交</van-button>
                        <van-button round block type="info" native-type="submit" @click="submit112">发送</van-button>
                    </van-action-bar>

            </van-form>
            <!--          </van-cell-group>-->
        </div>

        <!--        <div class="warp_body">-->
        <!--            <van-action-bar>-->
        <!--                <van-action-bar-button text="保存"  @click="submit" />-->
        <!--            </van-action-bar>-->
        <!--        </div>-->

        <van-popup v-model:show="data.showLawEnforcerFlag" position="bottom" :style="{ height: '30%' }"/>
        <UserPopup :visible="data.popupVisible" :content="data.popupContent" @close="closePopup"
                   @reciveData="reciveVisible"/>

        <van-popup v-model:show="data.showTimePicker" position="bottom" :style="{ height: '30%' }">
            <van-date-picker
                    type="time"
                    v-model="data.currentDate"
                    @confirm="onConfirm"
                    @cancel="data.showTimePicker = false"
            />
        </van-popup>
        <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>

        <DeptPopup :visible="data.deptChecked" :content="data.deptContent" @close="closePopup"
                   @reciveData="reciveDept"/>

        <van-notify v-model:show="data.notifyShow" type="success">
            <van-icon name="bell" style="margin-right: 4px;" />
            <span>{{data.notifyContent}}</span>
        </van-notify>
    </div>
</template>

<script setup name="register">

    import {showSuccessToast} from 'vant';
    import 'vant/es/toast/style';
    import {
        getByUserIdAndZero,
        addEnterpriseLawEnforcement,
        editEnterpriseLawEnforcement,
        queryEnterpriseLawEnforcementList
    } from '../../api/administrative'
    import {queryUserInfo} from '../../api/enforce'
    import {queryEnterpriseInfoList} from '../../api/enterprise'
    import {reactive, ref} from "vue";
    import {getDict} from "../../api/Home";
    import {queryLinkage, queryLinkageDictByValueAndParentId} from "../../api/linkage";
    import {uploadFile} from "../../util/fileUpload";
    import { showNotify } from 'vant';
    //用户筛选弹窗
    import UserPopup from './userFilter.vue';
    import DeptPopup from './deptFilter.vue';

    const {useCommon} = $globalStore;

    const router = useRouter();
    let queryaddressId = ref("");
    const data = reactive({
        showLawEnforcerFlag: false,
        showTimePicker: false,
        popupVisible: false,
        popupContent: '',
        showGA: false,
        showItem: false,
        checkItemText: "",
        checkRequireText: "",
        ga_columns: [],
        item_columns: [],
        currentDate: [],
        checked: false,
        deptChecked: false,
        deptContent: '',
        notifyShow: false,
        notifyContent: "",
        tempDate: null,
    });
    //保存参数
    const submitData = reactive({
        /** ID */
        id: "",
        /** 登记编号 */
        lawEnforcementCode: "",
        /** 企业名称 */
        enterpriseName: "",
        /**统一社会信用代码 */
        enterpriseNumber: "",
        /** 企业ID */
        enterpriseId: "",
        /** 企业联系人 */
        linkMan: "",
        /** 联系人电话 */
        linkTel: "",
        /** 检查时间 */
        checkTime: "",
        /** 检查事项 */
        checkItem: "",
        checkItemText: "",
        /** 检查要求 */
        checkRequire: "",
        checkRequireText: "",
        /** 执法部门 */
        lawEnforcement: "",
        /** 执法部门ID */
        lawEnforcementId: "",
        /** 执法人员 */
        lawEnforcer: "",
        lawCertificateNum: "",
        lawEnforcerText: "",
        /** 执法人员ID */
        lawEnforcerId: "",
        /** 执法人员2 */
        lawEnforcerTwo: "",
        lawCertificateNumTwo: "",
        lawEnforcerTextTwo: "",
        /** 执法人员2ID */
        lawEnforcerTwoId: "",
        /** 备注 */
        remark: "",
        userId: useCommon.userId,
        deptTexts: "",
        deptObjs: [],
        isUnite: 0,
    })

    const currentDate =() => {
        const now = new Date();
        const year = now.getFullYear();
        const month = (now.getMonth() + 1).toString().padStart(2, '0');
        const day = now.getDate().toString().padStart(2, '0');
        data.currentDate = [year, month, day]
    }

    const onConfirm = (time) => {
        if (time != null) {
            var times = time.selectedValues;
            submitData.checkTime = times[0] + "-" + times[1] + "-" + times[2];
            data.tempDate = times[1] + "月" + times[2] + "号";
        }
        data.showTimePicker = false;

        // 查询设定的检查时间是否有别的企业对该部门进行检查, 如果有这提示可进行联合执法
        if (null != submitData.enterpriseNumber && null != data.tempDate) {
            let params = {
                enterpriseNumber: submitData.enterpriseNumber,
                checkTime: submitData.checkTime,
            }
            queryEnterpriseLawEnforcementList(params, success => {
                var deptName = "";
                for (var i = 0; i < success.data.length; i++) {
                    deptName += success.data[i].lawEnforcement + ", ";
                }
                if (success.data.length > 0) {
                    data.notifyContent = "您在" + data.tempDate + "和" + deptName + "执法部门有相同的执法企业，可以发起联合执法"
                    data.notifyShow = true;
                    setTimeout(() => {
                        data.notifyShow = false;
                    }, 2000);
                }
            });
        }
    };

    const validator = (val) => /^1[34578]\d{9}$/.test(val);

    const onFailed = (errorInfo) => {
        console.log('failed', errorInfo);
    };


    const showPopup = () => {
        data.popupVisible = true;
    }
    const closePopup = () => {
        data.popupVisible = false;
        data.deptChecked = false;
    }
    const reciveVisible = (item) => {
        submitData.lawEnforcerTwo = item.userName
        submitData.lawCertificateNumTwo = item.lawCertificateNum;
        submitData.lawEnforcerTwoId = item.userId;
        submitData.lawEnforcerTextTwo = submitData.lawEnforcerTwo +" "+ submitData.lawCertificateNumTwo
        // submitData.lawEnforcerTextTwo = submitData.lawEnforcerTwo
    }

    const reciveDept = (item) => {
        submitData.deptTexts = "";
        submitData.deptObjs = [];
        for (var i=0; i<item.length; i++) {
            submitData.deptTexts += item[i].deptName+";";
            submitData.deptObjs.push({ deptId: item[i].deptId, deptName: item[i].deptName });
        }
    }

    /* 检查要求 start */
    const gaConfirm = ({selectedOptions}) => {
        data.checkRequireText = selectedOptions[0].text;
        submitData.checkRequire = selectedOptions[0].value;
        data.showGA = false;
        data.showItem = false;
    };

    /* 检查要求 start */
    const itemConfirm = ({selectedOptions}) => {
        data.checkItemText = selectedOptions[0].text;
        submitData.checkItem = 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 goBack = () => {
        router.go(-1);
    };

    const dataFillIn = () => {
        getByUserIdAndZero(useCommon.userId, success => {
            //跳转企业二维码地址
            if (success.success) {
                Object.keys(submitData).forEach((item) => {
                    submitData[item] = success.data[item] ? success.data[item] : "";
                })
                data.checkItemText = success.data['params'].checkItemText;
                data.checkRequireText = success.data['params'].checkRequireText;
                submitData.lawEnforcerText = success.data['lawEnforcer'];
                submitData.lawEnforcerTextTwo = success.data['lawEnforcerTwo'];
                // showSuccessToast('保存成功');
            }
        }, error => {
            console.log("保存失败")
        })
    }

    const tmpSave = () => {
        submitData.lawCertificateNum = null;
        submitData.isUnite = 0;
        if (data.checked) { submitData.isUnite = 1; }
        addEnterpriseLawEnforcement(submitData, success => {
            //跳转企业二维码地址
            if (success.success) {
                showSuccessToast('保存成功');
                router.push(
                    {
                        path: "/appointmentList"
                    });
            }
        }, error => {
            console.log("保存失败")
        })
    }

    const submit112 = () => {
        // showSuccessToast('登记成功');
        submitData.lawCertificateNum = null;
        submitData.isUnite = 0;
        if (data.checked) { submitData.isUnite = 1; }
        editEnterpriseLawEnforcement(submitData, success => {
            //跳转企业二维码地址
            if (success.success) {
                showSuccessToast('登记成功');
                router.push(
                    {
                        path: "/appointmentList"
                    });
            }
        }, error => {
            console.log("登记失败")
        })
    }

    const getLinkageByValueAndParentId = (value, parentId) => {
        // 查询检查要求字典信息
        queryLinkageDictByValueAndParentId({"dataScopeId": useCommon.userId, "value": value, "parentId": parentId}, success => {
            getLinkageByParentIdToItem(success.id)
        }, error => {
        });
    }

    const getLinkageByParentIdToItem = (parentId) => {
        // 查询检查要求字典信息
        queryLinkage({"dataScopeId": useCommon.userId, "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.checkItemText = success[i].title;
                //     submitData.checkItem = 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.checkRequireText = success[i].title;
                //     submitData.checkRequire = success[i].id;
                // }
            }
        }, error => {
        });
    }

    //初始化参数，获取扫码的企业统一信用编码
    onMounted(() => {
        // 数据填充
        // dataFillIn();

        currentDate();

        //查询当前登录人员信息
        queryUserInfo(useCommon.userId, success => {
            console.log(success.data)
            submitData.lawEnforcer = success.data.userName;
            submitData.lawCertificateNum = success.data.lawCertificateNum
            submitData.lawEnforcerText = submitData.lawEnforcer +" "+ submitData.lawCertificateNum
            // submitData.lawEnforcerText = submitData.lawEnforcer
            submitData.lawEnforcerId = success.data.userId;
            submitData.lawEnforcement = success.data.dept.deptName;
            submitData.lawEnforcementId = success.data.dept.deptId;
        }, error => {
        });

        getLinkageByValueAndParentId("check_item", "100");

        // 查询检查要求字典信息
        // getDict({"dictType": "checkRequire"}, success => {
        //     for(var i=0; i<success.data.length; i++) {
        //         data.ga_columns.push({ text: success.data[i].dictLabel, value: success.data[i].dictValue })
        //     }
        // },error=>{});

        // 查询检查要求字典信息
        // getDict({"dictType": "checkItem"}, success => {
        //     for(var i=0; i<success.data.length; i++) {
        //         data.item_columns.push({ text: success.data[i].dictLabel, value: success.data[i].dictValue })
        //     }
        // },error=>{});
    })

    const reciveData = (item) => {
        submitData.enterpriseName = item.enterpriseName;
        submitData.linkTel = item.enterpriseTel;
        submitData.linkMan = item.legalPerson;
        submitData.enterpriseNumber = item.enterpriseNumber;

        // 查询设定的检查时间是否有别的企业对该部门进行检查, 如果有这提示可进行联合执法
        if (null != submitData.enterpriseNumber && null != data.tempDate) {
            let params = {
                enterpriseNumber: submitData.enterpriseNumber,
                checkTime: submitData.checkTime,
            }
            queryEnterpriseLawEnforcementList(params, success => {
                var deptName = "";
                for (var i = 0; i < success.data.length; i++) {
                    deptName += success.data[i].lawEnforcement + ", ";
                }
                if (success.data.length > 0) {
                    data.notifyContent = "您在" + data.tempDate + "和" + deptName + "执法部门有相同的执法企业，可以发起联合执法"
                    data.notifyShow = true;
                    setTimeout(() => {
                        data.notifyShow = false;
                    }, 2000);
                }
            });
        }
    }
</script>
<script>
    //案件筛选弹窗
    import Popup from '../enterprise/companyFilter.vue';

    export default {
        components: {
            Popup
        },
        data() {
            return {
                popupVisible: false,
                popupContent: ''
            }
        },
        methods: {
            showPopupCompony() {
                this.popupVisible = true;
            },
            closePopupCompony() {
                this.popupVisible = false;
            }
        }
    }
</script>
<style lang="less" scoped>
    .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%;
      background-color: #ebf3fb;
      overflow-y: auto;
      margin-top: 0.15rem;
    }

    /* 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;
    }

    :deep(.van-button) {
        margin: 5% 3%;
        padding: 0;
        width: 94%;
        height: 1rem;
        color: #fff;
        font-size: 0.4rem;
        border-radius: 1rem;
        background: #1367fe;
        border: 1px solid #1367fe;
        text-align: center;
    }

    /deep/ .van-action-bar {
      box-shadow: 0 0 0.27rem #e5e5e5;
    }

</style>