From d8944c4764c3fc4b7baf6b5c1586cf17c88b0bb1 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期三, 23 三月 2022 22:38:20 +0800
Subject: [PATCH] 修改ztree复选框默认为父子联动

---
 src/pages/library/components/personList.vue | 2125 +++++++++++++++++++++++++++++++---------------------------
 1 files changed, 1,133 insertions(+), 992 deletions(-)

diff --git a/src/pages/library/components/personList.vue b/src/pages/library/components/personList.vue
index d2569b1..da1f4d0 100644
--- a/src/pages/library/components/personList.vue
+++ b/src/pages/library/components/personList.vue
@@ -4,17 +4,12 @@
       <div class="base-tip">
         <div class="left-tips">
           <span class="ku-name">{{ this.baseObject.tableName }}</span>
-          <span
-            class="list"
-            :class="
-              this.baseObject.bwType === '1' ? 'black-list' : 'white-list'
-            "
-            >{{ this.baseObject.bwType === "1" ? "榛戝悕鍗�" : "鐧藉悕鍗�" }}</span
-          >
+          <span class="list" :class="this.baseObject.bwType === '1' ? 'black-list' : 'white-list'">{{
+            this.baseObject.bwType === "1" ? "榛戝悕鍗�" : "鐧藉悕鍗�"
+          }}</span>
           <span class="ok-time"
-            >鏈夋晥鏃堕棿锛歿{ this.baseObject.startTime }}--{{
-              this.baseObject.endTime ? this.baseObject.endTime : "姘镐箙鏈夋晥"
-            }}</span
+            >鏈夋晥鏃堕棿锛歿{ this.baseObject.startTime }} --
+            {{ this.baseObject.endTime ? this.baseObject.endTime : "姘镐箙鏈夋晥" }}</span
           >
         </div>
 
@@ -26,77 +21,27 @@
             v-model="baseObject.enable"
             active-color="#4E94FF"
             inactive-color="#BBBBBB"
-            style="margin-right: 25px"
+            style="margin-right: 10px"
             :disabled="isDisabled(baseObject)"
             @change="setEnable(baseObject)"
           >
           </el-switch>
-
+          <div class="shutiao" v-if="baseObject.enable"></div>
+          <div class="shutiao1" v-else></div>
           <el-tooltip content="鍒犻櫎" placement="top" popper-class="atooltip">
             <span
               class="iconfont iconfont-wrap iconshanchuku-09"
               v-if="isShow('library:set')"
-              @click.stop="deleteBase"
+              @click.stop="askDelete('base')"
             ></span>
           </el-tooltip>
 
           <el-tooltip content="缂栬緫" placement="top" popper-class="atooltip">
-            <span
-              class="iconfont iconfont-wrap iconbianjiku-09"
-              @click.stop="edit"
-              v-if="isShow('library:set')"
-            ></span>
+            <span class="iconfont iconfont-wrap iconbianjiku-09" @click.stop="edit" v-if="isShow('library:set')"></span>
           </el-tooltip>
         </div>
       </div>
     </el-row>
-    <!-- <el-row class style="margin: 40px 0 40px 0px">
-      <el-col :span="6">
-        <el-input
-          placeholder="濮撳悕/鎬у埆/韬唤璇佸彿/鎵嬫満鍙�"
-          autocomplete="off"
-          width="100%"
-          size="small"
-          v-model="BaseManageData.contentValue"
-          @keyup.enter.native="handleSearch"
-        >
-          <upload-icon slot="suffix"></upload-icon>
-        </el-input>
-      </el-col>
-      <el-col :span="2">
-        <el-button size="small" type="primary" @click="handleSearch"
-          >鎼滅储</el-button
-        >
-      </el-col>
-      <el-col :offset="11" :span="3">
-        <fTemplate authority="library:set">
-          <el-button
-            size="small"
-            class="ml10"
-            type="danger"
-            @click="deleteBatch"
-            v-if="isShow('library:set')"
-            >鎵归噺鍒犻櫎</el-button
-          >
-        </fTemplate>
-      </el-col>
-      <el-col :span="2">
-        <div class="text-left">
-          <UploadBtn
-            limitTypes=".jpg,.png,.jpeg"
-            limitSize
-            uploadBtntext="涓婁紶鐓х墖"
-            uploadBtnIcon
-            v-if="isShow('library:set')"
-            uploadBtnSize="small"
-            :isDrag="true"
-            @addFilesBaBackFN="changeDialog"
-            @successFN="getUploadResult"
-            :idJson="{ tableId: baseObject.id }"
-          />
-        </div>
-      </el-col>
-    </el-row> -->
     <div class="border-tabl">
       <div class="head-search">
         <div class="desc">
@@ -115,27 +60,16 @@
           >
             <upload-icon slot="suffix"></upload-icon>
           </el-input>
-          <el-button size="small" type="primary" @click="handleSearch"
-            >鎼滅储</el-button
-          >
-          <el-tooltip
-            content="鎵归噺鍒犻櫎"
-            placement="top"
-            popper-class="atooltip"
-          >
+          <el-button size="small" type="primary" @click="handleSearch">鎼滅储</el-button>
+          <el-tooltip content="鎵归噺鍒犻櫎" placement="top" popper-class="atooltip">
             <span
               class="iconfont iconfont-wrap iconpiliangshanchu-09"
-              title="鍒犻櫎"
-              @click="deleteBatch"
+              @click="askDelete('batch')"
               v-if="isShow('library:set')"
             ></span>
           </el-tooltip>
 
-          <el-tooltip
-            content="涓婁紶鐓х墖"
-            placement="top"
-            popper-class="atooltip"
-          >
+          <el-tooltip content="涓婁紶鐓х墖" placement="top" popper-class="atooltip">
             <UploadBtn
               limitTypes=".jpg,.png,.jpeg"
               limitSize
@@ -154,169 +88,110 @@
       <el-table
         id="multipleTable"
         ref="multipleTable"
+        class="tableBox"
         :data="BaseManageData.personList"
         tooltip-effect="dark"
         style="width: 100%; overflow: auto"
         :fit="true"
+        cell-class-name="cell-classname"
+        @row-click="pickRow"
         :default-sort="{ prop: 'createTime', order: 'descending' }"
         @selection-change="handleSelectionChange"
-        :header-cell-style="{ background: '#f8f8f8', color: '#222222' }"
+        border
+        :header-cell-style="{
+          background: '#fff',
+          color: '#222222',
+          padding: '2px 1px',
+          borderBottom: 'none'
+        }"
       >
-        <el-table-column type="selection" width="30"></el-table-column>
-        <!-- <el-table-column label="搴忓彿" width="60" sortable align="center">
-          <template slot-scope="scope">{{ scope.$index + 1 }}</template>
-        </el-table-column> -->
-        <el-table-column
-          prop="personPicUrl"
-          label="鐓х墖"
-          align="center"
-          width="120"
-        >
+        <el-table-column type="selection" width="40"></el-table-column>
+        <el-table-column prop="personPicUrl" label="鐓х墖" width="120">
           <template slot-scope="scope">
             <img
               :src="'/httpImage/' + scope.row.personPicUrl"
               style="width: 84px; height: 84px; object-fit: contain"
               alt
             />
-            <p class="text-center fb f16" v-show="haveScore(scope.row)">
-              {{ scope.row.compareScore }}%
-            </p>
+            <p class="text-center fb f16" v-show="haveScore(scope.row)">{{ scope.row.compareScore }}%</p>
           </template>
         </el-table-column>
-        <el-table-column label="鐢熸晥鐘舵��" align="center" width="80">
+        <el-table-column label="鐢熸晥鐘舵��" min-width="70">
           <template slot-scope="scope">
             <el-switch
               v-model="scope.row.enable"
               :active-value="1"
               :disabled="!isShow('library:set')"
               :inactive-value="0"
+              active-color="#4E94FF"
+              inactive-color="#C4C4C4"
               @change="enable(scope.row)"
             ></el-switch>
           </template>
         </el-table-column>
-        <el-table-column
-          prop="personName"
-          label="濮撳悕"
-          min-width="90"
-          show-overflow-tooltip
-          sortable
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          prop="sex"
-          label="鎬у埆"
-          width="70"
-          sortable
-          align="center"
-        ></el-table-column>
+        <el-table-column prop="personName" label="濮撳悕" min-width="70" show-overflow-tooltip sortable></el-table-column>
+        <el-table-column prop="sex" label="鎬у埆" min-width="60" sortable></el-table-column>
         <el-table-column
           prop="idCard"
           label="韬唤璇佸彿"
-          min-width="170"
+          min-width="150"
           show-overflow-tooltip
           sortable
-          align="center"
         ></el-table-column>
         <el-table-column
           prop="phoneNum"
           label="鎵嬫満鍙�"
-          width="110"
+          min-width="100"
           show-overflow-tooltip
           sortable
-          align="center"
         ></el-table-column>
-        <el-table-column
-          prop="monitorLevel"
-          label="绛夌骇"
-          align="center"
-          width="80"
-        ></el-table-column>
+        <el-table-column prop="monitorLevel" label="绛夌骇" min-width="50"></el-table-column>
         <el-table-column
           prop="createTime"
           label="鍏ュ簱鏃堕棿"
-          width="140"
+          min-width="140"
           show-overflow-tooltip
           sortable
-          align="center"
         ></el-table-column>
-        <!-- <el-table-column prop="reserved" label="鍏朵粬" align="center"></el-table-column> -->
-
-        <el-table-column label="鎿嶄綔" min-width="200" align="center">
+        <el-table-column label="鎿嶄綔" min-width="130">
           <template slot-scope="scope">
             <fTemplate authority="library:set">
-              <el-tooltip
-                content="缂栬緫"
-                placement="top"
-                popper-class="atooltip"
-              >
+              <el-tooltip content="缂栬緫" placement="top" popper-class="atooltip">
                 <span
-                  class="iconfont iconfont-wrap iconbianji"
-                  style="font-size: 15px"
-                  @click="handleClick(scope.row)"
+                  class="iconfont iconbianjixinxi-09"
+                  style="font-size: 24px; cursor: pointer"
+                  @click="editRow(scope.row)"
                 ></span>
               </el-tooltip>
             </fTemplate>
-            <el-tooltip
-              content="鏌ユ壘姝や汉"
-              placement="top"
-              popper-class="atooltip"
-            >
+            <el-popover placement="top" trigger="click" popper-class="popper-caozuo">
+              <el-tooltip content="鏌ユ壘姝や汉" placement="top" popper-class="atooltip">
+                <span class="iconfont iconchazhaociren-09" @click="tosearch(scope.row)"></span>
+              </el-tooltip>
+              <el-tooltip content="鏌ョ湅璇︽儏" placement="top" popper-class="atooltip">
+                <span class="iconfont iconchakanxiangqing-09" @click="showDetail(scope.row)"></span>
+              </el-tooltip>
+              <fTemplate authority="library:set">
+                <el-tooltip content="澶嶅埗" placement="top" popper-class="atooltip">
+                  <span class="iconfont iconfuzhi-09" title="澶嶅埗" @click="copyClick(scope.row)"></span>
+                </el-tooltip>
+              </fTemplate>
+              <fTemplate authority="library:set">
+                <el-tooltip content="绉诲姩" placement="top" popper-class="atooltip">
+                  <span class="iconfont iconyidong-09" title="绉诲姩" @click="moveClick(scope.row)"></span>
+                </el-tooltip>
+              </fTemplate>
+              <fTemplate authority="library:set" class="del-wrap">
+                <el-tooltip content="鍒犻櫎" placement="top" popper-class="atooltip">
+                  <span class="iconfont iconshanchu-09" @click="askDelete('single', scope.row.id)"></span>
+                </el-tooltip>
+              </fTemplate>
               <span
-                class="iconfont iconsousuoren"
-                @click="tosearch(scope.row)"
+                slot="reference"
+                class="iconfont icongengduocaozuo-09"
+                style="font-size: 24px; cursor: pointer"
               ></span>
-            </el-tooltip>
-            <el-tooltip
-              content="鏌ョ湅璇︽儏"
-              placement="top"
-              popper-class="atooltip"
-            >
-              <span
-                class="iconfont iconsousuoren"
-                @click="showDetail(scope.row)"
-              ></span>
-            </el-tooltip>
-            <fTemplate authority="library:set">
-              <el-tooltip
-                content="澶嶅埗"
-                placement="top"
-                popper-class="atooltip"
-              >
-                <span
-                  class="iconfont iconfuzhi"
-                  title="澶嶅埗"
-                  @click="copyClick(scope.row)"
-                ></span>
-              </el-tooltip>
-            </fTemplate>
-            <fTemplate authority="library:set">
-              <el-tooltip
-                content="绉诲姩"
-                placement="top"
-                popper-class="atooltip"
-              >
-                <span
-                  class="iconfont iconyidongzhi"
-                  style="font-size: 15px"
-                  title="绉诲姩"
-                  @click="moveClick(scope.row)"
-                ></span>
-              </el-tooltip>
-            </fTemplate>
-            <fTemplate authority="library:set">
-              <el-tooltip
-                content="鍒犻櫎"
-                placement="top"
-                popper-class="atooltip"
-              >
-                <span
-                  class="iconfont iconshanchuku-09"
-                  style="color: #e74c3c"
-                  @click="deleteThis(scope.row.id)"
-                  title="鍒犻櫎"
-                ></span>
-              </el-tooltip>
-            </fTemplate>
+            </el-popover>
           </template>
         </el-table-column>
       </el-table>
@@ -331,61 +206,19 @@
         :total="BaseManageData.total"
       ></el-pagination>
     </div>
-    <!-- <div class="pt5" style="height: 40px; position: relative">
-      <el-pagination
-        @size-change="handleSizeChange"
-        @current-change="refrash"
-        :current-page="BaseManageData.page"
-        :page-size="BaseManageData.size"
-        :page-sizes="[10, 20, 50, 100]"
-        style="position: absolute; right: 10px; bottom: 5px"
-        layout="total,sizes,prev,pager,next,jumper"
-        :total="BaseManageData.total"
-      ></el-pagination>
-    </div> -->
-    <el-dialog
-      title="鎶撴媿璇︽儏"
-      :visible.sync="cameraDetailVisible"
-      okText="纭畾"
-    >
-      <div class="top-bar">
-        <el-date-picker
-          size="mini"
-          @change="timeChange"
-          v-model="timeRange"
-          value-format="yyyy-MM-dd HH:mm:ss"
-          type="datetimerange"
-          range-separator="鑷�"
-          start-placeholder="寮�濮嬫椂闂�"
-          end-placeholder="缁撴潫鏃堕棿"
-        ></el-date-picker>
-        <div style="margin: 0 10px; display: flex">
-          <span style="width: 68px">鍋滅暀鏃堕暱:</span>
-          <el-input
-            size="mini"
-            style="width: 80px"
-            v-model.number="reqCameraParams.thresholdTime"
-          ></el-input
-          >s
-        </div>
-        <el-button size="mini" type="primary" @click="postCameraData"
-          >鏌ヨ</el-button
-        >
-      </div>
-
+    <el-dialog title="鎶撴媿璇︽儏" :visible.sync="cameraDetailVisible" okText="纭畾" custom-class="zhuapai-dialog">
       <div class="member-info">
-        <label class>浜哄憳淇℃伅:</label>
+        <label class>
+          <img src="/images/library/涓汉淇℃伅.png" alt="" srcset="" />
+        </label>
         <ul>
           <li>
-            <span>濮撳悕:</span>
             <span>{{ memberInfo.personName }}</span>
           </li>
           <li>
-            <span>鎬у埆:</span>
             <span>{{ memberInfo.sex }}</span>
           </li>
-          <li>
-            <span>韬唤璇佸彿:</span>
+          <li style="margin-right: 80px">
             <span>{{ memberInfo.idCard }}</span>
           </li>
           <li>
@@ -395,13 +228,49 @@
         </ul>
       </div>
 
-      <el-table :data="cameraDetailData" border>
-        <el-table-column
-          prop="faceImg"
-          label="鎶撴媿瀹炴櫙"
-          width="160"
-          align="center"
-        >
+      <div class="top-bar">
+        <div style="display: flex">
+          <span style="margin-right: 10px">鍋滅暀鏃堕暱</span>
+          <el-input
+            size="mini"
+            style="width: 58px; margin-right: 4px"
+            v-model.number="reqCameraParams.thresholdTime"
+          ></el-input
+          >s
+        </div>
+        <div style="display: flex">
+          <span style="margin-right: 10px">鏃舵湡</span>
+          <el-date-picker
+            size="mini"
+            popper-class="popper-pick"
+            @change="timeChange"
+            v-model="timeRange"
+            align="center"
+            value-format="yyyy-MM-dd HH:mm:ss"
+            type="datetimerange"
+            range-separator="鑷�"
+            start-placeholder="寮�濮嬫椂闂�"
+            end-placeholder="缁撴潫鏃堕棿"
+          ></el-date-picker>
+        </div>
+
+        <el-button size="mini" type="primary" @click="postCameraData">鏌ヨ</el-button>
+      </div>
+      <p style="text-align: right; font-size: 14px; color: #5f5f5f">鍏眥{ faceDataCount }}鏉℃暟鎹�</p>
+
+      <el-table
+        :data="cameraDetailData"
+        tooltip-effect="dark"
+        :fit="true"
+        style="width: 100%; overflow: auto"
+        :header-cell-style="{
+          background: '#fff',
+          color: '#222222',
+          padding: '2px 1px',
+          borderBottom: 'none'
+        }"
+      >
+        <el-table-column prop="faceImg" label="鎶撴媿瀹炴櫙" width="160" align="center">
           <template slot-scope="scope">
             <div>
               <img
@@ -418,51 +287,22 @@
             </div>
           </template>
         </el-table-column>
-        <el-table-column
-          prop="cameraName"
-          label="鎽勫儚鏈哄悕绉�"
-          width="100"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          prop="startTime"
-          label="寮�濮嬫椂闂�"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          prop="endTime"
-          label="缁撴潫鏃堕棿"
-          align="center"
-        ></el-table-column>
-        <el-table-column
-          prop="stayTime"
-          label="鍋滅暀鏃堕暱"
-          width="99"
-          align="center"
-        >
+        <el-table-column prop="cameraName" label="鎽勫儚鏈哄悕绉�" width="100" align="center"></el-table-column>
+        <el-table-column prop="startTime" label="寮�濮嬫椂闂�" align="center"></el-table-column>
+        <el-table-column prop="endTime" label="缁撴潫鏃堕棿" align="center"></el-table-column>
+        <el-table-column prop="stayTime" label="鍋滅暀鏃堕暱" width="99" align="center">
           <template slot-scope="scope">
             <span>{{ scope.row.stayTime }} 绉�</span>
           </template>
         </el-table-column>
       </el-table>
-      <p style="text-align: right; font-size: 14px">
-        鍏眥{ faceDataCount }}鏉℃暟鎹�
-      </p>
+
+      <div class="bot-btn">
+        <el-button size="mini" type="primary" @click="cameraDetailVisible = false">鍏抽棴</el-button>
+      </div>
     </el-dialog>
-    <el-dialog
-      title="淇敼淇℃伅"
-      :visible.sync="dialogFormVisible"
-      okText="淇濆瓨"
-      width="30%"
-      :before-close="handleClose"
-      cancelText="鍙栨秷"
-    >
-      <el-form
-        ref="formForEdit"
-        :model="form"
-        label-width="120px"
-        :rules="rules"
-      >
+    <el-drawer title="淇敼淇℃伅" :modal="false" :visible.sync="showInfoDrawer">
+      <el-form ref="formForEdit" :model="inputPersonForm" label-width="100px" :rules="rules">
         <div class="flex-center mb10">
           <el-upload
             class="avatar-uploader"
@@ -474,15 +314,11 @@
             :on-error="uploadError"
           >
             <div class="mask1">
-              <div
-                slot="trigger"
-                class="flex-center"
-                style="position: absolute; top: 120px"
-              >
+              <div slot="trigger" class="flex-center" style="position: absolute; top: 70px">
                 <p
                   style="
                     background: rgba(0, 0, 0, 0.35);
-                    width: 150px;
+                    width: 100px;
                     line-height: 30px;
                     color: #fff;
                     font-size: 13px;
@@ -494,11 +330,11 @@
               </div>
             </div>
             <img
-              v-if="`httpImage/` + form.personPicUrl"
-              :src="`/httpImage/` + form.personPicUrl"
+              v-if="`httpImage/` + inputPersonForm.personPicUrl"
+              :src="`/httpImage/` + inputPersonForm.personPicUrl"
               style="
-                max-height: 150px;
-                width: 150px;
+                max-height: 100px;
+                width: 100px;
                 object-fit: contain;
                 background: rgba(0, 0, 0, 0.35);
               "
@@ -508,50 +344,29 @@
         </div>
         <el-row>
           <el-col :span="20">
-            <el-form-item label="ID" style="width: 100%; margin-bottom: 10px">
-              <el-input
-                size="small"
-                v-model="form.id"
-                disabled
-                placeholder="璇疯緭鍏�"
-              ></el-input>
+            <el-form-item label="ID" style="width: 100%; margin-bottom: 20px">
+              <el-input size="small" v-model="inputPersonForm.id" disabled placeholder="璇疯緭鍏�"></el-input>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="20">
-            <el-form-item
-              label="鐓х墖鏍囪瘑"
-              prop="picDesc"
-              style="width: 100%; margin-bottom: 10px"
-            >
-              <el-input
-                size="small"
-                v-model="form.picDesc"
-                placeholder="璇疯緭鍏�"
-              ></el-input>
+            <el-form-item label="鐓х墖鏍囪瘑" prop="picDesc" style="width: 100%; margin-bottom: 20px">
+              <el-input size="small" v-model="inputPersonForm.picDesc" placeholder="璇疯緭鍏�"></el-input>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="20">
-            <el-form-item label="濮撳悕" style="width: 100%; margin-bottom: 10px">
-              <el-input
-                size="small"
-                v-model="form.personName"
-                placeholder="璇疯緭鍏�"
-              ></el-input>
+            <el-form-item label="濮撳悕" style="width: 100%; margin-bottom: 20px">
+              <el-input size="small" v-model="inputPersonForm.personName" placeholder="璇疯緭鍏�"></el-input>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="20">
-            <el-form-item
-              label="鎬у埆"
-              prop="sex"
-              style="width: 100%; margin-bottom: 8px; text-align: left"
-            >
-              <el-radio-group v-model="form.sex" class="mt10">
+            <el-form-item label="鎬у埆" prop="sex" style="width: 100%; margin-bottom: 20px; text-align: left">
+              <el-radio-group v-model="inputPersonForm.sex" class="mt10">
                 <el-radio label="鐢�"></el-radio>
                 <el-radio label="濂�"></el-radio>
               </el-radio-group>
@@ -560,45 +375,22 @@
         </el-row>
         <el-row>
           <el-col :span="20">
-            <el-form-item
-              label="韬唤璇佸彿"
-              style="width: 100%; margin-bottom: 10px"
-            >
-              <el-input
-                size="small"
-                v-model="form.idCard"
-                placeholder="璇疯緭鍏�"
-              ></el-input>
+            <el-form-item label="韬唤璇佸彿" prop="idCard" style="width: 100%; margin-bottom: 20px">
+              <el-input size="small" v-model="inputPersonForm.idCard" placeholder="璇疯緭鍏�"></el-input>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="20">
-            <el-form-item
-              label="鎵嬫満鍙�"
-              style="width: 100%; margin-bottom: 10px"
-            >
-              <el-input
-                size="small"
-                v-model="form.phoneNum"
-                placeholder="璇疯緭鍏�"
-              ></el-input>
+            <el-form-item label="鎵嬫満鍙�" prop="phoneNum" style="width: 100%; margin-bottom: 20px">
+              <el-input size="small" v-model="inputPersonForm.phoneNum" placeholder="璇疯緭鍏�"></el-input>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="20">
-            <el-form-item
-              label="浜哄憳绛夌骇"
-              prop="monitorLevel"
-              style="width: 100%; margin-bottom: 10px"
-            >
-              <el-select
-                size="small"
-                v-model="form.monitorLevel"
-                placeholder="璇烽�夋嫨"
-                style="width: 100%"
-              >
+            <el-form-item label="浜哄憳绛夌骇" prop="monitorLevel" style="width: 100%; margin-bottom: 20px">
+              <el-select size="small" v-model="inputPersonForm.monitorLevel" placeholder="璇烽�夋嫨" style="width: 100%">
                 <el-option
                   v-for="item in VideoPhotoData.dictionary.MONITORLEVEL"
                   :key="item.value"
@@ -611,155 +403,119 @@
         </el-row>
         <el-row>
           <el-col :span="20">
-            <el-form-item
-              label="鍏ュ簱浣嶇疆"
-              style="width: 100%; margin-bottom: 10px"
-            >
-              <el-input
-                size="small"
-                v-model="form.fromServerId"
-                disabled
-                placeholder="璇疯緭鍏�"
-              ></el-input>
+            <el-form-item label="鍏ュ簱浣嶇疆" style="width: 100%; margin-bottom: 20px">
+              <el-input size="small" v-model="inputPersonForm.fromServerId" disabled></el-input>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="20">
-            <el-form-item
-              label="鍏ュ簱鏃堕棿"
-              style="width: 100%; margin-bottom: 10px"
-            >
-              <el-input
-                size="small"
-                v-model="form.createTime"
-                disabled
-                placeholder="璇疯緭鍏�"
-              ></el-input>
+            <el-form-item label="鍏ュ簱鏃堕棿" style="width: 100%; margin-bottom: 20px">
+              <el-input size="small" v-model="inputPersonForm.createTime" disabled></el-input>
             </el-form-item>
           </el-col>
         </el-row>
         <el-row>
           <el-col :span="20">
-            <el-form-item label="鍏朵粬" style="width: 100%; margin-bottom: 10px">
-              <el-input
-                size="small"
-                v-model="form.reserved"
-                placeholder="璇疯緭鍏�"
-              ></el-input>
+            <el-form-item label="鍏朵粬" style="width: 100%; margin-bottom: 20px">
+              <el-input size="small" v-model="inputPersonForm.reserved" placeholder="璇疯緭鍏�"></el-input>
             </el-form-item>
           </el-col>
         </el-row>
       </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button size="small" @click="handleClose" type="info"
-          >鍙� 娑�</el-button
-        >
-        <el-button size="small" type="primary" @click="submit()"
-          >纭� 瀹�</el-button
-        >
+      <div class="dialog-footer">
+        <!-- {{BaseManageData.personList[1].idCard}} -->
+        <el-button size="small" class="cancel-btn" @click="handleClose" type="info">鍙栨秷</el-button>
+        <el-button size="small" class="sure-btn" type="primary" @click="submit">纭畾</el-button>
       </div>
-    </el-dialog>
-    <el-dialog
-      title="鎻愮ず"
-      :visible.sync="dialogVisible"
-      :close="getPersonList"
-      width="30%"
-    >
+    </el-drawer>
+    <el-dialog :visible.sync="dialogVisible" :close="getPersonList" :center="true" custom-class="suc-dialog">
       <div>
-        <div class="tl">
+        <div class="suc-icon">
+          <i class="iconfont iconduigou3"></i>
+        </div>
+        <div class="tt">涓婁紶鎴愬姛</div>
+        <div class="flex-box">
           <span>涓婁紶鎴愬姛鐨勬暟閲忥細{{ uploadResult.successList.length }}</span>
         </div>
         <div class="flex-box mt10">
           <span>涓婁紶澶辫触鐨勬暟閲忥細{{ uploadResult.failList.length }}</span>
-          <div
-            class="ml20"
-            v-for="(i, index) in uploadResult.failList"
-            :key="index"
-          >
+          <div class="ml20" v-for="(i, index) in uploadResult.failList" :key="index">
             {{ i }}
           </div>
         </div>
         <div class="flex-box mt10">
-          <span
-            >鍖呭惈澶氬紶浜鸿劯鐨勫浘鐗囨暟閲忥細{{
-              uploadResult.multiFaceList.length
-            }}</span
-          >
-          <div
-            class="ml20"
-            v-for="(i, index) in uploadResult.multiFaceList"
-            :key="index"
-          >
+          <span>鍖呭惈澶氬紶浜鸿劯鐨勫浘鐗囨暟閲忥細{{ uploadResult.multiFaceList.length }}</span>
+          <div class="ml20" v-for="(i, index) in uploadResult.multiFaceList" :key="index">
             {{ i }}
           </div>
         </div>
         <div class="flex-box mt10">
           <span>涓嶅惈浜鸿劯鐨勫浘鐗囨暟閲忥細{{ uploadResult.noFaceList.length }}</span>
-          <div
-            class="ml20"
-            v-for="(i, index) in uploadResult.noFaceList"
-            :key="index"
-          >
+          <div class="ml20" v-for="(i, index) in uploadResult.noFaceList" :key="index">
             {{ i }}
           </div>
         </div>
       </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">鍙� 娑�</el-button>
+        <el-button type="primary" @click="dialogVisible = false">纭� 瀹�</el-button>
+      </span>
     </el-dialog>
 
-    <el-dialog
-      title="澶嶅埗鍒�"
-      :visible.sync="copyVisiabled"
-      okText="淇濆瓨"
-      width="35%"
-      class="copy"
-      cancelText="鍙栨秷"
-    >
+    <!-- 纭鍒犻櫎瀵硅瘽妗� -->
+    <el-dialog :visible.sync="askDeleteShow" :center="true" custom-class="del-dialog">
+      <div>
+        <div class="suc-icon">
+          <i class="iconfont icongantanhao1"></i>
+        </div>
+        <div class="tt">{{ delText[0] }}</div>
+        <div class="flex-box">
+          <span>{{ delText[1] }}</span>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="askDeleteShow = false">鍙� 娑�</el-button>
+        <el-button type="primary" @click="handleDel" :loading="delBtnLoading">纭� 瀹�</el-button>
+      </span>
+    </el-dialog>
+
+    <el-dialog title="澶嶅埗鍒�" :visible.sync="copyVisiabled" okText="淇濆瓨" custom-class="copy-dialog" cancelText="鍙栨秷">
       <div class="addToBase1">
         <div class="items" v-if="baseObject.bwType === '1'">
           <div class="lable">
-            <p>榛戝悕鍗� ></p>
+            <p>榛戝悕鍗�</p>
           </div>
           <div class="baseList">
-            <el-checkbox-group
-              v-model="BaseManageData.selectBlacks"
-              @change="blackAngWhite"
-            >
+            <el-checkbox-group v-model="BaseManageData.selectBlacks" @change="blackAngWhite">
               <div
                 class="base"
                 v-for="(item, index) in BaseManageData.blackList"
                 :key="index"
+                :class="BaseManageData.selectBlacks.includes(item.value) ? 'white-wrap' : ''"
               >
-                <el-checkbox
-                  :label="item.value"
-                  :title="item.title"
-                  :disabled="item.disabled"
-                  >{{ item.title }}</el-checkbox
-                >
+                <el-checkbox :label="item.value" :title="item.title" :disabled="item.disabled">{{
+                  item.title
+                }}</el-checkbox>
               </div>
             </el-checkbox-group>
           </div>
         </div>
         <div class="items" v-else>
           <div class="lable">
-            <p>鐧藉悕鍗� ></p>
+            <p>鐧藉悕鍗�</p>
           </div>
           <div class="baseList">
-            <el-checkbox-group
-              v-model="BaseManageData.selectWhites"
-              @change="blackAngWhite"
-            >
+            <el-checkbox-group v-model="BaseManageData.selectWhites" @change="blackAngWhite">
               <div
                 class="base"
+                :class="BaseManageData.selectWhites.includes(item.value) ? 'white-wrap' : ''"
                 v-for="(item, index) in BaseManageData.whiteList"
                 :key="index"
               >
-                <el-checkbox
-                  :label="item.value"
-                  :title="item.title"
-                  :disabled="item.disabled"
-                  >{{ item.title }}</el-checkbox
-                >
+                <el-checkbox :label="item.value" :title="item.title" :disabled="item.disabled">{{
+                  item.title
+                }}</el-checkbox>
               </div>
             </el-checkbox-group>
           </div>
@@ -767,67 +523,46 @@
       </div>
       <div slot="footer" class="dialog-footer">
         <el-button size="small" @click="copyClose" type="info">鍙� 娑�</el-button>
-        <el-button size="small" type="primary" @click="copySubmit()"
-          >纭� 瀹�</el-button
-        >
+        <el-button size="small" type="primary" @click="copySubmit()">纭� 瀹�</el-button>
       </div>
     </el-dialog>
 
-    <el-dialog
-      title="绉诲姩鑷�"
-      :visible.sync="moveVisiabled"
-      okText="淇濆瓨"
-      class="move"
-      width="35%"
-      cancelText="鍙栨秷"
-    >
+    <el-dialog title="绉诲姩鑷�" :visible.sync="moveVisiabled" okText="淇濆瓨" custom-class="copy-dialog" cancelText="鍙栨秷">
       <div class="addToBase1">
         <div class="items">
           <div class="lable">
-            <p>榛戝悕鍗� ></p>
+            <p>榛戝悕鍗�</p>
           </div>
           <div class="baseList">
-            <el-checkbox-group
-              v-model="BaseManageData.selectBlacks"
-              @change="blackAngWhite"
-              :max="1"
-            >
+            <el-checkbox-group v-model="BaseManageData.selectBlacks" @change="blackAngWhite" :max="1">
               <div
                 class="base"
                 v-for="(item, index) in BaseManageData.blackList"
                 :key="index"
+                :class="BaseManageData.selectBlacks.includes(item.value) ? 'white-wrap' : ''"
               >
-                <el-checkbox
-                  :label="item.value"
-                  :title="item.title"
-                  :disabled="item.disabled"
-                  >{{ item.title }}</el-checkbox
-                >
+                <el-checkbox :label="item.value" :title="item.title" :disabled="item.disabled">{{
+                  item.title
+                }}</el-checkbox>
               </div>
             </el-checkbox-group>
           </div>
         </div>
         <div class="items">
           <div class="lable">
-            <p>鐧藉悕鍗� ></p>
+            <p>鐧藉悕鍗�</p>
           </div>
           <div class="baseList">
-            <el-checkbox-group
-              v-model="BaseManageData.selectWhites"
-              @change="blackAngWhite"
-              :max="1"
-            >
+            <el-checkbox-group v-model="BaseManageData.selectWhites" @change="blackAngWhite" :max="1">
               <div
                 class="base"
                 v-for="(item, index) in BaseManageData.whiteList"
                 :key="index"
+                :class="BaseManageData.selectWhites.includes(item.value) ? 'white-wrap' : ''"
               >
-                <el-checkbox
-                  :label="item.value"
-                  :title="item.title"
-                  :disabled="item.disabled"
-                  >{{ item.title }}</el-checkbox
-                >
+                <el-checkbox :label="item.value" :title="item.title" :disabled="item.disabled">{{
+                  item.title
+                }}</el-checkbox>
               </div>
             </el-checkbox-group>
           </div>
@@ -835,9 +570,7 @@
       </div>
       <div slot="footer" class="dialog-footer">
         <el-button size="small" @click="moveClose" type="info">鍙� 娑�</el-button>
-        <el-button size="small" type="primary" @click="moveSubmit()"
-          >纭� 瀹�</el-button
-        >
+        <el-button size="small" type="primary" @click="moveSubmit()">纭� 瀹�</el-button>
       </div>
     </el-dialog>
   </div>
@@ -847,15 +580,29 @@
   updateBasePerson,
   deleteBasePersons,
   updateDbTableStatus,
-} from "@/api/baseLibrary";
-import { getCameraFaceData } from "@/api/es";
-import axios from "axios";
-// import { findByType } from '@/server/video.js'
-import UploadBtn from "./upload";
-import fTemplate from "@/components/fTemplate";
-import UploadIcon from "@/components/searching/UploadIcon.vue";
+  deleteDbPersonById,
+  deleteDBtablesById
+} from "@/api/baseLibrary"
+import { getCameraFaceData } from "@/api/es"
+// import { checkIDCard } from "@/api/utils";
+import { isIDCard } from "../../../scripts/validate"
 
-Date.prototype.Format = function (fmt) {
+import axios from "axios"
+import UploadBtn from "./upload"
+import fTemplate from "@/components/fTemplate"
+import UploadIcon from "@/components/searching/UploadIcon.vue"
+function isPhone(rule, value, callback) {
+  if (!value) {
+    return callback()
+  } else if (value.trim()) {
+    var pattern = /^1[345789]\d{9}$/
+    if (pattern.test(value)) {
+      return callback()
+    }
+    return callback(new Error("杈撳叆鐨勬墜鏈哄彿閿欒"))
+  }
+}
+Date.prototype.Format = function(fmt) {
   var o = {
     "M+": this.getMonth() + 1, //鏈堜唤
     "d+": this.getDate(), //鏃�
@@ -863,45 +610,70 @@
     "m+": this.getMinutes(), //鍒�
     "s+": this.getSeconds(), //绉�
     "q+": Math.floor((this.getMonth() + 3) / 3), //瀛e害
-    S: this.getMilliseconds(), //姣
-  };
-  if (/(y+)/.test(fmt))
-    fmt = fmt.replace(
-      RegExp.$1,
-      (this.getFullYear() + "").substr(4 - RegExp.$1.length)
-    );
+    S: this.getMilliseconds() //姣
+  }
+  if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length))
   for (var k in o)
     if (new RegExp("(" + k + ")").test(fmt))
-      fmt = fmt.replace(
-        RegExp.$1,
-        RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length)
-      );
-  return fmt;
-};
+      fmt = fmt.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length))
+  return fmt
+}
 
 export default {
+  components: {
+    UploadBtn,
+    fTemplate,
+    UploadIcon
+  },
+  props: {
+    baseObject: {
+      default: () => {},
+      type: Object
+    },
+    syncType: {
+      type: String
+    }
+  },
+  computed: {
+    isAdmin() {
+      if (sessionStorage.getItem("userInfo") && sessionStorage.getItem("userInfo") !== "") {
+        let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username
+        return loginName === "superadmin" || loginName === "basic"
+      }
+      return false
+    },
+    delText() {
+      switch (this.delType) {
+        case "base":
+          return ["鍒犻櫎搴曞簱", "纭畾鍒犻櫎璇ュ簳搴擄紵"]
+        case "single":
+          return ["鍒犻櫎浜哄憳", "纭畾鍒犻櫎璇ュ簳搴撲汉鍛橈紵"]
+        case "batch":
+          return ["鎵归噺鍒犻櫎", "纭畾鍒犻櫎璇ュ簳搴撻�変腑浜哄憳锛�"]
+        default:
+          return ["", ""]
+      }
+    }
+  },
   data() {
     return {
-      timeRange: [
-        new Date(2020, 7, 25, 8),
-        new Date(new Date().setHours(23, 59, 59)),
-      ],
+      timeRange: [new Date(2020, 7, 25, 8), new Date(new Date().setHours(23, 59, 59))],
       memberInfo: {
         personName: "",
         sex: "",
         idCard: "",
-        reserved: "",
+        reserved: ""
       },
+      askDeleteShow: false,
+      toDeleteId: "",
       reqCameraParams: {
         startTime: new Date(2020, 7, 25, 8).Format("yyyy-MM-dd HH:mm:ss"),
         endTime: new Date().Format("yyyy-MM-dd HH:mm:ss"),
         thresholdTime: 10,
-        faceId: [],
+        faceId: []
       },
       cameraDetailData: [],
       cameraDetailVisible: false,
-
-      dialogFormVisible: false,
       copyVisiabled: false,
       moveVisiabled: false,
       buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
@@ -914,35 +686,20 @@
       orderName: "createTime",
       contentValue: "",
       visible: false,
+      showInfoDrawer: false,
       selectedRowKeys: [],
-      form: {
-        id: "",
-        sex: "鐢�",
-        personName: "鍛靛懙鍛�",
-        tableId: "",
-        picDesc: "",
-        idCard: "12312938102143253",
-        phoneNum: "18712766787",
-        monitorLevel: "one",
-        faceUrl: "group2/M00/0A/D7/wKgBnFyjH0-AUE5eAAC8hSMP2Yw110.jpg",
-        enable: 0,
-        reserved: "",
-      },
+      inputPersonForm: {},
       rules: {
-        picDesc: [
-          { required: true, message: "璇疯緭鍏ョ収鐗囨爣璇�", trigger: "submit" },
-        ],
-        sex: [{ required: true, message: "璇峰嬀閫夋�у埆", trigger: "submit" }],
-        monitorLevel: [
-          { required: true, message: "璇烽�夋嫨浜哄憳绛夌骇", trigger: "submit" },
-        ],
+        picDesc: [{ required: true, message: "璇疯緭鍏ョ収鐗囨爣璇�", trigger: "change" }],
+        sex: [{ required: true, message: "璇峰嬀閫夋�у埆", trigger: "change" }],
+        idCard: [{ validator: isIDCard, trigger: "blur" }],
+        phoneNum: [{ validator: isPhone, trigger: "blur" }],
+        monitorLevel: [{ required: true, message: "璇烽�夋嫨浜哄憳绛夌骇", trigger: "change" }]
       },
       tableData: [],
-      tableHeight: window.innerHeight - 320,
-      multipleSelection: [],
-      peoperLevel: [],
       oldWidth: "",
       oldHeight: "",
+      delType: "",
       faceDataCount: 0,
       // 涓婁紶鍚庣殑寮规鏄剧ず
       dialogVisible: false,
@@ -951,244 +708,212 @@
         failList: [],
         successList: [],
         multiFaceList: [],
-        noFaceList: [],
+        noFaceList: []
       },
-    };
+      delBtnLoading: false
+    }
   },
-  computed: {
-    isAdmin() {
-      if (
-        sessionStorage.getItem("userInfo") &&
-        sessionStorage.getItem("userInfo") !== ""
-      ) {
-        let loginName = JSON.parse(sessionStorage.getItem("userInfo")).username;
-        return loginName === "superadmin" || loginName === "basic";
-      }
-      return false;
+
+  watch: {
+    "BaseManageData.selectBlacks": function(value) {
+      this.blackAngWhite()
     },
+    "BaseManageData.selectWhites": function(value) {
+      this.blackAngWhite()
+    }
   },
   methods: {
     postCameraData() {
       getCameraFaceData(this.reqCameraParams).then((res) => {
         if (res && res.rtnCode == 1) {
-          this.cameraDetailData = res.rtnData;
-          this.faceDataCount = res.rtnData.length;
+          this.cameraDetailData = res.rtnData
+          this.faceDataCount = res.rtnData.length
         }
-      });
+      })
     },
     timeChange(val) {
-      this.reqCameraParams.startTime = val[0];
-      this.reqCameraParams.endTime = val[1];
+      this.reqCameraParams.startTime = val[0]
+      this.reqCameraParams.endTime = val[1]
     },
     showDetail(row) {
-      this.cameraDetailData = [];
-      this.memberInfo.reserved = row.reserved;
-      this.memberInfo.idCard = row.idCard;
-      this.memberInfo.personName = row.personName;
-      this.memberInfo.sex = row.sex;
-      this.reqCameraParams.faceId = row.id;
-      this.cameraDetailVisible = true;
+      this.cameraDetailData = []
+      this.memberInfo.reserved = row.reserved
+      this.memberInfo.idCard = row.idCard
+      this.memberInfo.personName = row.personName
+      this.memberInfo.sex = row.sex
+      this.reqCameraParams.faceId = row.id
+      this.cameraDetailVisible = true
     },
     isShow(authority) {
-      if (this.isAdmin) {
-        return true;
-      } else if (this.buttonAuthority.indexOf("," + authority + ",") > -1) {
-        return true;
-      } else {
-        return false;
-      }
+      return this.isAdmin || this.buttonAuthority.indexOf("," + authority + ",") > -1
+    },
+    pickRow(row, column, event) {
+      this.$refs.multipleTable.toggleRowSelection(row)
     },
     toggleSelection(rows) {
       if (rows) {
         rows.forEach((row) => {
-          this.$refs.multipleTable.toggleRowSelection(row);
-        });
+          this.$refs.multipleTable.toggleRowSelection(row)
+        })
       } else {
-        this.$refs.multipleTable.clearSelection();
+        this.$refs.multipleTable.clearSelection()
       }
     },
-    deleteThis(id) {
-      let token =
-        sessionStorage.getItem("loginedInfo") &&
-        JSON.parse(sessionStorage.getItem("loginedInfo")).access_token;
-      this.$confirm("鎻愮ず锛氱‘瀹氬垹闄よ搴曞簱浜哄憳锛�", {
-        center: true,
-        cancelButtonClass: "comfirm-class-cancle",
-        confirmButtonClass: "comfirm-class-sure",
-      })
-        .then((_) => {
-          fetch(`/data/api-v/dbperson/deleteDbPersonById?id=${id}`, {
-            method: "GET",
-            headers: {
-              "Content-Type": "application/json",
-              Authorization: token,
-            },
+    askDelete(typ, id) {
+      if (typ == "batch") {
+        if (this.selectedRowKeys.length === 0) {
+          this.$notify({
+            type: "warning",
+            message: "璇烽�夋嫨瑕佸垹闄ょ殑浜哄憳",
+            duration: 1000000
           })
-            .then((res) => {
-              return res.json();
-            })
-            .then((data) => {
-              if (data.success) {
-                this.$notify({
-                  type: "success",
-                  message: "璇ヤ汉鍛樺垹闄ゆ垚鍔燂紒",
-                });
-              }
-              this.getPersonList();
-            })
-            .catch((err) => {
-              console.log(err);
-            });
-        })
-        .catch((_) => {});
-    },
-    sayHello() {
-      console.log("hello");
+          return
+        }
+      }
+      this.askDeleteShow = true
+      this.delType = typ
+      id && (this.toDeleteId = id)
     },
     getUploadResult(result) {
-      this.uploadResult = result.data;
-      this.dialogVisible = true;
-      this.getPersonList();
+      this.uploadResult = result.data
+      this.dialogVisible = true
+      this.getPersonList()
     },
     async setEnable(item) {
       let res = await updateDbTableStatus({
         id: item.id,
-        enable: item.enable,
-      });
+        enable: item.enable
+      })
       if (res.success) {
         this.$notify({
           type: "success",
-          message: "搴曞簱鎴愬姛鍙樻洿鐢熸晥鐘舵�侊紒",
-        });
+          message: "搴曞簱鎴愬姛鍙樻洿鐢熸晥鐘舵�侊紒"
+        })
       } else {
         this.$notify({
           type: "error",
-          message: "搴曞簱鍙樻洿鐢熸晥鐘舵�佸け璐ワ紒",
-        });
+          message: "搴曞簱鍙樻洿鐢熸晥鐘舵�佸け璐ワ紒"
+        })
       }
     },
     isDisabled(item) {
-      var flag = true;
+      var flag = true
       if (this.isShow("library:set")) {
         if (item.endTime == "") {
-          flag = false;
+          flag = false
         } else {
-          flag = !this.$moment(new Date()).isBetween(
-            item.startTime,
-            item.endTime
-          );
+          flag = !this.$moment(new Date()).isBetween(item.startTime, item.endTime)
         }
       }
-      return flag;
+      return flag
     },
     edit() {
-      this.$emit("changeShow", this.baseObject, this.syncType);
+      this.$emit("changeShow", this.baseObject, this.syncType)
+    },
+
+    deleteThis() {
+      deleteDbPersonById({ id: this.toDeleteId })
+        .then((data) => {
+          if (data.success) {
+            this.$notify({
+              type: "success",
+              message: "璇ヤ汉鍛樺垹闄ゆ垚鍔燂紒"
+            })
+          }
+          this.getPersonList()
+        })
+        .catch((err) => {})
     },
     deleteBase() {
-      debugger;
-      let id = this.baseObject.id;
-      let token =
-        sessionStorage.getItem("loginedInfo") &&
-        JSON.parse(sessionStorage.getItem("loginedInfo")).access_token;
-      this.$confirm("鎻愮ず锛氱‘瀹氬垹闄ゅ簳搴擄紵", {
-        center: true,
-        cancelButtonClass: "comfirm-class-cancle",
-        confirmButtonClass: "comfirm-class-sure",
-      }).then(() => {
-        fetch(`/data/api-v/dbtable/deleteDBtablesById?id=${id}`, {
-          method: "GET",
-          headers: {
-            "Content-Type": "application/json",
-            Authorization: token,
-          },
-        })
-          .then((res) => {
-            return res.json();
-          })
-          .then((res) => {
-            if (res.success) {
-              this.$notify({
-                type: "success",
-                message: "搴曞簱鍒犻櫎鎴愬姛锛�",
-              });
-            }
-            this.$emit("onDelete");
-          })
-          .catch((err) => {
+      deleteDBtablesById({ id: this.baseObject.id })
+        .then((res) => {
+          if (res.success) {
             this.$notify({
-              type: "error",
-              message: err,
-            });
-          });
-      });
+              type: "success",
+              message: "搴曞簱鍒犻櫎鎴愬姛锛�"
+            })
+          }
+
+          this.$emit("onDelete")
+        })
+        .catch((err) => {
+          this.$notify({
+            type: "error",
+            message: err
+          })
+        })
+    },
+    async deleteBatch() {
+      let ids = []
+      this.selectedRowKeys.map((item, index) => {
+        ids.push(item.id)
+      })
+      let res = await deleteBasePersons({ ids: ids })
+      if (res.success) {
+        this.$notify({
+          type: "success",
+          message: "鍒犻櫎鎴愬姛锛�"
+        })
+        this.getPersonList()
+      } else {
+        this.$notify({
+          type: "error",
+          message: "鍒犻櫎澶辫触锛�"
+        })
+      }
     },
     async getPersonList() {
-      if (this.baseObject.id && this.baseObject.id !== undefined) {
-        this.BaseManageData.tableId = this.baseObject.id;
-        this.setLoadSearch(this.BaseManageData.queryPersonList());
-      }
+      this.$nextTick(() => {
+        if (this.baseObject.id && this.baseObject.id !== undefined) {
+          this.BaseManageData.tableId = this.baseObject.id
+          this.setLoadSearch(this.BaseManageData.queryPersonList())
+        }
+      })
     },
     changeDialog(data) {
       data.erFileList.map((item, index) => {
         this.$notify({
           type: "error",
-          message: item.errorMsg.message,
-        });
-      });
+          message: item.errorMsg.message
+        })
+      })
     },
     handleClose() {
-      this.dialogFormVisible = false;
+      this.showInfoDrawer = false
     },
     handleSelectionChange(val) {
-      this.selectedRowKeys = val;
+      this.selectedRowKeys = val
     },
     refrash(current, pageSize) {
-      this.current = current;
-      this.BaseManageData.page = current;
-      this.getPersonList();
+      this.current = current
+      this.BaseManageData.page = current
+      this.getPersonList()
     },
     handleSizeChange(val) {
-      //this.pageSize = val;
-      this.BaseManageData.size = val;
-      this.getPersonList();
+      this.BaseManageData.size = val
+      this.getPersonList()
     },
-    handleClick(row) {
-      this.form = row;
-      this.dialogFormVisible = true;
+    editRow(row) {
+      this.inputPersonForm = { ...row }
+      this.showInfoDrawer = true
     },
     async submit() {
       this.$refs["formForEdit"].validate(async (valid) => {
-        // console.log("閫氳繃楠岃瘉", valid);
         if (valid) {
-          let { ...json } = this.form;
-          delete json["compareScore"];
-          // console.log("淇敼鐨勫弬鏁帮細", json);
-          let res = await updateBasePerson(json);
-          // console.log("淇濆瓨浜�", res);
+          let { ...json } = this.inputPersonForm
+          delete json["compareScore"]
+          let res = await updateBasePerson(json)
           if (res.success) {
-            this.$notify({
-              type: "success",
-              message: "浜哄憳淇敼鎴愬姛锛�",
-            });
-            this.dialogFormVisible = false;
+            this.getPersonList()
+            this.$notify.success("浜哄憳淇敼鎴愬姛锛�")
+            this.showInfoDrawer = false
           } else {
-            this.$notify({
-              type: "error",
-              message: "浜哄憳淇敼澶辫触锛岃閲嶈瘯锛侊紒",
-            });
+            this.$notify.error("浜哄憳淇敼澶辫触锛岃閲嶈瘯锛�")
           }
         } else {
-          return false;
+          return false
         }
-      });
-    },
-    confirm() {
-      this.$confirm({
-        title: "Confirm",
-        content: "Bla bla ...",
-        okText: "纭",
-        cancelText: "鍙栨秷",
-      });
+      })
     },
     async enable(item) {
       let res = await updateBasePerson({
@@ -1201,35 +926,47 @@
         phoneNum: item.phoneNum,
         monitorLevel: item.monitorLevel,
         personPicUrl: item.personPicUrl,
-        reserved: item.reserved,
-      });
+        reserved: item.reserved
+      })
       if (res.success === true) {
         this.$notify({
           type: "success",
-          message: "搴曞簱浜哄憳鎴愬姛鍙樻洿鐢熸晥鐘舵�侊紒",
-        });
+          message: "搴曞簱浜哄憳鎴愬姛鍙樻洿鐢熸晥鐘舵�侊紒"
+        })
       } else {
         this.$notify({
           type: "error",
-          message: "搴曞簱浜哄憳鍙樻洿鐢熸晥鐘舵�佸け璐ワ紒",
-        });
+          message: "搴曞簱浜哄憳鍙樻洿鐢熸晥鐘舵�佸け璐ワ紒"
+        })
       }
     },
     handleSearch() {
-      this.getPersonList();
+      this.getPersonList()
+    },
+    async handleDel() {
+      this.delBtnLoading = true
+      if (this.delType == "single") {
+        await this.deleteThis()
+      } else if (this.delType == "base") {
+        await this.deleteBase()
+      } else if (this.delType == "batch") {
+        await this.deleteBatch()
+      }
+
+      this.delBtnLoading = false
+      this.askDeleteShow = false
     },
     searchImg() {
-      this.$refs.uploadDrag && this.$refs.uploadDrag.uploadStart();
+      this.$refs.uploadDrag && this.$refs.uploadDrag.uploadStart()
     },
     haveScore(row) {
       if (row.compareScore && row.compareScore !== "") {
-        return true;
+        return true
       } else {
-        return false;
+        return false
       }
     },
     async searchImgList(faceUrl, threshold) {
-      // console.log("鎼滃浘鍙傛暟", faceUrl, threshold);
       let json = {
         tableId: this.baseObject.id,
         page: this.current,
@@ -1237,306 +974,199 @@
         faceUrl: faceUrl,
         threshold: threshold,
         orderType: this.orderType,
-        orderName: this.orderName,
-      };
-      let res = await getPersonByPhoto(json);
-      // console.log("鍒楄〃鏌ヨ", json);
-      this.tableData = res.data.datalist;
-      this.total = res.data.total;
-      this.compare = true;
+        orderName: this.orderName
+      }
+      let res = await getPersonByPhoto(json)
+      this.tableData = res.data.datalist
+      this.total = res.data.total
+      this.compare = true
     },
     updateThreshold() {},
     async updateFace(param) {
-      const fd = new FormData();
-      fd.append("file", param.file);
-      fd.append("id", this.form.id);
-      // console.log("鎹㈣劯浜嗗悧", fd);
+      const fd = new FormData()
+      fd.append("file", param.file)
+      fd.append("id", this.inputPersonForm.id)
       let res = await axios({
         method: "post",
         url: `/data/api-v/dbperson/updateFace`,
         headers: {
           Authorization:
-            sessionStorage.getItem("loginedInfo") &&
-            JSON.parse(sessionStorage.getItem("loginedInfo")).access_token,
+            sessionStorage.getItem("loginedInfo") && JSON.parse(sessionStorage.getItem("loginedInfo")).access_token
         },
-        data: fd,
-      });
+        data: fd
+      })
       if (res.data.success) {
-        this.form.personPicUrl = res.data.data.personPicUrl;
-        this.form.faceFeature = res.data.data.faceFeature;
+        this.inputPersonForm.persoasyncnPicUrl = res.data.data.personPicUrl
+        this.inputPersonForm.faceFeature = res.data.data.faceFeature
       }
     },
-    uploadSuccess() {
-      console.log("鎹㈣劯鎴愬姛浜�");
-    },
-    uploadError() {
-      console.log("鎹㈣劯澶辫触浜�");
-    },
-    deleteBatch() {
-      // console.log('瑕佸垹闄ょ殑', this.selectedRowKeys.length)
-      if (this.selectedRowKeys.length === 0) {
-        this.$notify({
-          type: "warning",
-          message: "璇烽�夋嫨瑕佸垹闄ょ殑浜哄憳",
-        });
-      } else {
-        this.$confirm("鎻愮ず锛氱‘瀹氬垹闄よ搴曞簱閫変腑浜哄憳锛�", {
-          center: true,
-          cancelButtonClass: "comfirm-class-cancle",
-          confirmButtonClass: "comfirm-class-sure",
-        }).then(async (_) => {
-          let ids = [];
-          this.selectedRowKeys.map((item, index) => {
-            ids.push(item.id);
-          });
-          // console.log('鎵归噺鍒犻櫎鏁扮粍', ids)
-          let res = await deleteBasePersons(ids);
-          // console.log(res, '鎵归噺鍒犻櫎缁撴灉')
-          if (res.success) {
-            this.$notify({
-              type: "success",
-              message: "鍒犻櫎鎴愬姛锛�",
-            });
-            this.getPersonList();
-          } else {
-            this.$notify({
-              type: "error",
-              message: "鍒犻櫎澶辫触锛�",
-            });
-          }
-        });
-      }
-    },
+    uploadSuccess() {},
+    uploadError() {},
     async init() {
-      await this.BaseManageData.querySyncTables();
-      await this.BaseManageData.queryLocalTables();
+      await this.BaseManageData.querySyncTables()
+      await this.BaseManageData.queryLocalTables()
       if (this.baseObject.id && this.baseObject.id !== undefined) {
-        // console.log("one;", this.baseObject.id);
-      } else if (
-        this.BaseManageData.syncTables[0].id &&
-        this.BaseManageData.syncTables[0].id !== undefined
-      ) {
-        this.BaseManageData.tableId = this.BaseManageData.syncTables[0].id;
-        this.BaseManageData.queryPersonList();
+      } else if (this.BaseManageData.syncTables[0].id && this.BaseManageData.syncTables[0].id !== undefined) {
+        this.BaseManageData.tableId = this.BaseManageData.syncTables[0].id
+        this.BaseManageData.queryPersonList()
       } else {
-        this.BaseManageData.tableId = this.BaseManageData.localTables[0].id;
-        this.BaseManageData.queryPersonList();
-      }
-    },
-    handleRowStyle({ row, rowIndex }) {
-      // console.log(row, rowIndex, "handleRowStyle");
-      if (rowIndex === 0) {
-        return "background:#222222;";
+        this.BaseManageData.tableId = this.BaseManageData.localTables[0].id
+        this.BaseManageData.queryPersonList()
       }
     },
     blackAngWhite() {
       if (this.BaseManageData.selectBlacks.length > 0) {
         for (let i = 0; i < this.BaseManageData.whiteList.length; i++) {
           //this.VideoPhotoData.whiteList[i].disabled = true
-          this.$set(this.BaseManageData.whiteList[i], "disabled", true);
+          this.$set(this.BaseManageData.whiteList[i], "disabled", true)
         }
       }
       if (this.BaseManageData.selectBlacks.length == 0) {
         for (let i = 0; i < this.BaseManageData.whiteList.length; i++) {
           //this.VideoPhotoData.whiteList[i].disabled = false
-          this.$set(this.BaseManageData.whiteList[i], "disabled", false);
+          this.$set(this.BaseManageData.whiteList[i], "disabled", false)
         }
       }
       if (this.BaseManageData.selectWhites.length > 0) {
         for (let i = 0; i < this.BaseManageData.blackList.length; i++) {
           // this.VideoPhotoData.blackList[i].disabled = true
-          this.$set(this.BaseManageData.blackList[i], "disabled", true);
+          this.$set(this.BaseManageData.blackList[i], "disabled", true)
         }
       }
       if (this.BaseManageData.selectWhites.length == 0) {
         for (let i = 0; i < this.BaseManageData.blackList.length; i++) {
           //this.VideoPhotoData.blackList[i].disabled = false
-          this.$set(this.BaseManageData.blackList[i], "disabled", false);
+          this.$set(this.BaseManageData.blackList[i], "disabled", false)
         }
       }
     },
-    // tosearch(item) {
-    //   // console.log("璺宠浆鍦板潃", item)
-    //   var curWwwPath = window.document.location.href;
-    //   var pathname = window.document.location.pathname;
-    //   var pos = curWwwPath.indexOf(pathname);
-    //   var localhostPath = curWwwPath.substring(0, pos); //ip+port
-    //   var href = localhostPath + "/Layout/Searching"
-    //   let captureId = item.id == "" ? item.personId : item.id
-    //   var url = item.personPicUrl ? item.personPicUrl : item.personPicUrl
-    //   // console.log("璺宠浆鍦板潃",href,"url",url)
-    //   var compType = 0
-    //   window.open(href + '?showType=findByPic&targetId=' + captureId + '&picSmUrl=' + url + '&compType=' + compType)
-    // },
     tosearch(item) {
       //let captureId = item.id == "" ? item.baseInfo[0].targetId : item.id
-      let captureId = item.id == "" ? item.personId : item.id;
-      let imgUrl = item.personPicUrl ? item.personPicUrl : item.personPicUrl;
-      let compType = 0;
+      let captureId = item.id == "" ? item.personId : item.id
+      let imgUrl = item.personPicUrl ? item.personPicUrl : item.personPicUrl
+      let compType = 0
 
       let message =
-        "toSearch?showType=findByPic&targetId=" +
-        captureId +
-        "&picSmUrl=" +
-        imgUrl +
-        "&compType=" +
-        compType;
+        "toSearch?showType=findByPic&targetId=" + captureId + "&picSmUrl=" + imgUrl + "&compType=" + compType
       window.parent.postMessage(
         {
-          msg: message,
+          msg: message
         },
         "*"
-      );
+      )
     },
     copyClick(row) {
-      this.BaseManageData.personId = row.id;
-      this.copyVisiabled = true;
+      this.BaseManageData.personId = row.id
+      this.copyVisiabled = true
     },
     moveClick(row) {
-      this.BaseManageData.personId = row.id;
-      this.moveVisiabled = true;
+      this.BaseManageData.personId = row.id
+      this.moveVisiabled = true
     },
     copyClose() {
-      this.copyVisiabled = false;
-      this.BaseManageData.personId = "";
-      this.BaseManageData.selectBlacks = [];
-      this.BaseManageData.selectWhites = [];
+      this.copyVisiabled = false
+      this.BaseManageData.personId = ""
+      this.BaseManageData.selectBlacks = []
+      this.BaseManageData.selectWhites = []
     },
     moveClose() {
-      this.moveVisiabled = false;
-      this.BaseManageData.personId = "";
-      this.BaseManageData.selectBlacks = [];
-      this.BaseManageData.selectWhites = [];
+      this.moveVisiabled = false
+      this.BaseManageData.personId = ""
+      this.BaseManageData.selectBlacks = []
+      this.BaseManageData.selectWhites = []
     },
     copySubmit() {
-      if (
-        this.BaseManageData.selectBlacks.length === 0 &&
-        this.BaseManageData.selectWhites.length === 0
-      ) {
+      if (this.BaseManageData.selectBlacks.length === 0 && this.BaseManageData.selectWhites.length === 0) {
         this.$notify({
           title: "娉ㄦ剰",
           message: "璇烽�夋嫨瑕佸鍒跺埌鐨勫簱",
-          type: "warning",
-        });
-        return;
+          type: "warning"
+        })
+        return
       }
-      var resp = this.BaseManageData.copyTo();
+      var resp = this.BaseManageData.copyTo()
       resp.then((data) => {
         if (data.success) {
           this.$notify({
             title: "鎴愬姛",
             message: data.data,
-            type: "success",
-          });
+            type: "success"
+          })
         } else {
           this.$notify({
             title: "澶辫触",
             message: data.data,
-            type: "error",
-          });
+            type: "error"
+          })
         }
-      });
-      this.copyVisiabled = false;
-      this.BaseManageData.personId = "";
-      this.BaseManageData.selectBlacks = [];
-      this.BaseManageData.selectWhites = [];
+      })
+      this.copyVisiabled = false
+      this.BaseManageData.personId = ""
+      this.BaseManageData.selectBlacks = []
+      this.BaseManageData.selectWhites = []
     },
     moveSubmit() {
-      if (
-        this.BaseManageData.selectBlacks.length === 0 &&
-        this.BaseManageData.selectWhites.length === 0
-      ) {
+      if (this.BaseManageData.selectBlacks.length === 0 && this.BaseManageData.selectWhites.length === 0) {
         this.$notify({
           title: "娉ㄦ剰",
           message: "璇烽�夋嫨瑕佺Щ鍔ㄥ埌鐨勫簱",
-          type: "warning",
-        });
-        return;
+          type: "warning"
+        })
+        return
       }
-      var resp = this.BaseManageData.moveTo();
+      var resp = this.BaseManageData.moveTo()
       resp.then((data) => {
         if (data.success) {
           this.$notify({
             title: "鎴愬姛",
             message: data.data,
-            type: "success",
-          });
+            type: "success"
+          })
         } else {
           this.$notify({
             title: "澶辫触",
             message: data.data,
-            type: "error",
-          });
+            type: "error"
+          })
         }
-        this.moveVisiabled = false;
-        this.BaseManageData.personId = "";
-        this.BaseManageData.selectBlacks = [];
-        this.BaseManageData.selectWhites = [];
-        this.BaseManageData.queryPersonList();
-      });
+        this.moveVisiabled = false
+        this.BaseManageData.personId = ""
+        this.BaseManageData.selectBlacks = []
+        this.BaseManageData.selectWhites = []
+        this.BaseManageData.queryPersonList()
+      })
     },
     setLoadSearch(fn) {
-      this.AuthData.setLoading("multipleTable", this);
+      this.AuthData.setLoading("multipleTable", this)
       fn.then((_) => {
-        this.AuthData.closeLoad();
-      });
-    },
+        this.AuthData.closeLoad()
+      })
+    }
   },
   mounted() {
-    this.getPersonList();
-    this.VideoPhotoData.queryDictionary();
-    this.BaseManageData.queryTagList();
-    this.oldWidth = document.body.clientWidth;
-    this.oldHeight = document.body.clientHeight;
-    this.blackAngWhite();
+    this.getPersonList()
+    this.VideoPhotoData.queryDictionary()
+    this.BaseManageData.queryTagList()
+    this.oldWidth = document.body.clientWidth
+    this.oldHeight = document.body.clientHeight
+    this.blackAngWhite()
     window.onresize = () => {
-      let width = document.body.clientWidth;
-      let height = document.body.clientHeight;
-      // console.log(width, height, "绐楀彛鍙樺寲瀵规瘮", this.oldWidth, this.oldHeight);
+      let width = document.body.clientWidth
+      let height = document.body.clientHeight
       if (width !== this.oldWidth && width < 1750) {
       }
       this.$nextTick(() => {
-        this.$refs.multipleTable.doLayout();
-      });
-    };
+        this.$refs.multipleTable.doLayout()
+      })
+    }
     this.$nextTick(() => {
-      this.$refs.multipleTable.doLayout();
-    });
+      this.$refs.multipleTable.doLayout()
+    })
   },
   beforeDestroy() {
-    window.onresize = null;
-  },
-  watch: {
-    baseObject: {
-      handler(newVal, oldVal) {
-        // console.log(newVal, "鐩戝惉baseObject");
-        this.BaseManageData.cleanData();
-        this.getPersonList();
-      },
-      deep: true,
-    },
-    "BaseManageData.selectBlacks": function (value) {
-      this.blackAngWhite();
-    },
-    "BaseManageData.selectWhites": function (value) {
-      this.blackAngWhite();
-    },
-  },
-  components: {
-    UploadBtn,
-    fTemplate,
-    UploadIcon,
-  },
-  props: {
-    baseObject: {
-      default: () => {},
-      type: Object,
-    },
-    syncType: {
-      type: String,
-    },
-  },
-};
+    window.onresize = null
+  }
+}
 </script>
 <style lang="scss">
 .activeRow {
@@ -1557,9 +1187,6 @@
   max-width: none;
   font-size: 14px;
   color: #606266;
-  thead {
-    background: green !important;
-  }
 }
 .avatar-uploader:hover {
   .mask1 {
@@ -1580,7 +1207,58 @@
 .table-parent {
   height: 100%;
   overflow: visible !important;
-
+  .zhuapai-dialog {
+    border-radius: 24px;
+    top: 50%;
+    min-height: 625px;
+    .bot-btn {
+      position: absolute;
+      bottom: 20px;
+      left: calc(50% - 75px);
+      .el-button--mini {
+        padding: 10px 34px;
+        font-size: 14px;
+        background: var(--colorCard) !important;
+        border-color: var(--colorCard) !important;
+        width: 150px;
+        border-radius: 18px;
+      }
+    }
+    .el-dialog__body {
+      padding-top: 0;
+      .el-table::before {
+        visibility: hidden;
+      }
+      .el-checkbox__input.is-indeterminate .el-checkbox__inner {
+        background-color: var(--colorCard);
+        border-color: var(--colorCard);
+      }
+      .el-checkbox__input.is-checked .el-checkbox__inner {
+        background-color: var(--colorCard);
+        border-color: var(--colorCard);
+      }
+      .el-table th.el-table__cell > .cell {
+        background: #f7f8fa;
+        height: 38px;
+        line-height: 38px;
+      }
+      .el-table__body tr.hover-row > td.el-table__cell {
+        background-color: #ffffff !important;
+      }
+    }
+    .el-dialog__header {
+      box-shadow: 0px 2px 4px rgb(0 0 0 / 8%);
+      text-align: center;
+      .el-dialog__title {
+        line-height: 22px;
+        font-size: 16px;
+        color: #5f5f5f;
+      }
+      .el-dialog__headerbtn .el-dialog__close {
+        color: #999999;
+      }
+    }
+  }
   .base-tip {
     text-align: left;
     font-size: 14px;
@@ -1606,20 +1284,40 @@
       display: flex;
       align-items: center;
       cursor: pointer;
+      .shutiao {
+        width: 1.73px;
+        height: 8.67px;
+        background: var(--colorCard);
+        border-radius: 1px;
+        position: absolute;
+        right: 125px;
+        transition: 0.5s;
+      }
+
+      .shutiao1 {
+        width: 1.73px;
+        height: 8.67px;
+        background: #bbbbbb;
+        border-radius: 1px;
+        position: absolute;
+        right: 153px;
+        transform: rotate(90deg);
+        transition: 0.5s;
+      }
       .el-switch__core {
         height: 26px;
         border-radius: 18px;
       }
       .el-switch__core:after {
-        width: 22px;
-        height: 22px;
+        width: 20px;
+        height: 20px;
+        top: 2px;
       }
       .el-switch.is-checked .el-switch__core::after {
         margin-left: -22px;
       }
       .iconshanchuku-09 {
         color: #fe6d68;
-        margin-right: 10px;
       }
       .iconshanchuku-09:hover {
         background: #fe6d68;
@@ -1630,8 +1328,8 @@
         color: rgb(102, 102, 102);
       }
       .iconbianjiku-09:hover {
-        border: 1px solid #4e94ff;
-        background: #4e94ff;
+        border: 1px solid var(--colorCard);
+        background: var(--colorCard);
         color: #fff;
       }
     }
@@ -1660,13 +1358,95 @@
       color: #ff3d3b;
     }
   }
+  .el-drawer {
+    box-shadow: -4px 0px 8px rgb(0 0 0 / 16%);
+    border-radius: 24px 0px 0px 24px;
+    min-width: 380px;
+    .el-drawer__header > :first-child {
+      font-size: 16px;
+    }
+    .el-drawer__header {
+      padding: 15px 20px;
+      box-shadow: 0px 2px 4px rgb(0 0 0 / 8%);
+      margin-bottom: 0;
+    }
+    .el-drawer__body {
+      padding: 20px;
+      .el-input.is-disabled .el-input__inner {
+        border: 1px solid #d4d6d9;
+        border-radius: 16px;
+        background: #edeff2;
+        color: #bbbbbb;
+        font-size: 14px;
+      }
+      .el-form-item.is-error .el-input__inner,
+      .el-form-item.is-error .el-input__inner:focus,
+      .el-form-item.is-error .el-textarea__inner,
+      .el-form-item.is-error .el-textarea__inner:focus,
+      .el-message-box__input input.invalid,
+      .el-message-box__input input.invalid:focus {
+        border-color: #f56c6c;
+      }
+      .el-radio__input.is-checked .el-radio__inner {
+        border-color: var(--colorCard);
+        background: var(--colorCard);
+      }
+      .el-form-item__label {
+        line-height: 32px;
+      }
+      .el-form-item__content {
+        line-height: 32px;
+      }
+      .el-input--small {
+        font-size: 14px;
+        .el-input__inner {
+          border: 1px solid #d4d6d9;
+          box-sizing: border-box;
+          border-radius: 16px;
+        }
+      }
+      .el-form-item__label {
+        color: #999999;
+      }
+      .el-form-item__error {
+        color: #fe6d68;
+        padding-top: 2px;
+        left: 15px;
+      }
+      .el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:before {
+        color: #fe6d68;
+      }
+      .el-col-20 {
+        width: 92.3333%;
+      }
+      .dialog-footer {
+        margin-top: 10px;
+        .sure-btn {
+          padding: 11px 65px;
+          font-size: 14px;
+          border-radius: 18px;
+          border-color: var(--colorCard) !important;
+          background: var(--colorCard) !important;
+          color: #fff;
+        }
+        .cancel-btn {
+          padding: 11px 65px;
+          font-size: 14px;
+          border-radius: 18px;
+          background: #ffffff;
+          border-color: #999999;
+          color: #999999;
+        }
+      }
+    }
+  }
 }
-
 .text-left {
   .el-upload-list {
     display: none;
   }
 }
+
 .border-tabl {
   border: 1px solid #ebeef5;
   border-bottom: none;
@@ -1677,6 +1457,23 @@
   padding: 10px;
   margin-top: 8px;
   box-shadow: 0px 0px 6px 1px rgb(143 159 191 / 15%);
+  .tableBox {
+    border: none;
+    &::before,
+    &::after {
+      display: none;
+    }
+    .el-table--border .el-table__cell,
+    .el-table__body-wrapper .el-table--border.is-scrolling-left ~ .el-table__fixed {
+      border-right: none;
+    }
+    td {
+      border: none;
+    }
+  }
+  .cell-classname {
+    background-color: #ffffff;
+  }
   .head-search {
     font-size: 14px;
     line-height: 20px;
@@ -1685,6 +1482,10 @@
     margin: 15px 10px 20px 10px;
     justify-content: space-between;
     align-items: center;
+    .desc {
+      min-width: fit-content;
+      margin-right: 20px;
+    }
     .right-group {
       display: flex;
       .el-input--small {
@@ -1692,8 +1493,6 @@
       }
       .iconpiliangshanchu-09 {
         color: #fe6d68;
-        margin-right: 10px;
-        margin-left: 20px;
       }
       .iconpiliangshanchu-09:hover {
         background: #fe6d68;
@@ -1702,10 +1501,18 @@
       }
       .el-button--small {
         padding: 8px 45px;
+        position: relative;
         font-size: 14px;
-        background: #4e94ff !important;
+        background: var(--colorCard) !important;
         border-radius: 0px 18px 18px 0px;
-        border-color: #4e94ff !important;
+        border-color: var(--colorCard) !important;
+        color: #fff;
+        margin-right: 10px;
+      }
+
+      .el-button--small:hover {
+        // background: "rgba(#{var(--colorCard-rgb)},10%) !important"  ;
+        filter: brightness(92%);
       }
       .el-input__suffix {
         top: 6px;
@@ -1724,6 +1531,9 @@
           color: #bbbbbb;
         }
       }
+      .el-input--small .el-input__inner:focus {
+        border: 1px solid var(--colorCard);
+      }
       // .compearValue
       .compearValue {
         .el-input-number__decrease,
@@ -1737,8 +1547,6 @@
         .el-input-number--mini {
           width: 72px;
         }
-      }
-      .upload-img-box {
       }
       .uploadIconBox .left-section1 .el-input__inner {
         height: 32px;
@@ -1757,6 +1565,54 @@
       font-weight: bold;
       font-size: 15px;
     }
+  }
+  .el-table::before {
+    visibility: hidden;
+  }
+  .el-checkbox__input.is-indeterminate .el-checkbox__inner {
+    background-color: var(--colorCard);
+    border-color: var(--colorCard);
+  }
+  .el-checkbox__input.is-checked .el-checkbox__inner {
+    background-color: var(--colorCard);
+    border-color: var(--colorCard);
+  }
+  .el-table th.el-table__cell > .cell {
+    background: #f7f8fa;
+    height: 38px;
+    line-height: 38px;
+  }
+  .el-table__body tr.hover-row > td.el-table__cell {
+    background-color: #ffffff !important;
+  }
+  .hover-row {
+    cursor: pointer;
+  }
+  .hover-row:hover {
+    td {
+      background-color: #fff;
+      border-top: 1px solid var(--colorCard);
+      border-bottom: 1px solid var(--colorCard);
+
+      &:first-child {
+        background-color: #fff;
+        border-radius: 20px 0 0 20px;
+        border-left: 1px solid var(--colorCard);
+        border-bottom: 1px solid var(--colorCard);
+      }
+
+      &:last-child {
+        border-radius: 0 20px 20px 0;
+        background-color: #fff;
+        border-right: 1px solid var(--colorCard);
+        border-bottom: 1px solid var(--colorCard);
+      }
+    }
+  }
+  .el-table td.el-table__cell div {
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    line-height: inherit;
   }
   ::-webkit-scrollbar-thumb {
     border-radius: 6px;
@@ -1788,11 +1644,11 @@
   text-align: center;
   font-size: 23px;
   transition: all 0.2s;
+  margin-left: 10px;
 }
 .el-dialog__header {
   padding: 20px 0 10px;
   text-align: left;
-  -webkit-box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.07);
   box-shadow: 0 2px 7px 0 rgba(0, 0, 0, 0.07);
 }
 .el-dialog__title {
@@ -1842,66 +1698,6 @@
   padding-left: 8px !important;
   padding-right: 0px !important;
 }
-.addToBase1 {
-  width: 98%;
-  height: 350px;
-  position: relative;
-  .topLabel {
-    margin-top: 20px;
-    height: 40px;
-    border-bottom: 1px solid #eee;
-    font-family: PingFangSC-Medium;
-    font-size: 20px;
-    font-weight: 600;
-    line-height: 1rem;
-    color: #222222;
-    text-align: left;
-    margin-left: 15px;
-  }
-  .items {
-    width: 100%;
-    height: auto;
-    max-height: 35%;
-    overflow-y: auto;
-    margin: 20px 0px;
-    .lable {
-      width: 15%;
-      margin-top: 10px;
-      float: left;
-      font-size: 14px;
-      font-weight: 600;
-    }
-    .baseList {
-      width: 85%;
-      height: 100%;
-      float: left;
-      .base {
-        width: calc(33% - 10px);
-        padding: 0px 5px;
-        line-height: 30px;
-        float: left;
-        text-align: left;
-        font-size: 12px !important;
-        .el-checkbox {
-          width: 100%;
-          display: block;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          white-space: nowrap;
-          .el-checkbox__label {
-            display: inline !important;
-          }
-        }
-      }
-    }
-  }
-}
-.copy,
-.move {
-  .el-dialog__body {
-    padding: 0px !important;
-  }
-}
 
 .avatar-uploader {
   margin: auto;
@@ -1915,19 +1711,364 @@
   justify-content: space-between;
   align-items: center;
   line-height: 30px;
+  margin: 20px 0 10px 0;
+
+  color: #999;
+  .el-button--mini {
+    padding: 8px 15px;
+    font-size: 14px;
+    border-radius: 3px;
+    background: var(--colorCard) !important;
+    border-radius: 16px;
+    border-color: var(--colorCard) !important;
+    width: 128px;
+  }
+  .el-input--mini .el-input__inner {
+    height: 32px;
+    line-height: 32px;
+    border: 1px solid #d4d5d8;
+    border-radius: 16px;
+  }
+  .el-range-editor--mini.el-input__inner {
+    height: 32px;
+    border-radius: 16px;
+    border: 1px solid #d4d5d8;
+    width: 370px;
+  }
+  .el-range-editor--mini .el-range__icon,
+  .el-range-editor--mini .el-range__close-icon {
+    line-height: 25px;
+  }
+  .el-date-range-picker__time-header > .el-icon-arrow-right {
+    color: #d4d5d8;
+  }
+  .el-range-editor--mini .el-range-separator {
+    line-height: 32px;
+    font-size: 12px;
+    height: 32px;
+    color: #d4d5d8;
+  }
+  .el-range-editor--mini .el-range-input {
+    font-size: 14px;
+  }
+}
+.el-dialog.el-dialog--center.suc-dialog {
+  border-radius: 24px;
+  height: 290px;
+  width: 360px;
+  .el-dialog__header {
+    box-shadow: none;
+    padding: 10px;
+  }
+  .el-dialog__headerbtn .el-dialog__close {
+    color: #999999;
+    font-size: 20px;
+  }
+  .el-dialog__body {
+    text-align: center;
+    padding: 0 20px 10px 20px;
+  }
+  .suc-icon {
+    margin-bottom: 20px;
+    text-align: center;
+
+    .iconfont {
+      font-size: 40px;
+      color: #13ce66;
+    }
+  }
+  .dialog-footer {
+    .el-button--default {
+      color: #999999;
+      background: #fff;
+      padding: 9px 37px;
+      font-size: 14px;
+      border: 1px solid #999999;
+      border-radius: 18px;
+      width: 150px;
+    }
+    .el-button--primary {
+      background: var(--colorCard) !important;
+      padding: 9px 37px;
+      color: #fff;
+      border: 1px solidvar(--colorCard) !important;
+      border-radius: 18px;
+      font-size: 14px;
+      width: 150px;
+    }
+  }
+  .tt {
+    font-weight: bold;
+    text-align: center;
+
+    font-size: 16px;
+    line-height: 22px;
+    color: #5f5f5f;
+    margin-bottom: 10px;
+  }
+  .flex-box {
+    font-size: 14px;
+    line-height: 20px;
+    display: flex;
+    justify-content: center;
+    color: #5f5f5f;
+  }
+}
+.el-dialog.copy-dialog {
+  width: 516px;
+  border-radius: 24px;
+  .el-dialog__header {
+    text-align: center;
+  }
+  .el-dialog__headerbtn .el-dialog__close {
+    color: #999999;
+    font-size: 20px;
+  }
+  .el-dialog__title {
+    line-height: 22px;
+    font-size: 16px;
+    color: #5f5f5f;
+  }
+  .el-dialog__body {
+    padding: 20px 15px;
+    color: #5f5f5f;
+  }
+  .dialog-footer {
+    width: 315px;
+    .el-button--info {
+      color: #999999;
+      background: #fff;
+      padding: 9px 37px;
+      font-size: 14px;
+      border: 1px solid #999999;
+      border-radius: 18px;
+      width: 150px;
+    }
+    .el-button--primary {
+      background: var(--colorCard) !important;
+      padding: 9px 37px;
+      color: #fff;
+      border: 1px solidvar(--colorCard) !important;
+      border-radius: 18px;
+      font-size: 14px;
+      width: 150px;
+    }
+  }
+  .addToBase1 {
+    position: relative;
+    .topLabel {
+      margin-top: 20px;
+      height: 40px;
+      border-bottom: 1px solid #eee;
+      font-family: PingFangSC-Medium;
+      font-size: 20px;
+      font-weight: 600;
+      line-height: 1rem;
+      color: #222222;
+      text-align: left;
+      margin-left: 15px;
+    }
+    .items {
+      width: 100%;
+      min-height: 150px;
+      margin-bottom: 20px;
+      .lable {
+        font-size: 16px;
+        font-weight: bold;
+        text-align: left;
+        margin-bottom: 10px;
+      }
+      .baseList {
+        height: 100%;
+        .base {
+          width: 152px;
+          padding: 5px 5px 5px 10px;
+          line-height: 30px;
+          box-sizing: border-box;
+          float: left;
+          text-align: left;
+          background: #eff1f5;
+          border-radius: 8px;
+          margin: 0 10px;
+          margin-bottom: 10px;
+          .el-checkbox__input.is-checked .el-checkbox__inner {
+            background-color: var(--colorCard);
+            border-color: var(--colorCard);
+          }
+          .el-checkbox {
+            width: 100%;
+            display: block;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            .el-checkbox__label {
+              display: inline !important;
+              padding-left: 6px;
+              line-height: 20px;
+              color: #5f5f5f;
+            }
+          }
+        }
+        .white-wrap {
+          background: #ffffff;
+          box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.16);
+        }
+      }
+    }
+  }
+}
+.el-dialog.el-dialog--center.del-dialog {
+  border-radius: 24px;
+  height: 235px;
+  width: 360px;
+  .el-dialog__header {
+    box-shadow: none;
+    padding: 10px;
+  }
+  .el-dialog__headerbtn .el-dialog__close {
+    color: #999999;
+    font-size: 20px;
+  }
+  .el-dialog__body {
+    text-align: center;
+    padding: 0 20px 10px 20px;
+  }
+  .suc-icon {
+    margin-bottom: 20px;
+    text-align: center;
+
+    .iconfont {
+      font-size: 40px;
+      color: #fe6d68;
+    }
+  }
+  .dialog-footer {
+    .el-button--default {
+      color: #999999;
+      background: #fff;
+      padding: 9px 37px;
+      font-size: 14px;
+      border: 1px solid #999999;
+      border-radius: 18px;
+      width: 150px;
+    }
+    .el-button--primary {
+      background: var(--colorCard) !important;
+      padding: 9px 37px;
+      color: #fff;
+      border: 1px solidvar(--colorCard) !important;
+      border-radius: 18px;
+      font-size: 14px;
+      width: 150px;
+    }
+  }
+  .tt {
+    font-weight: bold;
+    text-align: center;
+
+    font-size: 16px;
+    line-height: 22px;
+    color: #5f5f5f;
+    margin-bottom: 10px;
+  }
+  .flex-box {
+    font-size: 14px;
+    line-height: 20px;
+    display: flex;
+    justify-content: center;
+    color: #5f5f5f;
+  }
 }
 .member-info {
-  font-size: 13px;
-  margin: 10px 0;
+  padding: 20px 0;
   display: flex;
+  border-bottom: 1px solid #eff1f5;
   label {
     color: #999;
-    margin-right: 6px;
+    margin-right: 20px;
   }
   ul {
     display: flex;
+    align-items: center;
     li {
-      margin-right: 8px;
+      margin-right: 20px;
+      font-weight: bold;
+    }
+  }
+}
+
+.el-picker-panel.el-date-range-picker.el-popper.popper-pick {
+  border-radius: 8px;
+  .el-input--small .el-input__inner {
+    border: 1px solid #d4d5d8;
+    border-radius: 16px;
+  }
+  .el-date-range-picker__time-header {
+    border-bottom: none;
+  }
+  .el-picker-panel__footer {
+    border-top: none;
+    text-align: center;
+    padding-bottom: 10px;
+    border-radius: inherit;
+  }
+  .el-date-range-picker .el-picker-panel__content {
+    margin: 0;
+    padding: 5px 15px;
+  }
+  .el-button--text {
+    color: #999999;
+    background: #fff;
+    padding: 9px 37px;
+    font-size: 14px;
+    border: 1px solid #999999;
+    border-radius: 18px;
+  }
+  .el-date-table td.start-date span,
+  .el-date-table td.end-date span {
+    background-color: var(--colorCard);
+  }
+  .el-date-table td.in-range div {
+    background-color: var(--colorCard) 17;
+  }
+  .el-button--default {
+    background: var(--colorCard);
+    padding: 9px 37px;
+    color: #fff;
+    border: 1px solidvar(--colorCard);
+    border-radius: 18px;
+    font-size: 14px;
+  }
+}
+.el-popover.el-popper.popper-caozuo {
+  box-shadow: 0px 0px 10px rgb(0 0 0 / 12%);
+  border-radius: 8px;
+  padding: 0;
+  padding-right: 1px;
+  & > span {
+    width: 32px;
+    height: 32px;
+    cursor: pointer;
+    display: inline-block;
+    text-align: center;
+    line-height: 32px;
+    border-radius: 8px;
+    font-size: 24px;
+    .iconfont {
+      font-size: 24px;
+    }
+    .iconshanchu-09 {
+      color: #fe6d68;
+    }
+  }
+  & > span:hover {
+    background: var(--colorCard);
+    color: #fff;
+  }
+  & > .del-wrap:hover {
+    background: #fe6d68;
+    .iconshanchu-09 {
+      color: #fff;
     }
   }
 }

--
Gitblit v1.8.0