From 9bb702549e2530ef102f44c39123ec47cd2e35e7 Mon Sep 17 00:00:00 2001
From: shijingjing <1789544664@qq.com>
Date: Tue, 18 Oct 2022 16:48:27 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=8D=A2=E5=B1=8A?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/addChange.vue                  | 237 ++++++++++--------
 1 file changed, 127 insertions(+), 110 deletions(-)

diff --git a/project/pingchang/apps/AppOrganizationChange/components/addChange.vue b/project/pingchang/apps/AppOrganizationChange/components/addChange.vue
index 98bcf0da..bf0ea386 100644
--- a/project/pingchang/apps/AppOrganizationChange/components/addChange.vue
+++ b/project/pingchang/apps/AppOrganizationChange/components/addChange.vue
@@ -1,92 +1,81 @@
 <template>
-  <ai-list class="addChange">
-    <template #title>
-      <ai-title title="基本信息" isShowBottomBorder isShowBack  @onBackClick="cancel(false)" />
-    </template>
-        <template #content>
-      <div class="Form" style="padding: 0 200px;">
-        <el-form ref="form" :model="form" label-width="100px" label-position="right">
-          <ai-bar title="基本信息"></ai-bar>
-          <el-row type="flex">
-            <el-col :span="12">
-              <el-form-item label="换届时间" prop="data" :rules="[{ required: true, message: '请选择换届时间', trigger: 'blur' }]">
-                <el-input size="small" :maxlength="30" placeholder="请输入大屏项目名称" v-model="form.name"></el-input>
-              </el-form-item>
-            </el-col>
-            <el-col :span="12">
-              <el-form-item label="届次" prop="noun" :rules="[{ required: true, message: '请输入届次', trigger: 'blur' }]">
-                <el-input size="small" :maxlength="30" placeholder="请输入届次" v-model="form.name"></el-input>
-              </el-form-item>
-            </el-col>
-          </el-row>
-          <ai-bar title="本届任职(必填)">
-            <template slot="right">
-              <el-button size="small" type="text" icon="iconfont iconAdd" @click="toEdit('')" >添加任职人员</el-button>
-            </template>
-          </ai-bar>
-          <el-table :data="form.ladderRule" size="mini" border stripe>
-            <el-table-column label="查看人数(人)" align="center">
-              <template slot-scope="{row}">
-                <el-input class="tableInput" v-model.number="row.viewCount" clearable placeholder="请输入"/>
-              </template>
-            </el-table-column>
-            <el-table-column label="获得积分(分)" align="center">
-              <template slot-scope="{row}">
-                <el-input class="tableInput" v-model="row.integral" clearable placeholder="请输入" type="number"
-                          @keyup.native="row.integral=checkIntegral(row.integral)"/>
-              </template>
-            </el-table-column>
-            <el-table-column label="操作" align="center">
-              <template slot-scope="{$index}">
-                <el-button type="text" @click="handleDelete($index)">删除</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
-        </el-form>
+  <section class="addChange">
+    <ai-detail>
+      <ai-title  slot="title" title="新增换届" isShowBottomBorder isShowBack  @onBackClick="cancel(false)" />
+      <template #content>
+        <ai-card title="基本信息">
+          <template #content>
+            <div class="Form">
+              <el-form ref="form" :model="form" :rules="rules" label-width="100px" label-position="right">
+                <el-row type="flex">
+                  <el-col :span="12">
+                    <el-form-item label="换届时间" prop="changeTime">
+                      <el-date-picker v-model="form.changeTime" value-format="yyyy-MM-dd" type="date" placeholder="选择日期" style="width:338px">
+                      </el-date-picker>
+                    </el-form-item>
+                  </el-col>
+                  <el-col :span="12">
+                    <el-form-item label="届次" prop="sessionTime">
+                      <el-input size="small" :maxlength="30" placeholder="请输入届次" v-model="form.sessionTime"></el-input>
+                    </el-form-item>
+                  </el-col>
+                </el-row>
+                <ai-bar title="本届任职(必填)">
+                  <template slot="right">
+                    <el-button size="small" type="text" icon="iconfont iconAdd" @click="form.serveList.push({name:null,position:null,type:0})" >添加任职人员</el-button>
+                  </template>
+                </ai-bar>
+                <el-table :data="form.serveList" size="mini" border stripe>
+                  <el-table-column label="职位" align="center">
+                    <template slot-scope="{row}">
+                      <el-input class="tableInput" v-model="row.position" clearable placeholder="请输入职位"/>
+                    </template>
+                  </el-table-column>
+                  <el-table-column label="姓名" align="center">
+                    <template slot-scope="{row}">
+                      <el-input class="tableInput" v-model="row.name" clearable placeholder="请输入姓名" />
+                    </template>
+                  </el-table-column>
+                  <el-table-column label="操作" align="center">
+                    <template slot-scope="{$index}">
+                      <el-button type="text" @click="handleDelete($index, 'serveList')">删除</el-button>
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </el-form>
 
-        <!-- <ai-bar title="本届任职(必填)">
-          <template slot="right">
-            <el-button size="small" type="text" icon="iconfont iconAdd" @click="toEdit('')" >添加任职人员</el-button>
+              <ai-bar title="本届候选人">
+                <template slot="right">
+                  <el-button size="small" type="text" icon="iconfont iconAdd" @click="form.candidateList.push({name:null,position:null,type: 1})" >添加候选人</el-button>
+                </template>
+              </ai-bar>
+              <el-table :data="form.candidateList" size="mini" border stripe>
+                <el-table-column label="职位" align="center">
+                  <template slot-scope="{row}">
+                    <el-input class="tableInput" v-model="row.position" clearable placeholder="请输入职位"/>
+                  </template>
+                </el-table-column>
+                <el-table-column label="候选人" align="center">
+                  <template slot-scope="{row}">
+                    <el-input class="tableInput" v-model="row.name" clearable placeholder="请输入姓名" />
+                  </template>
+                </el-table-column>
+                <el-table-column label="操作" align="center">
+                  <template slot-scope="{$index}">
+                    <el-button type="text" @click="handleDelete($index, 'candidateList')">删除</el-button>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </div>
           </template>
-        </ai-bar>
-        <ai-table
-          class="detail-table__table"
-          :tableData="tableDataJob"
-          :col-configs="colConfigsJob"
-          :total="job.total"
-          :current.sync="job.current"
-          :size.sync="job.size"
-            >
-          <el-table-column slot="options" label="操作" align="center">
-            <template slot-scope="{ row }">
-              <el-button type="text" @click="jobEdit(row.id)">编辑</el-button>
-              <el-button type="text" @click="jobDelete(row.id)">删除</el-button>
-            </template>
-          </el-table-column>
-        </ai-table>
-        <ai-bar title="本届候选人">
-          <template slot="right">
-            <el-button size="small" type="text" icon="iconfont iconAdd" @click="toEdit('')" >添加候选人</el-button>
-          </template>
-        </ai-bar>
-        <ai-table
-          class="detail-table__table"
-          :tableData="tableDataPerson"
-          :col-configs="colConfigsPerson"
-          :total="person.total"
-          :current.sync="person.current"
-          :size.sync="person.size"
-          >
-          <el-table-column slot="options" label="操作" align="center">
-            <template slot-scope="{ row }">
-              <el-button type="text" @click="jobEdit(row.id)">编辑</el-button>
-              <el-button type="text" @click="jobDelete(row.id)">删除</el-button>
-            </template>
-          </el-table-column>
-        </ai-table> -->
-      </div>
-    </template>
-  </ai-list>
+        </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>
+  </section>
 </template>
 
 <script>
@@ -98,9 +87,33 @@ export default {
     dict: Object,
   },
   data() {
+    let validServe = (rule, value, callback) => {
+      if (!value.length) {
+        return callback(new Error('请填写本届任职人员信息'));
+      } else {
+        callback();
+      }
+    };
+    let validCandidate = (rule, value, callback) => {
+      if (!value.length) {
+        return callback(new Error('请填写本届候选人员信息'));
+      } else {
+        callback();
+      }
+    };
     return {
       form: {
-
+        addOrMakeup: true,
+        changeTime: '',
+        sessionTime: '',
+        serveList: [],   // 任职人员列表
+        candidateList: [], // 候选人员列表
+      },
+      rules: {
+        changeTime: [{ required: true, message: '请选择换届时间', trigger: 'blur' }],
+        sessionTime: [{ required: true, message: '请输入届次', trigger: 'blur' }],
+        serveList: [{required: true,validator: validServe, trigger: "blur"}],
+        candidateList: [{required: true,validator: validCandidate, trigger: "blur"}],
       },
       tableDataJob: [],
       tableDataPerson: [],
@@ -117,38 +130,42 @@ export default {
       }
     }
   },
-  computed: {
-    colConfigsJob() {
-      return [
-        {prop: 'content', label: '职位'},
-        {prop: 'content', label: '姓名'},
-        {slot: 'options'},
-      ]
-    },
-    colConfigsPerson() {
-      return [
-        {prop: 'content', label: '职位'},
-        {prop: 'content', label: '候选人'},
-        {slot: 'options'},
-      ]
-    },
-    formRules() {
-      return {
-        // corpId: [{required: true, message: "请输入CorpId"}],
-      }
-    }
-  },
   methods: {
     cancel (isRefresh) {
       this.$emit('change', {
         type: 'List',
         isRefresh: !!isRefresh
       })
-    }
+    },
+    handleDelete(i, type) {
+      this.$confirm("确定要删除该数据?").then(() => {
+        if(type == 'candidateList') {
+          this.form.candidateList.splice(i, 1)
+        } else if(type == 'serveList') {
+          this.form.serveList.splice(i, 1)
+        }
+      }).catch(() => 0)
+    },
+    confirm() {
+      this.$refs.form.validate((valid) => {
+        if(valid) {
+          this.instance.post(`/app/apporganizationgeneralelection/add`, {
+            ...this.form
+          }).then(res=>{
+            if(res.code == 0) {
+              console.log(res);
+            }
+          })
+        }
+      })
+      
+    },
   }
 }
 </script>
 
 <style lang="scss" scope>
-.addChange {}
+.addChange {
+  height: 100%;
+}
 </style>
\ No newline at end of file