sasp-admin 0.2.57

package/src/views/threeinone/safeOrgSpv.vue

@@ -0,0 +1,364 @@
+<template>
+    <el-container style="height: 100%">
+        <el-aside class="asideTree">
+            <el-input placeholder="组织名称" v-model="filterTree" style="margin-top: 5px" size="small"></el-input>
+            <div style="overflow-y: auto;height: calc(100% - 90px);margin-top: 5px">
+                <common-tree ref="orgSelectTree" :request-url="api.sysOrg.listNoPageForTrinity"
+                             :request-param="orgSearchParam"
+                             parent-id="orgParentId" :default-props="defaultProps" :defaultExpandAll="true"
+                             :dealTreeData="dealTreeData"
+                             :filterText="filterTree"
+                             :nodeClick="nodeClick" :render-content-func="renderContentFunc" :checkbox="false"
+                >
+                </common-tree>
+            </div>
+        </el-aside>
+        <el-main class="detail-info">
+            <el-container style="height: 100%">
+                <el-main>
+                    <div style="box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);height: 764px">
+                        <div class="econTitleDiv">
+                            <span style="">{{econTitle}}</span>
+                            <el-button class="saveButton" type="success" size="mini" style="font-size: 14px" @click="saveData">保存配置信息
+                            </el-button>
+                        </div>
+                        <div class="econContentDiv" v-for="(par,index) in  parEntArr" :key="par.id" v-if="cardShow">
+                                <div class="first_spv_main">
+                                    <div class="first_spv_title">
+                                        <el-checkbox v-model="checkedObj[par.id]" style="color: white;float: left;left: 9px"
+                                                     @change="changePar(par.id,checkedObj[par.id])">{{par.name}}</el-checkbox>
+                                    </div>
+
+                                    <div class="first_spv_content">
+                                        <div class="econChildDiv" v-for="(child,index) in parEntObj[par.id]" :key="child.id">
+                                            <el-checkbox v-model="checkedObj[child.id]" @change="changeChild(child.id,par.id,checkedObj[child.id])">{{child.name}}</el-checkbox>
+                                        </div>
+                                    </div>
+                                </div>
+                        </div>
+                    </div>
+                </el-main>
+            </el-container>
+        </el-main>
+    </el-container>
+</template>
+
+<script>
+    export default {
+        name: "safe-org-spv",
+        data() {
+            return {
+                defaultProps: {children: 'children', label: 'orgName'}, // 树组件的配置信息
+                orgSearchParam: {},
+                filterTree: "",
+                econTitle: "",//标题
+                checked:true,
+                parEntObj:{},
+                parEntArr:[],
+                cardShow:false,
+                checkedObj:{},
+                orgId:"",
+                checkedBak:[],
+        }
+        },
+        methods: {
+            dealTreeData(data) {
+
+            },
+            nodeClick(data, node) {
+                this.cardShow=false;
+                this.orgId=data.id;
+                this.econTitle=data.orgName;
+                if (data.orgType == 'ogn') {
+                    this.$message.error("地区节点不能配置监管行业！");
+                    return;
+                }
+                let spvArr=[];
+                // 加载所有可设置数据
+                this.axios.post(this.api.sysOrg.getById, {id: data.orgParentId}).then(async orgRes => {
+                    if (orgRes.data) {
+                        let rec = orgRes.data;
+                        if (rec.orgType == 'ogn') {// 父节点为地区节点，直接加载该监管地区下的监管信息
+                            this.loadAreaJgxx(data.id).then(async REGION => {
+                                let regionId = "";
+                                if (REGION.openStatus == 1 || REGION.openStatus == 0) {// 使用默认配置的监管
+                                    regionId = await this.loadDefaultSetting();
+                                } else if (REGION.openStatus == 9) {// 使用个性化配置
+                                    regionId = REGION.id;
+                                }
+                                let param = {"regionId": regionId, "order": "PARENT_ID,SPV_ORDER"};
+                                this.axios.post(this.api.safeSpv.findAndCount, param).then(res => {
+                                    if (res.data) {
+                                        spvArr = res.data;
+                                        this.delData(spvArr);
+                                    }
+                                })
+                            })
+                        } else if (rec.orgType == 'dept') {// 父节点为部门节点，需要加载父部门的配置监管信息
+                            await this.axios.post(this.api.sysOrg.findAllSpvByOrgId, {orgId: rec.id}).then(res => {
+                                if (res.data) {
+                                    spvArr = res.data;
+                                    this.delData(spvArr);
+                                }
+                            })
+                        } else {
+                            spvArr = [];
+                            this.$message.error("部门节点异常！！！");
+                            return;
+                        }
+                    }
+                })
+
+            },
+            /*
+                处理加载的数据
+            */
+            delData(spvArr){
+                if(spvArr == false || spvArr.length == 0){
+                    this.$message.error("未找到当前部门可配置的监管行业！请优先配置父级部门！");
+                    return;
+                }
+                this.parEntObj={};
+                this.parEntArr=[];
+                let parEntObj=this.parEntObj;
+                let parEntArr=this.parEntArr;
+
+                //假数据
+                spvArr.forEach(spvData =>{
+                    if(spvData.parentId== '-1'){
+                        this.$set(parEntObj,spvData.id,[])
+                        parEntArr.push(spvData);
+                    }
+                })
+                parEntArr.forEach(parEnt=>{
+                    spvArr.forEach(spvData =>{
+                        if(spvData.parentId== parEnt.id){
+                            parEntObj[parEnt.id].push(spvData);
+                        }
+                    })
+                })
+                this.checkedObj={};
+                // 加载已选择数据
+                this.axios.post(this.api.safeOrgSpv.find,{"orgId":this.orgId}).then( checkRes =>{
+                    this.checkedBak=[];
+                    if(checkRes.data){
+                        let arr=checkRes.data || [];
+                        arr.forEach(item =>{
+                            this.$set(this.checkedObj,item.spvId,true);
+                            this.checkedBak.push(item.id);
+                        })
+                    }
+                    this.cardShow=true;
+                })
+            },
+            /**
+             * 功能描述：获取默认配置
+             */
+            loadDefaultSetting() {
+                let param = {"openStatus": "0"};
+                this.axios.post(this.api.safeSpv.findAndCount, param).then(res => {
+                    if (res.data) {
+                        return  res.data[0].id;
+                    }
+                })
+            },
+            loadAreaJgxx(orgId) {
+                return new Promise(resolve => {
+                    this.axios.post(this.api.sysOrg.getById, {id: orgId}).then(res => {
+                        this.axios.post(this.api.safeRegion.getById, {id: (res.data || {}).regionId}).then(regionRes => {
+                            if (!regionRes ||!regionRes.data) {
+                                this.$message.error("未获取到地区数据！");
+                            }else {
+                                resolve(regionRes.data || {});
+                            }
+                        })
+                    })
+                })
+            },
+            renderContentFunc(h, {node, data}) {
+                let vm = this;
+                if (data.nodeType == "dept" || data.nodeType == "area") {
+                    return (
+                        <span>
+                            <i class={'el-icon-tickets'}></i>
+                            <span>{node.label}</span>
+                        </span>
+                    );
+                }
+                let MyComempte = (
+                    <span>
+                        <i class={'el-icon-coordinate'}></i>
+                        <span>{node.label}</span>
+                    </span>
+                );
+                return MyComempte;
+            },
+            /*
+                父级勾选
+             */
+            changePar(id,status){
+                //checkedObj:{},
+                let childArr=this.parEntObj[id] || [];
+                if(status){//父级全选
+                    childArr.forEach(item =>{
+                        this.$set(this.checkedObj,item.id,true);
+                    })
+                }else{//父级全不选
+                    childArr.forEach(item =>{
+                        this.$set(this.checkedObj,item.id,false);
+                    })
+                }
+            },
+            /*
+               子级勾选
+            */
+            changeChild(id,parentId,status){
+                let childArr=this.parEntObj[parentId] || [];
+                if(status){//勾选的时候判断父级是否需要全选
+                    let index=childArr.findIndex(item =>{
+                        if(!this.checkedObj[item.id]){
+                            return true;
+                        }
+                    })
+                    if(index <0){//同级没有未勾选的
+                        this.$set(this.checkedObj,parentId,true);
+                    }
+                }else{//取消勾选的时候判断父级是否需要取消全选
+                    this.$set(this.checkedObj,parentId,false);
+                }
+            },
+            saveData(){
+                let checkedArr=[];//保存勾选的数据
+                let arr=Object.keys(this.checkedObj) || [];
+                arr.forEach(item =>{
+                    if(this.checkedObj[item]){
+                        checkedArr.push(item);
+                    }
+                })
+                 if(checkedArr.length >0){
+                    this.axios.post(this.api.safeOrgSpv.batchAdd,{"ids":checkedArr.join(","),"orgId":this.orgId}).then(res=>{
+                        if(res.data.operateSuccess){
+                            this.$message({type: "success", message: "保存成功！"});
+                        }else{
+                            this.$message({type: "error", message: "保存失败！"});
+                        }
+                    })
+                 }else{
+                     this.axios.post(this.api.safeOrgSpv.batchDelete,{"ids":this.checkedBak.join(",")}).then(res=>{
+                         if(res.data.operateSuccess){
+                             this.$message({type: "success", message: "保存成功！"});
+                         }else{
+                             this.$message({type: "error", message: "保存失败！"});
+                         }
+                     })
+                 }
+            },
+        }
+    }
+</script>
+
+<style scoped>
+    .asideTree {
+        width: 300px;
+        position: relative;
+        overflow-y: hidden;
+        padding: 5px;
+        box-sizing: border-box;
+    }
+
+    .detail-info {
+        height: 100%;
+        border-left: 1px solid #EBEEF5;
+        padding: 5px 0 5px 5px;
+        overflow-x: hidden;
+        box-sizing: border-box;
+    }
+
+    .econTitleDiv {
+        border-radius: 4px 4px 0px 0px;
+        background-color: #3498DB;
+        height: 36px;
+        color: white;
+        line-height: 36px;
+        font-weight: bold;
+        text-align: center;
+        font-size: 18px;
+        cursor: pointer;
+        transition: all 0.5s;
+
+    }
+
+    .econTitleDiv .saveButton {
+        position: absolute;
+        right: 42px;
+        top: 23px;
+        z-index: 999;
+        width: 120px;
+        height: 30px;
+        cursor: pointer;
+    }
+    .first_spv_main {
+        margin: 4px;
+        height: 230px;
+        width: 240px;
+        padding: 0px;
+        border-radius: 4px;
+        border: #D8DEE2 solid 1px;
+        box-shadow: 0 0 12px 4px #DDE5EA;
+        float: left;
+        transition: all 0.3s;
+        position: relative;
+    }
+    .first_spv_title{
+        position: relative;
+        border-radius: 4px 4px 0px 0px;
+        background-color: #3498DB;
+        height: 34px;
+        color: white;
+        line-height: 34px;
+        text-align: center;
+        font-size: 14px;
+        cursor: pointer;
+        transition: all 0.5s;
+        width: 100%;
+    }
+    /deep/ .first_spv_title .el-checkbox__label{
+        color: white;
+    }
+    /deep/ .first_spv_title .el-checkbox__inner{
+    }
+    .first_spv_content{
+        height: 190px;
+        padding-top: 0px;
+        width: 100%;
+        margin: 0px auto;
+        overflow-y: auto;
+        overflow-x: hidden;
+    }
+    /deep/ .first_spv_content .econChildDiv .el-checkbox is-checked .el-checkbox__label{
+        color: white;
+    }
+    .econChildDiv{
+        float: left;
+        height: 25px;
+        line-height: 25px;
+        border-radius: 3px;
+        padding: 3px 10px;
+        border: #E7EBEE solid 1px;
+        font-size: 13px;
+        display: block;
+        cursor: pointer;
+        font-family: "微软雅黑";
+        width: 200px;
+        margin: 5px;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+    .econChildDiv_checked {
+        background-color: #3498DB;
+        box-shadow: rgba(52, 152, 219, 0.79) 2px 2px 10px;
+        color: white;
+        border: #3498DB solid 1px;
+    }
+</style>

package/src/views/threeinone/safeSpv/safeSpvLeftTree.vue

@@ -0,0 +1,109 @@
+<template>
+    <el-container style="width: 100%;height: 100%;">
+        <el-header class="title-header" :height="((source == '1') || isEdit) ? '82px' : '30px'">
+            <div class="title-div">
+                <span style="color:red;">{{spvTitle}}</span><span> 监管行业信息</span>
+            </div>
+            <el-row v-if="(source == '1') || isEdit" class="header-button-row">
+                <el-col :span="10">
+                    <el-dropdown @command="openSafeSpvDialog">
+                        <el-button type="success" size="mini">添加
+                            <i class="el-icon-arrow-down el-icon--right"></i></el-button>
+                        <el-dropdown-menu slot="dropdown">
+                            <el-dropdown-item command="1">同级行业</el-dropdown-item>
+                            <el-dropdown-item command="2">下级行业</el-dropdown-item>
+                        </el-dropdown-menu>
+                    </el-dropdown>
+                </el-col>
+                <el-col :span="7">
+                    <el-button size="mini" type="primary" @click="openSafeSpvDialog('edit')">修改</el-button>
+                </el-col>
+                <el-col :span="7">
+                    <el-button size="mini" type="danger" @click="removeSafeSpv()">删除</el-button>
+                </el-col>
+            </el-row>
+        </el-header>
+        <el-main :style="((source == '1') || isEdit) ? 'height: calc(100% - 82px);padding-top:10px' : 'height: calc(100% - 30px);padding-top:10px'">
+            <el-tree v-if="showTree" ref="spvTreeRef"
+                     :show-checkbox="((source == '1') || isEdit)"
+                     :expand-on-click-node="false"
+                     :data="spvTreeDataArr" :props="defaultProps"
+                     node-key="id" default-expand-all
+                     :render-content="renderSpvNodeContent"
+                     :current-node-key="currentNodeKey"
+                     highlight-current
+                     @node-click="nodeClick"
+            ></el-tree>
+        </el-main>
+    </el-container>
+</template>
+
+<script>
+    export default {
+        name: "safeSpvLeftTree",
+        props:{
+            source:{type:String,default:"1"},//来源，1-修改系统默认监管配置
+            spvTitle:{type:String,default:""},
+            showTree:{type:Boolean,default:false},
+            spvTreeDataArr:{type:Array,default:() => {return [];}},
+            currentNodeKey:{type:String,default:""},
+            defaultProps:{type:Object,default:() => {return {};}},
+            isEdit:{type:Boolean,default:false},
+            openSafeSpvDialog:{type:Function,default:null},
+            removeSafeSpv:{type:Function,default:null},
+        },
+        created(){
+        },
+        methods:{
+            /**
+             * 自定义左侧树节点显示内容
+             */
+            renderSpvNodeContent(h, { node, data, store }){
+                if(data.countSshy > 0){
+                    return (
+                        <span>
+                            <span>{node.label}</span>
+                            <span style="color:red">（{data.countSshy}）</span>
+                        </span>
+                    );
+                }else{
+                    return (
+                        <span>
+                            <span>{node.label}</span>
+                        </span>
+                    );
+                }
+            },
+
+            /**
+             * 节点点击
+             * @param data
+             * @param node
+             */
+            nodeClick(data, node){
+                return this.$emit("nodeClick",data,node)
+            },
+
+
+        }
+    }
+</script>
+
+<style scoped>
+    .title-div {
+        padding-left: 10px;
+        padding-right: 10px;
+    }
+    .title-header{
+        font-size: 14px;
+        line-height: 30px;
+        font-weight: bold;
+        border-bottom: 1px solid #cccccc;
+        padding: 0;
+    }
+
+    .header-button-row {
+        border-top: 1px solid #cccccc;
+        padding: 10px;
+    }
+</style>