集体股权

project/xiushan/apps/AppGroupShareholders/components/Add.vue

@@ -1,10 +1,12 @@
 <template>
   <section class="Add">
     <ai-detail v-if="!id || isEdit==true">
+
       <template #title>
         <ai-title :title="params.id ? '编辑集体经济股权登记' : '新增集体经济股权登记'" :isShowBack="true" :isShowBottomBorder="true" @onBackClick="cancel(false)"></ai-title>
       </template>
       <template #content>
+
         <ai-card title="基本信息">
           <template #right v-if="params.id">
             <span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="isEdit==true" @click="isEdit=false">取消</span>
@@ -43,25 +45,35 @@
 
         <ai-card title="家庭持股情况">
           <template #right>
-            <span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" @click="sysInfoDialog = true">+添加股权人</span>
+            <span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;"  v-if="!id || isEdit==true" @click="sysInfoDialog = true">+添加股权人</span>
           </template>
           <template #content>
             <ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size"
                       @getList="getDetail" :col-configs="colConfigs" :dict="dict">
+              
+              <el-table-column slot="options" label="操作"  align="center" v-if="!id || isEdit==true">
+                <template slot-scope="{row,$index}">
+                  <el-button type="text" @click="editBtn(row,$index)">编辑</el-button>
+                  <el-button type="text" @click="deleteBtn(row,$index)">删除</el-button>
+                </template>
+              </el-table-column>
             </ai-table>
           </template>
         </ai-card>
+
       </template>
       <template slot="footer" class="footer">
         <el-button class="delete-btn footer-btn" @click="cancel(false)">取消</el-button>
         <el-button class="footer-btn" type="primary" @click="confirm()">保存</el-button>
       </template>
     </ai-detail>
+
     <ai-detail class="add" v-if="params.id && !isEdit">
       <template slot="title">
         <ai-title title="集体经济股权登记详情" isShowBack isShowBottomBorder @onBackClick="cancel(false)"></ai-title>
       </template>
       <template slot="content">
+
         <ai-card title="合同信息">
           <template #right>
               <span style="color:#2266FF;cursor: pointer;font-size: 12px;" class="iconfont iconEdit" v-if="isEdit==false" @click="isEdit=true,form=data">修改</span>
@@ -78,21 +90,31 @@
             </ai-wrapper>
           </template>
         </ai-card>
+
         <ai-card title="家庭持股情况">
           <template #right>
-            <span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" @click="sysInfoDialog = true">+添加股权人</span>
+            <span style="color:#2266FF;margin-left: 16px;cursor: pointer;font-size: 12px;" v-if="!id || isEdit==true" @click="sysInfoDialog = true">+添加股权人</span>
           </template>
           <template #content>
             <ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size"
                       @getList="getDetail" :col-configs="colConfigs" :dict="dict">
+
+              <el-table-column slot="options" label="操作"  align="center" v-if="!id || isEdit==true">
+                <template slot-scope="{row,$index}">
+                  <el-button type="text" @click="editBtn(row, $index)">编辑</el-button>
+                  <el-button type="text" @click="deleteBtn(row, $index)">删除</el-button>
+                </template>
+              </el-table-column>
             </ai-table>
+            
           </template>
         </ai-card>
       </template>
     </ai-detail>
+
     <!-- 弹框 -->
     <ai-dialog title="股权结构" :visible.sync="sysInfoDialog" width="600px" @onConfirm="onConfirm"
-               @closed="sysInfo={}">
+               @closed="table={},isEditSys=false">
       <el-form size="small" label-width="140px" :rules="dialogRules" ref="dialogForm" :model="table">
         <el-form-item label="股权人姓名" prop="name">
           <el-input v-model="table.name" placeholder="请输入股权人姓名" clearable/>
@@ -135,7 +157,6 @@ export default {
         stockCertificateCode: '',
         fileList: [],
       },
-      // tableData: {},
       table: {},
       isEdit: false,
       radioFrom: '',
@@ -145,6 +166,8 @@ export default {
       page: {current: 1, size: 10, total: 0},
       sysInfoDialog: false,
       data: {},
+      isEditSys: false,
+      sysIndex: ''
     }
   }, 
   computed: {
@@ -168,11 +191,12 @@ export default {
     ...mapState(['user']),
     colConfigs() {
       return [
-        { prop: "name", label: '股权人姓名', align: "center", width: "220px", },
+        { prop: "name", label: '股权人姓名', align: "center", width: "150px", },
-        { prop: "householdRelation", label: '与户主关系', align: "center", width: "200px", },
+        { prop: "householdRelation", label: '与户主关系', align: "center", width: "200px", dict: 'householdRelation'},
-        { prop: "idNumber", label: '身份证', align: "center", width: "300px", },
+        { prop: "idNumber", label: '身份证', align: "center", width: "200px", },
         { prop: "shareholdingNumber", label: '持股数量', align: "center", width: "200px", },
         { prop: "shareholdingAmount", label: '金额', align: "center", width: "200px", },
+        { slot: "options" ,},
       ]
     }
   },
@@ -183,7 +207,6 @@ export default {
       this.getDetail(this.params.id)
     }
     this.form.areaId = this.user.info.areaId
-    // this.getTableData()
   },
   methods: {
     cancel(isRefresh) {
@@ -192,17 +215,13 @@ export default {
         isRefresh: !!isRefresh,
       })
     },
-    // getTableData() {
+    deleteBtn(row, index) {
-    //   this.instance.post("/appcollectiveeconomyequity/list", null, {
+      console.log(row);
-    //     params: {...this.page }
+      if(row.householdRelation == 11) {
-    //   }).then(res => {
+        return '不可以删除户主'
-    //     if (res?.data) {
+      }
-    //       this.data = res.data?.records 
+      this.tableData.splice(index, 1)
-    //       this.tableData = res.data?.records.shareholderLists
+    },
-    //       this.page.total = res.data.total
-    //     }
-    //   })
-    // },
     getDetail(id) {
       this.instance.post(`/appcollectiveeconomyequity/queryDetailById`,null, {
         params: {
@@ -220,12 +239,14 @@ export default {
     onConfirm() {
       this.$refs.dialogForm.validate((valid) => {
         if(valid) {
-          let tableDataList = []
+          if(this.isEditSys) {  //编辑
-          tableDataList.push(this.table)
+            // this.tableData[this.sysIndex] = this.table
-          this.tableData = tableDataList
+            this.tableData.splice(this.sysIndex, 1, this.table)
-          setTimeout(() => {
+          }else{//新增
-            this.sysInfoDialog = false
+            this.tableData.push(this.table)
-          }, 600)
+          }
+          this.sysInfoDialog = false
+          this.$forceUpdate()
         }
       })
     },
@@ -247,6 +268,13 @@ export default {
         }
       })
     },
+    editBtn(row, index) {
+      console.log(index)
+      this.table = JSON.parse(JSON.stringify(row))
+      this.sysInfoDialog = true
+      this.isEditSys = true
+      this.sysIndex = index 
+    }
   },
 }
 </script>