用户、角色、部门，新增批量操作，案件池详情展示、以及调度

“dzb”

2022-10-03 4d9a35462803c7392dedca8d95fe21ff3d949466

用户、角色、部门，新增批量操作，案件池详情展示、以及调度

 src/App.vue

@@ -60,14 +60,15 @@
  background-color: #17324c !important;
}
.el-tree{
  background-color: #17324c !important;
  background-color: #09152f !important;
}
.el-tree-node__content:hover, .el-upload-list__item:hover{
  background-color: #09152f !important;
  color: #4b9bb7 !important;
}
.el-tree-node:focus>.el-tree-node__content{
  background-color: #09152f !important;
  background-color: #070f22 !important;
  color:#4b9bb7
}
/*定义滚动条高宽及背景
 高宽分别对应横竖滚动条的尺寸*/

 src/components/detail/index.vue

@@ -119,9 +119,9 @@
            <div class="show-item">
                <div class="show-wrap">
                    <MyProcess v-if="activeIndex === 1" :handlePassVo="handlePassVo"></MyProcess>
                    <MyFilePicture v-else-if="activeIndex === 2" :currentSitVo="currentSitVo" ></MyFilePicture>
                    <MyFilePicture v-else-if="activeIndex === 2" :filesPictureVo="filesPictureVo" ></MyFilePicture>
                    <MySovleProblem v-else-if="activeIndex === 3" :problemProVo="problemProVo"></MySovleProblem>
                    <MyScene v-else></MyScene>
                    <MyScene v-else :currentSitVo="currentSitVo"></MyScene>
                </div>
            </div>
        </div>
@@ -133,7 +133,7 @@
import MySovleProblem from '@/components/solveProblem'
import MyScene from '@/components/scene'
export default {
    components: {
    components: { 
        MyProcess, MyFilePicture, MySovleProblem, MyScene
    },
    data() {
@@ -159,22 +159,24 @@
                    title: '现场情况',
                    index: 4,
                },
            ],
            ], 
            baseCase:{},
            handlePassVo:{},
            currentSitVo:{},
            problemProVo:{},
            filesPictureVo:{}
            
        }
    },
    created() {
        console.log('created');
        const {info} = this;
        const {info} = this; 
        this.baseCase = info.baseCase;
        this.handlePassVo = info.handlePassVo;
        this.currentSitVo = info.currentSitVo;
        this.problemProVo = info.currentSitVo;
        console.log(info);
        this.problemProVo = info.problemProVo;
        this.filesPictureVo = info.filesPictureVo;
        console.log(info); 
    },
    methods: {
        changeComponent(index) {

 src/components/dispatch/index.vue

New file
@@ -0,0 +1,277 @@
<template>
    <div class="dispatch">
        <el-form ref="form" :model="dispatch" :rules="rules" label-width="120px">
            <!-- 选择距离 -->
            <el-form-item label="距离:" prop="distance">
                <el-radio-group v-model="dispatch.distance">
                    <el-radio :label="1">100m以内</el-radio>
                    <el-radio :label="2">300m以内</el-radio>
                    <el-radio :label="3">500m以内</el-radio>
                    <el-radio :label="4">1km以内</el-radio>
                    <el-radio :label="5">2km以内</el-radio>
                    <el-radio :label="6">3km以内</el-radio>
                </el-radio-group>
            </el-form-item>
            <!-- 选择执法车 -->
            <el-form-item label="选择执法车:" prop="enforcementCar">
                <el-select v-model="dispatch.enforcementCar" placeholder="请选择">
                    <el-option v-for="item in carOptions" :key="item.value" :label="item.label" :value="item.value">
                    </el-option>
                </el-select>
            </el-form-item>
            <!-- 选择人员 -->
            <div class="form-person">
                <!-- 部门 -->
                <el-form-item label="选择人员:" prop="dispatchOpinion">
                    <el-select v-model="dispatch.dispatchOpinion" placeholder="请选择部门">
                        <el-option v-for="item in departOptions" :key="item.value" :label="item.label"
                            :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <!-- 中队 -->
                <el-form-item prop="enforcementTeam" class="person-item">
                    <el-select v-model="dispatch.enforcementTeam" placeholder="选择中队">
                        <el-option v-for="item in squadronOptions" :key="item.value" :label="item.label"
                            :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item prop='lawEnforcer' class="person-item">
                    <!-- 人员 -->
                    <el-select v-model="dispatch.lawEnforcer" placeholder="请选择人员">
                        <el-option v-for="item in personOptions" :key="item.value" :label="item.label"
                            :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>
            </div>
            <div class="form-footer">
                <!-- 执法人员编号 -->
                <el-form-item label="执法人员编号:" prop="lawEnforcerName">
                    <el-input v-model="dispatch.lawEnforcerName"></el-input>
                </el-form-item>
                <!-- 执法人员联系方式 -->
                <el-form-item label="联系方式:" prop="contactWay">
                    <el-input v-model="dispatch.contactWay"></el-input>
                </el-form-item>
                <el-button type="primary" @click.native.prevent="handleDispatch">发送短信</el-button>
            </div>
        </el-form>
        <div class="map">
            <!-- <MyMap></MyMap> -->
        </div>
    </div>
</template>
<script>
import MyMap from '@/components/map'
export default {
    components: {
        MyMap
    },
    props: ['id','changeDialog'],
    created() {
        console.log(this.id);
    },
    data() {
        const checkPhone = (rule, value, callback) => {
            if (value) {
                const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/
                if (!rep.test(value)) {
                    callback("请输入正确的手机号码");
                } else {
                    callback();
                }
            } else {
                callback(new Error('联系方式不能为空'))
            }
        }
        const checkOpinion = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('部门不能为空'))
            }
        }
        const checkDistance = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('距离不能为空'))
            }
        }
        const checkCar = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('执法车辆不能为空'))
            }
        }
        const checkTeam = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('中队不能为空'))
            }
        }
        const checkPerson = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('执法人员不能为空'))
            }
        }
        const checkNumber = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('执法人员编号不能为空'))
            }
        }
        return {
            dispatch: {
                baseCaseId: 0,//案件id
                contactWay: "",//联系方式
                dispatchOpinion: "",//部门
                disposeDate: "",//处置日期
                distance: 0,//距离
                enforcementCar: '',//执法车
                enforcementTeam: "",//执法中队
                lawEnforcer: '',//执法人员
                lawEnforcerName: ""//执法编号
            },
            rules: {
                contactWay: [
                    {
                        required: true, trigger: 'blur', validator: checkPhone
                    }
                ],
                dispatchOpinion: [
                    { required: true, trigger: 'change', validator: checkOpinion }
                ],
                distance: [
                    { required: true, trigger: 'change', validator: checkDistance }
                ],
                enforcementCar: [
                    { required: true, trigger: 'change', validator: checkCar }
                ],
                enforcementTeam: [
                    { required: true, trigger: 'change', validator: checkTeam }
                ],
                lawEnforcer: [
                    { required: true, trigger: 'change', validator: checkPerson }
                ],
                lawEnforcerName: [
                    { required: true, trigger: 'change', validator: checkNumber }
                ],
            },
            carOptions: [
                {
                    label: '车辆一',
                    value: 1,
                },
                {
                    label: '车辆二',
                    value: 2,
                },
            ],
            departOptions: [
                {
                    label: '部门一',
                    value: 1,
                },
                {
                    label: '部门二',
                    value: 2,
                },
            ],
            carOptions: [
                {
                    label: '车辆一',
                    value: 1,
                },
                {
                    label: '车辆二',
                    value: 2,
                },
            ],
            squadronOptions: [
                {
                    label: '中队一',
                    value: 1,
                },
                {
                    label: '中队二',
                    value: 2,
                },
            ],
            personOptions: [
                {
                    label: '人员一',
                    value: 1,
                },
                {
                    label: '人员二',
                    value: 2,
                },
            ],
        }
    },
    methods: {
        // 执行调度
        handleDispatch() {
            console.log(this.dispatch);
            this.$refs.form.validate((valid) => {
                console.log(valid);
                if (valid) {
                    const {dispatch,id} = this;
                    dispatch.disposeDate = new Date();
                    console.log(id);
                    dispatch.baseCaseId = id;
                    console.log(dispatch);
                    this.$axios({
                        method:'post',
                        url:`sccg/dispatch_handle/dispatch`,
                        data:dispatch
                    })
                    .then(res=>{
                        this.$message({
                            type: res.code === 200 ? 'success':'error',
                            message: res.code === 200 ? '调度成功':res.message,
                        })
                        this.$emit('changeDialog',{dialogView:false});
                    })
                } else {
                    return false;
                }
            })
        }
    }
}
</script>
<style lang="scss" scoped>
.dispatch {
    padding: 50px 20px 10px;
    .form-person{
        display: flex;
        .person-item{
            margin-left: -100px;
        }
    }
    .form-footer {
        display: flex;
        align-items: center;
        line-height: 40px;

        .el-button {
            margin-bottom: 22px;
            margin-left: 40px;
        }
    }

    .map {
        height: 388px;
        width: 100%;
    }
}
</style>

 src/components/filePictrue/index.vue

@@ -3,17 +3,15 @@
        <div class="file-tell">
            <div class="tell-title">上报</div>
            <div class="tell-show">
                <el-upload class="upload-demo" :show-file-list="false" action="http://42.193.1.25:8082/sccg/file/medias"
                    :headers="getToken()" multiple :limit="50">
                    <div class="my-demo">
                        <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                            alt="">
                        <div class="tip">
                            <div>【图片类型】上报</div>
                            <div>【上报时间】2022-09-08 14:23:34</div>
                        </div>
                <div class="my-demo">
                    <!-- <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                            alt=""> -->
                    <img class="img" :src="imgSource[0].url" alt="">
                    <div class="tip">
                        <div>【图片类型】上报</div>
                        <div>【上报时间】2022-09-08 14:23:34</div>
                    </div>
                </el-upload>
                </div>
                <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                    alt="">
            </div>
@@ -21,17 +19,15 @@
        <div class="file-deal">
            <div class="tell-title">处置</div>
            <div class="tell-show">
                <el-upload class="upload-demo" :show-file-list="false" action="http://42.193.1.25:8082/sccg/file/medias"
                    :headers="getToken()" multiple :limit="50">
                    <div class="my-demo">
                        <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                            alt="">
                        <div class="tip">
                            <div>【图片类型】处置</div>
                            <div>【上报时间】2022-09-08 14:23:34</div>
                        </div>
                <div class="my-demo">
                    <!-- <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                        alt=""> -->
                    <img class="img" :src="imgSource[1].url" alt="">   
                    <div class="tip">
                        <div>【图片类型】处置</div>
                        <div>【上报时间】2022-09-08 14:23:34</div>
                    </div>
                </el-upload>
                </div>
                <img src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__ef98ada722c616eccb097d1352880862.svg"
                    alt="">
            </div>
@@ -42,8 +38,14 @@
export default {
    data() {
        return {

            imgSource: []
        }
    },
    props: ['filesPictureVo'],
    created() {
        console.log(this.filesPictureVo);
        const { filesPictureVo: { imageResources: mysource } } = this;
        this.imgSource = mysource;
    },
    methods: {
        // 获取token
@@ -61,33 +63,35 @@
.file-picture {
    padding-top: 50px;

    .file-tell,.file-deal {
    .file-tell,
    .file-deal {
        .tell-title {
            line-height: 40px;
        }

        .tell-show {
            display: flex;

            .upload-demo {
                height: 159px;

                .my-demo {
                    position: relative;
                    height: 100%;
                }

                .tip {
                    div {
                        line-height: 20px;
                    }

                    text-align: left;
                    position: absolute;
                    bottom: 80px;
                }
            }
        }
    }

    .my-demo {
        position: relative;
        height: 159px;
    }

    .tip {
        div {
            line-height: 20px;
        }

        text-align: left;
        position: absolute;
        bottom: 0px;
    }

    .img {
        width: 226px;
        height: 159px;
    }
}
</style>

 src/components/process/index.vue

@@ -1,34 +1,34 @@
<template>
    <div class="my-process">
        <div class="my-pro-header">
            <div class="pro-step" v-for="(item,index) in list" :key="item.title">
            <div class="pro-step" v-for="(item,index) in list" :key="item.name">
                <div class="pro-step-top">
                    <div
                        :class="['circle',active === item.index ? 'in-process' : active > item.index ? 'finish' : 'wait' ]">
                        :class="['circle',active === index+1 ? 'in-process' : active > index ? 'finish' : 'wait' ]">
                    </div>
                    <div :class="['line',active > item.index ? 'finish-line' :'']"
                    <div :class="['line',active > index ? 'finish-line' :'']"
                        v-if="index<list.length-1 ? true:false"></div>
                </div>
                <div
                    :class="['pro-step-name',active === item.index ? 'in-process' : active > item.index ? 'finish' : 'wait' ]">
                    {{item.title}}</div>
                    :class="['pro-step-name',active === index+1 ? 'in-process' : active > index ? 'finish' : 'wait' ]">
                    {{item.name}}</div>
            </div>
        </div>
        <div class="my-pro-main">
            <div class="pro-step-ver" v-for="(item,index) in list" :key="item.title">
                <div
                    :class="['pro-step-name',active === item.index ? 'in-process' : active > item.index ? 'finish' : 'wait' ]">
                    {{item.title}}</div>
                    :class="['pro-step-name',active === index+1 ? 'in-process' : active > index ? 'finish' : 'wait' ]">
                    {{item.name}}</div>
                <div class="pro-step-top">
                    <div
                        :class="['circle',active === item.index ? 'in-process' : active > item.index ? 'finish' : 'wait' ]">
                        :class="['circle',active === index+1 ? 'in-process' : active > index ? 'finish' : 'wait' ]">
                    </div>
                    <div :class="['line',active > item.index ? 'finish-line' :'']"
                    <div :class="['line',active > index ? 'finish-line' :'']"
                        v-if="index<list.length-1 ? true:false"></div>
                </div>
                <div class="desc">
                    <div class="desc-title">环节用时:</div>
                    <div class="desc-content" v-if="active > index+1">
                    <div class="desc-content" v-if="active > index">
                        <div class="desc-content-message">1111111</div>
                        <div class="desc-content-endtime">22.09.06 16:40</div>
                    </div>
@@ -73,7 +73,10 @@
    props:['handlePassVo'],
    created(){
        console.log('process');
        console.log(this.handlePassVo);
        const {handlePassVo:{workflowConfigSteps:mylist}} = this;
        // console.log(this.handlePassVo.workflowConfigSteps[0].name); 
        console.log(mylist);
        this.list =  mylist;
    }
}
</script>
@@ -103,6 +106,8 @@
    }

    .my-pro-main {
        margin-top: 30px;
        margin-left: -50px;
        .pro-step-ver {
            display: flex;
            align-items: flex-start;
@@ -117,8 +122,10 @@
            align-items: center;
        }
        .pro-step-name {
            width: 120px;
            line-height: 24px;
            margin-right: 10px;
            text-align: right;
        }
        .desc{
            flex: 1;

 src/components/scene/index.vue

@@ -9,93 +9,93 @@
            </div>
        </div>
        <div class="scene-item" v-if="active === 1">
            <el-form label-position="right" label-width="120px" :model="sceneObj">
            <el-form ref="arrivalSituation" label-position="right" label-width="120px" :model="arrivalSituation">
                <el-form-item label="到达时间:">
                    <el-input v-model="sceneObj.name"></el-input>
                    <el-input v-model="arrivalSituation.arrivalTime"></el-input>
                </el-form-item>
                <el-form-item label="到达地址:">
                    <el-input v-model="sceneObj.region"></el-input>
                    <el-input v-model="arrivalSituation.arrivalAddress"></el-input>
                </el-form-item>
                <el-form-item label="现场情况说明:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="arrivalSituation.situationExplain"></el-input>
                </el-form-item>
                <el-form-item label="信访回复说明:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="arrivalSituation.replyExplain"></el-input>
                </el-form-item>
                <el-form-item label="现场情况照片:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="arrivalSituation.situationPic"></el-input>
                </el-form-item>
            </el-form>
        </div>
        <div class="scene-item" v-if="active === 2">
            <el-form label-position="right" label-width="120px" :model="sceneObj">
            <el-form ref="investigation" label-position="right" label-width="120px" :model="investigation">
                <el-form-item label="承办队员:">
                    <el-input v-model="sceneObj.name"></el-input>
                    <el-input v-model="investigation.name"></el-input>
                </el-form-item>
                <el-form-item label="协办队员:">
                    <el-input v-model="sceneObj.region"></el-input>
                    <el-input v-model="investigation.region"></el-input>
                </el-form-item>
                <el-form-item label="时间:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="地址:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="案由:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="当事人信息:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="情况描述:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="照片附件:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="类型:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="当事人姓名:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="手机号码:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="证件类型:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="证件号码:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="文化程度:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="职业:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="工作单位及职务:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="名族:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="籍贯:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="现住址:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
                <el-form-item label="户籍所在地:">
                    <el-input v-model="sceneObj.type"></el-input>
                    <el-input v-model="investigation.type"></el-input>
                </el-form-item>
            </el-form>
            <el-button>返回</el-button>
        </div>
        <div class="scene-item" v-if="active === 3">
            <el-form label-position="right" label-width="120px" :model="sceneObj">
            <el-form ref="writ" label-position="right" label-width="120px" :model="writ">
                <el-form-item label="类型:">
                    <el-input v-model="sceneObj.name"></el-input>
                    <el-input v-model="writ.name"></el-input>
                </el-form-item>
            </el-form>
        </div>
@@ -120,10 +120,17 @@
                    label: '告知违法'
                }
            ],
            sceneObj: {},
            arrivalSituation: {},
            investigation:{},
            writ:{}

        }
    },
    props:['currentSitVo'],
    created(){
        const {currentSitVo:{arrivalSituation:mylist}} = this;
        this.arrivalSituation = mylist;
    },
    methods: {
        changeActive(idx) {
            this.active = idx;

 src/components/solveProblem/index.vue

@@ -1,19 +1,19 @@
<template>
    <div class="sovle-problem">
        <div class="sovle-header">
            <div class="sovle-limit">处理时限:1工作日</div>
            <div class="sovle-limit">处理时限:{{}}</div>
            <div class="sovle-limit">剩余时间:23小时</div>
        </div>
        <div class="sovle-timeline">
            <el-timeline>
                <el-timeline-item :color="mycolor">
                <el-timeline-item :color="mycolor" v-for="item in list" :key="item.id">
                    <div class="title">
                        <div class="title-left">【派遣】派遣员:xxx</div>
                        <div class="title-right">22.09.06 16:40</div>
                        <div class="title-left">【{{item.name}}】{{item.name === '派遣' ? '派遣员':item.name === '处理' ? '处理人':'评定人'}}:{{item.disposeRecord.handleId}}</div>
                        <div class="title-right">{{item.disposeRecord.endTime}}</div>
                    </div>
                    <div class="message">【派遣意见】请相关执法队员及时前往现场进行处置</div>
                </el-timeline-item>
                <el-timeline-item :color="mycolor">
                    <div class="message">【{{item.name === '派遣' ? '派遣意见':item.name === '处理' ? '处理结果':'评定结果'}}】请相关执法队员及时前往现场进行处置</div>
                </el-timeline-item> 
                <!-- <el-timeline-item :color="mycolor">
                    <div class="title">
                        <div class="title-left">【处理】处理人:xxx</div>
                        <div class="title-right">22.09.06 16:40</div>
@@ -26,7 +26,7 @@
                        <div class="title-right">22.09.06 16:40</div>
                    </div>
                    <div class="message">【评定结果】请相关执法队员及时前往现场进行处置</div>
                </el-timeline-item>
                </el-timeline-item> -->
            </el-timeline>
        </div>
    </div>
@@ -35,9 +35,16 @@
    export default{
        data(){
            return{
                mycolor:'#02a7f0'
                mycolor:'#02a7f0',
                list:[]
            }
        }
        },
        props:['problemProVo'],
        created(){
            const {problemProVo:{workflowConfigSteps:mylist}} = this;
            console.log(mylist);
            this.list = mylist;
        }   
    }
</script>
<style lang="scss" scoped>

 src/main.js

@@ -22,6 +22,7 @@
      next();
    } else {
      router.push("/login");
      next();
    }
  } else {
    next();

 src/views/operate/baseSetting/illegalBuild/createUser/index.vue

@@ -2,10 +2,13 @@
    <div class="createUser">
        <main>
            <div class="mainContent">
                <el-form ref="user" label-width="140px" autoComplete="on" :model="things" label-position="right">
                <el-form ref="user" :rules="createIll" label-width="140px" autoComplete="on" :model="things" label-position="right">
                    <!-- 违规事项编号 -->
                    <el-form-item class="optionItem" label="违规事项编号:" prop="number">
                    <!-- <el-form-item class="optionItem" label="违规事项编号:" prop="number">
                        <el-input v-model="things.number" placeholder="请填写违规事项编号"></el-input>
                    </el-form-item> -->
                    <el-form-item class="optionItem" label="新增名称:" prop="name">
                        <el-input v-model="things.name" placeholder="请输入新增名称"></el-input>
                    </el-form-item>
                    <!-- 所属类型 -->
                    <el-form-item class="optionItems" label="所属类型:" prop="typeThird">
@@ -23,22 +26,22 @@
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 所属小类 -->
                    <el-form-item class="optionItem" label="所属小类:" prop="typeFirst">
                        <el-select v-model="things.typeFirst" placeholder="请选择所属类型" disabled>
                            <el-option v-for="item in typeFirstList" :key="item.id" :label="item.name"
                    <!-- 请输入新增等级 -->
                    <el-form-item class="optionItem" label="案件等级:" prop="level">
                        <el-select v-model="things.level" placeholder="请选择所属类型" >
                            <el-option v-for="item in eventLevelList" :key="item.id" :label="item.name"
                                :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 案由 -->
                    <el-form-item class="optionItem" label="案由:" prop="type">
                        <el-input type="textarea" autosize v-model="things.type" placeholder="请输入案由描述内容"
                            :disabled="!updateFlag" disabled></el-input>
                        <el-input type="textarea" autosize v-model="things.type" placeholder="请输入案由描述内容"></el-input>
                    </el-form-item>
                    <el-form-item v-if="updateFlag">
                    <el-form-item>
                        <div class="optionBtn">
                            <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">确认
                            <!-- @click.native.prevent="handleSubmit" -->
                            <el-button type="primary" class="btn submit" >确认
                            </el-button>
                        </div>
                    </el-form-item>
@@ -51,54 +54,58 @@
<script>
export default {
    data() {
        const checkName = (rule,value,callback)=>{
            if(value){
                callback();
            }else{
                callback(new Error('新增违建类名不能为空'));
            }
        }
        const checkLevel = (rule,value,callback)=>{
            if(value){
                callback();
            }else{
                callback(new Error('新增违建等级不能为空'));
            }
        }
        return {
            things: {
                number: 0,
                type: '',
                name:'',
                typeFirst: '',
                typeSecond: '',
                typeThird: '',
                level:'',
            },
            roleList: [],
            typeThirdList:[],
            typeSecondList:[],
            typeFirstList:[],
            eventLevelList:[],
            createIll:{
                name:[
                    { required:true,trigger:'blur',validator:checkName }
                ],
                level:[
                    {
                        required:true,trigger:'change',validator:checkLevel
                    }
                ]
            }
        }
    },
    created() {
        console.log(this.userInfo);
        this.things = JSON.parse(JSON.stringify(this.userInfo));
        // 获取所属类型列表
        this.getTypeThird();
        this.getTypeSecond();
        this.getTypeFirst();
        this.getEventLevel();
    },
    methods: {
        // handleUser() {
        //     this.$refs.user.validate((valid) => {
        //         if (valid) {
        //             const { role } = this;
        //             console.log(role);
        //             this.$axios.post('/sccg/role/update/' + role.id, {
        //                 id: role.id,
        //                 status: role.status,
        //                 description: role.description,
        //                 name: role.name,
        //                 sort: 0
        //             }).then(res => {
        //                 this.$emit('changeDialog', { dialogUpdate: false });
        //                 this.getUserList();
        //             })
        //         } else {
        //             return false;
        //         }
        //     })
        // },
        // 查询所属类型
        getTypeThird() {
            this.$axios({
                method: 'get',
                url: "sccg/violations/query/type_first",
                url: "sccg/illegal_building/query/type_first",
            })
                .then(res => {
                    this.typeThirdList = res.data;
@@ -108,22 +115,23 @@
        getTypeSecond(){
            this.$axios({
                method: 'get',
                url: "sccg/violations/query/type_second",
                url: "sccg/illegal_building/query/type_second",
            })
                .then(res => {
                    this.typeSecondList = res.data;
                })
        },
        // 查询所属小类
        getTypeFirst(){
        // 获取案件等级列表
        getEventLevel() {
            this.$axios({
                method: 'get',
                url: "sccg/violations/query/type_third",
                url: 'sccg/violations/query/event_type'
            })
                .then(res => {
                    this.typeFirstList = res.data;
                    console.log(res);
                    this.eventLevelList = res.data;
                })
        }
        },
    },
    props: ['getUserList']
}

 src/views/operate/baseSetting/illegalBuild/index.vue

@@ -13,11 +13,11 @@
                    </div>
                </div>
                <div class="addUser">
                    <el-button class="addBtn" type="primary" @click="dialogCreate = true">新建角色</el-button>
                    <!-- <el-dialog :visible.sync="dialogCreate" title="新增角色" width="45%" v-if="dialogCreate"
                    <el-button class="addBtn" type="primary" @click="dialogCreate = true">新增违建</el-button>
                    <el-dialog :visible.sync="dialogCreate" title="新增违建" width="45%" v-if="dialogCreate"
                        :before-close="handleClose">
                        <createUser :refresh="getUserList" />
                    </el-dialog> -->
                    </el-dialog>
                </div>
            </div>
        </header>

 src/views/operate/baseSetting/violation/createUser/index.vue

@@ -2,10 +2,14 @@
    <div class="createUser">
        <main>
            <div class="mainContent">
                <el-form ref="user" label-width="140px" autoComplete="on" :model="things" label-position="right">
                <el-form ref="user" :rules="createThings" label-width="140px" autoComplete="on" :model="things" label-position="right">
                    <!-- 违规事项编号 -->
                    <el-form-item class="optionItem" label="违规事项编号:" prop="number">
                    <!-- <el-form-item class="optionItem" label="违规事项编号:" prop="number">
                        <el-input v-model="things.number" placeholder="请填写违规事项编号"></el-input>
                    </el-form-item>  -->
                    <!-- 新增的类型或大类或小类 -->
                    <el-form-item class="optionItem" label="新增名称:" prop="name">
                        <el-input v-model="things.name" placeholder="请输入新增名称"></el-input>
                    </el-form-item>
                    <!-- 所属类型 -->
                    <el-form-item class="optionItems" label="所属类型:" prop="typeThird">
@@ -23,27 +27,33 @@
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 请输入新增等级 -->
                    <el-form-item class="optionItem" label="案件等级:" prop="level">
                        <el-select v-model="things.level" placeholder="请选择所属类型" >
                            <el-option v-for="item in eventLevelList" :key="item.id" :label="item.name"
                                :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 所属小类 -->
                    <el-form-item class="optionItem" label="所属小类:" prop="typeFirst">
                    <!-- <el-form-item class="optionItem" label="所属小类:" prop="typeFirst">
                        <el-select v-model="things.typeFirst" placeholder="请选择所属类型" disabled>
                            <el-option v-for="item in typeFirstList" :key="item.id" :label="item.name"
                                :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    </el-form-item> -->
                    <!-- 案由 -->
                    <el-form-item class="optionItem" label="案由:" prop="type">
                        <el-input type="textarea" autosize v-model="things.type" placeholder="请输入案由描述内容"
                            :disabled="!updateFlag" disabled></el-input>
                        <el-input type="textarea" autosize v-model="things.type" placeholder="请输入案由描述内容"></el-input>
                    </el-form-item>
                    <el-form-item v-if="updateFlag">
                    <el-form-item>
                        <div class="optionBtn">
                            <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">确认
                            <el-button type="primary" class="btn submit" @click.native.prevent="handleSubmit">确认
                            </el-button>
                        </div>
                    </el-form-item>
                </el-form>

            </div>
        </main>
    </div>
@@ -51,49 +61,57 @@
<script>
export default {
    data() {
        const checkName = (rule,value,callback)=>{
            if(value){
                callback();
            }else{
                callback(new Error('新增违规类型不能为空'));
            }
        }
        const checkLevel = (rule,value,callback)=>{
            if(value){
                callback();
            }else{
                callback(new Error('新增违规等级不能为空'));
            }
        }
        return {
            things: {
                number: 0,
                type: '',
                // number: 0,
                // type: '',
                name:'',
                typeFirst: '',
                typeSecond: '',
                typeThird: '',
                level:'',
            },
            createThings:{
                name:[
                    {
                        required:true,trigger:'blur',validator:checkName
                    }
                ],
                level:[
                    {
                        required:true,trigger:'change',validator:checkLevel
                    }
                ]
            },
            roleList: [],
            typeThirdList:[],
            typeSecondList:[],
            typeFirstList:[],
            // typeFirstList:[],
            eventLevelList:[]
        }
    },
    created() {
        console.log(this.userInfo);
        this.things = JSON.parse(JSON.stringify(this.userInfo));
        // 获取所属类型列表
        this.getTypeThird();
        this.getTypeSecond();
        this.getTypeFirst();
        // this.getTypeFirst();
        this.getEventLevel();
    },
    methods: {
        // handleUser() {
        //     this.$refs.user.validate((valid) => {
        //         if (valid) {
        //             const { role } = this;
        //             console.log(role);
        //             this.$axios.post('/sccg/role/update/' + role.id, {
        //                 id: role.id,
        //                 status: role.status,
        //                 description: role.description,
        //                 name: role.name,
        //                 sort: 0
        //             }).then(res => {
        //                 this.$emit('changeDialog', { dialogUpdate: false });
        //                 this.getUserList();
        //             })
        //         } else {
        //             return false;
        //         }
        //     })
        // },
        // 查询所属类型
        getTypeThird() {
            this.$axios({
@@ -115,14 +133,29 @@
                })
        },
        // 查询所属小类
        getTypeFirst(){
        // getTypeFirst(){
        //     this.$axios({
        //         method: 'get',
        //         url: "sccg/violations/query/type_third",
        //     })
        //         .then(res => {
        //             this.typeFirstList = res.data;
        //         })
        // },
        // 获取案件等级列表
        getEventLevel() {
            this.$axios({
                method: 'get',
                url: "sccg/violations/query/type_third",
                url: 'sccg/violations/query/event_type'
            })
                .then(res => {
                    this.typeFirstList = res.data;
                    console.log(res);
                    this.eventLevelList = res.data;
                })
        },
        // 提交新增违规类型
        handleSubmit(){
            console.log(this.things);
        }
    },
    props: ['getUserList']
@@ -181,6 +214,7 @@
    &::v-deep .el-textarea__inner {
        background-color: #09152f;
        border: 1px solid #17324c;
        font-size: 10px;
    }

    ::v-deep .el-form-item__label {
@@ -190,6 +224,7 @@
    ::v-deep .el-input__inner {
        background-color: #09152f;
        border: 1px solid #17324c;
        font-size: 10px;
    }
}
</style>

 src/views/operate/baseSetting/violation/index.vue

@@ -13,11 +13,11 @@
                    </div>
                </div>
                <div class="addUser">
                    <el-button class="addBtn" type="primary" @click="dialogCreate = true">新建角色</el-button>
                    <!-- <el-dialog :visible.sync="dialogCreate" title="新增角色" width="45%" v-if="dialogCreate"
                    <el-button class="addBtn" type="primary" @click="dialogCreate = true">新增违规类型</el-button>
                    <el-dialog :visible.sync="dialogCreate" title="新增违规类型" width="45%" v-if="dialogCreate"
                        :before-close="handleClose">
                        <createUser :refresh="getUserList" />
                    </el-dialog> -->
                    </el-dialog>
                </div>
            </div>
        </header>

 src/views/operate/disposal/casepool/dispatch/index.vue

@@ -4,7 +4,13 @@
            <div class="headerContent">
                <div class="search">
                    <span>筛选条件:</span>
                    <el-input placeholder="请输入内容" v-model="context"></el-input>
                    <div class="option">
                        <el-select v-model="mystatus" placeholder="违规" @change="setMystatus">
                            <el-option v-for="item in typeList" :key="item.label" :label="item.name"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="findBtn">
                        <el-button type="primary" @click="getUserList">查询</el-button>
                    </div>
@@ -24,9 +30,9 @@
                    @selection-change="tableChange">
                    <el-table-column type="selection" min-width="5">
                    </el-table-column>
                    <el-table-column prop="code" label="事件编号" min-width="10">
                    <el-table-column prop="id" label="事件编号" min-width="10">
                        <template slot-scope="scope">
                            <el-link @click="JumpView(scope.row)">{{scope.row.code}}</el-link>
                            <el-link @click="JumpView(scope.row)">{{scope.row.id}}</el-link>
                        </template>
                    </el-table-column>
                    <el-table-column prop="eventSource" label="问题来源" min-width="10">
@@ -46,25 +52,30 @@
                    <el-table-column prop="continueTime" label="持续时间" min-width="10">
                    </el-table-column>
                    <el-table-column prop="operation" label="操作" min-width="20">
                        <template>
                        <template slot-scope="scope">
                            <div class="btn">
                                <span>调度</span>
                                <span class="line">|</span>
                                <span @click="opernDialog">上传处置结果</span>
                                <span @click="opernDialog(scope.row)">上传处置结果</span>
                            </div>
                        </template>
                    </el-table-column>
                </el-table>
                <!-- 查看修改页面 -->
                <el-dialog :visible.sync="dialogUpdate" width="80%" title="基础信息(人工)"
                <!-- <el-dialog :visible.sync="dialogUpdate" width="80%" title="基础信息(人工)"
                    v-if="dialogUpdate" :before-close="handleClose">
                    <updateUser :info=info />
                </el-dialog> -->
                <!-- 详情页展示 -->
                <el-dialog :visible.sync="dialogView" width="80%" title="基础信息(人工)" v-if="dialogView"
                    :before-close="handleClose">
                    <MyDetail :info=info></MyDetail>
                </el-dialog>
                <!-- 上传页面 -->
                <el-dialog :visible.sync="dialogUpload" width="45%" title="上传处置结果"
                <el-dialog :visible.sync="dialogUpload" width="60%" title="上传处置结果"
                    v-if="dialogUpload" :before-close="handleClose">
                    <!-- <uploadVio></uploadVio>违规 -->
                    <uploadIll></uploadIll>
                    <uploadVio v-if="mystatus === 0"></uploadVio>
                    <uploadIll v-else></uploadIll>
                </el-dialog>
                <!-- tools -->
                <div class="tools">
@@ -95,19 +106,22 @@
    </div>
</template>
<script>
import updateUser from "./updateUser"
// import updateUser from "./updateUser"
import uploadVio from './updateUser/uploadResult/vio'
import uploadIll from "./updateUser/uploadResult/ill"
import MyDetail from '@/components/detail'
export default {
    components: {
        updateUser,uploadVio,uploadIll
        // updateUser,
        uploadVio,uploadIll,MyDetail
    },
    data() {
        return {
            tableData: [],
            context: "",
            dialogUpload:false,
            dialogUpdate: false,
            // dialogUpdate: false,
            dialogView:false,
            info: {},
            totalNum: null,
            pageSize: 10,
@@ -115,6 +129,7 @@
            all: false,
            unsame: false,
            myIdx: 0,
            preMyIdx:0,
            options: [
                {
                    value: 0,
@@ -147,42 +162,12 @@
                    checked: false,
                },
            ],
            tagList: [
                {
                    name: '待处理',
                    value: 7,
                    checked: true
                },
                {
                    name: '已上报',
                    value: 1,
                    checked: false
                },
                {
                    name: '已调度',
                    value: 3,
                    checked: false
                },
                {
                    name: '在学习',
                    value: 4,
                    checked: false
                },
                {
                    name: '暂不处理',
                    value: 4,
                    checked: false
                },
            ],
            statusArr:[],
            mystatus:0,
        }
    },
    created() {
        this.tagList.forEach(item => {
            if (item.checked) {
                this.statusArr[0] = item.value;
            }
        })
        this.statusArr[0] = 6;
        this.typeList.forEach(item => {
            if (item.checked) {
                this.statusArr[1] = item.value;
@@ -191,6 +176,13 @@
        this.getUserList();
    },
    methods: {
        // 顶部下拉框
        setMystatus(value) {
            console.log(value);
            this.statusArr[1] = value;
            this.changeTypeChecked(value - 1);
            this.getUserList();
        },
        // 批量删除
        mulDelete(idArr){
            console.log(idArr);
@@ -206,25 +198,27 @@
            })
        },
        // 执行下拉框操作
        selectChange(val) {
            let ids = [];
            this.tempList.forEach(item => {
                ids.push(item.number);
            })
            if (ids.length !== 0) {
                if (val === 3) {
                    this.mulDelete(ids);
        selectChange(list) {
            console.log(this.tempList);
            if (this.tempList.length !== 0) {
                if (list === 3) {
                    this.preMyIdx = list;
                    this.mulDelete(this.tempList);
                }
            } else {
                this.myIdx = this.preMyIdx;
                this.$message({
                    type: 'warning',
                    message: '您还没选中任何数据',
                })
            }
        },
        // 监听表格选中状态
        // 监听表格
        tableChange(list) {
            this.tempList = list;
            this.tempList = [];
            list.forEach(item => {
                this.tempList.push(item.code);
            })
            if (list.length === this.tableData.length) {
                this.all = true;
            } else {
@@ -269,7 +263,7 @@
            console.log(statusArr);
            this.$axios({
                method: 'get',
                url: `sccg/base-case/query/${statusArr[1]}?state=${statusArr[0]}&current=${currentPage}&size=${pageSize}&resource=2`
                url: `sccg/base_case/query?state=${statusArr[0]}&current=${currentPage}&size=${pageSize}&resource=2&type=${statusArr[1]}`
            }).then(res => {
                this.totalNum = res.data.total;
                this.tableData = res.data.records;
@@ -285,6 +279,9 @@
                    item.checked = false;
                }
            })
            this.mystatus = idx + 1;
            this.statusArr[1] = this.typeList[idx].value;
            this.getUserList();
        },
        // 设置表格斑马纹
        tableRowClassName({ row, rowIndex }) {
@@ -314,27 +311,28 @@
            this.$confirm('确认关闭？')
                .then(_ => {
                    this.dialogUpload = false;
                    this.dialogUpdate = false;
                    // this.dialogUpdate = false;
                    done();
                })
                .catch(_ => { });
        },
        async JumpView(data){
            await this.getEventInfo(data.code);
            this.dialogView = true;
        },
        // 获取案件信息
        getEventInfo(code){
            this.$axios({
                method:'get',
                url:`sccg/base-case/baseCaseDetail/${code}`
                url:`sccg/base_case/baseCaseDetail/${code}`
            })
            .then(res=>{
                this.info = res.data;  
                this.dialogView = true;
            })
        },
        opernDialog(){
        opernDialog(data){
            this.dialogUpload = true;
            console.log(data); 
        }
    }
}
@@ -396,7 +394,10 @@
            }
        }
    }

    &::v-deep .el-input__inner {
        background-color: #09152f;
        border: 1px solid #17324c;
    }
    main {
        background-color: #09152f;
        margin-top: 20px;

 src/views/operate/disposal/casepool/dispatch/updateUser/filePictrue/index.vue

File was deleted

 src/views/operate/disposal/casepool/dispatch/updateUser/process/index.vue

File was deleted

 src/views/operate/disposal/casepool/dispatch/updateUser/scene/index.vue

File was deleted

 src/views/operate/disposal/casepool/dispatch/updateUser/solveProblem/index.vue

File was deleted

 src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/arrive/index.vue

New file
@@ -0,0 +1,179 @@
<template>
    <div class="arrive">
        <div class="arrive-title">到大现场情况</div>
        <div class="arrive-form">
            <el-form ref="arriveForm" label-width="160px" :model="arrive" :rules="arriveRules" autoComplete="on">
                <!-- 到达时间 -->
                <el-form-item label="到达时间:" prop="arrivalTime">
                    <el-date-picker v-model="arrive.arrivalTime" type="datetime" placeholder="选择到达时间">
                    </el-date-picker>
                </el-form-item>
                <!-- 到达地址 -->
                <el-form-item label="到达地址:" prop="arrivalAddress">
                    <el-input v-model="arrive.arrivalAddress" placeholder="请输入地址"></el-input>
                </el-form-item>
                <!-- 现场情况说明 -->
                <el-form-item label="现场情况说明:" prop="situationExplain">
                    <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4}" maxlength="200" show-word-limit
                        v-model="arrive.situationExplain" placeholder="请输入情况说明,限制200字以内"></el-input>
                </el-form-item>
                <!-- 信访回复说明 -->
                <el-form-item label="信访回复说明:" prop="replyExplain">
                    <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4}" maxlength="200" show-word-limit
                        v-model="arrive.replyExplain" placeholder="请输入回访说明,限制200字以内"></el-input>
                </el-form-item>
                <!-- 现场情况照片 -->
                <el-form-item label="现场情况照片:" prop="situationPic">
                    <div class="upImg">
                        <div class="img-list">
                            <img :src="item" alt="" v-for="(item,index) in arrive.situationPic" :key="index">
                        </div>
                        <div class="upload" v-if="arrive.situationPic.length<4">
                            <el-upload :file-list="fileList" class="upload-demo"
                                action="http://42.193.1.25:8082/sccg/file/medias" multiple :show-file-list="false"
                                :limit="4" :on-success="handleSuccess" :headers="getToken()">
                                <i class="el-icon-plus"></i>
                            </el-upload>
                        </div>
                        <div class="tip">{{arrive.situationPic.length}} / 4</div>
                    </div>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        const checkTime = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback(new Error('到达时间不能为空'));
            }
        }
        const checkAddress = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback(new Error('到达地址不能为空'));
            }
        }
        const checkSit = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback(new Error('现场情况说明不能为空'));
            }
        }
        const checkReplay = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback(new Error('信访回复说明不能为空'));
            }
        }
        const checkSitPic = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback();
            }
        }
        return {
            arrive: {
                situationPic: [],
            },
            arriveRules: {
                arrivalTime: [
                    { trigger: 'blur', validator: checkTime }
                ],
                arrivalAddress: [
                    { trigger: 'blur', validator: checkAddress }
                ],
                situationExplain: [
                    { trigger: 'blur', validator: checkSit }
                ],
                replyExplain: [
                    { trigger: 'blur', validator: checkReplay }
                ],
                situationPic: [
                    { trigger: 'change', validator: checkSitPic }
                ],
            },
            fileList: [],
        }
    },
    methods: {
        handleSuccess(res, file, filelist) {
            const baseUrl = 'http://140.143.152.226:8410/';
            console.log(res);
            if (this.arrive.situationPic.length < 4) {
                this.arrive.situationPic.push(baseUrl + res.data.url1)
            }
        },
        getToken() {
            const token = sessionStorage.getItem('token');
            const tokenHead = sessionStorage.getItem('tokenHead');
            if (token && tokenHead) {
                return { Authorization: tokenHead + token }
            }
        },
    }
}
</script>
<style lang="scss" scoped>
.arrive-title{
    line-height: 60px;
    font-weight: 650;
    font-size: 20px;
    width: 160px;
    padding-right: 12px;
    text-align: right;
    color: #4b9bb7;
}

.upImg {
    display: flex;

    .tip {
        position: absolute;
        bottom: 0;
        right: 0;
    }

    .img-list {
        height: 80px;
        position: relative;

        img {
            width: 60px;
            height: 60px;
        }
    }
}

.upload {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    background-color: #fbfdff;
    border-radius: 4px;
}

::v-deep .el-textarea__inner {
    background-color: #09152f;
    border: 1px solid #17324c;
}

::v-deep .el-input__count {
    background-color: #09152f;
}

::v-deep .el-form-item__label {
    color: #4b9bb7;
}
</style>

 src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/book/index.vue

New file
@@ -0,0 +1,96 @@
<template>
    <div class="book">
        <div class="book-title">文种书类</div>
        <div class="book-form">
            <el-form ref="bookForm" label-width="160px" :model="book" :rules="bookRules" autoComplete="on">
                <!-- 文书种类 -->
                <el-form-item label="文书种类:" prop="kind">
                    <el-input v-model="book.kind"></el-input>
                </el-form-item>
                <!-- 文书编号 -->
                <el-form-item label="文书编号:" prop="id">
                    <el-input v-model="book.id"></el-input>
                </el-form-item>
                <!-- 违法类型 -->
                <el-form-item label="违法类型:" prop="vioKind">
                    <el-input v-model="book.vioKind"></el-input>
                </el-form-item>
                <!-- 文书发放时间 -->
                <el-form-item label="文书发放时间:" prop="giveTime">
                    <el-input v-model="book.giveTime"></el-input>
                </el-form-item>
                <!-- 文书限定时间 -->
                <el-form-item label="文书限定时间" prop="limitTime">
                    <el-input v-model="book.limitTime"></el-input>
                </el-form-item>
                <!-- 文书发放内容 -->
                <el-form-item label="文书发放内容:" prop="content">
                    <el-input v-model="book.content"></el-input>
                </el-form-item>
                <!-- 实际整改时间 -->
                <el-form-item label="实际整改时间:" prop="updateTime">
                    <el-input v-model="book.updateTime"></el-input>
                </el-form-item>
                <!-- 整改情况 -->
                <el-form-item label="整改情况:" prop="condition">
                    <el-input v-model="book.condition"></el-input>
                </el-form-item>
                <!-- 备注 -->
                <el-form-item label="备注:" prop="note">
                    <el-input v-model="book.note"></el-input>
                </el-form-item>
                <!-- 文书照片上传 -->
                <el-form-item label="文书照片上传:" prop="bookPhoto">
                    <el-input v-model="book.bookPhoto"></el-input>
                </el-form-item>
                <!-- 整改前照片 -->
                <el-form-item label="整改前照片:" prop="beforeUpdate">
                    <el-input v-model="book.beforeUpdate"></el-input>
                </el-form-item>
                <!-- 整改后照片 -->
                <el-form-item label="整改后照片:" prop="afterUpdate">
                    <el-input v-model="book.afterUpdate"></el-input>
                </el-form-item>
                <!-- 其他照片 -->
                <el-form-item label="其他:" prop="other">
                    <el-input v-model="book.other"></el-input>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>
<script>
    export default{
        data(){
            return{
                book:{},
                bookRules:{

                }
            }
        }
    }
</script>
<style lang="scss" scoped>
.book-title{
    line-height: 60px;
    font-weight: 650;
    font-size: 20px;
    width: 160px;
    padding-right: 12px;
    text-align: right;
    color: #4b9bb7;
}
::v-deep .el-textarea__inner {
    background-color: #09152f;
    border: 1px solid #17324c;
}

::v-deep .el-input__count {
    background-color: #09152f;
}

::v-deep .el-form-item__label {
    color: #4b9bb7;
}
</style>

 src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/evidence/index.vue

New file
@@ -0,0 +1,276 @@
<template>
    <div class="evidence">
        <div class="evidence-title">调查取证</div>
        <div class="evidence-form">
            <el-form ref="evidenceForm" label-width="160px" :model="evidence" :rules="evidenceRules" autoComplete="on">
                <!-- 承办队员 -->
                <el-form-item label="承办队员:" prop="undertaker">
                    <el-input v-model="evidence.undertaker" placeholder="请输入姓名"></el-input>
                </el-form-item>
                <!-- 协办队员 -->
                <el-form-item label="协办队员:" prop="assistant">
                    <el-input v-model="evidence.assistant" placeholder="请输入姓名"></el-input>
                </el-form-item>
                <!-- 时间 -->
                <el-form-item label="时间:" prop="investigationTime">
                    <el-date-picker v-model="evidence.investigationTime" type="datetime" placeholder="选择时间">
                    </el-date-picker>
                </el-form-item>
                <!-- 地址 -->
                <el-form-item label="地址:" prop="address">
                    <el-input v-model="evidence.address" placeholder="请输入地址"></el-input>
                </el-form-item>
                <!-- 案由 -->
                <el-form-item label="案由:" prop="caseAction">
                    <el-input v-model="evidence.caseAction" placeholder="请输入案由"></el-input>
                </el-form-item>
                <!-- 当事人信息 -->
                <el-form-item label="当事人信息">
                    <el-input suffix-icon="el-icon-s-order" @focus="openDialog"></el-input>
                </el-form-item>
                <!-- 情况描述 -->
                <el-form-item label="情况描述:" prop="description">
                    <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4}" maxlength="200" show-word-limit
                        v-model="evidence.description" placeholder="请输入情况描述,限制200字以内"></el-input>
                </el-form-item>
                <!-- 照片附件 -->
                <el-form-item label="照片附件:" prop="photo">
                    <div class="upImg">
                        <div class="img-list">
                            <img :src="item" alt="" v-for="(item,index) in evidence.pic" :key="index">
                        </div>
                        <div class="upload" v-if="evidence.pic.length<4">
                            <el-upload :file-list="fileList" class="upload-demo"
                                action="http://42.193.1.25:8082/sccg/file/medias" multiple :show-file-list="false"
                                :limit="4" :on-success="handleSuccess2" :headers="getToken()">
                                <i class="el-icon-plus"></i>
                            </el-upload>
                        </div>
                        <div class="tip">{{evidence.pic.length}} / 4</div>
                    </div>
                </el-form-item>
            </el-form>
        </div>
        <div class="user-form">
            <el-dialog :visible.sync="dialogUser" width="80%" title="调度信息" v-if="dialogUser" :before-close="handleClose"
                append-to-body>
                11111
            </el-dialog>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        const checkName = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback(new Error('承办队员名字不能为空'));
            }
        }
        const checkName2 = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback(new Error('协办队员名字不能为空'));
            }
        }
        const checkTime2 = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback(new Error('此处时间不能为空'));
            }
        }
        const checkAddress2 = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback(new Error('此处地址不能为空'));
            }
        }
        const checkCase = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback(new Error('案由不能空'));
            }
        }
        const checkDesc = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback(new Error('情况描述不能为空'));
            }
        }
        const checkPic = (rule, value, callback) => {
            if (value) {
                callback()
            } else {
                callback();
            }
        }
        return {
            evidence: {
                pic: []
            },
            evidenceRules: {
                undertaker: [
                    {
                        trigger: 'blur', validator: checkName
                    }
                ],
                assistant: [
                    {
                        trigger: 'blur', validator: checkName2
                    }
                ],
                investigationTime: [
                    {
                        trigger: 'change', validator: checkTime2
                    }
                ],
                address: [
                    {
                        trigger: 'blur', validator: checkAddress2
                    }
                ],
                caseAction: [
                    {
                        trigger: 'blur', validator: checkCase
                    }
                ],
                description: [
                    {
                        trigger: 'blur', validator: checkDesc
                    }
                ],
                pic: [
                    {
                        trigger: 'blur', validator: checkPic
                    }
                ],
            },
            fileList: [],
            user: {},
            dialogUser: false,
        }
    },
    methods: {
        handleSuccess2(res, file, filelist) {
            const baseUrl = 'http://140.143.152.226:8410/';
            console.log(res);
            if (this.evidence.pic.length < 4) {
                this.evidence.pic.push(baseUrl + res.data.url1)
            }
        },
        getToken() {
            const token = sessionStorage.getItem('token');
            const tokenHead = sessionStorage.getItem('tokenHead');
            if (token && tokenHead) {
                return { Authorization: tokenHead + token }
            }
        },
        // 打开当事人信息填写表
        openDialog(e) {
            this.dialogUser = true
        },
        // 关闭当事人信息
        handleClose(done) {
            this.$confirm('确认关闭？')
                .then(_ => {
                    this.dialogUser = false;
                    done();
                })
                .catch(_ => { });
        },
    }
}
</script>
<style lang="scss" scoped>
.evidence {
    line-height: 60px;

    .evidence-title {
        line-height: 60px;
        font-weight: 650;
        font-size: 20px;
        width: 160px;
        padding-right: 12px;
        text-align: right;
        color: #4b9bb7;
    }
}

.upImg {
    display: flex;

    .tip {
        position: absolute;
        bottom: 0;
        right: 0;
    }

    .img-list {
        height: 80px;
        position: relative;

        img {
            width: 60px;
            height: 60px;
        }
    }
}

.upload {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    background-color: #fbfdff;
    border-radius: 4px;
}

::v-deep .el-textarea__inner {
    background-color: #09152f;
    border: 1px solid #17324c;
}

::v-deep .el-input__count {
    background-color: #09152f;
}

::v-deep .el-form-item__label {
    color: #4b9bb7;
}

::v-deep .el-dialog__header,
::v-deep .el-dialog__body {
    background-color: #06122c;
}

::v-deep .el-dialog__header {
    display: flex;
    align-items: center;
    background-color: #fff;
    padding: 20px;
    line-height: 60px;
}

::v-deep .el-dialog__title {
    color: #4b9bb7;
}

::v-deep .el-dialog__close {
    width: 20px;
    height: 20px;
    // color: #fff;
}

::v-deep .el-dialog__body {
    padding: 0;
}
</style>

 src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/ill/index.vue

@@ -1,200 +1,44 @@
<template>
    <div class="vio">
        <div class="arrive">
            <div class="arrive-title">到大现场情况</div>
            <div class="arrive-form">
                <el-form ref="arriveForm" label-width="160px" :model="arrive" :rules="arriveRules" autoComplete="on">
                    <!-- 到达时间 -->
                    <el-form-item label="到达时间" prop="arriveTime">
                        <el-input v-model="arrive.arriveTime"></el-input>
                    </el-form-item>
                    <!-- 到达地址 -->
                    <el-form-item label="到达地址" prop="arriveAddr">
                        <el-input v-model="arrive.arriveAddr"></el-input>
                    </el-form-item>
                    <!-- 现场情况说明 -->
                    <el-form-item label="现场情况说明" prop="arriveCondition">
                        <el-input type="textarea" v-model="arrive.arriveCondition"></el-input>
                    </el-form-item>
                    <!-- 信访回复说明 -->
                    <el-form-item label="信访回复说明" prop="arriveLetter">
                        <el-input v-model="arrive.arriveLetter"></el-input>
                    </el-form-item>
                    <!-- 现场情况照片 -->
                    <el-form-item label="现场情况照片" prop="arrivePhoto">
                        <el-input v-model="arrive.arrivePhoto"></el-input>
                    </el-form-item>
                </el-form>
            </div>
        </div>
        <div class="evidence">
            <div class="evidence-title">调查取证</div>
            <div class="evidence-form">
                <el-form ref="evidenceForm" label-width="160px" :model="evidence" :rules="evidenceRules"
                    autoComplete="on">
                    <!-- 文书种类 -->
                    <el-form-item label="文书种类" prop="team">
                        <el-input v-model="evidence.team"></el-input>
                    </el-form-item>
                    <!-- 协办队员 -->
                    <el-form-item label="协办队员" prop="helper">
                        <el-input v-model="evidence.helper"></el-input>
                    </el-form-item>
                    <!-- 时间 -->
                    <el-form-item label="时间" prop="time">
                        <el-input v-model="evidence.time"></el-input>
                    </el-form-item>
                    <!-- 地址 -->
                    <el-form-item label="地址" prop="address">
                        <el-input v-model="evidence.address"></el-input>
                    </el-form-item>
                    <!-- 案由 -->
                    <el-form-item label="案由" prop="cause">
                        <el-input v-model="evidence.cause"></el-input>
                    </el-form-item>
                    <!-- 文书种类 -->
                    <el-form-item label="文书种类" prop="team">
                        <el-input v-model="evidence.team"></el-input>
                    </el-form-item>
                    <!-- 当事人信息 -->
                    <el-form-item label="当事人信息" prop="appender">
                        <el-input v-model="evidence.appender"></el-input>
                    </el-form-item>
                    <!-- 情况描述 -->
                    <el-form-item label="情况描述" prop="description">
                        <el-input v-model="evidence.description"></el-input>
                    </el-form-item>
                    <!-- 照片附件 -->
                    <el-form-item label="照片附件" prop="photo">
                        <el-input v-model="evidence.photo"></el-input>
                    </el-form-item>
                </el-form>
            </div>
        </div>
        <div class="book">
            <div class="book-title">文种书类</div>
            <div class="book-form">
                <el-form ref="bookForm" label-width="160px" :model="book" :rules="bookRules"
                    autoComplete="on">
                    <!-- 文书种类 -->
                    <el-form-item label="文书种类" prop="kind">
                        <el-input v-model="book.kind"></el-input>
                    </el-form-item>
                    <!-- 文书编号 -->
                    <el-form-item label="文书编号" prop="id">
                        <el-input v-model="book.id"></el-input>
                    </el-form-item>
                    <!-- 违法类型 -->
                    <el-form-item label="违法类型" prop="vioKind">
                        <el-input v-model="book.vioKind"></el-input>
                    </el-form-item>
                    <!-- 文书发放时间 -->
                    <el-form-item label="文书发放时间" prop="giveTime">
                        <el-input v-model="book.giveTime"></el-input>
                    </el-form-item>
                    <!-- 文书限定时间 -->
                    <el-form-item label="文书限定时间" prop="limitTime">
                        <el-input v-model="book.limitTime"></el-input>
                    </el-form-item>
                    <!-- 文书发放内容 -->
                    <el-form-item label="文书发放内容" prop="content">
                        <el-input v-model="book.content"></el-input>
                    </el-form-item>
                    <!-- 实际整改时间 -->
                    <el-form-item label="实际整改时间" prop="updateTime">
                        <el-input v-model="book.updateTime"></el-input>
                    </el-form-item>
                    <!-- 整改情况 -->
                    <el-form-item label="整改情况" prop="condition">
                        <el-input v-model="book.condition"></el-input>
                    </el-form-item>
                    <!-- 备注 -->
                    <el-form-item label="备注" prop="note">
                        <el-input v-model="book.note"></el-input>
                    </el-form-item>
                    <!-- 文书照片上传 -->
                    <el-form-item label="文书照片上传" prop="bookPhoto">
                        <el-input v-model="book.bookPhoto"></el-input>
                    </el-form-item>
                    <!-- 整改前照片 -->
                    <el-form-item label="整改前照片" prop="beforeUpdate">
                        <el-input v-model="book.beforeUpdate"></el-input>
                    </el-form-item>
                    <!-- 整改后照片 -->
                    <el-form-item label="整改后照片" prop="afterUpdate">
                        <el-input v-model="book.afterUpdate"></el-input>
                    </el-form-item>
                    <!-- 其他照片 -->
                    <el-form-item label="其他" prop="other">
                        <el-input v-model="book.other"></el-input>
                    </el-form-item>
                </el-form>
            </div>
        </div>
    <div class="ill">
        <!-- 到达现场情况 -->
        <MyArrive></MyArrive>
        <!-- 调查取证 -->
        <MyEvidence></MyEvidence>
        <!-- 文种书类 -->
        <MyBook></MyBook>
        <!-- 底部按钮 -->
        <div class="footer">
            <el-button>确定</el-button>
            <el-button @click="handleSubmit" type="primary">确定</el-button>
            <el-button>返回</el-button>
        </div>
    </div>
</template>
<script>
import MyArrive from '../components/arrive'
import MyEvidence from "../components/evidence"
import MyBook from "../components/book"
export default {
    components:{
        MyArrive,MyEvidence,MyBook
    },
    data() {
        return {
            arrive: {

            },
            arriveRules: {
        }
    },
    methods:{
        handleSubmit(){

            },
            evidence: {

            },
            evidenceRules: {

            },
            book:{

            },
            bookRules:{
                
            }
        }
    }
}
</script>
<style lang="scss" scoped>
.vio {
    padding: 50px 100px;

    .arrive-title,
    .evidence-title {
        line-height: 40px;
        font-weight: 650;
        font-size: 20px;
        width: 160px;
        padding-right: 12px;
        text-align: right;
        color: #4b9bb7;
    .ill{
        padding: 20px 200px;
    }

    .footer {
.footer {
        display: flex;
        justify-content: flex-end;
    }

    ::v-deep .el-input__inner {
        background-color: #09152f;
        border: 1px solid #17324c;
    }

    ::v-deep .el-textarea__inner {
        background-color: #09152f;
        border: 1px solid #17324c;
    }

    ::v-deep .el-form-item__label {
        color: #4b9bb7;
    }
}
</style>

 src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/vio/index.vue

@@ -1,127 +1,63 @@
<template>
    <div class="vio">
        <div class="arrive">
            <div class="arrive-title">到大现场情况</div>
            <div class="arrive-form">
                <el-form ref="arriveForm" label-width="160px" :model="arrive" :rules="arriveRules" autoComplete="on">
                    <!-- 到达时间 -->
                    <el-form-item label="到达时间" prop="arriveTime">
                        <el-input v-model="arrive.arriveTime"></el-input>
                    </el-form-item>
                    <!-- 到达地址 -->
                    <el-form-item label="到达地址" prop="arriveAddr">
                        <el-input v-model="arrive.arriveAddr"></el-input>
                    </el-form-item>
                    <!-- 现场情况说明 -->
                    <el-form-item label="现场情况说明" prop="arriveCondition">
                        <el-input type="textarea" v-model="arrive.arriveCondition"></el-input>
                    </el-form-item>
                    <!-- 信访回复说明 -->
                    <el-form-item label="信访回复说明" prop="arriveLetter">
                        <el-input v-model="arrive.arriveLetter"></el-input>
                    </el-form-item>
                    <!-- 现场情况照片 -->
                    <el-form-item label="现场情况照片" prop="arrivePhoto">
                        <el-input v-model="arrive.arrivePhoto"></el-input>
                    </el-form-item>
                </el-form>
            </div>
        </div>
        <div class="evidence">
            <div class="evidence-title">调查取证</div>
            <div class="evidence-form">
                <el-form ref="evidenceForm" label-width="160px" :model="evidence" :rules="evidenceRules" autoComplete="on">
                    <!-- 承办队员 -->
                    <el-form-item label="承办队员" prop="team">
                        <el-input v-model="evidence.team"></el-input>
                    </el-form-item>
                    <!-- 协办队员 -->
                    <el-form-item label="协办队员" prop="helper">
                        <el-input v-model="evidence.helper"></el-input>
                    </el-form-item>
                    <!-- 时间 -->
                    <el-form-item label="时间" prop="time">
                        <el-input v-model="evidence.time"></el-input>
                    </el-form-item>
                    <!-- 地址 -->
                    <el-form-item label="地址" prop="address">
                        <el-input v-model="evidence.address"></el-input>
                    </el-form-item>
                    <!-- 案由 -->
                    <el-form-item label="案由" prop="cause">
                        <el-input v-model="evidence.cause"></el-input>
                    </el-form-item>
                    <!-- 承办队员 -->
                    <el-form-item label="承办队员" prop="team">
                        <el-input v-model="evidence.team"></el-input>
                    </el-form-item>
                    <!-- 当事人信息 -->
                    <el-form-item label="当事人信息" prop="appender">
                        <el-input v-model="evidence.appender"></el-input>
                    </el-form-item>
                    <!-- 情况描述 -->
                    <el-form-item label="情况描述" prop="description">
                        <el-input v-model="evidence.description"></el-input>
                    </el-form-item>
                    <!-- 照片附件 -->
                    <el-form-item label="照片附件" prop="photo">
                        <el-input v-model="evidence.photo"></el-input>
                    </el-form-item>
                </el-form>
            </div>
        </div>
        <!-- 到达现场情况 -->
        <MyArrive ref="arrive"></MyArrive>
        <!-- 调查取证 -->
        <MyEvidence ref="evidence"></MyEvidence>
        <!-- 底部按钮 -->
        <div class="footer">
            <el-button>确定</el-button>
            <el-button @click="handleSubmit" type="primary">确定</el-button>
            <el-button>返回</el-button>
        </div>
    </div>
</template>
<script>
import MyArrive from '../components/arrive'
import MyEvidence from "../components/evidence"
export default {
    components:{
        MyArrive,MyEvidence
    },
    data() {
        return {
            arrive:{

            },
            arriveRules:{

            },
            evidence:{

            },
            evidenceRules:{

            }
        }
    },
    methods:{
        handleSubmit(){
            const {arrive,evidence} = this.$refs;
            const {arriveForm} = arrive.$refs;
            const {evidenceForm} = evidence.$refs;
            console.log(evidenceForm);
            arriveForm.validate((valid)=>{
                console.log(valid);
                if(valid){
                    evidenceForm.validate((flag)=>{
                        if(flag){
                            console.log(flag);
                        }else{
                            return false;
                        }
                    })
                }else{
                    evidenceForm.validate((flag)=>{
                        if(!flag){
                            return false;
                        }
                    })
                    return false;
                }
            })
        }
    }
}
</script>
<style lang="scss" scoped>
.vio{
    padding: 50px 100px;
    .arrive-title,.evidence-title{
        line-height: 40px;
        font-weight: 650;
        font-size: 20px;
        width: 160px;
        padding-right: 12px;
        text-align: right;
        color: #4b9bb7;
    .vio{
        padding: 20px 200px;
    }
    .footer{
.footer {
        display: flex;
        justify-content: flex-end;
    }
    ::v-deep .el-input__inner{
        background-color: #09152f;
        border: 1px solid #17324c;
    }
    ::v-deep .el-textarea__inner{
        background-color: #09152f;
        border: 1px solid #17324c;
    }
    ::v-deep .el-form-item__label{
        color:#4b9bb7;
    }
}
</style>

 src/views/operate/disposal/casepool/escalation/createUser/ill/index.vue

New file
@@ -0,0 +1,493 @@
<template>
    <div class="ill">
        <div class="input-area">
            <div class="input-header">
                <div class="input-header__title">基础信息</div>
                <div class="input-header__tip">填写事件基础信息</div>
            </div>
            <div class="input-form">
                <el-form ref="user" label-width="160px" autoComplete="on" :model="ill" :rules="createillRules"
                    label-position="right">
                    <!-- 问题类型
                    <el-form-item class="optionItem" label="问题类型:" prop="category">
                        <el-select v-model="ill.type" placeholder="违建">
                            <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value"
                                :disabled="item.disabled">
                            </el-option>
                        </el-select>
                    </el-form-item> -->
                    <!-- 违建类别 -->
                    <el-form-item class="optionItems" label="违建类别:" prop="categoryId">
                        <el-select v-model="ill.categoryId" placeholder="请选择违建类别" size="small">
                            <el-option v-for="item in bigKindList" :key="item.id" :label="item.name" :value="item.id"
                                :disabled="item.disabled">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 当事人姓名 -->
                    <el-form-item class="optionItems" label="当事人姓名:" prop="partyName">
                        <el-input placeholder="请填写当事人姓名" v-model="ill.partyName"></el-input>
                    </el-form-item>
                    <!-- 当事人身份证号 -->
                    <el-form-item class="optionItems" label="当事人身份证号:" prop="partyIdCard">
                        <el-input placeholder="请填写当事人身份证号" v-model="ill.partyIdCard"></el-input>
                    </el-form-item>
                    <!-- 当事人联系电话 -->
                    <el-form-item class="optionItem" label="当事人联系电话:" prop="partyPhone">
                        <el-input v-model="ill.partyPhone" placeholder="请填写当事人联系电话"></el-input>
                    </el-form-item>
                    <!-- 违建地点 -->
                    <el-form-item class="optionItems" label="违建地点:" prop="site">
                        <el-input placeholder="请填写违建地点" v-model="ill.site"></el-input>
                    </el-form-item>
                    <!-- 所属社区 -->
                    <el-form-item class="optionItems" label="所属社区:" prop="communityId">
                        <el-select v-model="ill.communityId" placeholder="请选择所属社区">
                            <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 身份证正反面照片 -->
                    <el-form-item class="optionItems" label="身份证正反面照片:" prop="positive">
                        <template>
                            <div class="idcard">
                                <el-upload class="upload-demo" :show-file-list="false"
                                    action="http://42.193.1.25:8082/sccg/file/medias" :headers="getToken()" multiple
                                    :limit="50" :on-success="handleSuccess">
                                    <img v-if="ill.positive === ''"
                                        src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__15f765432d579a14b8f6591c100d30e3.svg"
                                        alt="">
                                    <span class="text" v-if="ill.positive === ''">身份证正面</span>
                                    <img :src="ill.positive" alt="" class="img" v-else>
                                </el-upload>
                                <el-upload class="upload-demo" :show-file-list="false"
                                    action="http://42.193.1.25:8082/sccg/file/medias" :headers="getToken()" multiple
                                    :limit="50" :on-success="handleSuccess2">
                                    <img v-if="ill.negative === '' "
                                        src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__15f765432d579a14b8f6591c100d30e3.svg"
                                        alt="">
                                    <span class="text" v-if="ill.negative === ''">身份证反面</span>
                                    <img :src="ill.negative" alt="" class="img" v-else />
                                </el-upload>
                            </div>
                        </template>
                    </el-form-item>
                    <!-- 报警时间 -->
                    <el-form-item class="optionItems" label="报警时间:" prop="alarmTime">
                        <el-date-picker v-model="ill.alarmTime" type="datetime" placeholder="选择报警时间">
                        </el-date-picker>
                    </el-form-item>
                </el-form>
            </div>
            <div class="not-need">
                <div class="not-need__header">
                    执法违建情况
                </div>
                <el-form ref="condition" label-width="160px" autoComplete="on" :model="ill" :rules="createillRules">
                    <!-- 违建具体位置 -->
                    <el-form-item class="optionItems" label="违建具体位置:" prop="position">
                        <el-input placeholder="请填写违建具体位置" v-model="ill.position"></el-input>
                    </el-form-item>
                    <el-form-item class="optionItems" label="违法建设长、宽、高:" prop="buildingLength">
                        <div class="area">
                            <el-input placeholder="单位米" v-model="ill.buildingLength"></el-input>
                            <el-input placeholder="单位米" v-model="ill.buildingWidth"></el-input>
                            <el-input placeholder="单位米" v-model="ill.buildingHigh"></el-input>
                        </div>
                    </el-form-item>
                    <el-form-item class="optionItems" label="违法建设面积:" prop="buildingArea">
                        <el-input placeholder="请填写违法建设面积" v-model="ill.buildingArea"></el-input>
                    </el-form-item>
                    <el-form-item class="optionItems" label="违法建筑材料:" prop="materials">
                        <el-input placeholder="请填写违法建筑材料" v-model="ill.materials"></el-input>
                    </el-form-item>
                </el-form>
            </div>
            <div class="input-footer">
                <el-button type="primary" class="confirm" @click="handleUser">确定</el-button>
                <el-button class="back">返回</el-button>
            </div>
        </div>
        <div class="map-area">
            <!-- <MyMap /> -->
        </div>
    </div>
</template>
<script>
import MyMap from '@/components/map'
export default {
    components: {
        MyMap
    },
    data() {
        const checkArea = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('违法建设面积不能为空'))
            }
        }
        const checkHigh = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('违法建设高度不能为空'));

            }
        }
        const checkWidth = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('违法建设宽度不能为空'));

            }
        }
        const checkLength = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('违法建设长度不能为空'));

            }
        }
        const checkCategoryId = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('违建类别不能为空'));
            }
        }
        const checkCommunityId = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('所属社区不能为空'));
            }
        }
        const checkMaterials = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('违法建筑材料不能为空'));
            }
        }
        const checkIdCard = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('当事人身份证号码不能为空'));
            }
        }
        const checkName = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('当事人姓名不能为空'));
            }
        }
        const checkPhone = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('当事人联系电话不能为空'));
            }
        }
        const checkPosition = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('违法建设具体位置不能为空'));
            }
        }
        const checkPositive = (rule, value, callback) => {
            if (value) {
                if (this.ill.negative === '') {
                    callback('身份证反面不能为空');
                } else {
                    callback();
                }
            } else {
                callback(new Error('身份证正面不能为空'));

            }
        }
        const checkSite = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('违法建设地点不能为空'));
            }
        }
        const checkDate = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('报警时间不能为空'))
            }
        }
        return {
            ill: {
                buildingArea: 2.0,
                buildingHigh: 2.0,
                buildingLength: 2.0,
                buildingWidth: 1.0,
                // category: '',
                categoryId: '',
                communityId: '',
                materials: "钢筋",
                partyIdCard: "511025184612310213",
                partyName: "单数大",
                partyPhone: "17844631885",
                position: "新地方新低点",
                positive: "",
                negative: "",
                site: "新地方",
                alarmTime: '',
            },
            createillRules: {
                buildingArea: [
                    {
                        required: true, trigger: 'change', validator: checkArea
                    }
                ],
                buildingHigh: [
                    {
                        required: true, trigger: 'blur', validator: checkHigh
                    }
                ],
                buildingLength: [
                    {
                        required: true, trigger: 'blur', validator: checkLength
                    }
                ],
                buildingWidth: [
                    {
                        required: true, trigger: 'blur', validator: checkWidth
                    }
                ],
                categoryId: [
                    {
                        required: true, trigger: 'change', validator: checkCategoryId
                    }
                ],
                communityId: [
                    {
                        required: true, trigger: 'change', validator: checkCommunityId
                    }
                ],
                materials: [
                    {
                        required: true, trigger: 'blur', validator: checkMaterials
                    }
                ],
                partyIdCard: [
                    {
                        required: true, trigger: 'blur', validator: checkIdCard
                    }
                ],
                partyName: [
                    {
                        required: true, trigger: 'blur', validator: checkName
                    }
                ],
                partyPhone: [
                    {
                        required: true, trigger: 'blur', validator: checkPhone
                    }
                ],
                position: [
                    {
                        required: true, trigger: 'blur', validator: checkPosition
                    }
                ],
                positive: [
                    {
                        required: true, trigger: 'change', validator: checkPositive
                    }
                ],
                site: [
                    {
                        required: true, trigger: 'blur', validator: checkSite
                    }
                ],
                alarmTime: [
                    {
                        required: true, trigger: 'change', validator: checkDate
                    }
                ]
            },
            bigKindList: [],
            typeList: [
                {
                    name: '社区1',
                    value: 1,
                },
                {
                    name: '社区2',
                    value: 2,
                }
            ],
        }
    },
    created() {
        const { getBigKind } = this;
        // this.ill.category = this.mytype + 1;
        getBigKind();
    },
    methods: {
        handleUser() {
            const that = this;
            // console.log(this.$refs);
            this.$refs.user.validate((valid) => {
                console.log(valid)
                if (valid) {
                    that.$refs.condition.validate((flag) => {
                        console.log(flag);
                        if (flag) {
                            const { ill } = this;
                            ill.buildingLength = parseFloat(ill.buildingLength);
                            ill.buildingHigh = parseFloat(ill.buildingHigh);
                            ill.buildingWidth = parseFloat(ill.buildingWidth);
                            ill.buildingArea = parseFloat(ill.buildingArea);
                            console.log(ill);
                            that.$axios({
                                method: 'post',
                                url: 'sccg/base-case/addition_illegal_building',
                                data: ill,
                            })
                                .then(res => {
                                    if (res.code === 200) {
                                        this.$message({
                                            type: 'success',
                                            message: res.message
                                        })
                                        this.$emit('changeDialog', { dialogView: false });
                                    } else {
                                        this.$message({
                                            type: 'warning',
                                            message: res.message,
                                        })
                                    }
                                })
                        } else {
                            return false;
                        }
                    })
                } else {
                    return false;
                }
            })
        },
        handleStop() {
            this.refresh();
        },
        // 获取大类列表
        getBigKind() {
            this.$axios({
                method: 'get',
                url: 'sccg/illegal_building/query/type_second'
            }).then(res => {
                this.bigKindList = res.data;
                // console.log(res);
            })
        },
        // 获取行政区域
        // 获取token
        getToken() {
            const token = sessionStorage.getItem('token');
            const tokenHead = sessionStorage.getItem('tokenHead');
            if (token && tokenHead) {
                return { Authorization: tokenHead + token };
            }
        },
        handleSuccess(res, file, filelist) {
            const baseUrl = 'http://140.143.152.226:8410/';
            console.log(res);
            this.ill.positive = baseUrl + res.data.url1;

        },
        handleSuccess2(res, file, filelist) {
            const baseUrl = 'http://140.143.152.226:8410/';
            console.log(res);
            this.ill.negative = baseUrl + res.data.url1;
        }
    },
    props: ['mytype', 'changeDialog']
}
</script>
<style lang="scss" scoped>
.ill {
    display: flex;
    padding: 20px 50px;

    .input-area {
        flex: 1;
        padding: 10px 20px;

        .input-header {
            color: #4b9bb7;

            .input-header__title {
                line-height: 60px;
                font-weight: 650;
                font-size: 20px;
            }

            .input-header__tip {
                line-height: 40px;
            }
        }

        .input-form {

            &::v-deep .el-input__inner {
                background-color: #09152f;
                border: 1px solid #17324c;
            }

            &::v-deep .el-textarea__inner {
                background-color: #09152f;
                border: 1px solid #17324c;
            }

            .upload-demo {
                position: relative;

                .text {
                    position: absolute;
                    top: 22%;
                    left: 20%;
                }
            }

            .idcard {
                display: flex;
            }

            .idCardZ {
                width: 200px;
                height: 200px;
            }
        }

        .input-footer {
            display: flex;
            justify-content: center;
        }
    }

    .img {
        width: 125px;
        height: 80px;
    }

    .area {
        display: flex;
    }

    .map-area {
        flex: 1;
    }
}
</style>

 src/views/operate/disposal/casepool/escalation/createUser/index.vue

@@ -1,195 +1,49 @@
<template>
    <div class="createUser">
        <main>
            <div class="mainContent">
                <el-form ref="user" label-width="140px" autoComplete="on" :model="things" label-position="right">
                    <!-- 违规事项编号 -->
                    <el-form-item class="optionItem" label="违规事项编号:" prop="number">
                        <el-input v-model="things.number" placeholder="请填写违规事项编号"></el-input>
                    </el-form-item>
                    <!-- 所属类型 -->
                    <el-form-item class="optionItems" label="所属类型:" prop="typeThird">
                        <el-select v-model="things.typeThird" placeholder="请选择所属类型" >
                            <el-option v-for="item in typeThirdList" :key="item.id" :label="item.name"
                                :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 所属大类 -->
                    <el-form-item class="optionItem" label="所属大类:" prop="typeSecond">
                        <el-select v-model="things.typeSecond" placeholder="请选择所属类型" >
                            <el-option v-for="item in typeSecondList" :key="item.id" :label="item.name"
                                :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 所属小类 -->
                    <el-form-item class="optionItem" label="所属小类:" prop="typeFirst">
                        <el-select v-model="things.typeFirst" placeholder="请选择所属类型" disabled>
                            <el-option v-for="item in typeFirstList" :key="item.id" :label="item.name"
                                :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 案由 -->
                    <el-form-item class="optionItem" label="案由:" prop="type">
                        <el-input type="textarea" autosize v-model="things.type" placeholder="请输入案由描述内容"
                            :disabled="!updateFlag" disabled></el-input>
                    </el-form-item>
                    <el-form-item v-if="updateFlag">
                        <div class="optionBtn">
                            <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">确认
                            </el-button>
                        </div>
                    </el-form-item>
                </el-form>

            </div>
        </main>
        <div class="chooseArea">
            <el-button type="primary" @click="toShow(0,'违规')">违规登记</el-button>
            <el-button type="primary" @click="toShow(1,'违建')">违建登记</el-button>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        return {
            things: {
                number: 0,
                type: '',
                typeFirst: '',
                typeSecond: '',
                typeThird: '',
            },
            roleList: [],
            typeThirdList:[],
            typeSecondList:[],
            typeFirstList:[],
        }
    },
    created() {
        console.log(this.userInfo);
        this.things = JSON.parse(JSON.stringify(this.userInfo));
        // 获取所属类型列表
        this.getTypeThird();
        this.getTypeSecond();
        this.getTypeFirst();

    },
    methods: {
        // handleUser() {
        //     this.$refs.user.validate((valid) => {
        //         if (valid) {
        //             const { role } = this;
        //             console.log(role);
        //             this.$axios.post('/sccg/role/update/' + role.id, {
        //                 id: role.id,
        //                 status: role.status,
        //                 description: role.description,
        //                 name: role.name,
        //                 sort: 0
        //             }).then(res => {
        //                 this.$emit('changeDialog', { dialogUpdate: false });
        //                 this.getUserList();
        //             })
        //         } else {
        //             return false;
        //         }
        //     })
        // },
        // 查询所属类型
        getTypeThird() {
            this.$axios({
                method: 'get',
                url: "sccg/violations/query/type_first",
            })
                .then(res => {
                    this.typeThirdList = res.data;
        toShow(idx, lab) {
            this.$confirm('您确定要去上报' + lab + '事件')
                .then(_ => {
                    this.$emit('getPageProp',{flag:false,type:idx});
                })
        },
        // 查询所属大类
        getTypeSecond(){
            this.$axios({
                method: 'get',
                url: "sccg/violations/query/type_second",
            })
                .then(res => {
                    this.typeSecondList = res.data;
                })
        },
        // 查询所属小类
        getTypeFirst(){
            this.$axios({
                method: 'get',
                url: "sccg/violations/query/type_third",
            })
                .then(res => {
                    this.typeFirstList = res.data;
                })
                .catch(_ => { console.log('err') });
        }
    },
    props: ['getUserList']
    props:['getPageProp']
}
</script>
<style lang="scss" scoped>
.createUser {
    border-radius: 1px;
    background-color: #09152f;
.chooseArea {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 50px;
    padding-bottom: 80px;

    main {
        // border: 1px solid #fff;
        text-align: left;
        padding: 0 55px;
        background-color: #09152f;
        padding-bottom: 50px;

        .mainContent {
            display: flex;
            justify-content: center;
            padding-top: 50px;

            .el-form-item__content {
                width: 400px;

                .el-select {
                    width: 100%;
                }
            }

            .optionHandleSp {
                display: flex;

                .areaNumber,
                .moreNumber {
                    flex: 1;
                }

                .telNumber {
                    flex: 2;
                }
            }

            .optionBtn {
                display: flex;
                margin-top: 20px;

                .btn {
                    padding: 12px 50px;
                }
            }

        }
    .el-button {
        width: 120px;
        line-height: 40px;
        padding: 0;
        margin-top: 20px;
    }

    &::v-deep .el-textarea__inner {
        background-color: #09152f;
        border: 1px solid #17324c;
    }

    ::v-deep .el-form-item__label {
        color: #4b9bb7;
    }

    ::v-deep .el-input__inner {
        background-color: #09152f;
        border: 1px solid #17324c;
    .el-button+.el-button {
        margin-left: 0;
    }
}
</style>

 src/views/operate/disposal/casepool/escalation/createUser/vio/index.vue

New file
@@ -0,0 +1,472 @@
<template>
    <div class="vio">
        <div class="input-area">
            <div class="input-header">
                <div class="input-header__title">基础信息</div>
                <div class="input-header__tip">填写事件基础信息</div>
            </div>
            <div class="input-form">
                <el-form ref="user" label-width="100px" autoComplete="on" :model="vio" :rules="createRoleRules"
                    label-position="right">
                    <!-- 问题类型 -->
                    <!-- <el-form-item class="optionItem" label="问题类型:" prop="category">
                        <el-select v-model="vio.category" placeholder="违规" disabled>
                            <el-option v-for="item in typeList" :key="item.label" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item> -->
                    <!-- 大类名称 -->
                    <el-form-item class="optionItems" label="大类名称:" prop="categoryId">
                        <el-select v-model="vio.categoryId" placeholder="请选择大类名称">
                            <el-option v-for="item in bigKindList" :key="item.id" :label="item.name" :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 小类名称 -->
                    <el-form-item class="optionItems" label="小类名称:" prop="typeId">
                        <el-select v-model="vio.typeId" placeholder="请选择小类名称">
                            <el-option v-for="item in smallKindList" :key="item.id" :label="item.name" :value="item.id"
                                :disabled="item.disabled">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 事件等级 -->
                    <el-form-item class="optionItems" label="事件等级:" prop="gradeId">
                        <el-select v-model="vio.gradeId" placeholder="请选择案件等级">
                            <el-option v-for="item in eventLevelList" :key="item.id" :label="item.name" :value="item.id"
                                :disabled="item.disabled">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 案由 -->
                    <el-form-item class="optionItem" label="案由:" prop="actionCause">
                        <el-input v-model="vio.actionCause" placeholder="请输入案由"></el-input>
                    </el-form-item>
                    <!-- 所属区县 -->
                    <!-- <el-form-item class="optionItems" label="所属区县:" prop="status">
                        <el-select v-model="vio.type" placeholder="请选择所属区县">
                            <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value"
                                :disabled="item.disabled">
                            </el-option>
                        </el-select>
                    </el-form-item> -->
                    <!-- 所属社区 -->
                    <el-form-item class="optionItems" label="所属社区:" prop="communityId">
                        <el-select v-model="vio.communityId" placeholder="请选择所属社区">
                            <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value"
                                :disabled="item.disabled">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 所属街道 -->
                    <el-form-item class="optionItems" label="所属街道:" prop="streetId">
                        <el-select v-model="vio.streetId" placeholder="请选择所属街道">
                            <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value"
                                :disabled="item.disabled">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 事发地点 -->
                    <el-form-item class="optionItems" label="事发地点:" prop="site">
                        <el-input placeholder="请输入事发地详细位置" v-model="vio.site"></el-input>
                    </el-form-item>
                    <!-- 是否关联商铺 -->
                    <el-form-item class="optionItems" label="是否关联商铺:" prop="linkShop">
                        <el-radio-group v-model="vio.linkShop">
                            <el-radio :label="1">是</el-radio>
                            <el-radio :label="0">否</el-radio>
                        </el-radio-group>
                    </el-form-item>
                    <!-- 关联商铺名称 -->
                    <el-form-item class="optionItems" label="关联商铺名称:" prop="shopName">
                        <el-input placeholder="请填写关联商铺名称" v-model="vio.shopName"
                            :disabled="vio.linkShop === 1 ?false : true"></el-input>
                    </el-form-item>
                    <!-- 填写车牌号 -->
                    <el-form-item class="optionItems" label="填写车牌号:" prop="carNumber">
                        <el-input placeholder="请填写车牌号" v-model="vio.carNumber"></el-input>
                    </el-form-item>
                    <!-- 问题描述 -->
                    <el-form-item class="optionItems" label="问题描述:" prop="description">
                        <el-input type="textarea" placeholder="请输入内容200字以内" v-model="vio.description"></el-input>
                    </el-form-item>
                    <!-- 报警时间 -->
                    <el-form-item class="optionItems" label="报警时间:" prop="alarmTime">
                        <el-date-picker v-model="vio.alarmTime" type="datetime" placeholder="选择报警时间">
                        </el-date-picker>
                    </el-form-item>
                </el-form>
            </div>
            <div class="not-need">
                <div class="not-need__header">
                    填写反映人信息
                </div>
                <div class="not-need-item">
                    <label>反映人:</label>
                    <input type="text" class="not-need__inner">
                </div>
                <div class="not-need-item">
                    <label>联系方式:</label>
                    <input type="text" class="not-need__inner">
                </div>
                <div class="not-need-item">
                    <label>身份证号:</label>
                    <input type="text" class="not-need__inner">
                </div>
            </div>
            <div class="input-footer">
                <el-button type="primary" class="confirm" @click="handleSubmit">确定</el-button>
                <el-button class="back">返回</el-button>
            </div>
        </div>
        <div class="map-area">
            <MyMap />
        </div>
    </div>
</template>
<script>
import MyMap from '@/components/map'
export default {
    components: {
        MyMap
    },
    data() {
        const checkCause = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('案由不能为空'))
            }
        }
        const checkCategory = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('大类名称不能为空'))
            }
        }
        const checkCommunity = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('所属社区不能为空'));
            }
        }
        const checkDesc = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('问题描述不能为空'))
            }
        }
        const checkSite = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('事发地点不能为空'))
            }
        }
        const checkStreet = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('所属街道不能为空'))
            }
        }
        const checkType = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('小类不能为空'))
            }
        }
        const checkGrade = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('事件等级不能为空'))
            }
        }
        const checkDate = (rule, value, callback) => {
            if (value) {
                callback();
            } else {
                callback(new Error('报警时间不能为空'))
            }
        }
        return {
            vio: {
                actionCause: "",//案由
                carNumber: "",//车牌号
                // category:1,//1:违规2:违建
                categoryId: '',//大类
                communityId: '',//所属社区
                description: '',//问题描述
                informant: '',//反映人
                informantIdCard: '',//身份证号码
                informantPhoneCode: "",//反映人联系方式
                linkShop: 0,//是否关联商铺(0否1是)
                shopName: "",//关联商铺名称
                site: '',//事发地点
                streetId: '',//所属街道
                typeId: '',//小类
                gradeId: '',//案件等级
                alarmTime: ''
            },
            createRoleRules: {
                //案由
                actionCause: [
                    {
                        required: true, trigger: 'blur', validator: checkCause,
                    }
                ],
                //车牌号
                carNumber: [
                    {
                        required: false,
                    }
                ],
                //大类
                categoryId: [
                    {
                        required: true, trigger: 'change', validator: checkCategory
                    }
                ],
                //所属社区
                communityId: [
                    {
                        required: true, trigger: 'change', validator: checkCommunity
                    }
                ],
                //问题描述
                description: [
                    {
                        required: true, trigger: 'blur', validator: checkDesc
                    }
                ],
                // informant:"大苏打",//反映人
                // informantIdCard:"51102519910082831",//身份证号码
                // informantPhoneCode:"17844631885",//反映人联系方式
                // linkShop:0,//是否关联商铺(0否1是)
                // shopName:"",//关联商铺名称
                //事发地点
                site: [
                    {
                        required: true, trigger: 'blur', validator: checkSite
                    }
                ],
                //所属街道
                streetId: [
                    {
                        required: true, trigger: 'change', validator: checkStreet
                    }
                ],
                //小类
                typeId: [
                    {
                        required: true, trigger: 'change', validator: checkType
                    }
                ],
                //案件等级
                gradeId: [
                    {
                        required: true, trigger: 'change', validator: checkGrade
                    }
                ],
                alarmTime: [
                    {
                        required: true, trigger: 'change', validator: checkDate
                    }
                ]

            },
            bigKindList: [],
            smallKindList: [],
            eventLevelList: [],
            typeList: [
                {
                    label: '违规',
                    value: 1.
                },
                {
                    label: '违建',
                    value: 2.
                }
            ]

        }
    },
    created() {
        const { getBigKind, getEventLevel, getSmallKind } = this;
        console.log(this.mytype);
        this.vio.category = this.mytype + 1;
        getBigKind();
        getSmallKind();
        getEventLevel();
    },
    methods: {
        handleStop() {
            this.refresh();
        },
        // 获取大类列表
        getBigKind() {
            this.$axios({
                method: 'get',
                url: 'sccg/violations/query/type_first'
            }).then(res => {
                this.bigKindList = res.data;
                // console.log(res);
            })
        },
        // 获取小类列表
        getSmallKind() {
            this.$axios({
                method: 'get',
                url: 'sccg/violations/query/type_second'
            })
                .then(res => {
                    console.log(res);
                    this.smallKindList = res.data;
                })
        },
        // 获取案件等级列表
        getEventLevel() {
            this.$axios({
                method: 'get',
                url: 'sccg/violations/query/event_type'
            })
                .then(res => {
                    console.log(res);
                    this.eventLevelList = res.data;
                })
        },
        // 获取行政区域
        getRegion() {
            this.$axios({
                method: 'get',
                url: 'sccg/sccg-region/getTree',
            })
                .then(res => {
                    // this.
                })
        },
        // 提交注册信息
        handleSubmit() {
            this.$refs.user.validate((valid) => {
                if (valid) {
                    const { vio } = this;
                    console.log(vio);
                    this.$axios({
                        method: 'post',
                        url: 'sccg/base-case/addition_violation',
                        data: vio
                    })
                        .then(res => {
                            if (res.code === 200) {
                                this.$message({
                                    type: 'success',
                                    message: res.message
                                })
                                this.$emit('changeDialog', { dialogView: false });
                            } else {
                                this.$message({
                                    type: 'warning',
                                    message: res.message,
                                })
                            }
                        })
                } else {
                    return false;
                }
            })
        }
    },
    props: ['mytype', 'changeDialog']
}
</script>
<style lang="scss" scoped>
.vio {
    display: flex;
    padding: 20px 10px 50px;

    .input-area {
        flex: 1;
        padding: 10px 20px;

        .input-header {
            color: #4b9bb7;

            .input-header__title {
                line-height: 60px;
                font-weight: 650;
                font-size: 20px;
            }

            .input-header__tip {
                line-height: 40px;
            }
        }

        .input-form {
            .el-form {
                &::v-deep .el-form-item__label {
                    color: #4b9bb7;
                }

                &::v-deep .el-input__inner {
                    background-color: #09152f;
                    border: 1px solid #17324c;
                }

                &::v-deep .el-textarea__inner {
                    background-color: #09152f;
                    border: 1px solid #17324c;
                }
            }
        }

        .input-footer {
            display: flex;
            justify-content: center;
        }
    }

    .map-area {
        flex: 1;
    }

    .not-need {
        color: #4b9bb7;

        .not-need__header {
            line-height: 40px;
        }

        .not-need-item {
            line-height: 40px;
            margin-bottom: 22px;
            display: flex;

            label {
                width: 100px;
                padding-right: 12px;
                text-align: right;
            }

            .not-need__inner {
                flex: 1;
                line-height: 40px;
                padding: 0 15px;
                border-radius: 4px;
                color: #fff;
                // outline: #409eff solid 1px;
                outline: none;
                background-color: #09152f;
                border: 1px solid #17324c;
            }
        }
    }

}
</style>

 src/views/operate/disposal/casepool/escalation/index.vue

@@ -3,20 +3,43 @@
        <header>
            <div class="headerContent">
                <div class="search">
                    <span>筛选条件:</span>
                    <el-input placeholder="请输入内容" v-model="context"></el-input>
                    <span>来源查询:</span>
                    <div class="option">
                        <el-select v-model="mystatus" placeholder="违规" @change="setMystatus">
                            <el-option v-for="item in typeList" :key="item.label" :label="item.name"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="findBtn">
                        <el-button type="primary" @click="getUserList">查询</el-button>
                    </div>
                </div>
                <!-- <div class="addUser">
                    <el-button class="addBtn" type="primary" @click="dialogCreate = true">添加</el-button>
                    <el-dialog :before-close="handleClose" :visible.sync="dialogCreate" title="请选择上报事件类型" width="45%"
                        v-if="dialogCreate">
                        <createUser @getPageProp=setDialog />
                    </el-dialog>
                    <el-dialog :before-close="handleClose" :visible.sync="dialogNewAdd"
                        :title="newAddType === 0 ? '违规事件登记' : '违建事件登记' " width="60%" v-if="dialogNewAdd">
                        <MyIll v-if="newAddType === 1" :mytype=newAddType @changeDialog=changeDialog />
                        <myVio v-else :mytype=newAddType @changeDialog=changeDialog />
                    </el-dialog>
                </div> -->
            </div>
        </header>
        <main>
            <div class="mainContent">
                <!-- 导航状态标签 -->
                <!-- <div class="nav">
                    <div @click="changeNavChecked(index)" :class="[item.checked ? 'is-active':'','nav-item']"
                        v-for="(item,index) in tagList" :key="item.name">{{item.name}}</div>
                </div>
                <div class="type-nav">
                    <div @click="changeTypeChecked(index)" v-for="(item,index) in typeList" :key="item.name"
                        :class="[item.checked ? 'is-active':'','type-item']">{{item.name}}</div>
                </div>
                </div> -->
                <!-- 数据展示 -->
                <el-table ref="multipleTable"
                    :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}"
@@ -24,34 +47,45 @@
                    @selection-change="tableChange">
                    <el-table-column type="selection" min-width="5">
                    </el-table-column>
                    <el-table-column prop="number" label="事件编号" min-width="10">
                    <el-table-column prop="code" label="事件编号" min-width="10">
                        <template slot-scope="scope">
                            <el-link @click="JumpView(scope.row)">{{scope.row.number}}</el-link>
                            <el-link @click="JumpView(scope.row)">{{scope.row.code}}</el-link>
                        </template>
                    </el-table-column>
                    <el-table-column prop="typeThird" label="事件来源" min-width="10">
                    <el-table-column prop="eventSource" label="事件来源" min-width="10">
                    </el-table-column>
                    <el-table-column prop="typeSecond" label="大类名称" min-width="10">
                    <el-table-column prop="category" label="大类名称" min-width="10">
                    </el-table-column>
                    <el-table-column prop="typeFirst" label="小类名称" min-width="10">
                    <el-table-column prop="type" label="小类名称" min-width="10">
                    </el-table-column>
                    <el-table-column prop="type" label="案由" min-width="10">
                    <el-table-column prop="actionCause" label="案由" min-width="10">
                    </el-table-column>
                    <el-table-column prop="type" label="报警点位" min-width="10">
                    <el-table-column prop="site" label="报警点位" min-width="10">
                    </el-table-column>
                    <el-table-column prop="type" label="所属区域" min-width="10">
                    <el-table-column prop="streetId" label="所属区域" min-width="10">
                    </el-table-column>
                    <el-table-column prop="type" label="报警时间" min-width="10">
                    <el-table-column prop="alarmTime" label="报警时间" min-width="10">
                    </el-table-column>
                    <el-table-column prop="type" label="持续时间" min-width="10">
                    <el-table-column prop="continueTime" label="持续时间" min-width="10">
                    </el-table-column>
                    <el-table-column prop="operation" label="操作" min-width="5">
                    <el-table-column prop="operation" label="操作" min-width="20">
                        <template slot-scope="scope">
                            <!-- <div class="operation">
                                <span @click="handleFind(scope.row)">上报</span>
                                <span class="line">|</span>
                                <span @click="handleDelete(scope.row)">调度</span>
                                <span class="line">|</span>
                                <span @click="handleDelete(scope.row)">在学习</span>
                                <span class="line">|</span>
                                <span @click="handleDelete(scope.row)">暂不处理</span>
                            </div> -->
                        </template>
                    </el-table-column>
                </el-table>
                <!-- 查看修改页面 -->
                <el-dialog :visible.sync="dialogUpdate" width="80%" title="基础信息(人工)"
                    v-if="dialogUpdate" :before-close="handleClose">
                    <updateUser :info=info />
                <!-- 详情页展示 -->
                <el-dialog :visible.sync="dialogView" width="80%" title="基础信息(人工)" v-if="dialogView"
                    :before-close="handleClose">
                    <MyDetail :info=info></MyDetail>
                </el-dialog>
                <!-- tools -->
                <div class="tools">
@@ -82,23 +116,43 @@
    </div>
</template>
<script>
import updateUser from "@/components/detail"
// import updateUser from "./updateUser"
import MyDetail from '@/components/detail'
// import createUser from "./createUser"
// import MyIll from './createUser/ill'
// import MyVio from './createUser/vio'
export default {
    components: {
        updateUser
        MyDetail
    },
    data() {
        return {
            tableData: [],
            tableData: [
                // {
                //     code:1,
                //     eventSource:1,
                //     category:1,
                //     type:1,
                //     actionCause:'案由1111',
                //     site:'你好',
                //     streetId:1,
                //     alarmTime:'2022-21-20',
                //     continueTime:'8小时',
                // }
            ],
            context: "",
            dialogUpdate: false,
            info: {},
            dialogCreate: false,
            dialogView: false,
            dialogNewAdd: false,
            newAddType: 0,
            totalNum: null,
            pageSize: 10,
            currentPage: 1,
            all: false,
            unsame: false,
            myIdx: 0,
            preMyIdx: 0,
            info: {},
            options: [
                {
                    value: 0,
@@ -119,6 +173,33 @@
                }
            ],
            tempList: [],
            tagList: [
                {
                    name: '待处理',
                    value: 7,
                    checked: true
                },
                {
                    name: '已上报',
                    value: 1,
                    checked: false
                },
                {
                    name: '已调度',
                    value: 3,
                    checked: false
                },
                {
                    name: '在学习',
                    value: 4,
                    checked: false
                },
                {
                    name: '暂不处理',
                    value: 4,
                    checked: false
                },
            ],
            typeList: [
                {
                    name: '违规',
@@ -131,46 +212,84 @@
                    checked: false,
                },
            ],
            mystatus: '',
            statusArr: [],

        }
    },
    created() {
        this.tagList.forEach(item => {
            if (item.checked) {
                this.statusArr[0] = item.value;
            }
        })
        this.typeList.forEach(item => {
            if (item.checked) {
                this.statusArr[1] = item.value;
            }
        })
        this.getUserList();
    },
    methods: {
        setMystatus(value) {
            console.log(value);
            this.statusArr[1] = value;
            this.changeTypeChecked(value - 1);
            this.getUserList();
        },
        setDialog({ flag, type }) {
            this.dialogCreate = flag;
            this.dialogNewAdd = true;
            this.newAddType = type;
        },
        // 批量删除
        mulDelete(idArr){
            console.log(idArr);
            this.$axios({
                method:'delete',
                url:'sccg/violations/batch_delete?ids='+idArr,
            }).then(res=>{
                this.getUserList();
                this.$message({
                    message:res.message,
                    type:res.code === 200 ? 'success' : 'warning'
        mulDelete(idArr) {
            console.log(idArr instanceof Array);
            const { statusArr } = this;
            this.$confirm('您确定要批量删除案件吗?')
                .then(_ => {
                    this.$axios({
                        method: 'delete',
                        url: 'sccg/base_case/batch_deletion?ids=' + idArr + '&type=' + statusArr[1],
                    }).then(res => {
                        if (res.code === 200) {
                            this.getUserList();
                            this.$message({
                                message: '批量删除案件成功',
                                type:'success'
                            })
                        }else{
                            this.$message({
                                message: res.data,
                                type:'warning'
                            })
                        }
                    })
                })
            })
                .catch(err => { console.log(err) })
        },
        // 执行下拉框操作
        selectChange(val) {
            let ids = [];
            this.tempList.forEach(item => {
                ids.push(item.number);
            })
            if (ids.length !== 0) {
                if (val === 3) {
                    this.mulDelete(ids);
        selectChange(list) {
            console.log(this.tempList);
            if (this.tempList.length !== 0) {
                if (list === 3) {
                    this.preMyIdx = list;
                    this.mulDelete(this.tempList);
                }
            } else {
                this.myIdx = this.preMyIdx;
                this.$message({
                    type: 'warning',
                    message: '您还没选中任何数据',
                })
            }
        },
        // 监听表格选中状态
        // 监听表格
        tableChange(list) {
            this.tempList = list;
            this.tempList = [];
            list.forEach(item => {
                this.tempList.push(item.code);
            })
            if (list.length === this.tableData.length) {
                this.all = true;
            } else {
@@ -187,49 +306,17 @@
                this.$refs.multipleTable.toggleRowSelection(row)
            })
        },
        // 删除单条数据
        handleDelete({ number }) {
            console.log(number);
            this.$confirm('确认删除？')
                .then(_ => {
                    console.log(1);
                    this.$axios({
                        method: 'delete',
                        url: `sccg/violations/delete?id=${number}`,
                    })
                        .then(res => {
                            console.log(res);
                            this.$message({
                                type: res.code === 200 ? 'success' : 'warning',
                                message: res.message
                            })

                            this.getUserList();
                        })
                })
                .catch(_ => { console.log(2) });
        },
        // 获取用户列表
        getUserList() {
            const { currentPage, pageSize, context } = this;
            // 获取所有用户信息
            const { currentPage, pageSize, context, statusArr } = this;
            console.log(statusArr);
            this.$axios({
                method: 'get',
                url: `sccg/violations/query?current=${currentPage}&size=${pageSize}&keyWord=${context}`,
            })
                .then(res => {
                    this.tableData = res.data.records;
                    this.totalNum = res.data.total;
                })
        },
        // 更改违规/违建
        changeTypeChecked(idx) {
            this.typeList.forEach((item, index) => {
                if (index === idx) {
                    item.checked = true;
                } else {
                    item.checked = false;
                }
                url: `sccg/base_case/query?state=${statusArr[0]}&current=${currentPage}&size=${pageSize}&resource=2&type=${statusArr[1]}`
            }).then(res => {
                this.totalNum = res.data.total;
                this.tableData = res.data.records;
                console.log(res);
            })
        },
        // 设置表格斑马纹
@@ -240,6 +327,12 @@
                return 'success-row';
            }
            return '';
        },
        // 查看用户信息(不可修改)
        handleFind(rowData) {
            this.dialogView = true;
            this.updateFlag = false;
            this.userInfo = rowData;
        },
        // 当前页改变触发事件
        changeCurrentPage(page) {
@@ -256,18 +349,63 @@
            this.currentPage = page;
            this.getUserList();
        },
        changeDialog(val) {
            this.dialogNewAdd = val.dialogView;
            this.dialogCreate = val.dialogView;
            this.dialogView = val.dialogView;
            this.getUserList();
        },
        handleClose(done) {
            this.$confirm('确认关闭？')
                .then(_ => {
                    this.dialogUpdate = false;
                    this.dialogCreate = false;
                    this.dialogView = false;
                    done();
                })
                .catch(_ => { });
        },
        JumpView(data){
            this.info = data;
            this.dialogUpdate = true;
            console.log(data);
        // 更改一级标签的选中
        changeNavChecked(idx) {
            this.tagList.forEach((item, index) => {
                if (index === idx) {
                    item.checked = true;
                } else {
                    item.checked = false;
                }
            })
            this.typeList[0].checked = true;
            this.typeList[1].checked = false;
            this.statusArr[0] = this.tagList[idx].value;
            this.statusArr[1] = 1;
            this.getUserList();
        },
        // 更改违规/违建
        changeTypeChecked(idx) {
            this.typeList.forEach((item, index) => {
                if (index === idx) {
                    item.checked = true;
                } else {
                    item.checked = false;
                }
            })
            this.mystatus = idx + 1;
            this.statusArr[1] = this.typeList[idx].value;
            this.getUserList();
        },
        async JumpView(data) {
            await this.getEventInfo(data.code);
        },
        // 获取案件信息
        getEventInfo(code) {
            console.log('获取具体案件信息',code);
            this.$axios({
                method: 'get',
                url: `sccg/base_case/baseCaseDetail/${code}`
            })
                .then(res => {
                    this.info = res.data;
                    this.dialogView = true;
                })
        }
    }
}
@@ -277,6 +415,7 @@
    text-align: left;
    margin: 10px 20px;
    color: #4b9bb7;

    header {
        background-color: #09152f;
        border: 1pox solid #fff;
@@ -296,13 +435,23 @@
                    flex: 1;
                }

                .el-input {
                    flex: 2;
                    color: #1d3f57;
                .option {
                    line-height: 100px;
                    display: flex;
                    align-items: center;

                    &::v-deep .el-input__inner {
                        background-color: #09152f;
                        border: 1px solid #17324c;
                    // ::v-deep .el-select {
                    //     background-color: #09152f;
                    //     border: 1px solid #17324c;
                    // }

                    .el-select {
                        line-height: 40px;

                        .el-input {
                            flex: 2;
                            color: #1d3f57;
                        }
                    }
                }

@@ -330,18 +479,47 @@
        }
    }

    &::v-deep .el-input__inner {
        background-color: #09152f;
        border: 1px solid #17324c;
    }

    main {
        background-color: #09152f;
        margin-top: 20px;
        padding-bottom: 50px;
        border: 1pox solid #fff;

        .mainTitle {
            line-height: 60px;
        }

        padding: 10px;

        .nav {
            display: flex;
            line-height: 40px;

            .nav-item {
                width: 80px;
                text-align: center;

                &:hover {
                    cursor: pointer;
                }
            }

            .is-active {
                background-color: #070f22;
                color: #fff;
            }
        }

        .type-nav {
            display: flex;
            line-height: 40px;
            margin-left: 30px;
            padding-top: 10px;
            margin-bottom: 10px;
            margin-top: 2px;

            .type-item {
                width: 80px;
@@ -428,6 +606,7 @@
        .el-table {
            color: #4b9bb7;
            font-size: 10px;
            margin-top: 10px;

            &::v-deep .cell {
                text-overflow: ellipsis;
@@ -462,35 +641,6 @@

        .el-table::v-deep .success-row {
            background: #071f39;
        }

        &::v-deep .switchStyle .el-switch__label {
            position: absolute;
            display: none;
            color: #fff;
        }

        &::v-deep .el-switch__core {
            background-color: rgba(166, 166, 166, 1);
        }

        &::v-deep .switchStyle .el-switch__label--left {
            z-index: 9;
            left: 20px;
        }

        &::v-deep .switchStyle .el-switch__label--right {
            z-index: 9;
            left: 4px;
        }

        &::v-deep .switchStyle .el-switch__label.is-active {
            display: block;
        }

        &::v-deep .switchStyle.el-switch .el-switch__core,
        &::v-deep .el-switch .el-switch__label {
            width: 50px !important;
        }
    }


 src/views/operate/disposal/casepool/escalation/updateUser/index.vue

 src/views/operate/disposal/casepool/pool/createUser/ill/index.vue

@@ -353,7 +353,7 @@
                            console.log(ill);
                            that.$axios({
                                method: 'post',
                                url: 'sccg/base-case/addition_illegal_building',
                                url: 'sccg/base_case/addition_illegal_building',
                                data: ill,
                            })
                                .then(res => {

 src/views/operate/disposal/casepool/pool/createUser/vio/index.vue

@@ -359,7 +359,7 @@
                    console.log(vio);
                    this.$axios({
                        method: 'post',
                        url: 'sccg/base-case/addition_violation',
                        url: 'sccg/base_case/addition_violation',
                        data: vio
                    })
                        .then(res => {

 src/views/operate/disposal/casepool/pool/index.vue

@@ -5,7 +5,7 @@
                <div class="search">
                    <span>来源查询:</span>
                    <div class="option">
                        <el-select v-model="mystatus" placeholder="违规" @change="setMystatus" >
                        <el-select v-model="mystatus" placeholder="违规" @change="setMystatus">
                            <el-option v-for="item in typeList" :key="item.label" :label="item.name"
                                :value="item.value">
                            </el-option>
@@ -17,13 +17,17 @@
                </div>
                <div class="addUser">
                    <el-button class="addBtn" type="primary" @click="dialogCreate = true">添加</el-button>
                    <!-- 选择登记类型 -->
                    <el-dialog :before-close="handleClose" :visible.sync="dialogCreate" title="请选择上报事件类型" width="45%"
                        v-if="dialogCreate">
                        <createUser @getPageProp=setDialog />
                    </el-dialog>
                    <!-- 事件登记 -->
                    <el-dialog :before-close="handleClose" :visible.sync="dialogNewAdd"
                        :title="newAddType === 0 ? '违规事件登记' : '违建事件登记' " width="60%" v-if="dialogNewAdd">
                        <!-- 违建登记 -->
                        <MyIll v-if="newAddType === 1" :mytype=newAddType @changeDialog=changeDialog />
                        <!-- 违规登记 -->
                        <myVio v-else :mytype=newAddType @changeDialog=changeDialog />
                    </el-dialog>
                </div>
@@ -47,9 +51,9 @@
                    @selection-change="tableChange">
                    <el-table-column type="selection" min-width="5">
                    </el-table-column>
                    <el-table-column prop="code" label="事件编号" min-width="10">
                    <el-table-column prop="id" label="事件编号" min-width="10">
                        <template slot-scope="scope">
                            <el-link @click="JumpView(scope.row)">{{scope.row.code}}</el-link>
                            <el-link @click="JumpView(scope.row)">{{scope.row.id}}</el-link>
                        </template>
                    </el-table-column>
                    <el-table-column prop="eventSource" label="问题来源" min-width="10">
@@ -73,7 +77,7 @@
                            <div class="operation">
                                <span @click="handleFind(scope.row)">上报</span>
                                <span class="line">|</span>
                                <span @click="handleDelete(scope.row)">调度</span>
                                <span @click="handleDispatch(scope.row)">调度</span>
                                <span class="line">|</span>
                                <span @click="handleDelete(scope.row)">在学习</span>
                                <span class="line">|</span>
@@ -85,9 +89,12 @@
                <!-- 详情页展示 -->
                <el-dialog :visible.sync="dialogView" width="80%" title="基础信息(人工)" v-if="dialogView"
                    :before-close="handleClose">
                    <!-- <updateUser :updateFlag="updateFlag" :userInfo=userInfo
                        :getUserList=" context ? getUserList : getUserList" @changeDialog="changeDialog" /> -->
                    <MyDetail :info=info></MyDetail>
                </el-dialog>
                <!-- 调度 -->
                <el-dialog :visible.sync="dialogDispatch" width="80%" title="调度信息" v-if="dialogDispatch"
                    :before-close="handleClose">
                    <MyDispatch :id="baseId" @changeDialog="changeDialog"></MyDispatch>
                </el-dialog>
                <!-- tools -->
                <div class="tools">
@@ -118,15 +125,14 @@
    </div>
</template>
<script>
// import updateUser from "./updateUser"
import MyDetail from '@/components/detail'
import createUser from "./createUser"
import MyIll from './createUser/ill'
import MyVio from './createUser/vio'
import MyDispatch from '@/components/dispatch'
export default {
    components: {
        // updateUser
        createUser, MyIll, MyVio, MyDetail
        createUser, MyIll, MyVio, MyDetail, MyDispatch
    },
    data() {
        return {
@@ -143,10 +149,10 @@
                //     continueTime:'8小时',
                // }
            ],
            context: "",
            dialogCreate: false,
            dialogView: false,
            dialogNewAdd: false,
            dialogDispatch:false,
            newAddType: 0,
            totalNum: null,
            pageSize: 10,
@@ -179,17 +185,17 @@
            tagList: [
                {
                    name: '待处理',
                    value: 7,
                    value: 0,
                    checked: true
                },
                {
                    name: '已上报',
                    value: 1,
                    value: 3,
                    checked: false
                },
                {
                    name: '已调度',
                    value: 3,
                    value: 6,
                    checked: false
                },
                {
@@ -199,7 +205,7 @@
                },
                {
                    name: '暂不处理',
                    value: 4,
                    value: 5,
                    checked: false
                },
            ],
@@ -217,6 +223,7 @@
            ],
            mystatus: '',
            statusArr: [],
            baseId:0

        }
    },
@@ -234,12 +241,19 @@
        this.getUserList();
    },
    methods: {
        setMystatus(value){
        // 调度
        handleDispatch(data) {
            this.baseId = data.id;
            this.dialogDispatch = true;
        },
        // 顶部下拉框
        setMystatus(value) {
            console.log(value);
            this.statusArr[1] = value;
            this.changeTypeChecked(value-1);
            this.changeTypeChecked(value - 1);
            this.getUserList();
        },
        // 选择违规违建
        setDialog({ flag, type }) {
            this.dialogCreate = flag;
            this.dialogNewAdd = true;
@@ -247,17 +261,29 @@
        },
        // 批量删除
        mulDelete(idArr) {
            console.log(idArr);
            // this.$axios({
            //     method: 'delete',
            //     url: 'sccg/violations/batch_delete?ids=' + idArr,
            // }).then(res => {
            //     this.getUserList();
            //     this.$message({
            //         message: res.message,
            //         type: res.code === 200 ? 'success' : 'warning'
            //     })
            // })
            console.log(idArr instanceof Array);
            const { statusArr } = this;
            this.$confirm('您确定要批量删除案件吗?')
                .then(_ => {
                    this.$axios({
                        method: 'delete',
                        url: 'sccg/base-case/batch_deletion?ids=' + idArr + '&type=' + statusArr[1],
                    }).then(res => {
                        if (res.code === 200) {
                            this.getUserList();
                            this.$message({
                                message: '批量删除案件成功',
                                type: 'success'
                            })
                        } else {
                            this.$message({
                                message: res.data,
                                type: 'warning'
                            })
                        }
                    })
                })
                .catch(err => { console.log(err) })
        },
        // 执行下拉框操作
        selectChange(list) {
@@ -279,7 +305,7 @@
        tableChange(list) {
            this.tempList = [];
            list.forEach(item => {
                this.tempList.push(item.id);
                this.tempList.push(item.code);
            })
            if (list.length === this.tableData.length) {
                this.all = true;
@@ -297,35 +323,13 @@
                this.$refs.multipleTable.toggleRowSelection(row)
            })
        },
        // 删除单条数据
        handleDelete({ number }) {
            console.log(number);
            this.$confirm('确认删除？')
                .then(_ => {
                    console.log(1);
                    // this.$axios({
                    //     method: 'delete',
                    //     url: `sccg/violations/delete?id=${number}`,
                    // })
                    //     .then(res => {
                    //         console.log(res);
                    //         this.$message({
                    //             type: res.code === 200 ? 'success' : 'warning',
                    //             message: res.message
                    //         })

                    //         this.getUserList();
                    //     })
                })
                .catch(_ => { console.log(2) });
        },
        // 获取用户列表
        getUserList() {
            const { currentPage, pageSize, context, statusArr } = this;
            const { currentPage, pageSize, statusArr } = this;
            console.log(statusArr);
            this.$axios({
                method: 'get',
                url: `sccg/base-case/query?state=${statusArr[0]}&current=${currentPage}&size=${pageSize}&resource=2&type=${statusArr[1]}`
                url: `sccg/base_case/query?state=${statusArr[0]}&current=${currentPage}&size=${pageSize}&resource=2&type=${statusArr[1]}`
            }).then(res => {
                this.totalNum = res.data.total;
                this.tableData = res.data.records;
@@ -343,9 +347,8 @@
        },
        // 查看用户信息(不可修改)
        handleFind(rowData) {
            this.dialogView = true;
            this.updateFlag = false;
            this.userInfo = rowData;
            // this.dialogView = true;
            // this.userInfo = rowData;
        },
        // 当前页改变触发事件
        changeCurrentPage(page) {
@@ -366,12 +369,15 @@
            this.dialogNewAdd = val.dialogView;
            this.dialogCreate = val.dialogView;
            this.dialogView = val.dialogView;
            this.dialogDispatch = val.dialogView;
            this.getUserList();
        },
        handleClose(done) {
            this.$confirm('确认关闭？')
                .then(_ => {
                    this.dialogCreate = false;
                    this.dialogNewAdd = false;
                    this.dialogDispatch = false;
                    this.dialogView = false;
                    done();
                })
@@ -389,7 +395,7 @@
            this.typeList[0].checked = true;
            this.typeList[1].checked = false;
            this.statusArr[0] = this.tagList[idx].value;
            this.statusArr[1] = 1; 
            this.statusArr[1] = 1;
            this.getUserList();
        },
        // 更改违规/违建
@@ -401,7 +407,7 @@
                    item.checked = false;
                }
            })
            this.mystatus = idx+1;
            this.mystatus = idx + 1;
            this.statusArr[1] = this.typeList[idx].value;
            this.getUserList();
        },
@@ -410,9 +416,10 @@
        },
        // 获取案件信息
        getEventInfo(code) {
            console.log('获取具体案件信息', code);
            this.$axios({
                method: 'get',
                url: `sccg/base-case/baseCaseDetail/${code}`
                url: `sccg/base_case/baseCaseDetail/${code}`
            })
                .then(res => {
                    this.info = res.data;

 src/views/systemSetting/baseSetting/department/createUser/index.vue

@@ -36,7 +36,7 @@
                                </div>
                                <div class="scrollWrap">
                                    <el-checkbox-group :max="3" v-model="checkedUser" @change="handleCheckedUserChange">
                                        <el-checkbox v-for="user in userList" :label="user.username" :key="user.id" :value="user.id">
                                        <el-checkbox v-for="user in userList" :label="user.id" :key="user.id">
                                            {{user.username}}
                                        </el-checkbox>
                                    </el-checkbox-group>
@@ -112,7 +112,7 @@
            userList: [],
            departList: [],
            checkedUser: [],
            openUser:false,
            openUser: false,
        }
    },
    created() {
@@ -126,26 +126,27 @@
        handleUser() {
            this.$refs.user.validate((valid) => {
                if (valid) {
                    const { depart } = this;
                    const { depart, checkedUser } = this;
                    console.log(depart);
                    // this.$axios.post('/sccg/depart/create', {
                    //     departName: depart.departName,
                    //     parentId: depart.parentId, departType: depart.departType, departDes: depart.departDes
                    // }).then(res => {
                    //     if (res.code === 200) {
                    //         this.$message({
                    //             message:res.message,
                    //             type:'success'
                    //         })
                    //         this.refresh();
                    //     }else if(res.code ===2001){
                    //         this.$message({
                    //             message:res.message,
                    //             type:'error'
                    //         })
                    //         this.refresh();
                    //     }
                    // })
                    console.log(checkedUser);
                    this.$axios.post('/sccg/depart/create', {
                        departName: depart.departName,
                        parentId: depart.parentId, departType: depart.departType, departDes: depart.departDes
                    }).then(res => {
                        if (res.code === 200) {
                            this.$message({
                                message:res.message,
                                type:'success'
                            })
                            this.refresh();
                        }else if(res.code ===2001){
                            this.$message({
                                message:res.message,
                                type:'error'
                            })
                            this.refresh();
                        }
                    })
                } else {
                    return false;
                }
@@ -171,23 +172,24 @@
                if (res.code === 200) {
                    console.log(res)
                    this.userList = res.data.records;
                    console.log(this.userList);
                }
            })
        },
        handleCheckedUserChange(value) {
            // console.log(value);
            if(value.length>3){
            if (value.length > 3) {
                console.log(this.checkedUser);
                this.$message({
                    type:'warning',
                    message:'最多只能添加三个成员'
                    type: 'warning',
                    message: '最多只能添加三个成员'
                })
            }
            // let checkedCount = value.length;
            // this.checkAll = checkedCount === this.cities.length;
            // this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
        },
        addUser(){
        addUser() {
            console.log(this.checkedUser);
            this.openUser = false;
        },
@@ -272,6 +274,7 @@
                position: absolute;
                z-index: 2000;
                right: 0;

                .box-card {
                    max-height: 200px;
                    overflow: hidden;

 src/views/systemSetting/baseSetting/department/index.vue

@@ -48,11 +48,8 @@
                    <el-table-column prop="operation" label="操作" min-width="15">
                        <template slot-scope="scope">
                            <div class="operation">
                                <!-- <span @click="handleChangeRole(scope.row)">修改角色</span> -->
                                <span @click="handleFind(scope.row)">查看</span>
                                <span class="line">|</span>
                                <!-- <span>修改密码</span> -->
                                <!-- <span>删除</span> -->
                                <span @click="handleUpdate(scope.row)">修改</span>
                                <span class="line">|</span>
                                <span @click="handleDelete(scope.row)">删除</span>
@@ -116,6 +113,7 @@
            all: false,
            unsame: false,
            myIdx: 0,
            preMyIdx: 0,
            options: [
                {
                    value: 0,
@@ -143,11 +141,50 @@
    },
    methods: {
        selectChange(list) {
            console.log(list);
            console.log(this.tempList);
            if (this.tempList.length !== 0) {
                if (list === 3) {
                    this.preMyIdx = list;
                    this.mulDelete(this.tempList);
                }
            } else {
                this.myIdx = this.preMyIdx;
                this.$message({
                    type: 'warning',
                    message: '您还没选中任何数据',
                })
            }
        },
        // 多条数据删除
        mulDelete(idArr) {
            this.$confirm('您确定要批量删除部门吗?')
                .then(_ => {
                    this.$axios({
                        method: 'post',
                        url: 'sccg/depart/batch_deletion?ids=' + idArr,
                    })
                        .then(res => {
                            if (res.code === 200) {
                                this.$message({
                                    type: 'success',
                                    message: '批量删除部门成功',
                                })
                                this.getUserList();
                            } else {
                                this.$message({
                                    type: 'error',
                                    message: res.message
                                })
                            }
                        })
                })
                .catch(err => { console.log(err) });
        },
        tableChange(list) {
            this.tempList = list;
            this.tempList = [];
            list.forEach(item => {
                this.tempList.push(item.id);
            })
            if (list.length === this.tableData.length) {
                this.all = true;
            } else {
@@ -168,6 +205,7 @@
                this.$refs.multipleTable.toggleRowSelection(row)
            })
        },
        // 单条数据删除
        handleDelete({ id }) {
            this.$confirm('确认删除？')
                .then(_ => {
@@ -190,19 +228,15 @@
                })
                .catch(_ => { });
        },
        // 修改角色
        handleChangeRole(obj) {
            this.dialogUpdate = true
            this.user = obj;
            // console.log(obj)
        },
        // 修改用户状态
        handleChangeStatus(obj) {
            let { id, status } = obj;
            status == true ? status = 1 : status = 0;
            console.log(id, status);
            this.$axios.post(`sccg/depart/status`, { id: id, status: status }).then(res => {
                console.log(res);
                if (res.code == 200) {
                    this.getUserList();
                }
            })
        },
        // 获取用户列表

 src/views/systemSetting/baseSetting/department/updateUser/index.vue

@@ -135,6 +135,7 @@
            this.$refs['user'].validate((valid) => {
                if (valid) {
                    const { user } = this;
                    console.log(user)
                    this.$axios.post('sccg/depart/update', {
                        id: user.id,
                        departName: user.departName,

 src/views/systemSetting/baseSetting/role/index.vue

@@ -145,13 +145,18 @@
        this.getUserList();
    },
    methods: {
        selectChange(list) {
        async selectChange(list) {
            console.log(this.tempList);
            if (this.tempList.length !== 0) {
                this.preMyIdx = list;
                if (list === 3) {
                    this.preMyIdx = list;
                    this.handleDelete(this.tempList);
                    await this.handleDelete(this.tempList);
                } else if (list === 2) {
                    await this.mulUpdateStatus(this.tempList, 0);
                } else {
                    await this.mulUpdateStatus(this.tempList, 1);
                }
                this.myIdx = 0;
            } else {
                this.myIdx = this.preMyIdx;
                this.$message({
@@ -159,6 +164,31 @@
                    message: '您还没选中任何数据',
                })
            }
        },
        mulUpdateStatus(idArr, flag) {
            this.$confirm(flag === 1 ? "您确定要进行批量启用角色吗?" : '您确定要进行批量禁用角色吗?')
                .then(_ => {
                    this.$axios({
                        method: 'post',
                        url: 'sccg/role/updateStatusBatch?ids=' + idArr + '&status=' + flag,
                    })
                        .then(res => {
                            if (res.code === 200) {
                                this.$message({
                                    type: 'success',
                                    message: '更改用户状态成功',
                                })
                                this.getUserList();
                            } else {
                                this.$message({
                                    type: 'error',
                                    message: res.message
                                })
                            }
                            console.log(res);
                        })
                })
                .catch(err => { console.log(err) })
        },
        tableChange(list) {
            this.tempList = [];
@@ -309,10 +339,6 @@
        },
        changeDialog(val) {
            this.dialogUpdate = val.dialogUpdate;
            this.$message({
                type:'success',
                message:'更改成功',
            })
        },
        handleClose(done) {
            this.$confirm('确认关闭？')

 src/views/systemSetting/baseSetting/role/updateUser/index.vue

@@ -4,8 +4,9 @@
            <div class="mainContent">
                <div class="my-tree">
                    <div class="my-tree__wrap">
                        <el-tree :data="roleList" :props="defaultProps" @node-click="handleNodeClick" show-checkbox
                            @check-change="handleCheckChange" default-expand-all node-key="id">
                        <!-- @node-click="handleNodeClick" -->
                        <el-tree ref="tree" :data="roleList" :props="defaultProps"  show-checkbox
                            @check="handleCheck" :default-checked-keys="checkedIds" default-expand-all node-key="id">
                        </el-tree>
                    </div>
                    <div class="my-tree__bottom"></div>
@@ -41,6 +42,7 @@
    },
    created() {
        const that = this;
        this.getRoleMenus(this.userInfo.id);
        this.getMenuList();
    },
    methods: {
@@ -72,7 +74,6 @@
            })
                .then(res => {
                    this.roleList = res.data;
                    console.log(res);
                })
        },
        // 点击树节点
@@ -83,31 +84,54 @@
            this.treeId = id;

        },
        // 树形控件选中更改
        handleCheckChange(data, checked, indeterminate) {
            // console.log(data,checked,indeterminate);
            if (checked) {
                this.checkedIds.push(data.id);
            } else {
                let index = 0;
                this.checkedIds.forEach((item, idx) => {
                    if (item.id === data.id) {
                        index = idx;
                    }
                })
                this.checkedIds.splice(index, 1);
            }
        // 树形控件复选框点击事件
        handleCheck(data, checked) {
            console.log(checked.checkedKeys);
            this.checkedIds = checked.checkedKeys;
            console.log(this.checkedIds);
        },
        // 保存role
        saveRole() {
            this.resCheckedIds = [];
            const {userInfo} = this;
            this.resCheckedIds = this.checkedIds;
            this.$emit('changeDialog',{dialogUpdate:false});
            this.$axios({
                method:'post',
                url:'sccg/role/allocMenu?roleId='+userInfo.id + '&menuIds=' + this.checkedIds,
            })
            .then(res=>{
                if(res.code === 200){
                    this.$message({
                        type:'success',
                        message:'修改角色权限成功',
                    })
                    this.getRoleMenus(userInfo.id);
                }else{
                    this.$message({
                        type:'warning',
                        message:res.message
                    })
                }
            })
            // this.$emit('changeDialog',{dialogUpdate:false});
        },
        // 消除role
        resetRole() {
            this.resCheckedIds = []
            this.resCheckedIds = [];
            this.$emit('changeDialog',{dialogUpdate:false});
        },
        // 获取角色菜单
        getRoleMenus(roleId){
            this.$axios({
                method:'get',
                url:`sccg/role/listMenu/${roleId}`
            })
            .then(res=>{
                this.checkedIds = [];
                res.data.forEach(item=>{
                    this.checkedIds.push(item.id);
                })
            })
        }
    },
    props: ['userInfo', 'updateFlag', 'getUserList', 'changeDialog']

 src/views/systemSetting/baseSetting/user/components/main/index.vue

@@ -4,7 +4,8 @@
            <!-- 数据展示 -->
            <el-table ref="multipleTable"
                :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}"
                :data="tableData" style="width: 100%" :row-class-name="tableRowClassName" @selection-change="tableChange">
                :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"
                @selection-change="tableChange">
                <el-table-column type="selection" min-width="5">
                </el-table-column>
                <el-table-column label="用户ID" min-width="4">
@@ -69,8 +70,8 @@
                    </div>
                    <div class="funsItem">
                        <el-select v-model="myIdx" placeholder="批量操作" @change="selectChange">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value" :disabled="item.disabled">
                            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"
                                :disabled="item.disabled">
                            </el-option>
                        </el-select>
                    </div>
@@ -91,7 +92,7 @@
import MyPwd from '../password'
export default {
    components: {
        updateUser,MyPwd
        updateUser, MyPwd
    },
    data() {
        return {
@@ -111,44 +112,118 @@
            },
            all: false,
            unsame: false,
            myIdx:0,
            options:[
            myIdx: 0,
            preMyIdx: 0,
            options: [
                {
                    value:0,
                    label:'批量操作',
                    disabled:true,
                    value: 0,
                    label: '批量操作',
                    disabled: true,
                },
                {
                    value:1,
                    label:'批量启用',
                    value: 1,
                    label: '批量启用',
                },
                {
                    value:2,
                    label:'批量禁用',
                    value: 2,
                    label: '批量禁用',
                },
                {
                    value:3,
                    label:'批量删除',
                    value: 3,
                    label: '批量删除',
                }
            ],
            tempList:[]
            tempList: []
        }
    },
    created() {
        this.getUserList();
    },
    methods: {
        selectChange(list){
            console.log(list);
        async selectChange(list) {
            console.log(this.tempList);
            if (this.tempList.length !== 0) {
                this.preMyIdx = list;
                if (list === 3) {
                    await this.mulDelte(this.tempList);
                } else if (list === 2) {
                    await this.mulUpdateStatus(this.tempList,0);
                } else {
                    await this.mulUpdateStatus(this.tempList,1);
                }
                this.myIdx = 0;
            } else {
                this.myIdx = this.preMyIdx;
                this.$message({
                    type: 'warning',
                    message: '您还没选中任何数据',
                })
            }
        },
        tableChange(list){
            this.tempList = list;
            if(list.length===this.tableData.length){
        tableChange(list) {
            this.tempList = [];
            list.forEach(item => {
                this.tempList.push(item.id);
            })
            if (list.length === this.tableData.length) {
                this.all = true;
            }else{
            } else {
                this.all = false
            }
        },
        // 批量删除用户信息
        mulDelte(idArr) {
            console.log(idArr);
            this.$confirm("您确定要进行批量删除用户吗?")
                .then(_ => {
                    this.$axios({
                        method: 'post',
                        url: 'sccg/admin/deleteBatch?ids=' + idArr,
                    })
                        .then(res => {
                            if (res.code === 200) {
                                this.$message({
                                    type: 'success',
                                    message: '删除用户信息成功',
                                })
                                this.getUserList();
                            } else {
                                this.$message({
                                    type: 'error',
                                    message: res.message
                                })
                            }
                            console.log(res);
                        })
                })
                .catch(err => { console.log(err) })
        },
        // 批量修改账号
        mulUpdateStatus(idArr,flag) {
            console.log(flag);
            this.$confirm( flag === 1 ? "您确定要进行批量启用用户吗?" :'您确定要进行批量禁用用户吗?' ) 
                .then(_ => {
                    this.$axios({
                        method: 'post',
                        url: 'sccg/admin/updateStatusBatch?ids=' + idArr + '&status='+flag,
                    })
                        .then(res => {
                            if (res.code === 200) {
                                this.$message({
                                    type: 'success',
                                    message: '更改用户状态成功',
                                })
                                this.getUserList();
                            } else {
                                this.$message({
                                    type: 'error',
                                    message: res.message
                                })
                            }
                            console.log(res);
                        })
                })
                .catch(err => { console.log(err) })
        },
        changeTime({ createTime }) {
            return helper(createTime);
@@ -300,8 +375,10 @@
        justify-content: space-between;
        align-items: center;
        padding: 0 20px;

        .funs {
            display: flex;

            .funsItem {
                line-height: 28px;
                display: flex;
@@ -310,25 +387,30 @@
                border-radius: 4px;
                font-size: 12px;
                margin-left: 10px;
                .el-checkbox{

                .el-checkbox {
                    width: 80px;
                    padding: 0 10px;
                }
                .el-select{

                .el-select {
                    width: 120px;
                }
                &::v-deep .el-input__inner{

                &::v-deep .el-input__inner {
                    border: none;
                    background-color: #09152f;
                }
                &:hover{

                &:hover {
                    border: 1px solid #4b9bb7;
                }
                &:hover .el-checkbox{

                &:hover .el-checkbox {
                    color: #4b9bb7;
                }
            }
            

        }

        .pagination {
@@ -345,7 +427,8 @@
                    background-color: #071f39;
                    color: #4b9bb7;
                }
                &::v-deep .active{

                &::v-deep .active {
                    background-color: #409eff;
                    color: #fff;
                }

 src/views/systemSetting/platform/mySetting/create/index.vue

New file
@@ -0,0 +1,44 @@
<template>
    <div class="add">
        <el-form :model="menu" ref="menu" label-width="120px" :rules="rules">
            <!-- 菜单名称 -->
            <el-form-item label="菜单名称:" prop="title">
                <el-input v-model="menu.title"></el-input>
            </el-form-item>
            <!-- 显示状态 -->
            <el-form-item label="显示状态:" prop="hidden">
                <el-input v-model="menu.hidden"></el-input>
            </el-form-item>
            <!-- 菜单名称 -->
            <el-form-item label="菜单名称" prop="name">
                <el-input v-model="menu.name"></el-input>
            </el-form-item>
        </el-form>
    </div>
</template>
<script>
export default {
    data() {
        return {
            menu: {
                createTime: "",
                description: "",
                hidden: 0,
                icon: "",
                id: 0,
                level: 0,
                name: "",
                parentId: 0,
                sort: 0,
                title: ""
            },
            rules: {

            }
        }
    }
}
</script>
<style lang="scss" scoped>

</style>

 src/views/systemSetting/platform/mySetting/index.vue

@@ -2,67 +2,161 @@
    <div class="mySetting">
        <!-- header 页面标题提示 -->
        <header>
            <div class="headerTitle">系统设置 >> 门户管理 > 自定义菜单设置</div>
            <div class="header-title">系统设置 >> 门户管理 > 自定义菜单设置</div>
            <div class="header-add">
                <el-button type="primary" @click="handleAdd">新增菜单</el-button>
            </div>
        </header>
        <main>
            <div class="mainContent">
            <div class="main-content">
                <!-- 数据展示 -->
                <el-table ref="multipleTable"
                <!-- <el-table ref="multipleTable"
                    :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}"
                    :data="menuList" style="width: 100%" row-key="id" :row-class-name="tableRowClassName">
                    <el-table-column type="selection" min-width="5">
                    </el-table-column>
                    <el-table-column prop="title" label="菜单栏" min-width="75">
                        <el-tree :data="menuList" node-key="id" :default-expanded-keys="[0]"
                            :default-checked-keys="[0]" :props="defaultProps">
                        </el-tree>
                        <template slot-scope="scope">
                            <el-tree :data="scope.row.menuVoArrayList" node-key="id" :default-expanded-keys="[0]"
                                :default-checked-keys="[0]" :props="defaultProps">
                            </el-tree>
                        </template>
                    </el-table-column>
                    <el-table-column label="操作" min-width="20">
                        <template slot-scope="scope">
                            <div class="operation">
                                <!-- <span @click="handleChangeRole(scope.row)">修改角色</span> -->
                                <span @click="handleFind(scope.row)">查看</span>
                                <span @click="handleAdd(scope.row)">新增</span>
                                <span class="line">|</span>
                                <!-- <span>修改密码</span> -->
                                <!-- <span>删除</span> -->
                                <span @click="handleUpdate(scope.row)">修改角色</span>
                                <span @click="handleEdit(scope.row)">编辑</span>
                                <span class="line">|</span>
                                <span @click="handleDelete(scope.row)">删除</span>
                            </div>
                        </template>
                    </el-table-column>
                </el-table>
                <!-- 查看修改页面 -->
                <el-dialog :visible.sync="dialogUpdate" width="45%" :title="updateFlag ? '修改角色信息' :'查看角色信息'"
                    v-if="dialogUpdate">

                </el-dialog>
                </el-table> -->
                <el-row class="my-container">
                    <el-col :span="6" class="my-aside">
                        <el-tree :data="menuList" @node-click="handleNodeClick" :props="defaultProps" accordion
                            node-key="id">
                            <span class="custom-tree-node" slot-scope="{ node, data }">
                                <span>{{ node.label }}</span>
                                <span>
                                    <el-button type="text" size="mini" @click="handleEdit(data)">
                                        编辑
                                    </el-button>
                                    <el-button type="text" size="mini" @click="handleDelete(data)">
                                        删除
                                    </el-button>
                                </span>
                            </span>
                        </el-tree>
                    </el-col>
                    <el-col :span="18" class="my-content" v-if="article.title">
                        <div class="my-header">菜单管理-{{article.title}}
                        </div>
                        <div class="my-name">
                            <div class="my-show__left">名称:</div>
                            <div class="my-show__right">{{article.title}}</div>
                        </div>
                        <div class="my-desc">
                            <div class="my-show__left">描述:</div>
                            <div class="my-show__right">{{article.title}}</div>
                        </div>
                        <div class="my-show">
                            <div class="my-show__left">是否显示菜单:</div>
                            <div class="my-show__right">
                                <el-switch class="switchStyle" v-model="article.hidden" active-text="开"
                                    inactive-text="关" active-color="#3fef9a" inactive-color="#000212"
                                    @change="handleChangeStatus(article)">
                                </el-switch>
                            </div>
                        </div>
                    </el-col>
                </el-row>
            </div>
        </main>
        <footer>
            <!-- 新增弹窗 -->
            <el-dialog title="提示" :visible.sync="dialogAdd" v-if="dialogAdd" width="45%" :before-close="handleClose">
                <MyAdd></MyAdd>
            </el-dialog>
        </footer>
    </div>
</template>
<script>
import helper from "@/utils/mydate.js"
import MyAdd from './create'
export default {
    components: {
        MyAdd
    },
    data() {
        return {
            menuList: [],
            article: [],
            article: {},
            defaultProps: {
                children: 'menuVoArrayList',
                label: 'title'
            },
            count: 1,
            menuList: [],
            context: "",
            dialogCreate: false,
            dialogUpdate: false,
            updateFlag: false,
            userInfo: '',
            dialogAdd: false,
        }
    },
    created() {
        this.getMenuList();
    },
    methods: {
        // 点击节点
        handleNodeClick(data) {
            this.article = { ...data };
            this.article.hidden === 0 ? this.article.hidden = false : this.article.hidden = true
        },
        // 修改状态
        handleChangeStatus(data) {
            console.log(data);
            data.hidden ? data.hidden = 1 : data.hidden = 0;
            this.$axios({
                method: 'post',
                url: `sccg/menu/updateHidden/${data.id}` + '?hidden=' + data.hidden
            })
                .then(res => {
                    this.$message({
                        type: res.code === 200 ? 'success' : 'error',
                        message: res.message
                    })
                    this.getMenuList();
                    this.article = {};
                })
        },
        // 新增
        handleAdd() {
            this.dialogAdd = true;
        },
        // 编辑
        handleEdit(data) {
            console.log(data);
        },
        //删除
        handleDelete(data) {
            console.log(data);
            this.$confirm('您确认要删除订单吗?')
                .then(_ => {
                    this.$axios({
                        method: 'post',
                        url: `sccg/menu/delete/${data.id}`
                    })
                        .then(res => {
                            this.$message({
                                type: res.code === 200 ? 'success' : 'error',
                                message: res.code === 200 ? '删除菜单成功' : res.message
                            })
                            if (res.code === 200) {
                                this.getMenuList();
                            }
                        })
                })
                .catch(err => {
                    console.log(err);
                })
        },
        // 获取菜单列表
        getMenuList() {
            this.$axios({
@@ -70,63 +164,18 @@
                url: 'sccg/system/portal/menu/search',
            }).then(res => {
                this.menuList = res.data.records;
                this.getContent(0);
                console.log(this.menuList);
            })
        },
        // 切换菜单内容展示
        getContent(index, sonIndex = null) {
            if (sonIndex === null) {
                this.article = this.menuList[index];

                return;
            }
            this.article = this.menuList[index].menuVoArrayList[sonIndex];
        },
        // 设置表格斑马纹
        tableRowClassName({ row, rowIndex }) {
            if ((rowIndex + 1) % 2 == 0) {
                return 'warning-row';
            } else {
                return 'success-row';
            }
            return '';
        },
        handleCheckChange(data, checked, indeterminate) {
            console.log(data, checked, indeterminate);
        },
        handleNodeClick(data) {
            console.log(data);
        },
        loadNode(node, resolve) {
            if (node.level === 0) {
                return resolve([{ name: 'region1' }, { name: 'region2' }]);
            }
            if (node.level > 3) return resolve([]);

            var hasChild;
            if (node.data.name === 'region1') {
                hasChild = true;
            } else if (node.data.name === 'region2') {
                hasChild = false;
            } else {
                hasChild = Math.random() > 0.5;
            }

            setTimeout(() => {
                var data;
                if (hasChild) {
                    data = [{
                        name: 'zone' + this.count++
                    }, {
                        name: 'zone' + this.count++
                    }];
                } else {
                    data = [];
                }

                resolve(data);
            }, 500);
        }
        // 关闭弹窗
        handleClose(done) {
        this.$confirm('确认关闭？')
          .then(_ => {
            this.dialogAdd = false
            done();
          })
          .catch(_ => {});
      }
    }

}
@@ -140,6 +189,15 @@
    header {
        line-height: 60px;
        padding: 0 20px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        .header-add{
            .el-button{
                background-color: #eb5d01;
                border: none;
            }
        }
    }

    main {
@@ -148,49 +206,45 @@
        padding-bottom: 50px;
        border: 1pox solid #fff;

        .mainTitle {
            line-height: 60px;
        }
        .main-content {
            .my-container {
                ::v-deep .el-tree-node__content {
                    height: 36px;
                }

        .el-table {
            color: #4b9bb7;
            font-size: 10px;

            &::v-deep .el-table__cell {
                text-align: center;
                ::v-deep .el-tree-node__label {
                    line-height: 20px;
                }
            }

            &::v-deep .el-table__empty-block {
                background-color: #09152f;
                color: #4b9bb7;
            }
            &::v-deep .el-table__row:hover{
                background-color: #4b9bb7;
            }
            .el-tree {
                background-color: #071f39;
            }

            .operation {
            .my-header {
                line-height: 60px;
                display: flex;
                justify-content: center;

                .line {
                    padding: 0 5px;
                }

                span:hover {
                    cursor: pointer;
                }
            }
        }

        .el-table::v-deep .warning-row {
            background: #06122c;
        }
            .my-name,
            .my-desc,
            .my-show {
                line-height: 40px;
                display: flex;
                justify-content: center;
                align-items: center;
            }

        .el-table::v-deep .success-row {
            background: #071f39;
            .my-show__right {
                margin-left: 10px;
            }

            .custom-tree-node {
                flex: 1;
                display: flex;
                align-items: center;
                justify-content: space-between;
                font-size: 14px;
                line-height: 20px;
                padding-right: 8px;
            }
        }

        &::v-deep .switchStyle .el-switch__label {