股权结构

project/xiushan/apps/AppPortalUser/pumDetail.vue

@@ -44,16 +44,40 @@
         </template>
         <template v-if="index==1">
           <ai-card title="股权结构">
-            <!-- <el-button type="text">+添加股东</el-button> -->
+            <template #right>
+              <el-button type="text" size="small" @click="handleAdd">+添加股东</el-button>
+            </template>
+            <template #content>
               <ai-table :tableData="tableData" :total="page.total" :current.sync="page.current" :size.sync="page.size"
                         @getList="getTableData" :col-configs="colConfigs">
-              
               </ai-table>
+            </template>
           </ai-card>
         </template>
-
       </template>
     </ai-detail>
+    <ai-dialog title="股权结构" :visible.sync="dialog" width="600px"  @onConfirm="confirm">
+      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+        <el-form-item label="股东名称" prop="name">
+          <el-input v-model="form.name" placeholder="请输入股东名称"></el-input>
+        </el-form-item>
+        <el-form-item label="股东类型" prop="resource">
+          <el-radio-group v-model="form.resource">
+            <el-radio label="个人"></el-radio>
+            <el-radio label="企业"></el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="身份证号" prop="idNumber">
+          <el-input v-model="form.idNumber" placeholder="请输入身份证号"></el-input>
+        </el-form-item>
+        <el-form-item label="持股数量" prop="num">
+          <el-input v-model="form.num" placeholder="请输入持股数量"></el-input>
+        </el-form-item>
+        <el-form-item label="持股占比%" prop="percentage">
+          <el-input v-model="form.percentage" placeholder="请输入持股占比"></el-input>
+        </el-form-item>
+      </el-form>
+    </ai-dialog>
   </section>
 </template>
 
@@ -73,11 +97,20 @@ export default {
       return [
         {prop: "", label: "股东名称", width: 150},
         {prop: "", label: "股东类型", width: 150},
-        {prop: "", label: "身份证/信用代码", width: 240},
+        {prop: "idNumber", label: "身份证/信用代码", width: 240},
         {prop: "", label: "持股数量", width: 150},
         {prop: "", label: "持股占比", width: 150},
         {prop: "", label: "股权证", width: 200},
       ]
+    },
+    rules() {
+      return {
+        name: [{required: true, message: "请填写姓名",trigger: 'blur'}],
+        resource: [{ required: true, message: '请选择股东类型', trigger: 'change' }],
+        idNumber: [{ required: true, message: '请输入身份证号',trigger: 'blur'}],
+        num: [{ required: true, message: '请输入持股数量',trigger: 'blur'}],
+        percentage: [{ required: true, message: '请输入持股占比',trigger: 'blur'}]
+      }
     }
   },
   data() {
@@ -87,6 +120,14 @@ export default {
       index: 0,
       tableData: [],
       page: {current: 1, size: 10, total: 0},
+      dialog: false,
+      form: {
+        name: "",
+        resource: "",
+        idNumber: "",
+        num: '',
+        percentage: '',
+      },
     }
   },
   methods: {
@@ -114,6 +155,24 @@ export default {
       //   }
       // })
     },
+    handleAdd() {
+      this.dialog = true
+    },
+    confirm() {
+      // this.$refs["form"].validate(valid => {
+      //   if (valid) {
+      //     this.instance.post("/app/appdvcpconfig/addOrUpdate", {
+      //       ...this.dialogForm,
+      //     }).then(res => {
+      //       if (res.code == 0) {
+      //         this.$message.success(this.dialogForm.id ? "修改成功" : "新增成功");
+      //         this.dialog = false;
+      //         this.getTableData();
+      //       }
+      //     })
+      //   }
+      // })
+    },
   },
   created() {
     this.getDetail()