From d19fd32eb0692166230762146f1370da82775074 Mon Sep 17 00:00:00 2001
From: XiaoRuby <3114200645@qq.com>
Date: 星期一, 28 八月 2023 14:08:08 +0800
Subject: [PATCH] Crunchy-08/28合区代码

---
 src/components/view/measurementManagement.vue |  739 +++++++++++++++++++++++++++++++++++++-------------------
 1 files changed, 483 insertions(+), 256 deletions(-)

diff --git a/src/components/view/measurementManagement.vue b/src/components/view/measurementManagement.vue
index 8865a88..fbd1415 100644
--- a/src/components/view/measurementManagement.vue
+++ b/src/components/view/measurementManagement.vue
@@ -327,6 +327,7 @@
             v-show="viewResume == true"
             type="primary"
             size="mini"
+            @click="sunmitPlanForm"
             icon="el-icon-plus"
             :style="`background: #3a7bfa; opacity: ${addShow ? 1 : 0}`"
             >淇濆瓨</el-button
@@ -334,242 +335,376 @@
         </el-col>
       </el-row>
       <div class="second_div_main">
-        <div class="second_div_top">
-          <el-descriptions
-            class="secode_div_top_descriptions"
-            v-show="viewResume == false"
-          >
-            <template slot="title">
-              <span>璁″垝淇℃伅</span>
-              <span
-                v-show="measurePlanPage.accountOrPlan == false"
-                :style="
-                  `font-size: 14px; color: ${okOrNo == 'y' ? 'green' : 'red'}`
-                "
-                >&ensp;{{ okOrNo == "y" ? "宸插畬鎴�" : "鏈畬鎴�" }}</span
-              >
-            </template>
-            <el-descriptions-item label="璁″垝缂栧彿">{{
-              measureTop.plan_number
-            }}</el-descriptions-item>
-            <el-descriptions-item label="鍒涘缓浜�">{{
-              measureTop.founder
-            }}</el-descriptions-item>
-            <el-descriptions-item label="鍒涘缓鏃ユ湡">{{
-              measureTop.createTime
-            }}</el-descriptions-item>
-            <el-descriptions-item label="璁″垝鏃ユ湡">{{
-              measureTop.planTime
-            }}</el-descriptions-item>
-            <el-descriptions-item label="璁″垝鍗曚綅">{{
-              measureTop.plan_unit
-            }}</el-descriptions-item>
-            <el-descriptions-item label="璐熻矗浜�">{{
-              measureTop.person_charge
-            }}</el-descriptions-item>
-          </el-descriptions>
-          <el-descriptions
-            class="secode_div_top_descriptions"
-            v-show="viewResume == true"
-          >
-            <template slot="title">
-              <span>璁″垝淇℃伅</span>
-            </template>
+        <el-form :model="addFormDevice" :rules="rules" ref="ruleFormDevice">
+          <!-- form琛ㄥ崟 -->
+          <div class="second_div_top">
+            <el-descriptions
+              class="secode_div_top_descriptions"
+              v-show="viewResume == false"
             >
-            <el-descriptions-item label="璁″垝鏃ユ湡">
-              <el-date-picker
-                v-model="value1"
-                type="datetime"
-                placeholder="閫夋嫨鏃ユ湡鏃堕棿"
-              >
-              </el-date-picker>
-            </el-descriptions-item>
-            <el-descriptions-item label="璁″垝鍗曚綅">
-              <el-input
-                style="width: 206px"
-                placeholder="璇疯緭鍏ヨ鍒掑崟浣�"
-                clearable
-                v-model="addFormDevice.planningUnit"
-              ></el-input
-            ></el-descriptions-item>
-            <el-descriptions-item label="璐熻矗浜�">
-              <el-select
-                v-model="addFormDevice.responsiblePerson"
-                size="small"
-                placeholder="璐熻矗浜�"
-                class="table_top"
-              >
-                <el-option
-                  v-for="item in createPerson"
-                  :key="item.index"
-                  :label="item.name"
-                  :value="item.id"
-                ></el-option>
-              </el-select>
-            </el-descriptions-item>
-          </el-descriptions>
-        </div>
-        <div class="second_div_middle">
-          <div class="el_divider_span">璁惧淇℃伅</div>
-          <el-divider></el-divider>
-        </div>
-        <div class="second_div_table">
-          <div style="float: right;padding-bottom: 8px">
-            <el-button size="mini" type="primary" @click="addDeviceAdd">
-              <span style="font-size: 14px;">鏂板璁惧</span></el-button
-            >
-          </div>
-          <div v-show="viewResume == true">
-            <el-table
-              ref="multipleTable"
-              tooltip-effect="dark"
-              :data="addFormDevice.addDevice"
-              border
-              :Key="key"
-              style="width: 100%; margin-top: 12px;"
-              height="calc(100vh - 380px)"
-            >
-              <el-table-column type="selection" width="55" min-width="5%">
-              </el-table-column>
-              <el-table-column label="浠櫒璁惧缂栫爜" min-width="10%" prop="code">
-              </el-table-column>
-              <el-table-column label="浠櫒璁惧鍚嶇О" min-width="10%" prop="name">
-                <template scope="scope">
-                  <el-select
-                    v-model="scope.row.deviceId"
-                    @change="nameAndCode(scope)"
-                    size="small"
-                    placeholder="璇烽�夋嫨璁惧"
-                    class="table_top"
-                  >
-                    <el-option
-                      v-for="item in deviceIdAndNameAndCode"
-                      :key="item.index"
-                      :label="item.name"
-                      :value="item.id"
-                    ></el-option>
-                  </el-select>
-                </template>
-              </el-table-column>
-              <el-table-column
-                label="娴嬮噺鑼冨洿"
-                min-width="10%"
-              ></el-table-column>
-              <el-table-column
-                label="璁¢噺鍛ㄦ湡"
-                min-width="10%"
-              ></el-table-column>
-              <el-table-column
-                label="璁¢噺缁撴灉"
-                min-width="10%"
-              ></el-table-column>
-              <el-table-column
-                label="璁¢噺鏃ユ湡"
-                min-width="10%"
-              ></el-table-column>
-              <el-table-column
-                label="璁¢噺鏈夋晥鏈�"
-                min-width="10%"
-              ></el-table-column>
-              <el-table-column label="鎿嶄綔" min-width="10%">
-                <el-button type="text" size="mini">浣滃簾</el-button>
-              </el-table-column>
-            </el-table>
-          </div>
-          <div v-show="viewResume == false">
-            <el-table
-              :data="recordData"
-              tooltip-effect="dark"
-              :header-cell-style="{ 'text-align': 'center' }"
-              border
-              :row-style="{ height: '50px' }"
-              :cell-style="{ padding: '0px', 'text-align': 'center' }"
-              style="width: 100%; margin-top: 12px;"
-              height="calc(100vh - 382px)"
-            >
-              <el-table-column
-                label="浠櫒璁惧缂栫爜"
-                prop="code"
-              ></el-table-column>
-              <el-table-column
-                label="浠櫒璁惧鍚嶇О"
-                prop="name"
-              ></el-table-column>
-              <el-table-column
-                label="娴嬮噺鑼冨洿"
-                prop="measuring_range"
-              ></el-table-column>
-              <el-table-column
-                label="璁¢噺鍛ㄦ湡"
-                prop="measure_period"
-              ></el-table-column>
-              <el-table-column label="璁¢噺缁撴灉" prop="measure_result">
-                <template slot-scope="scope">
-                  <el-tag
-                    v-if="scope.row.measure_result == 1"
-                    disable-transitions
-                    type="success"
-                    >杩愯</el-tag
-                  >
-                  <el-tag
-                    v-else-if="scope.row.measure_result == 2"
-                    disable-transitions
-                    type="danger"
-                    >澶卞噯</el-tag
-                  >
-                  <el-tag
-                    v-else-if="scope.row.measure_result == null"
-                    disable-transitions
-                    type="info"
-                    >鏈閲�</el-tag
-                  >
-                </template></el-table-column
-              >
-              <el-table-column
-                label="璁¢噺鏃ユ湡"
-                prop="measureDate"
-              ></el-table-column>
-              <el-table-column
-                label="璁¢噺鏈夋晥鏈�"
-                prop="validityEnd"
-              ></el-table-column>
-              <el-table-column
-                label="璐熻矗浜�"
-                prop="personCharge"
-              ></el-table-column>
-              <el-table-column
-                label="鍒涘缓鏃ユ湡"
-                prop="createTime"
-              ></el-table-column>
-              <el-table-column label="鍒涘缓浜�" prop="founder"></el-table-column>
-              <el-table-column
-                label="璁¢噺鍗曚綅"
-                prop="plan_unit"
-              ></el-table-column>
-              <el-table-column
-                width="200px"
-                label="璁¢噺缂栧彿"
-                prop="measure_number"
-              ></el-table-column>
-            </el-table>
+              <template slot="title">
+                <span>璁″垝淇℃伅</span>
+                <span
+                  v-show="measurePlanPage.accountOrPlan == false"
+                  :style="
+                    `font-size: 14px; color: ${okOrNo == 'y' ? 'green' : 'red'}`
+                  "
+                  >&ensp;{{ okOrNo == "y" ? "宸插畬鎴�" : "鏈畬鎴�" }}</span
+                >
+              </template>
+              <el-descriptions-item label="璁″垝缂栧彿">{{
+                measureTop.plan_number
+              }}</el-descriptions-item>
+              <el-descriptions-item label="鍒涘缓浜�">{{
+                measureTop.founder
+              }}</el-descriptions-item>
+              <el-descriptions-item label="鍒涘缓鏃ユ湡">{{
+                measureTop.createTime
+              }}</el-descriptions-item>
+              <el-descriptions-item label="璁″垝鏃ユ湡">{{
+                measureTop.planTime
+              }}</el-descriptions-item>
+              <el-descriptions-item label="璁″垝鍗曚綅">{{
+                measureTop.plan_unit
+              }}</el-descriptions-item>
+              <el-descriptions-item label="璐熻矗浜�">{{
+                measureTop.person_charge
+              }}</el-descriptions-item>
+            </el-descriptions>
             <div
-              class="middle_under_div"
-              v-show="measurePlanPage.accountOrPlan == false"
+              class="secode_div_top_descriptions_add"
+              v-show="viewResume == true"
             >
-              <el-pagination
-                @size-change="handleSizeChange"
-                @current-change="handleCurrentChange"
-                :current-page="currentPage"
-                :page-sizes="[10, 15, 20, 25]"
-                :pager-count="9"
-                :page-size="12"
-                layout="total, sizes, prev, pager, next, jumper"
-                :total="measurePlanPageTotal"
+              <el-form-item
+                required
+                prop="plannedDate"
+                label="璁″垝鏃ユ湡锛�"
+                style="width: 30%"
               >
-              </el-pagination>
+                <el-date-picker
+                  v-model="addFormDevice.plannedDate"
+                  value-format="yyyy-MM-dd"
+                  type="daterange"
+                  range-separator="~"
+                  start-placeholder="寮�濮嬫棩鏈�"
+                  end-placeholder="缁撴潫鏃ユ湡"
+                >
+                </el-date-picker>
+              </el-form-item>
+              <el-form-item
+                label="璁″垝鍗曚綅锛�"
+                prop="planUnit"
+                required
+                style="width: 20%"
+              >
+                <el-input
+                  style="width: 206px"
+                  placeholder="璇疯緭鍏ヨ鍒掑崟浣�"
+                  clearable
+                  v-model="addFormDevice.planUnit"
+                ></el-input>
+              </el-form-item>
+              <el-form-item
+                label="璐熻矗浜猴細"
+                prop="personCharge"
+                required
+                style="width: 20%"
+              >
+                <el-select
+                  v-model="addFormDevice.personCharge"
+                  style="width: 206px"
+                  placeholder="璐熻矗浜�"
+                  class="table_top"
+                >
+                  <el-option
+                    v-for="item in createPerson"
+                    :key="item.index"
+                    :label="item.name"
+                    :value="item.id"
+                  ></el-option>
+                </el-select>
+              </el-form-item>
             </div>
           </div>
-        </div>
+          <div class="second_div_middle">
+            <div class="el_divider_span">璁惧淇℃伅</div>
+            <el-divider></el-divider>
+          </div>
+          <div class="second_div_table">
+            <div style="float: right;padding-bottom: 8px">
+              <el-button size="mini" type="primary" @click="addDeviceAdd">
+                <span style="font-size: 14px;">鏂板璁惧</span></el-button
+              >
+            </div>
+            <div v-show="viewResume == true">
+              <el-table
+                ref="multipleTableDevice"
+                tooltip-effect="dark"
+                :data="addFormDevice.measureLedgerList"
+                header-cell-class-name="addHeaderCellClassName"
+                border
+                class="end_table"
+                height="calc(100vh - 380px)"
+              >
+                <el-table-column
+                  label="浠櫒璁惧缂栫爜"
+                  min-width="10%"
+                  prop="code"
+                >
+                </el-table-column>
+                <el-table-column min-width="10%" prop="name">
+                  <template slot="header">
+                    <span class="requiredclass">浠櫒璁惧鍚嶇О</span>
+                  </template>
+                  <template scope="scope">
+                    <el-form-item
+                      :prop="`measureLedgerList[` + scope.$index + `].deviceId`"
+                      :rules="{
+                        required: true,
+                        trigger: 'change'
+                      }"
+                    >
+                      <el-select
+                        v-model="scope.row.deviceId"
+                        @change="nameAndCode(scope)"
+                        size="small"
+                        placeholder="璇烽�夋嫨璁惧"
+                        class="table_top"
+                      >
+                        <el-option
+                          v-for="item in deviceIdAndNameAndCode"
+                          :key="item.index"
+                          :label="item.name"
+                          :value="item.id"
+                        ></el-option>
+                      </el-select>
+                    </el-form-item>
+                  </template>
+                </el-table-column>
+                <el-table-column label="娴嬮噺鑼冨洿" min-width="10%">
+                  <template scope="scope">
+                    <el-form-item
+                      :prop="
+                        `measureLedgerList[` + scope.$index + `].measuringRange`
+                      "
+                      :rules="{
+                        required: true,
+                        trigger: 'blur'
+                      }"
+                    >
+                      <el-input
+                        placeholder="璇疯緭鍏ユ祴閲忚寖鍥�"
+                        clearable
+                        size="small"
+                        v-model="
+                          addFormDevice.measureLedgerList[scope.$index]
+                            .measuringRange
+                        "
+                      ></el-input>
+                    </el-form-item>
+                  </template>
+                </el-table-column>
+                <el-table-column label="璁¢噺鍛ㄦ湡" min-width="5%">
+                  <template scope="scope">
+                    <span
+                      v-show="
+                        addFormDevice.measureLedgerList[scope.$index]
+                          .measurePeriod !== ''
+                      "
+                      >{{
+                        addFormDevice.measureLedgerList[scope.$index]
+                          .measurePeriod
+                      }}/鏈�</span
+                    >
+                  </template>
+                </el-table-column>
+                <el-table-column label="璁¢噺缁撴灉" min-width="10%">
+                  <template scope="scope">
+                    <el-select
+                      v-model="
+                        addFormDevice.measureLedgerList[scope.$index]
+                          .measureResult
+                      "
+                      style="padding-top: 4px;"
+                      size="small"
+                      placeholder="璇烽�夋嫨璁¢噺缁撴灉"
+                      class="table_top"
+                    >
+                      <el-option label="姝e父" value="1"></el-option>
+                      <el-option label="澶卞噯" value="2"></el-option>
+                    </el-select> </template
+                ></el-table-column>
+                <el-table-column width="200px">
+                  <template slot="header">
+                    <span class="requiredclass">璁¢噺鏃ユ湡</span>
+                  </template>
+                  <template scope="scope">
+                    <el-form-item
+                      :prop="
+                        `measureLedgerList[` + scope.$index + `].measureDate`
+                      "
+                      :rules="{
+                        required: true,
+                        trigger: 'change'
+                      }"
+                    >
+                      <el-date-picker
+                        size="small"
+                        style="width: 150px;"
+                        v-model="
+                          addFormDevice.measureLedgerList[scope.$index]
+                            .measureDate
+                        "
+                        value-format="yyyy-MM-dd"
+                        type="date"
+                        placeholder="閫夋嫨鏃ユ湡"
+                      >
+                      </el-date-picker>
+                    </el-form-item>
+                  </template>
+                </el-table-column>
+                <el-table-column width="300px">
+                  <template slot="header">
+                    <span class="requiredclass">璁¢噺鏈夋晥鏈�</span>
+                  </template>
+                  <template scope="scope">
+                    <el-form-item
+                      :prop="
+                        `measureLedgerList[` + scope.$index + `].planDateList`
+                      "
+                      :rules="{
+                        required: true,
+                        trigger: 'change'
+                      }"
+                    >
+                      <el-date-picker
+                        v-model="
+                          addFormDevice.measureLedgerList[scope.$index]
+                            .planDateList
+                        "
+                        value-format="yyyy-MM-dd"
+                        size="small"
+                        style="width: 270px"
+                        @change="pickerplanDateList(scope)"
+                        type="daterange"
+                        range-separator="~"
+                        start-placeholder="寮�濮嬫棩鏈�"
+                        end-placeholder="缁撴潫鏃ユ湡"
+                      >
+                      </el-date-picker>
+                    </el-form-item>
+                  </template>
+                </el-table-column>
+                <el-table-column label="鎿嶄綔" min-width="10%">
+                  <template scope="scope">
+                    <el-button
+                      type="text"
+                      size="mini"
+                      @click="measureLedgerListDelete(scope)"
+                      >鍒犻櫎</el-button
+                    >
+                  </template>
+                </el-table-column>
+              </el-table>
+            </div>
+            <div v-show="viewResume == false">
+              <el-table
+                :data="recordData"
+                tooltip-effect="dark"
+                :header-cell-style="{ 'text-align': 'center' }"
+                border
+                :row-style="{ height: '50px' }"
+                :cell-style="{ padding: '0px', 'text-align': 'center' }"
+                style="width: 100%; margin-top: 12px;"
+                height="calc(100vh - 400px)"
+              >
+                <el-table-column
+                  label="浠櫒璁惧缂栫爜"
+                  prop="code"
+                ></el-table-column>
+                <el-table-column
+                  label="浠櫒璁惧鍚嶇О"
+                  prop="name"
+                ></el-table-column>
+                <el-table-column
+                  label="娴嬮噺鑼冨洿"
+                  prop="measuring_range"
+                ></el-table-column>
+                <el-table-column
+                  label="璁¢噺鍛ㄦ湡"
+                  prop="measure_period"
+                ></el-table-column>
+                <el-table-column label="璁¢噺缁撴灉" prop="measure_result">
+                  <template slot-scope="scope">
+                    <el-tag
+                      v-if="scope.row.measure_result == 1"
+                      disable-transitions
+                      type="success"
+                      >杩愯</el-tag
+                    >
+                    <el-tag
+                      v-else-if="scope.row.measure_result == 2"
+                      disable-transitions
+                      type="danger"
+                      >澶卞噯</el-tag
+                    >
+                    <el-tag
+                      v-else-if="scope.row.measure_result == null"
+                      disable-transitions
+                      type="info"
+                      >鏈閲�</el-tag
+                    >
+                  </template></el-table-column
+                >
+                <el-table-column
+                  label="璁¢噺鏃ユ湡"
+                  prop="measureDate"
+                ></el-table-column>
+                <el-table-column
+                  label="璁¢噺鏈夋晥鏈�"
+                  prop="validityEnd"
+                ></el-table-column>
+                <el-table-column
+                  label="璐熻矗浜�"
+                  prop="personCharge"
+                ></el-table-column>
+                <el-table-column
+                  label="鍒涘缓鏃ユ湡"
+                  prop="createTime"
+                ></el-table-column>
+                <el-table-column
+                  label="鍒涘缓浜�"
+                  prop="founder"
+                ></el-table-column>
+                <el-table-column
+                  label="璁¢噺鍗曚綅"
+                  prop="plan_unit"
+                ></el-table-column>
+                <el-table-column
+                  width="200px"
+                  label="璁¢噺缂栧彿"
+                  prop="measure_number"
+                ></el-table-column>
+              </el-table>
+              <div
+                class="middle_under_div"
+                v-show="measurePlanPage.accountOrPlan == false"
+              >
+                <el-pagination
+                  @size-change="handleSizeChange"
+                  @current-change="handleCurrentChange"
+                  :current-page="currentPage"
+                  :page-sizes="[10, 15, 20, 25]"
+                  :pager-count="9"
+                  :page-size="12"
+                  layout="total, sizes, prev, pager, next, jumper"
+                  :total="measurePlanPageTotal"
+                >
+                </el-pagination>
+              </div>
+            </div>
+          </div>
+        </el-form>
       </div>
     </div>
   </div>
@@ -622,14 +757,37 @@
       measureTop: {},
       measurePlanPageTotal: "",
       okOrNo: "",
-      value1: "",
       deviceIdAndNameAndCode: [],
       addFormDevice: {
-        responsiblePerson: "", //璐熻矗浜�
-        planningUnit: "", // 璁″垝鍗曚綅
-        addDevice: []
+        plannedDate: [], // 璁″垝鏃ユ湡寮�濮嬫椂闂寸粨鏉熸椂闂撮�夋嫨鍣�
+        planDateBegin: "", // 璁″垝鏃ユ湡寮�濮嬫椂闂�
+        planDateEnd: "", // 璁″垝鏃ユ湡缁撴潫鏃堕棿
+        personCharge: "", //璐熻矗浜�
+        planUnit: "", // 璁″垝鍗曚綅
+        measureLedgerList: []
       },
-      createPerson: [] // 鍒涘缓浜哄垪琛�
+      createPerson: [], // 鍒涘缓浜哄垪琛�
+      rules: {
+        planUnit: [
+          { required: true, message: "璇疯緭鍏ヨ鍒掑崟浣�", trigger: "blur" },
+          { min: 1, max: 25, message: "闀垮害鍦� 1 鍒� 25 涓瓧绗�", trigger: "blur" }
+        ],
+        personCharge: [
+          { required: true, message: "璇烽�夋嫨璐熻矗浜�", trigger: "change" }
+        ],
+        plannedDate: [
+          {
+            type: "array",
+            required: true,
+            message: "璇烽�夋嫨璁″垝鏃ユ湡鍖洪棿",
+            fields: {
+              //tpye绫诲瀷璇曟儏鍐佃�屽畾,鎵�浠ュ鏋滆繑鍥炵殑鏄痙ate灏辨敼鎴恉ate
+              0: { type: "string", required: true, message: "璇烽�夋嫨寮�濮嬫棩鏈�" },
+              1: { type: "string", required: true, message: "璇烽�夋嫨缁撴潫鏃ユ湡" }
+            }
+          }
+        ]
+      }
     };
   },
   mounted() {
@@ -716,7 +874,6 @@
           params: this.measurePlanPage
         })
         .then(res => {
-          console.log(`output->res.data`, res.data[0]);
           this.recordData = res.data.table;
           this.measureTop = res.data.top;
           this.measurePlanPageTotal = res.data.total;
@@ -726,30 +883,76 @@
       }
     },
     addDeviceAdd() {
-      let obj = {
+      let measureLedgerList = {
         code: "",
-
         deviceId: "",
-        measureDate: "2023-08-16",
-        measurePeriod: 12,
-        measureResult: 0,
-        measuringRange: "0.2302",
-        validityBegin: "2023-08-16",
-        validityEnd: "2023-08-16"
+        measureDate: "",
+        planDateList: "", // 缂撳瓨鏁版嵁
+        measurePeriod: "",
+        measureResult: "",
+        measuringRange: "",
+        validityBegin: "",
+        validityEnd: ""
       };
-      this.addFormDevice.addDevice.push(obj);
+      this.addFormDevice.measureLedgerList.push(measureLedgerList);
     },
     nameAndCode(scope) {
-      let index = this.deviceIdAndNameAndCode.find(
+      let deviceMessage = this.deviceIdAndNameAndCode.find(
         role => role.id === scope.row.deviceId
       );
-      this.addDeviceAdd.code = index.code;
-      this.addFormDevice.addDevice[scope.$index].push = this.addDeviceAdd;
-      this.$nextTick(() => {
-        this.key++;
+      this.addFormDevice.measureLedgerList[scope.$index].code =
+        deviceMessage.code;
+    },
+    addHeaderCellClassName({ columnIndex }) {
+      if (columnIndex === 0 || columnIndex === 1) {
+        return "requiredclass";
+      }
+    },
+    pickerplanDateList(scope) {
+      let begin = scope.row.planDateList[0];
+      let end = scope.row.planDateList[1];
+      this.addFormDevice.measureLedgerList[scope.$index].validityBegin = begin;
+      this.addFormDevice.measureLedgerList[scope.$index].validityEnd = end;
+
+      let StartDate = begin.split("-");
+      let EndDate = end.split("-");
+      let dayDate = EndDate[2] - StartDate[2];
+
+      EndDate = parseInt(EndDate[0]) * 12 + parseInt(EndDate[1]);
+      StartDate = parseInt(StartDate[0]) * 12 + parseInt(StartDate[1]);
+
+      let resultDate = EndDate - StartDate + 1;
+      this.addFormDevice.measureLedgerList[
+        scope.$index
+      ].measurePeriod = resultDate;
+    },
+    measureLedgerListDelete(scope) {
+      this.addFormDevice.measureLedgerList.splice(scope.$index, 1);
+    },
+    sunmitPlanForm() {
+      this.$refs.ruleFormDevice.validate(valid => {
+        if (valid) {
+          this.addFormDevice.planDateBegin = this.addFormDevice.plannedDate[0];
+          this.addFormDevice.planDateEnd = this.addFormDevice.plannedDate[1];
+          delete this.addFormDevice.plannedDate;
+          this.addFormDevice.measureLedgerList.forEach(i => {
+            i.validityBegin = i.planDateList[0];
+            i.validityEnd = i.planDateList[1];
+            delete i.planDateList;
+          });
+          this.$axios
+            .post(this.$api.url.meteringPlanDevicePlan, this.addFormDevice, {
+              headers: { "Content-Type": "application/json" }
+            })
+            .then(res => {
+              this.$message({
+                message: res.message,
+                type: "success"
+              });
+              this.addShow = false;
+            });
+        }
       });
-      // addDevice
-      console.log(`output->this.addDe`, this.addFormDevice);
     }
   },
   watch: {
@@ -779,7 +982,7 @@
 };
 </script>
 
-<style>
+<style less="scss">
 .main_div {
   height: calc(100vh - 110px);
   position: relative;
@@ -795,6 +998,23 @@
   height: calc(100vh - 110px);
   transition: 0.5s;
 }
+.secode_div_top_descriptions_add {
+  padding-left: 30px;
+  padding-top: 48px;
+
+  .el-form-item {
+    float: left;
+  }
+}
+.end_table {
+  width: 100%;
+  margin-top: 12px;
+
+  .cell {
+    height: 40px;
+  }
+}
+
 .top_div {
   width: 100%;
   height: 100px;
@@ -838,7 +1058,6 @@
   padding: 35px 0;
 }
 .el-descriptions-item__label {
-  padding-top: 8px !important;
   height: 20px !important;
 }
 .el-input__prefix {
@@ -896,8 +1115,16 @@
   padding-bottom: 15px;
 }
 .secode_div_top_descriptions {
-  padding-left: 20px;
-  padding-top: 10px;
+  padding-left: 30px;
+  padding-top: 17px;
+}
+.secode_div_top_descriptions .el-form-item {
+  float: left;
+}
+.requiredclass::before {
+  content: "*";
+  color: #f56c6c;
+  margin-right: 6px;
 }
 .el-descriptions__title {
   font-size: 15px;

--
Gitblit v1.9.3