调整样式

src/views/modules/plugins/power/poweraxis.vue

@@ -38,11 +38,11 @@
             <el-table-column prop="categoryCode" :formatter="categoryCodeFormatter" label="类别" ></el-table-column>
             <el-table-column prop="leaderName" label="负责人"></el-table-column>
             <el-table-column prop="leaderMobile" label="联系方式" ></el-table-column>
-            <el-table-column label="操作" align="center">
+            <el-table-column label="操作" align="center" width="300px">
                 <template slot-scope="row">
-                    <el-button size="mini" type="text" icon="el-icon-edit">修改</el-button>
+                    <el-button size="mini" type="danger" icon="el-icon-edit" @click="modify(row)">修改</el-button>
-                    <el-button size="mini" type="text" icon="el-icon-edit" @click="del(row)">删除</el-button>
+                    <el-button size="mini" type="warning" icon="el-icon-edit" @click="del(row)">删除</el-button>
-                    <el-button size="mini" type="text" icon="el-icon-user">负责人</el-button>
+                    <el-button size="mini" type="primary" icon="el-icon-user">负责人</el-button>
                 </template>
             </el-table-column>
         </el-table>
@@ -53,10 +53,76 @@
         title="新增"
         :visible.sync="addDialogBox"
         width="30%"
+        :before-close="handleClose">
+            <el-form :model="addOrgForm" :rules="rules">   
+                <el-form-item label="类别" prop="categoryCode">
+                    <el-select v-model="addOrgForm.categoryCode" placeholder="请选择类别"  
+                    @change="handelChange">
+                        <el-option
+                        v-for="item in tagCategoryArr"
+                        :key="item.categoryCode"
+                        :label="item.categoryName"
+                        :value="item.categoryCode">
+                        </el-option>
+                    </el-select>
+                </el-form-item>
+                <el-form-item label="名称" prop="name">
+                    <el-input  v-model="addOrgForm.name" placeholder="请输入名称" style="width:250px"></el-input>
+                </el-form-item>
+                <!-- 下拉框组织的参数 -->
+                <el-form-item label="所属组织" v-show="orgListSwitch" prop="agencyId">
+                    <el-cascader @change="handelAddAgency"
+                        v-model="addOrgForm.agencyId"
+                        :options="agencytree"
+                        placeholder="请选择所属组织"
+                        :props="{ expandTrigger: 'hover', label: 'orgName', value: 'orgId', children: 'subOrgList' }"
+                        ></el-cascader>
+                </el-form-item>
+                <!-- 网格党支部下拉框 -->
+                <el-form-item label="所属上级" v-show="GridPartyBranchSwitch" prop="pid">
+                    <el-select v-model="addOrgForm.pid" placeholder="请选择所属上级">
+                        <el-option
+                        v-for="item in GridPartyBranchList"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.id">
+                        </el-option>
+                    </el-select>
+                </el-form-item>
+
+                <!-- 党委下拉框 -->
+                <el-form-item label="所属上级" v-show="partyCommSwitch" prop="pid">
+                    <el-select v-model="addOrgForm.pid" placeholder="请选择所属上级">
+                        <el-option
+                        v-for="item in PartyCommList"
+                        :key="item.id"
+                        :label="item.name"
+                        :value="item.id">
+                        </el-option>
+                    </el-select>
+                </el-form-item>
+
+                <el-form-item label="排序">
+                    <el-input-number v-model="addOrgForm.sort" :min="null" :max="10" label="请输入排序"></el-input-number>
+                </el-form-item>
+
+            </el-form>
+            <div>
+                <el-button @click="cancelAdd">取 消</el-button>
+                <el-button type="primary" @click="handelAdd">确 定</el-button>
+            </div>
+        </el-dialog>
+
+
+        <!-- 修改弹窗 -->
+        <el-dialog
+        title="修改"
+        :visible.sync="modifyPopSwitch"
+        width="30%"
         :before-close="handleClose">
             <el-form>   
-                <el-form-item label="动力主轴标签">
+                <el-form-item label="类别">
-                    <el-select v-model="addOrgForm.categoryCode" placeholder="请选择动力主轴标签"  
+                    <el-select v-model="addOrgForm.categoryCode" placeholder="类别"  
                     @change="handelChange">
                         <el-option
                         v-for="item in tagCategoryArr"
@@ -70,17 +136,17 @@
                     <el-input  v-model="addOrgForm.name" placeholder="请输入名称" style="width:250px"></el-input>
                 </el-form-item>
                 <!-- 下拉框组织的参数 -->
-                <el-form-item label="绑定组织" v-show="orgListSwitch">
+                <el-form-item label="所属组织" v-show="orgListSwitch">
                     <el-cascader
                         v-model="addOrgForm.agencyName"
                         :options="agencytree"
-                        placeholder="请选择要绑定的组织"
+                        placeholder="请选择所属组织"
                         :props="{ expandTrigger: 'hover', label: 'orgName', value: 'orgId', children: 'subOrgList' }"
                         ></el-cascader>
                 </el-form-item>
                 <!-- 网格党支部下拉框 -->
-                <el-form-item label="所属上级网格党支部" v-show="GridPartyBranchSwitch">
+                <el-form-item label="所属上级" v-show="GridPartyBranchSwitch">
-                    <el-select v-model="addOrgForm.pid" placeholder="请选择所属上级网格党支部">
+                    <el-select v-model="addOrgForm.pid" placeholder="请选择所属上级">
                         <el-option
                         v-for="item in GridPartyBranchList"
                         :key="item.id"
@@ -91,8 +157,8 @@
                 </el-form-item>
 
                 <!-- 党委下拉框 -->
-                <el-form-item label="所属党委" v-show="partyCommSwitch">
+                <el-form-item label="所属上级" v-show="partyCommSwitch">
-                    <el-select v-model="addOrgForm.pid" placeholder="请选择所属党委">
+                    <el-select v-model="addOrgForm.pid" placeholder="请选择所属上级">
                         <el-option
                         v-for="item in PartyCommList"
                         :key="item.id"
@@ -103,16 +169,17 @@
                 </el-form-item>
 
                 <el-form-item label="排序">
-                    <el-input v-model="addOrgForm.sort" placeholder="请输入排序" style="width:250px"></el-input>
+                    <el-input-number v-model="addOrgForm.sort" :min="0" :max="10" label="请输入排序"></el-input-number>
                 </el-form-item>
 
             </el-form>
             <div>
-                <el-button @click="cancelAdd">取 消</el-button>
+                <el-button @click="cancelModify">取 消</el-button>
-                <el-button type="primary" @click="submitAddNewOrg">确 定</el-button>
+                <el-button type="primary" @click="submitModifyOrg">确 定</el-button>
             </div>
         </el-dialog>
 
+
         <!-- 删除弹窗 -->
         <el-dialog 
         title="确认删除"
@@ -154,6 +221,7 @@ export default {
             },
             // 新增表单
             addOrgForm:{
+                id:'',
                 name:'',
                 customerId:'',
                 agencyId:'',
@@ -187,6 +255,23 @@ export default {
             partyCommSwitch:false,
             // 确认删除弹窗
             delWindow:false,
+            // 修改弹窗
+            modifyPopSwitch:false,
+
+            rules:{
+                categoryCode:[
+                    { required: true, message: "上级部门不能为空", trigger: "blur" }
+                ],
+                name:[
+                    { required: true, message: "上级部门不能为空", trigger: "blur" }
+                ],
+                agencyId:[
+                    { required: true, message: "上级部门不能为空", trigger: "blur" }
+                ],
+                pid:[
+                    { required: true, message: "上级部门不能为空", trigger: "blur" }
+                ]
+            }
             
         }
     },
@@ -201,9 +286,18 @@ export default {
         this.agencyId = localStorage.getItem('agencyId')
     },
     methods:{
+
+        handelAdd(){
+            this.$refs['addOrgForm'].validate((valid) => {
+                if (valid) {
+                    this.submitAddNewOrg()
+                } 
+            })
+        },
         
         // 确定新增按钮
         async submitAddNewOrg(){
+            
             const url = '/pli/power/axisStruct/addOrg'
 
             let params = {
@@ -310,6 +404,73 @@ export default {
                 this.$message.error(msg)
             }
         },
+        // 根据id查询修改表单数据
+        async queryModifyById(id){
+            const url = '/pli/power/axisStruct/queryModifyById/'+id
+
+            let params = {}
+
+            const { data, code, msg } = await requestPost(url,params)
+
+            if (code === 0) {
+                console.log(data)
+                this.addOrgForm.name = data.name
+                this.addOrgForm.customerId = data.customerId
+                this.addOrgForm.agencyId = data.agencyId
+                this.addOrgForm.agencyName = data.agencyName
+                this.addOrgForm.agencyType = data.agencyType
+                this.addOrgForm.pid = data.pid
+                this.addOrgForm.categoryCode = data.categoryCode
+                if(this.addOrgForm.categoryCode === 'community_party') {
+                    this.orgListSwitch = true
+                    this.GridPartyBranchSwitch = false
+                    this.partyCommSwitch = false
+                }
+                if(this.addOrgForm.categoryCode === 'grid_party') {
+                    this.orgListSwitch = false
+                    this.GridPartyBranchSwitch = false
+                    this.partyCommSwitch = true
+                    this.getPartyCommList()
+                }
+                if(this.addOrgForm.categoryCode === 'group_party') {
+                    this.GridPartyBranchSwitch = true
+                    this.partyCommSwitch = false
+                    this.getGridPartyBranchList()
+                }
+                this.addOrgForm.sort = data.sort
+            } else {
+                this.$message.error(msg)
+            }
+        },
+        // 确定修改按钮
+        async submitModifyOrg(){
+            const url = '/pli/power/axisStruct/modifyOrg'
+
+            let params = {
+                name:this.addOrgForm.name,
+                sort:this.addOrgForm.sort,
+                customerId:this.customerId,
+                agencyId:this.addOrgForm.agencyId,
+                agencyName:this.addOrgForm.agencyName,
+                agencyType:this.addOrgForm.agencyType,
+                categoryCode:this.addOrgForm.categoryCode,
+                pid:this.addOrgForm.pid,
+                id:this.addOrgForm.id
+            }
+
+            const { data, code, msg } = await requestPost(url,params)
+
+            if (code === 0) {
+                this.$message.success("修改成功")
+                this.modifyPopSwitch = false
+                this.addOrgFormRest()
+                this.initTreeData()
+                this.getTagCategoryArr()
+                this.getAgencyTree()
+            } else {
+                this.$message.error(msg)
+            }
+        },
         // 查父id
         // async getPid(){
         //     const url = '/pli/power/axisStruct/getPid'
@@ -364,6 +525,13 @@ export default {
             this.GridPartyBranchSwitch = false
             this.addOrgFormRest()
         },
+        // 取消修改按钮
+        cancelModify(){
+            this.modifyPopSwitch = false
+            this.orgListSwitch = false
+            this.GridPartyBranchSwitch = false
+            this.addOrgFormRest()
+        },
         // 清空新增表单
         addOrgFormRest(){
             this.addOrgForm.name = ''
@@ -446,7 +614,24 @@ export default {
                 }
             })
             return orgArray;
-        }
+        },
+        // 修改表单按钮
+        modify(row){
+            this.modifyPopSwitch = true
+            this.queryModifyById(row.row.id)
+            this.addOrgForm.id = row.row.id
+        },
+        handelAddAgency(val){
+            
+            if (val.length === 3) {
+                this.addOrgForm.agencyId = val[2]
+                
+
+            } else {
+                this.addOrgForm.agencyId = val[1]
+            }
+            this.addOrgForm.agencyType = 'agency'
+        },
         
     }
 }