From a3911c73d85172fab42edeb9a5980f27f4997de5 Mon Sep 17 00:00:00 2001
From: zhangsiyu <q3183592900@qq.com>
Date: Mon, 3 Jul 2023 18:05:24 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../turndelivery/deliveryInfo.vue             | 1648 ++++++++++-------
 1 file changed, 1019 insertions(+), 629 deletions(-)

diff --git a/src/views/distribution/turndelivery/deliveryInfo.vue b/src/views/distribution/turndelivery/deliveryInfo.vue
index 841dbb4e..7e209eac 100644
--- a/src/views/distribution/turndelivery/deliveryInfo.vue
+++ b/src/views/distribution/turndelivery/deliveryInfo.vue
@@ -1,667 +1,1057 @@
 <template>
+  <!-- <div>
+    <el-row>
+      <el-button
+        type="primary"
+        plain
+        style="margin-left: 15%; width: 100px; height: 40px"
+        @click="ccc"
+        >自主配送</el-button
+      >
+      <el-button
+        type="primary"
+        plain
+        style="margin-left: 30%; width: 100px; height: 40px"
+        @click="ddd"
+        >外协</el-button
+      >
+    </el-row>
+  </div> -->
+  <div class="tabbertop">
+    <div class="xz">
+      自主配送
+    </div>
     <div>
-        <el-row>
-            <el-button type="primary" plain style="margin-left: 15%;width: 100px;height: 40px" @click="ccc">自主配送</el-button>
-            <el-button type="primary" plain style="margin-left: 30%;width: 100px;height: 40px" @click="ddd">外协</el-button>
-        </el-row>
+      外协配送
     </div>
-    <div style="border: 3px solid pink;margin: 2%" v-if="aaa">
-        <el-form ref="form" :model="form" label-width="100px" style="margin: 3px">
-            <el-row>
-                <el-col :span="8">
-                    <el-form-item label="车辆信息:"  prop="goodsShelfId">
-                        <el-select v-model="form.vehicleIds" multiple placeholder="请选择车辆">
-                            <el-option
-                                    v-for="item in vehicleData"
-                                    :key="item.id"
-                                    :label="item.vehicleNub"
-                                    :value="item.id">
-                            </el-option>
-                        </el-select>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="8">
-                    <el-form-item label="司机负责人:"  prop="goodsShelfId" >
-                        <el-select v-model="form.masterDriver"  placeholder="请选择车辆"  @change="changeMasterDriver">
-                            <el-option
-                                    v-for="item in masterDriverData"
-                                    :key="item.id"
-                                    :label="item.name"
-                                    :value="item.id">
-                            </el-option>
-                        </el-select>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="8">
-                    <el-form-item label="配送司机信息:"  prop="goodsShelfId">
-                        <el-select v-model="form.slaveDriver" multiple placeholder="请选择车辆"  @change="changeSlaveDriver">
-                            <el-option
-
-                                    v-for="item in slaveDriverData"
-                                    :key="item.id"
-                                    :label="item.name"
-                                    :value="item.id">
-                            </el-option>
-                        </el-select>
-                    </el-form-item>
-                </el-col>
-            </el-row>
-            <el-row>
-                <el-col :span="6">
-                <el-form-item label="叉车司机:"  prop="forklift" >
-                        <el-select v-model="form.forklift"  placeholder="请选择叉车司机">
-                            <el-option
-                                    v-for="item in this.forkliftData"
-                                    :key="item.dictKey"
-                                    :label="item.dictValue"
-                                    :value="item.dictKey">
-                            </el-option>
-<!--                            {{this.forkliftData}}-->
-                        </el-select>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="6">
-                    <el-form-item label="装卸班组:"  prop="loader">
-                        <el-select v-model="form.loader"  placeholder="请选择装卸班组">
-                            <el-option
-                                    v-for="item in loaderData"
-                                    :key="item.dictKey"
-                                    :label="item.dictValue"
-                                    :value="item.dictKey">
-                            </el-option>
-                        </el-select>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="3">
-<!--                    <el-radio-group v-model="form.loadAndUnload" >-->
-<!--                        <el-radio  v-for="item in this.loadAndUnloadData" :label="item.dictValue" :value="item.dictKey"></el-radio>-->
-<!--                    </el-radio-group>-->
-                    <el-checkbox-group v-model="this.loadAndUnload">
-                        <el-checkbox v-for="item in loadAndUnloadData" :label="item.dictKey" :value="item.dictKey">{{item.dictValue}}</el-checkbox>
-                    </el-checkbox-group>
-                </el-col>
-            </el-row>
-            <el-row>
-                <el-col :span="6">
-                    <el-form-item label="备货区域:"  prop="goodsAreaId">
-                        <el-select v-model="form.goodsAreaId"  placeholder="请选择备货区域">
-                            <el-option
-                                    v-for="item in goodsAreaData"
-                                    :key="item.dictKey"
-                                    :label="item.dictValue"
-                                    :value="item.dictKey">
-                            </el-option>
-                        </el-select>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="6">
-                    <el-form-item label="备货时间:"  prop="goodsShelfId">
-                        <el-date-picker
-                                v-model="form.stockupDate"
-                                type="date"
-                                placeholder="请选择备货时间">
-                        </el-date-picker>
-                    </el-form-item>
-                </el-col>
-            </el-row>
-            <el-row>
-                <el-col :span="24">
-                    <el-form-item label="备注:"  prop="remarks">
-                        <el-input
-                                type="textarea"
-                                :rows="2"
-                                placeholder="请输入内容"
-                                v-model="form.remarks">
-                        </el-input>
-                    </el-form-item>
-                </el-col>
-            </el-row>
-
-        </el-form>
+  </div>
+  <!-- <div style="border: 3px solid pink; margin: 2%" v-if="aaa">
+    <el-form ref="form" :model="form" label-width="100px" style="margin: 3px">
+      <el-row>
+        <el-col :span="8">
+          <el-form-item label="车辆信息:" prop="goodsShelfId">
+            <el-select v-model="form.vehicleIds" multiple placeholder="请选择车辆">
+              <el-option
+                v-for="item in vehicleData"
+                :key="item.id"
+                :label="item.vehicleNub"
+                :value="item.id"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="司机负责人:" prop="goodsShelfId">
+            <el-select
+              v-model="form.masterDriver"
+              placeholder="请选择车辆"
+              @change="changeMasterDriver"
+            >
+              <el-option
+                v-for="item in masterDriverData"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="配送司机信息:" prop="goodsShelfId">
+            <el-select
+              v-model="form.slaveDriver"
+              multiple
+              placeholder="请选择车辆"
+              @change="changeSlaveDriver"
+            >
+              <el-option
+                v-for="item in slaveDriverData"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="6">
+          <el-form-item label="叉车司机:" prop="forklift">
+            <el-select v-model="form.forklift" placeholder="请选择叉车司机">
+              <el-option
+                v-for="item in this.forkliftData"
+                :key="item.dictKey"
+                :label="item.dictValue"
+                :value="item.dictKey"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="装卸班组:" prop="loader">
+            <el-select v-model="form.loader" placeholder="请选择装卸班组">
+              <el-option
+                v-for="item in loaderData"
+                :key="item.dictKey"
+                :label="item.dictValue"
+                :value="item.dictKey"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="3">
+          <el-checkbox-group v-model="this.loadAndUnload">
+            <el-checkbox
+              v-for="item in loadAndUnloadData"
+              :label="item.dictKey"
+              :value="item.dictKey"
+              >{{ item.dictValue }}</el-checkbox
+            >
+          </el-checkbox-group>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="6">
+          <el-form-item label="备货区域:" prop="goodsAreaId">
+            <el-select v-model="form.goodsAreaId" placeholder="请选择备货区域">
+              <el-option
+                v-for="item in goodsAreaData"
+                :key="item.dictKey"
+                :label="item.dictValue"
+                :value="item.dictKey"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="备货时间:" prop="goodsShelfId">
+            <el-date-picker v-model="form.stockupDate" type="date" placeholder="请选择备货时间">
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="24">
+          <el-form-item label="备注:" prop="remarks">
+            <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="form.remarks">
+            </el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div> -->
+  <div class="maboxc">
+    <div class="minbox">
+      <div>
+        <span>*</span>
+        车辆信息
+      </div>
+      <div>
+        <el-scrollbar height="140px" style="border: 1px solid #D3832A;border-radius: 3px;">
+          <div class="itemmabox">
+            <span v-for="item in [1,3,45,5,1,123,1,1241,1,151,13,1]">
+              {{ item }}
+            </span>
+          </div>
+        </el-scrollbar>
+      </div>
     </div>
-
-    <div style="border: 3px solid pink;margin: 2%" v-if="bbb">
-        <el-form ref="form" :model="form" label-width="100px" style="margin: 3px">
-            <el-row>
-                <el-col :span="6">
-                    <el-form-item label="外协来源:"  prop="goodsShelfId">
-                        <el-select v-model="form.tripartiteSource"  placeholder="请选择来源">
-                            <el-option
-                                    v-for="item in tripartiteSourceData"
-                                    :key="item.dictKey"
-                                    :label="item.dictValue"
-                                    :value="item.dictValue">
-                            </el-option>
-                        </el-select>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="6">
-                    <el-form-item label="司机名称:"  prop="goodsShelfId">
-                        <el-input v-model="form.driverName" placeholder="请输入司机名称"></el-input>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="6">
-                    <el-form-item label="司机电话:"  prop="goodsShelfId">
-                        <el-input v-model="form.deiverPhone" placeholder="请输入本次费用"></el-input>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="6">
-                    <el-form-item label="车辆车牌:"  prop="goodsShelfId">
-                        <el-input v-model="form.vehicleNum" placeholder="请输入本次费用"></el-input>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="6">
-                        <el-form-item label="配送费用:"  prop="goodsShelfId">
-                            <el-input v-model="form.deliveryFee" placeholder="请输入本次费用"></el-input>
-                        </el-form-item>
-                </el-col>
-            </el-row>
-            <el-row>
-                <el-col :span="6">
-                    <el-form-item label="叉车司机:"  prop="forklift" >
-                        <el-select v-model="form.forklift"  placeholder="请选择叉车司机">
-                            <el-option
-                                    v-for="item in this.forkliftData"
-                                    :key="item.dictKey"
-                                    :label="item.dictValue"
-                                    :value="item.dictKey">
-                            </el-option>
-                        </el-select>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="6">
-                    <el-form-item label="装卸班组:"  prop="loader">
-                        <el-select v-model="form.loader"  placeholder="请选择装卸班组">
-                            <el-option
-                                    v-for="item in loaderData"
-                                    :key="item.dictKey"
-                                    :label="item.dictValue"
-                                    :value="item.dictKey">
-                            </el-option>
-                        </el-select>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="3">
-                    <!--                    <el-radio-group v-model="form.loadAndUnload" >-->
-                    <!--                        <el-radio  v-for="item in this.loadAndUnloadData" :label="item.dictValue" :value="item.dictKey"></el-radio>-->
-                    <!--                    </el-radio-group>-->
-                    <el-checkbox-group v-model="form.loadAndUnload">
-                        <el-checkbox v-for="item in loadAndUnloadData" :label="item.dictKey" :value="item.dictKey">{{item.dictValue}}</el-checkbox>
-                    </el-checkbox-group>
-                </el-col>
-            </el-row>
-            <el-row>
-                <el-col :span="6">
-                    <el-form-item label="备货区域:"  prop="goodsAreaId">
-                        <el-select v-model="form.goodsAreaId"  placeholder="请选择备货区域">
-                            <el-option
-                                    v-for="item in goodsAreaData"
-                                    :key="item.dictKey"
-                                    :label="item.dictValue"
-                                    :value="item.dictKey">
-                            </el-option>
-                        </el-select>
-                    </el-form-item>
-                </el-col>
-                <el-col :span="6">
-                    <el-form-item label="备货时间:"  prop="goodsShelfId">
-                        <el-date-picker
-                                v-model="form.stockupDate"
-                                type="date"
-                                placeholder="请选择备货时间">
-                        </el-date-picker>
-                    </el-form-item>
-                </el-col>
-            </el-row>
-            <el-row>
-                <el-col :span="24">
-                    <el-form-item label="备注:"  prop="remarks">
-                        <el-input
-                                type="textarea"
-                                :rows="2"
-                                placeholder="请输入内容"
-                                v-model="form.remarks">
-                        </el-input>
-                    </el-form-item>
-                </el-col>
-            </el-row>
-        </el-form>
+    <div class="minbox">
+      <div>
+        <span>*</span>
+        司机负责人
+      </div>
+      <div>
+        <el-scrollbar height="140px" style="border: 1px solid #D3832A;border-radius: 3px;">
+          <div class="itemmabox">
+            <span v-for="item in [1,3,45,5,1,123,1,1241,1,151,13,1]">
+              {{ item }}
+            </span>
+          </div>
+        </el-scrollbar>
+      </div>
     </div>
-    <div>
-        <el-row>
-            <!-- 列表模块 -->
-            <el-table
-                    :data="data"
-                    :height="height"
-                    :border="option.border"
-                    style="width: 100%">
-                <template v-for="(item,index) in option.column">
-                    <!-- table字段 -->
-                    <el-table-column v-if="item.hide!==true"
-                                     :prop="item.prop"
-                                     :label="item.label"
-                                     :width="item.width"
-                                     :key="index">
-                    </el-table-column>
-                </template>
-            </el-table>
-            <el-table ref="table" v-loading="loading"
-                      :data="data"
-                      style="width: 100%; height:100%"
-                      :border="option.border">
-
-                <el-table-column type="expand" v-if="option.expand" align="center"></el-table-column>
-                <el-table-column v-if="option.index" label="序号" type="index" width="80px"
-                                 align="center"></el-table-column>
-
-                <template v-for="(item,index) in option.column">
-                    <!-- table字段 -->
-                    <el-table-column v-if="item.hide!==true"
-                                     :prop="item.prop"
-                                     :label="item.label"
-                                     :width="item.width"
-                                     :key="index">
-                    </el-table-column>
-                </template>
-                <!-- 操作栏模块 -->
-            </el-table>
-        </el-row>
-        <el-form-item style="margin-left: 45%;margin-top: 10px">
-            <el-button type="primary" icon="el-icon-circle-close"  @click="onSubmitOrder">提交(配送内容)</el-button>
-            <el-button icon="el-icon-circle-close" @click="this.$router.go(-1)">返 回</el-button>
-        </el-form-item>
+    <div class="minbox">
+      <div>
+        <span>*</span>
+        配送司机信息
+      </div>
+      <div>
+        <el-scrollbar height="140px" style="border: 1px solid #D3832A;border-radius: 3px;">
+          <div class="itemmabox">
+            <span v-for="item in [1,3,45,5,1,123,1,1241,1,151,13,1]">
+              {{ item }}
+            </span>
+          </div>
+        </el-scrollbar>
+      </div>
     </div>
+    <div class="minbox">
+      <div>
+        <span>*</span>
+        叉车司机
+      </div>
+      <div>
+        <el-scrollbar height="140px" style="border: 1px solid #D3832A;border-radius: 3px;">
+          <div class="itemmabox">
+            <span v-for="item in [1,3,45,5,1,123,1,1241,1,151,13,1]">
+              {{ item }}
+            </span>
+          </div>
+        </el-scrollbar>
+      </div>
+    </div>
+  </div>
+  <div style="border: 3px solid pink; margin: 2%" v-if="bbb">
+    <el-form ref="form" :model="form" label-width="100px" style="margin: 3px">
+      <el-row>
+        <el-col :span="6">
+          <el-form-item label="外协来源:" prop="goodsShelfId">
+            <el-select v-model="form.tripartiteSource" placeholder="请选择来源">
+              <el-option
+                v-for="item in tripartiteSourceData"
+                :key="item.dictKey"
+                :label="item.dictValue"
+                :value="item.dictValue"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="司机名称:" prop="goodsShelfId">
+            <el-input v-model="form.driverName" placeholder="请输入司机名称"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="司机电话:" prop="goodsShelfId">
+            <el-input v-model="form.deiverPhone" placeholder="请输入本次费用"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="车辆车牌:" prop="goodsShelfId">
+            <el-input v-model="form.vehicleNum" placeholder="请输入本次费用"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="配送费用:" prop="goodsShelfId">
+            <el-input v-model="form.deliveryFee" placeholder="请输入本次费用"></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="6">
+          <el-form-item label="叉车司机:" prop="forklift">
+            <el-select v-model="form.forklift" placeholder="请选择叉车司机">
+              <el-option
+                v-for="item in this.forkliftData"
+                :key="item.dictKey"
+                :label="item.dictValue"
+                :value="item.dictKey"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="装卸班组:" prop="loader">
+            <el-select v-model="form.loader" placeholder="请选择装卸班组">
+              <el-option
+                v-for="item in loaderData"
+                :key="item.dictKey"
+                :label="item.dictValue"
+                :value="item.dictKey"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="3">
+          <!--                    <el-radio-group v-model="form.loadAndUnload" >-->
+          <!--                        <el-radio  v-for="item in this.loadAndUnloadData" :label="item.dictValue" :value="item.dictKey"></el-radio>-->
+          <!--                    </el-radio-group>-->
+          <el-checkbox-group v-model="form.loadAndUnload">
+            <el-checkbox
+              v-for="item in loadAndUnloadData"
+              :label="item.dictKey"
+              :value="item.dictKey"
+              >{{ item.dictValue }}</el-checkbox
+            >
+          </el-checkbox-group>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="6">
+          <el-form-item label="备货区域:" prop="goodsAreaId">
+            <el-select v-model="form.goodsAreaId" placeholder="请选择备货区域">
+              <el-option
+                v-for="item in goodsAreaData"
+                :key="item.dictKey"
+                :label="item.dictValue"
+                :value="item.dictKey"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="6">
+          <el-form-item label="备货时间:" prop="goodsShelfId">
+            <el-date-picker v-model="form.stockupDate" type="date" placeholder="请选择备货时间">
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="24">
+          <el-form-item label="备注:" prop="remarks">
+            <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="form.remarks">
+            </el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+  </div>
+  <div>
+    <el-row>
+      <!-- 列表模块 -->
+      <tablecmt
+          :columnList="columnList"
+          :tableData="data"
+          :loading="loading"
+          @inputTxt="inputsc"
+          @timeCheck="timesc"
+          @btnCheck="btnsc"
+          @selectCheck="selectsc"
+          @selection="selectionsc"
+        >
+          <template #default="slotProps">
+            <el-button size="small" @click="editsolt(slotProps.scope)">查看</el-button>
 
-
+          </template>
+        </tablecmt>
+    </el-row>
+    <el-form-item style="margin-left: 45%; margin-top: 10px">
+      <el-button type="primary" icon="el-icon-circle-close" @click="onSubmitOrder"
+        >提交(配送内容)</el-button
+      >
+      <el-button icon="el-icon-circle-close" @click="this.$router.go(-1)">返 回</el-button>
+    </el-form-item>
+  </div>
+  <edittablehead
+    @setcolum="setnewcolum"
+    @closce="showdrawer"
+    :drawerShow="drawerShow"
+    :columnList="columnList"
+  ></edittablehead>
 </template>
 
 <script>
-  import { useStore } from 'vuex';
-  // import { getReservationAddr } from '@/api/distribution/distributionReservation';
-  import { getDictionaryBiz } from '@/api/system/dict';
-  import option from '@/option/distribution/distributionReservation';
-  import { getListTeam } from '@/api/basicdata/basicdataTeamGroup';
-  import {
-    getList,
-    getDetail,
-    getReservationAddr,
-    deliveryTask
-  } from '@/api/distribution/distributionReservation';
-  import { getListUser } from '@/api/distribution/distributionStockup';
-  import { getPostList } from '@/api/system/post';
-  import { getListOwn } from '@/api/system/user';
-  import { stockUp } from '@/api/basicdata/basicdataGoodsArea';
-  import { getVehicleList } from '@/api/basicdata/basicdataVehicle';
-  import {getDriverList} from "@/api/basicdata/basicdataDriverArtery";
-  // import { ref } from 'vue'
-  export default {
-    data() {
-      return {
-        height: 0,
-        loading: false,
-        ids: null,
-        error: null,
-        form:{},
-        data:[],
-        page: {
-          currentPage: 1,
-          pageSize: 10,
-          total: 40
+import { useStore } from 'vuex';
+// import { getReservationAddr } from '@/api/distribution/distributionReservation';
+import { getDictionaryBiz } from '@/api/system/dict';
+import option from '@/option/distribution/distributionReservation';
+import { getListTeam } from '@/api/basicdata/basicdataTeamGroup';
+import {
+  getList,
+  getDetail,
+  getReservationAddr,
+  deliveryTask,
+} from '@/api/distribution/distributionReservation';
+import { getListUser } from '@/api/distribution/distributionStockup';
+import { getPostList } from '@/api/system/post';
+import { getListOwn } from '@/api/system/user';
+import { stockUp } from '@/api/basicdata/basicdataGoodsArea';
+import { getVehicleList } from '@/api/basicdata/basicdataVehicle';
+import { getDriverList } from '@/api/basicdata/basicdataDriverArtery';
+// import { ref } from 'vue'
+export default {
+  data() {
+    return {
+      columnList: [
+        {
+          prop: '',
+          label: '序号',
+          type: 0,
+          values: '',
+          width: 55,
+          checkarr: [],
+          fixed: true,
         },
-        aaa:true,
-        bbb:false,
-        option: option,
-        deliveryTypeData: [],
-        //配送类型字典列表
-        resvervationStatusData: [],
-        //备货状态
-        stockupStatusData: [],
-        //订单来源
-        orderSourceData: [],
-        //预约时段
-        periodOfTimeData: [],
-        //配送方式
-        deliveryWayData: [],
-        //服务内容
-        addvalueServeTypeData:[],
-        vehicleData:[],
-        masterDriverData:[],
-        slaveDriverData:[],
-        forkliftData:[],
-        loaderData:[],
-        goodsAreaData:[],
-        deptId:'',
-        driverData:[],
-        loadAndUnloadData:[],
-        tripartiteSourceData:[],
-        loadAndUnload:[],
-
+        {
+          prop: 'stockArticleId',
+          label: '订单自编号',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: true,
+          sortable: true,
+          head: false,
+        },
+        {
+          prop: 'consignee',
+          label: '收货人',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'deliveryAddress',
+          label: '收货地址',
+          type: 2,
+          values: '',
+          width: '180',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'deliveryPhone',
+          label: '收件人电话',
+          type: 2,
+          values: '',
+          width: '180',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'reservationDate',
+          label: '预约时间',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'periodOfTime',
+          label: '时段',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'deliveryWay',
+          label: '配送方式',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+          head: true,
+        },
+        {
+          prop: 'deliveryType',
+          label: '配送类型',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'serveType',
+          label: '服务类型',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'collectFee',
+          label: '到付运费',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'otherFee',
+          label: '其他费用',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'replaceFee',
+          label: '代付运费',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'fee',
+          label: '总费用',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'reservationStatus',
+          label: '预约信息状态',
+          type: 2,
+          values: '',
+          width: '180',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'orderSource',
+          label: '订单来源',
+          type: 4,
+          values: '',
+          width: '180',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'stockupStatus',
+          label: '备货状态',
+          type: 2,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: 'goodsAreaId',
+          label: '备货区编号',
+          type: 3,
+          values: '',
+          width: '150',
+          checkarr: [
+            {
+              value: '已签收',
+              label: '已签收',
+            },
+            {
+              value: '未签收',
+              label: '未签收',
+            },
+          ],
+          fixed: false,
+          sortable: true,
+        },
+        {
+          prop: '',
+          label: '操作',
+          type: 6,
+          values: '',
+          width: '150',
+          checkarr: [],
+          fixed: 'right',
+          hide: true,
+        },
+      ],
+      columnListedit: [],
+      drawerShow: false,
+      height: 0,
+      loading: false,
+      ids: null,
+      error: null,
+      form: {},
+      data: [],
+      page: {
+        currentPage: 1,
+        pageSize: 10,
+        total: 40,
+      },
+      aaa: true,
+      bbb: false,
+      option: option,
+      deliveryTypeData: [],
+      //配送类型字典列表
+      resvervationStatusData: [],
+      //备货状态
+      stockupStatusData: [],
+      //订单来源
+      orderSourceData: [],
+      //预约时段
+      periodOfTimeData: [],
+      //配送方式
+      deliveryWayData: [],
+      //服务内容
+      addvalueServeTypeData: [],
+      vehicleData: [],
+      masterDriverData: [],
+      slaveDriverData: [],
+      forkliftData: [],
+      loaderData: [],
+      goodsAreaData: [],
+      deptId: '',
+      driverData: [],
+      loadAndUnloadData: [],
+      tripartiteSourceData: [],
+      loadAndUnload: [],
+    };
+  },
+  created() {
+    this.$watch(
+      () => this.$route.params,
+      () => {
+        this.fetchData();
+      },
+      // 组件创建完后获取数据，
+      // 此时 data 已经被 observed 了
+      { immediate: true }
+    );
+    this.onLoad();
+    this.getDictionary();
+    this.getFork();
+    this.getTeam();
+    this.getvehicleData();
+    this.getMasterDriverData();
+  },
+  computed: {},
 
-      };
+  mounted() {
+    /**
+     * 初始化获取本地缓存的编辑隐藏的列表
+     *  固定搭配，不能更改
+     */
+     let newarr = this.$functions.getStorage(window.location.pathname);
+    if (newarr) {
+      this.columnList.map(item => {
+        item.head = false;
+      });
+      newarr.map(ite => {
+        this.columnList.map(item => {
+          if (ite == item.label) {
+            item.head = true;
+          }
+        });
+      });
+    }
+  },
+  methods: {
+    showdrawer(value){
+      this.drawerShow=value
     },
-    created() {
-      this.$watch(
-        () => this.$route.params,
-        () => {
-          this.fetchData();
-        },
-        // 组件创建完后获取数据，
-        // 此时 data 已经被 observed 了
-        { immediate: true }
-      );
-      this.onLoad();
-      this.getDictionary();
-      this.getFork();
-      this.getTeam()
-      this.getvehicleData();
-      this.getMasterDriverData();
+    /**
+     * 弹窗的勾选回调，用于更改头部数组
+     * 固定搭配，只需要更换   columnList
+     */
+    setnewcolum(newarr, headarr) {
+      // console.log(newarr,'+++++++++++')
+      this.columnList = newarr;
+      this.$functions.setStorage(window.location.pathname, headarr);
     },
-    computed:{
-
+    selectionsc(value) {
+      console.log(value);
     },
-
-    mounted() {
+    delectsolt(scope) {
+      const { row } = scope;
+      console.log(row);
     },
-    methods: {
-      fetchData() {
-        this.error = this.post = null;
-        this.loading = true;
-        if (this.$route.query.id) {
-          this.ids = this.$route.query.id;
-        }
-      },
-      //查询叉车人员
-      async getFork(){
-        let ides = '';
-        let ide = {  };
-        await getListUser().then(res =>{
-          console.log("res>>>",res.data.data);
-          ides = res.data.data.tenantId;
-          this.deptId = res.data.data.deptId;
-        })
-        await getPostList(ides).then(res =>{
-          console.log(">>>>",res.data.data);
-          // this.forkliftData = res.data.data;
-          res.data.data.forEach(i =>{
-            if(i.postName == "叉车"){
-              console.log(">>>>>>>>",i);
-              ide = i;
-            }
-          })
-        })
-        // console.log("ied>>>>>",ide);
-        let params={
-          postId: ide.id, //岗位
-          deptId: this.deptId, //部门
-          // roleId: '', //角色
-        }
-        getListOwn(Object.assign(params, this.query)).then(res =>{
-          // console.log(".............",res.data.data);
-          let fo = [];
-          res.data.data.forEach( i =>{
-            let a ={
-              dictKey: i.id,
-              dictValue: i.name
-            };
-            fo.push(a);
-          });
-          this.forkliftData = fo;
-        })
-        await this.getStorageArea();
-        await this.getTeam();
-
-      },
-      //查询班组
-      async getTeam(){
-        let params ={
-          department: this.deptId
-        }
-        getListTeam(this.page.currentPage, this.page.pageSize, Object.assign(params, this.query)).then(res =>{
-          let fo= [];
-          res.data.data.records.forEach(i =>{
-            let a= {
-              dictKey: i.id,
-              dictValue: i.name +'-'+i.groupName
-            }
-            fo.push(a);
-          });
-          this.loaderData = fo;
-          console.log("this.loaderData",this.loaderData);
-        })
-      },
-      //备货区
-      async getStorageArea(){
-        let params ={
-          department: this.deptId
-        }
-        stockUp(params).then(res =>{
-          let fo =[];
-          res.data.data.forEach(i =>{
-            let v = {
-              dictKey: i.id,
-              dictValue: i.name +'-'+i.headline
-            }
-            fo.push(v)
-          })
-          this.goodsAreaData = fo;
-        })
-      },
-      //查询司机信息
-      getMasterDriverData(){
-        getDriverList(1,10,'').then(res=>{
-          this.masterDriverData = res.data.data.records;
-          this.slaveDriverData = res.data.data.records;
-          this.driverData = res.data.data.records;
-        })
-      },
-      //查询车辆信息
-      getvehicleData(){
-        getVehicleList(1,10,'').then(res=>{
-          this.vehicleData = res.data.data.records;
-          console.log(res.data.data);
-        })
-      },
-      //负责司机数据维护
-      changeMasterDriver(params){
-        this.masterDriverData = JSON.parse(JSON.stringify(this.driverData));
-        console.log(">>>>>>>>>",params);
-        this.slaveDriverData=JSON.parse(JSON.stringify(this.driverData));
-        this.slaveDriverData.forEach((slave,index)=>{
-           if (slave.id===params){
-             this.slaveDriverData.splice(index,1)
-           }
-       })
-      },
-        //主副司机数据维护
-      changeSlaveDriver(params){
-        // this.slaveDriverData = JSON.parse(JSON.stringify(this.driverData));
-        this.masterDriverData = JSON.parse(JSON.stringify(this.driverData));
-        params.forEach(par=>{
-          this.masterDriverData.forEach((master,index)=>{
-            if (par===master.id){
-              this.masterDriverData.splice(index,1)
-            }
-          })
-
-        })
-      },
-      //数据字典数据获取
-      getDictionary() {
-        getDictionaryBiz('addvalue_serve_type').then(res => {
-          this.addvalueServeTypeData = res.data.data;
+    editsolt(scope) {
+      const { row } = scope;
+      console.log(row);
+    },
+    btnsc(index, row) {
+      console.log(index, row);
+    },
+    selectsc(index, row) {
+      console.log(index, row);
+    },
+    timesc(index, row) {
+      console.log(index, row);
+    },
+    inputsc(index, row) {
+      console.log(index, row);
+    },
+    fetchData() {
+      this.error = this.post = null;
+      this.loading = true;
+      if (this.$route.query.id) {
+        this.ids = this.$route.query.id;
+      }
+    },
+    //查询叉车人员
+    async getFork() {
+      let ides = '';
+      let ide = {};
+      await getListUser().then(res => {
+        console.log('res>>>', res.data.data);
+        ides = res.data.data.tenantId;
+        this.deptId = res.data.data.deptId;
+      });
+      await getPostList(ides).then(res => {
+        console.log('>>>>', res.data.data);
+        // this.forkliftData = res.data.data;
+        res.data.data.forEach(i => {
+          if (i.postName == '叉车') {
+            console.log('>>>>>>>>', i);
+            ide = i;
+          }
+        });
+      });
+      // console.log("ied>>>>>",ide);
+      let params = {
+        postId: ide.id, //岗位
+        deptId: this.deptId, //部门
+        // roleId: '', //角色
+      };
+      getListOwn(Object.assign(params, this.query)).then(res => {
+        // console.log(".............",res.data.data);
+        let fo = [];
+        res.data.data.forEach(i => {
+          let a = {
+            dictKey: i.id,
+            dictValue: i.name,
+          };
+          fo.push(a);
         });
-        getDictionaryBiz('delivery_type').then(res => {
-          this.deliveryTypeData = res.data.data;
+        this.forkliftData = fo;
+      });
+      await this.getStorageArea();
+      await this.getTeam();
+    },
+    //查询班组
+    async getTeam() {
+      let params = {
+        department: this.deptId,
+      };
+      getListTeam(
+        this.page.currentPage,
+        this.page.pageSize,
+        Object.assign(params, this.query)
+      ).then(res => {
+        let fo = [];
+        res.data.data.records.forEach(i => {
+          let a = {
+            dictKey: i.id,
+            dictValue: i.name + '-' + i.groupName,
+          };
+          fo.push(a);
         });
-        //订单来源
-        getDictionaryBiz('order_source').then(res => {
-          this.orderSourceData = res.data.data;
-          console.log(this.deliveryTypeData);
+        this.loaderData = fo;
+        console.log('this.loaderData', this.loaderData);
+      });
+    },
+    //备货区
+    async getStorageArea() {
+      let params = {
+        department: this.deptId,
+      };
+      stockUp(params).then(res => {
+        let fo = [];
+        res.data.data.forEach(i => {
+          let v = {
+            dictKey: i.id,
+            dictValue: i.name + '-' + i.headline,
+          };
+          fo.push(v);
         });
-        //预约状态
-        getDictionaryBiz('resvervation_status').then(res => {
-          this.resvervationStatusData = res.data.data;
+        this.goodsAreaData = fo;
+      });
+    },
+    //查询司机信息
+    getMasterDriverData() {
+      getDriverList(1, 10, '').then(res => {
+        this.masterDriverData = res.data.data.records;
+        this.slaveDriverData = res.data.data.records;
+        this.driverData = res.data.data.records;
+      });
+    },
+    //查询车辆信息
+    getvehicleData() {
+      getVehicleList(1, 10, '').then(res => {
+        this.vehicleData = res.data.data.records;
+        console.log(res.data.data);
+      });
+    },
+    //负责司机数据维护
+    changeMasterDriver(params) {
+      this.masterDriverData = JSON.parse(JSON.stringify(this.driverData));
+      console.log('>>>>>>>>>', params);
+      this.slaveDriverData = JSON.parse(JSON.stringify(this.driverData));
+      this.slaveDriverData.forEach((slave, index) => {
+        if (slave.id === params) {
+          this.slaveDriverData.splice(index, 1);
+        }
+      });
+    },
+    //主副司机数据维护
+    changeSlaveDriver(params) {
+      // this.slaveDriverData = JSON.parse(JSON.stringify(this.driverData));
+      this.masterDriverData = JSON.parse(JSON.stringify(this.driverData));
+      params.forEach(par => {
+        this.masterDriverData.forEach((master, index) => {
+          if (par === master.id) {
+            this.masterDriverData.splice(index, 1);
+          }
         });
-        //备货状态
-        getDictionaryBiz('stockup_status').then(res => {
-          this.stockupStatusData = res.data.data;
+      });
+    },
+    //数据字典数据获取
+    getDictionary() {
+      getDictionaryBiz('addvalue_serve_type').then(res => {
+        this.addvalueServeTypeData = res.data.data;
+      });
+      getDictionaryBiz('delivery_type').then(res => {
+        this.deliveryTypeData = res.data.data;
+      });
+      //订单来源
+      getDictionaryBiz('order_source').then(res => {
+        this.orderSourceData = res.data.data;
+        console.log(this.deliveryTypeData);
+      });
+      //预约状态
+      getDictionaryBiz('resvervation_status').then(res => {
+        this.resvervationStatusData = res.data.data;
+      });
+      //备货状态
+      getDictionaryBiz('stockup_status').then(res => {
+        this.stockupStatusData = res.data.data;
+      });
+      //时段
+      getDictionaryBiz('period_of_time').then(res => {
+        this.periodOfTimeData = res.data.data;
+      });
+      getDictionaryBiz('delivery_way').then(res => {
+        this.deliveryWayData = res.data.data;
+      });
+      getDictionaryBiz('load_and_unload').then(res => {
+        this.loadAndUnloadData = res.data.data;
+      });
+      //三方外协来源
+      getDictionaryBiz('tripartite_source').then(res => {
+        this.tripartiteSourceData = res.data.data;
+      });
+    },
+
+    ccc() {
+      this.aaa = true;
+      this.bbb = false;
+      this.form = {};
+      this.loadAndUnload = [];
+    },
+    ddd() {
+      this.aaa = false;
+      this.bbb = true;
+      this.form = {};
+      this.loadAndUnload = [];
+    },
+    onSubmitOrder() {
+      const params = this.form;
+      if (params.tripartiteSource) {
+        this.tripartiteSourceData.forEach(item => {
+          if (params.tripartiteSource === item.dictValue) {
+            params.tripartiteSource = item.dictKey;
+          }
         });
-        //时段
-        getDictionaryBiz('period_of_time').then(res => {
-          this.periodOfTimeData = res.data.data;
+      }
+      params.loadAndUnload = this.loadAndUnload.join(',');
+      if (params.loader) {
+        this.loaderData.forEach(item => {
+          if (params.loader === item.dictKey) {
+            this.form.loaderName = item.dictValue;
+          }
         });
-        getDictionaryBiz('delivery_way').then(res => {
-          this.deliveryWayData = res.data.data;
+      }
+      if (params.slaveDriver) {
+        let slaveDriverName = [];
+        this.slaveDriverData.forEach(item => {
+          params.slaveDriver.forEach(slave => {
+            if (slave === item.id) {
+              slaveDriverName.push(item.name);
+            }
+          });
         });
-        getDictionaryBiz('load_and_unload').then(res => {
-          this.loadAndUnloadData = res.data.data;
+        params.slaveDriver = params.slaveDriver.join(',');
+        this.form.slaveDriverNames = slaveDriverName.join(',');
+      }
+      if (params.vehicleIds) {
+        let vehicleNums = [];
+        this.vehicleData.forEach(item => {
+          params.vehicleIds.forEach(id => {
+            if (id === item.id) {
+              vehicleNums.push(item.vehicleNub);
+            }
+          });
         });
-        //三方外协来源
-        getDictionaryBiz('tripartite_source').then(res => {
-          this.tripartiteSourceData = res.data.data;
+        params.vehicleIds = params.vehicleIds.join(',');
+        this.form.vehicleNums = vehicleNums.join(',');
+      }
+      if (params.masterDriver) {
+        this.driverData.forEach(driver => {
+          if (params.masterDriver === driver.id) {
+            this.form.masterDriverName = driver.name;
+          }
         });
-      },
-
-      ccc(){
-        this.aaa=true;
-        this.bbb=false;
-        this.form = {};
-        this.loadAndUnload=[];
-      },
-      ddd(){
-        this.aaa=false;
-        this.bbb=true;
-        this.form = {};
-        this.loadAndUnload=[];
+      }
 
-      },
-      onSubmitOrder(){
-        const params = this.form;
-        if (params.tripartiteSource){
-          this.tripartiteSourceData.forEach(item=>{
-            if (params.tripartiteSource === item.dictValue){
-              params.tripartiteSource = item.dictKey;
+      this.form = params;
+      this.form.reservationIds = this.ids;
+      console.log('>>>>>>>>>>>>>>>>', this.form);
+      deliveryTask(this.form).then(res => {
+        this.$message({
+          type: 'success',
+          message: '操作成功!',
+        });
+      });
+    },
+    onLoad() {
+      this.loading = false;
+      getReservationAddr(this.ids).then(res => {
+        const data = res.data.data;
+        data.forEach(item => {
+          this.orderSourceData.forEach(a => {
+            if (item.orderSource === a.dictKey) {
+              item.orderSource = a.dictValue;
             }
-          })
-        }
-        params.loadAndUnload = this.loadAndUnload.join(",");
-        if (params.loader){
-          this.loaderData.forEach(item=>{
-            if (params.loader === item.dictKey){
-              this.form.loaderName = item.dictValue;
+          });
+          this.stockupStatusData.forEach(b => {
+            if (item.stockupStatus === b.dictKey) {
+              item.stockupStatus = b.dictValue;
             }
-          })
-        }
-        if (params.slaveDriver){
-          let slaveDriverName = [];
-          this.slaveDriverData.forEach(item=>{
-            params.slaveDriver.forEach(slave=>{
-              if (slave === item.id){
-                slaveDriverName.push(item.name)
-              }
-            })
-          })
-          params.slaveDriver = params.slaveDriver.join(",");
-          this.form.slaveDriverNames = slaveDriverName.join(",");
-        }
-        if (params.vehicleIds){
-          let vehicleNums = [];
-          this.vehicleData.forEach(item=>{
-            params.vehicleIds.forEach(id=>{
-              if (id === item.id){
-                vehicleNums.push(item.vehicleNub)
-              }
-            })
-          })
-          params.vehicleIds = params.vehicleIds.join(",");
-          this.form.vehicleNums = vehicleNums.join(",");
-        }
-        if (params.masterDriver){
-          this.driverData.forEach(driver=>{
-            if (params.masterDriver === driver.id){
-              this.form.masterDriverName = driver.name;
+          });
+          this.resvervationStatusData.forEach(e => {
+            if (item.reservationStatus === e.dictKey) {
+              item.reservationStatus = e.dictValue;
+            }
+          });
+          this.deliveryTypeData.forEach(c => {
+            if (item.deliveryType === c.dictKey) {
+              item.deliveryType = c.dictValue;
             }
-          })
-        }
-
-        this.form = params;
-        this.form.reservationIds = this.ids;
-        console.log(">>>>>>>>>>>>>>>>",this.form);
-        deliveryTask(this.form).then(res=>{
-          this.$message({
-            type: 'success',
-            message: '操作成功!'
           });
-        })
 
-      },
-      onLoad() {
-        this.loading=false;
-        getReservationAddr(this.ids).then(res=>{
-          const data = res.data.data;
-          data.forEach(item=> {
-            this.orderSourceData.forEach(a => {
-              if (item.orderSource === a.dictKey) {
-                item.orderSource = a.dictValue;
-              }
-            });
-            this.stockupStatusData.forEach(b => {
-              if (item.stockupStatus === b.dictKey) {
-                item.stockupStatus = b.dictValue;
-              }
-            });
-            this.resvervationStatusData.forEach(e => {
-              if (item.reservationStatus === e.dictKey) {
-                item.reservationStatus = e.dictValue;
-              }
-            });
-            this.deliveryTypeData.forEach(c => {
-              if (item.deliveryType === c.dictKey) {
-                item.deliveryType = c.dictValue;
+          this.deliveryWayData.forEach(c => {
+            if (item.deliveryWay === c.dictKey) {
+              item.deliveryWay = c.dictValue;
+            }
+          });
+          this.periodOfTimeData.forEach(d => {
+            console.log('11111111111');
+            if (item.periodOfTime === d.dictKey) {
+              item.periodOfTime = d.dictValue;
+            }
+          });
+          let pa = [];
+          if (item.serveType.length > 1) {
+            pa = item.serveType.split(',');
+          } else {
+            pa.push(item.serveType);
+          }
+          this.addvalueServeTypeData.forEach(f => {
+            pa.forEach((p, index) => {
+              if (p === f.dictKey) {
+                pa[index] = f.dictValue;
               }
             });
+          });
+        });
+        console.log('>>>>>>>>', data);
+        this.page.total = data.total;
+        this.data = data;
+        console.log('>>>>>>>>>>>', this.data);
+        this.loading = false;
+      });
+    },
+  },
+};
+</script>
 
-            this.deliveryWayData.forEach(c => {
-              if (item.deliveryWay === c.dictKey) {
-                item.deliveryWay = c.dictValue;
-              }
-            });
-            this.periodOfTimeData.forEach(d => {
-              console.log("11111111111");
-              if (item.periodOfTime === d.dictKey) {
-                item.periodOfTime = d.dictValue;
-              }
-            });
-            let pa = [];
-            if (item.serveType.length > 1) {
-              pa = item.serveType.split(",");
-            } else {
-              pa.push(item.serveType);
-            }
-            this.addvalueServeTypeData.forEach(f => {
-              pa.forEach((p, index) => {
-                if (p === f.dictKey) {
-                  pa[index] = f.dictValue
-                }
-              })
-            })
-          })
-          console.log(">>>>>>>>",data);
-          this.page.total = data.total;
-          this.data = data;
-          console.log(">>>>>>>>>>>",this.data);
-          this.loading = false;
-        })
+<style lang="scss" scoped>
+  .tabbertop{
+    width: 100%;
+    // height: 6px;
+    background-color: #ffffff;
+    display: flex;
+    align-items: center;
+    padding-left: 50px;
+    box-sizing: border-box;
+    >div{
+      width: 150px;
+      font-size: 20px;
+      height: 50px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      
+    }
+    .xz{
+      color: #D3832A;
+      border-bottom: 5px solid #D3832A;
+    }
+  }
+  .maboxc{
+    width: 98%;
+    margin: auto;
+    padding: 20px;
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    box-sizing: border-box;
+    background-color: #ffffff;
+    margin-bottom: 20px;
+    border-radius: 5px;
+    margin-top: 10px;
+    box-sizing: border-box;
+    >.minbox{
+      display: flex;
+      align-items: flex-start;
+      margin-right: 30px;
+      margin-bottom: 20px;
+      >div:nth-of-type(1){
+        display: flex;
+        align-items: center;
+        >span{
+          color: #ff0000;
+          font-size: 20px;
+        }
       }
+      >div:nth-of-type(2){
+        width: 220px;
+        margin-left: 10px;
+        border-radius: 3px;
+        .itemmabox{
+          display: flex;
+          flex-direction: column;
+          >span{
+            width: 100%;
+            // height: 32px;
+            // background-color: #ffffff;
+            border: 1px solid #EEEEEE;
+            box-sizing: border-box;
+            padding: 5px;
 
-
+          }
+        }
+      }
     }
-
-
-  };
-</script>
-
-<style scoped>
-
+  }
 </style>
-