tab禁用

ZZJ

2022-01-12 9d43e7051075f1fc1b2fee680a79f90becddd63f

 src/pages/library/components/carList.vue

@@ -12,7 +12,8 @@
            >{{ this.baseObject.bwType === "1" ? "黑名单" : "白名单" }}</span
          >
          <span class="ok-time"
            >有效时间：{{ this.baseObject.startTime }}--{{
            >有效时间：{{ this.baseObject.startTime }} --
            {{
              this.baseObject.endTime ? this.baseObject.endTime : "永久有效"
            }}</span
          >
@@ -31,7 +32,8 @@
            @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"
@@ -111,11 +113,13 @@

      <el-table
        id="multipleTable"
        class="tableBox"
        ref="multipleTable"
        :data="BaseManageData.personList"
        tooltip-effect="dark"
        style="width: 100%; overflow: auto"
        :fit="true"
        border
        :default-sort="{ prop: 'createTime', order: 'descending' }"
        @selection-change="handleSelectionChange"
        :header-cell-style="{
@@ -233,19 +237,24 @@
                popper-class="atooltip"
              >
                <span
                  class="iconfont iconbianji iconStyle1"
                  style="font-size: 15px"
                  class="iconfont iconbianjixinxi-09"
                  style="    font-size: 24px;cursor: pointer"
                  @click="handleClick(scope.row)"
                ></span>
              </el-tooltip>
            </fTemplate>
            <el-tooltip
              content="查找此人"
            <el-popover
              placement="top"
              trigger="click"
              popper-class="popper-caozuo1"
            >
              <el-tooltip
              content="查找此车"
              placement="top"
              popper-class="atooltip"
            >
              <span
                class="iconfont iconsousuoren iconStyle1"
                class="iconfont iconchazhaociren-09"
                @click="tosearch(scope.row)"
              ></span>
            </el-tooltip>
@@ -256,7 +265,7 @@
                popper-class="atooltip"
              >
                <span
                  class="iconfont iconfuzhi iconStyle1"
                  class="iconfont iconfuzhi-09"
                  title="复制"
                  @click="copyClick(scope.row)"
                ></span>
@@ -269,8 +278,7 @@
                popper-class="atooltip"
              >
                <span
                  class="iconfont iconyidongzhi iconStyle1"
                  style="font-size: 15px"
                  class="iconfont iconyidong-09"
                  title="移动"
                  @click="moveClick(scope.row)"
                ></span>
@@ -283,13 +291,20 @@
                popper-class="atooltip"
              >
                <span
                  class="iconfont iconshanchu iconStyle1"
                  class="iconfont iconshanchu-09"
                  style="color: #e74c3c"
                  @click="deleteThis(scope.row.id)"
                  title="删除"
                ></span>
              </el-tooltip>
            </fTemplate>
             <span
                slot="reference"
                class="iconfont icongengduocaozuo-09"
                style="font-size: 24px; cursor: pointer"
              ></span>
            </el-popover>
            
          </template>
        </el-table-column>
      </el-table>
@@ -297,8 +312,7 @@
        @current-change="refrash"
        :current-page="BaseManageData.page"
        :page-size="BaseManageData.size"
        style="margin-top: 10px;"
        layout="total,sizes,prev,pager,next,jumper"
        style="margin-top: 10px"
        :total="BaseManageData.total"
      ></el-pagination>
    </div>
@@ -510,134 +524,148 @@
      title="车辆信息"
      :modal="false"
      :destroy-on-close="true"
      :append-to-body="true"
      custom-class="add-car"
      :visible.sync="addDrawer"
      :direction="direction"
      :before-close="handleClose1"
    >
      <div class="drawerSpace">
        <div class="uploadLine">
          <div class="car-picture">
            <el-upload
              action
              :http-request="uploadCar"
              accept="image/*"
              list-type="picture-card"
              :file-list="form.carUrls"
              :before-remove="handleRemoveCarPic"
            >
              <i class="el-icon-plus" style="margin-top: 25px"></i>
              <div>上传车辆照片</div>
            </el-upload>
          </div>
          <div class="person-picture">
            <el-upload
              action
              :http-request="uploadPerson"
              list-type="picture-card"
              accept="image/*"
              :limit="1"
              :file-list="form.faceUrl"
              :on-remove="handleRemoveFacePic"
            >
              <i class="el-icon-plus" style="margin-top: 25px"></i>
              <div>上传车主照片</div>
            </el-upload>
          </div>
      <div class="uploadLine">
        <div class="car-picture">
          <div class="car-text">上传车辆照片</div>
          <el-upload
            action
            :http-request="uploadCar"
            accept="image/*"
            list-type="picture-card"
            :file-list="form.carUrls"
            :before-remove="handleRemoveCarPic"
          >
            <i class="el-icon-plus" style="margin-top: 25px"></i>
          </el-upload>
        </div>
        <el-form
          ref="formForCar"
          :model="form"
          label-width="100px"
          style="margin-top: 20px; margin-bottom: 50px"
          :rule="rules"
        <div class="person-picture">
          <div class="car-text">上传车主照片</div>
          <el-upload
            action
            :http-request="uploadPerson"
            list-type="picture-card"
            accept="image/*"
            :limit="1"
            :file-list="form.faceUrl"
            :on-remove="handleRemoveFacePic"
          >
            <i class="el-icon-plus" style="margin-top: 25px"></i>
          </el-upload>
        </div>
      </div>
      <el-form
        ref="formForCar"
        :model="form"
        label-width="80px"
        style="margin-top: 20px; margin-bottom: 30px"
        :rule="rules"
      >
        <el-form-item label="车牌号" prop="carNo">
          <el-input
            placeholder="请输入车牌号"
            v-model="form.carNo"
            class="inputWidth"
          ></el-input>
        </el-form-item>
        <el-form-item label="车辆类型">
          <el-select
            v-model="form.carType"
            placeholder="请选择车辆类型"
            class="inputWidth"
          >
            <el-option
              v-for="item in VideoPhotoData.dictionary.CARTYPE"
              :key="item.value"
              :label="item.name"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="车辆品牌">
          <el-select
            v-model="form.carBrand"
            placeholder="请选择车辆品牌"
            class="inputWidth"
          >
            <el-option
              v-for="item in VideoPhotoData.dictionary.BRAND"
              :key="item.value"
              :label="item.name"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="车身颜色">
          <el-select
            v-model="form.carColor"
            placeholder="请选择车身颜色"
            class="inputWidth"
          >
            <el-option
              v-for="item in VideoPhotoData.dictionary.nColor"
              :key="item.value"
              :label="item.name"
              :value="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="车主姓名">
          <el-input v-model="form.personName" class="inputWidth"></el-input>
        </el-form-item>
        <el-form-item label="车主性别">
          <el-radio-group v-model="form.sex">
            <el-radio label="男"></el-radio>
            <el-radio label="女"></el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="身份证号">
          <el-input v-model="form.idCard" class="inputWidth"></el-input>
        </el-form-item>
        <el-form-item label="手机号">
          <el-input v-model="form.phoneNum" class="inputWidth"></el-input>
        </el-form-item>
        <el-form-item label="其他">
          <el-input v-model="form.reserved" class="inputWidth"></el-input>
        </el-form-item>
        <!-- <el-form-item style="text-align: tight">
          <el-button
            type="primary"
            @click="submitCar"
            style="margin-left: 120px"
            >保存</el-button
          >
          <el-button @click="resetForm">取消</el-button>
        </el-form-item> -->
      </el-form>
      <div class="dialog-footer">
        <el-button
          size="small"
          class="sure-btn"
          type="primary"
          @click="submitCar"
          >确 定</el-button
        >
          <el-form-item label="*车牌号：">
            <el-input
              placeholder="请输入车牌号"
              v-model="form.carNo"
              class="inputWidth"
            ></el-input>
          </el-form-item>
          <el-form-item label="车辆类型：">
            <el-select
              v-model="form.carType"
              placeholder="请选择车辆类型"
              class="inputWidth"
            >
              <el-option
                v-for="item in VideoPhotoData.dictionary.CARTYPE"
                :key="item.value"
                :label="item.name"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="车辆品牌：">
            <el-select
              v-model="form.carBrand"
              placeholder="请选择车辆品牌"
              class="inputWidth"
            >
              <el-option
                v-for="item in VideoPhotoData.dictionary.BRAND"
                :key="item.value"
                :label="item.name"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="车身颜色：">
            <el-select
              v-model="form.carColor"
              placeholder="请选择车身颜色"
              class="inputWidth"
            >
              <el-option
                v-for="item in VideoPhotoData.dictionary.nColor"
                :key="item.value"
                :label="item.name"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="车主姓名：">
            <el-input v-model="form.personName" class="inputWidth"></el-input>
          </el-form-item>
          <el-form-item label="车主性别：">
            <el-radio-group v-model="form.sex">
              <el-radio label="男"></el-radio>
              <el-radio label="女"></el-radio>
            </el-radio-group>
          </el-form-item>
          <el-form-item label="身份证号：">
            <el-input v-model="form.idCard" class="inputWidth"></el-input>
          </el-form-item>
          <el-form-item label="手机号：">
            <el-input v-model="form.phoneNum" class="inputWidth"></el-input>
          </el-form-item>
          <el-form-item label="其他：">
            <el-input v-model="form.reserved" class="inputWidth"></el-input>
          </el-form-item>
          <el-form-item style="text-align: tight">
            <el-button
              type="primary"
              @click="submitCar"
              style="margin-left: 120px"
              >保存</el-button
            >
            <el-button @click="resetForm">取消</el-button>
          </el-form-item>
        </el-form>
        <el-button
          size="small"
          class="cancel-btn"
          @click="resetForm"
          type="info"
          >取 消</el-button
        >
      </div>
    </el-drawer>

    <el-drawer
      title="上传车牌"
      :modal="false"
      :append-to-body="true"
      :visible.sync="addBatchDrawer"
      :direction="direction"
      custom-class="upload-pai"
      :before-close="handleClose2"
    >
      <div class="drawerSpace">
@@ -652,14 +680,30 @@
          <p>
            车牌号以逗号或回车键隔开，单次最多支持100条上传，例如：京YAB123,京F34Y87
          </p>
          <el-button
          <!-- <el-button
            type="primary"
            @click="platesBatch"
            style="margin-left: 210px"
            >保存</el-button
          >
          <el-button @click="resetForm('ruleForm')">取消</el-button>
          <el-button @click="resetForm('ruleForm')">取消</el-button> -->
        </div>
      </div>
      <div class="dialog-footer">
        <el-button
          size="small"
          class="sure-btn"
          type="primary"
          @click="platesBatch"
          >保存</el-button
        >
        <el-button
          size="small"
          class="cancel-btn"
          @click="resetForm('ruleForm')"
          type="info"
          >取消</el-button
        >
      </div>
    </el-drawer>
  </div>
@@ -707,11 +751,6 @@
          url: "group2/M00/0A/D7/wKgBnFyjH0-AUE5eAAC8hSMP2Yw110.jpg",
        },
      ],
      // provinces: [
      //   { name: "京", value: 1 },
      //   { name: "津", value: 2 },
      //   { name: "冀", value: 3 },
      // ],
      copyVisiabled: false,
      moveVisiabled: false,
      buttonAuthority: sessionStorage.getItem("buttonAuthoritys") || [],
@@ -746,13 +785,11 @@
        reserved: "",
      },
      rules: {
        picDesc: [
          { required: true, message: "请输入照片标识", trigger: "change" },
        ],
        sex: [{ required: true, message: "请勾选性别", trigger: "change" }],
        monitorLevel: [
          { required: true, message: "请选择人员等级", trigger: "change" },
        ],
        carNo: [{ required: true, message: "请输入车牌号", trigger: "change" }],
        // sex: [{ required: true, message: "请勾选性别", trigger: "change" }],
        // monitorLevel: [
        //   { required: true, message: "请选择人员等级", trigger: "change" },
        // ],
      },
      tableData: [],
      oldWidth: "",
@@ -928,13 +965,9 @@
      done();
    },
    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
      );
    },
    toggleSelection(rows) {
      if (rows) {
@@ -970,7 +1003,6 @@
        })
        .catch((err) => {});
    },
    // sayHello() {},
    getUploadResult(result) {
      this.uploadResult = result.data;
      this.dialogVisible = true;
@@ -1075,7 +1107,6 @@
      return row.compareScore && row.compareScore !== "";
    },
    async setEnable(item) {
      debugger;
      let res = await updateDbTableStatus({
        id: item.id,
        enable: item.enable,
@@ -1475,9 +1506,6 @@
  max-width: none;
  font-size: 14px;
  color: #606266;
  thead {
    background: green !important;
  }
}
.avatar-uploader:hover {
  .mask1 {
@@ -1529,16 +1557,74 @@
      height: 25px;
    }
  }
  .el-drawer.ltr,
  .el-drawer.rtl {
    width: 27% !important;
    //height: 90%;
    //top: 9%;
  .el-drawer.add-car {
    width: 380px;
    .el-drawer__header {
      border-bottom: 2px solid #eee;
      padding-bottom: 10px;
      font-size: 16px;
      margin-bottom: 0px;
      margin-bottom: 0;
      padding: 20px;
      box-shadow: 0px 2px 4px rgb(0 0 0 / 8%);
      font-size: 14px;
    }
    .el-drawer__body {
      .uploadLine {
        padding-left: 10px;

        .el-upload-list--picture-card .el-upload-list__item {
          background-color: #fff;
          border: 2px solid #d4d6d9;
          border-radius: 8px;
          width: 100px;
          height: 100px;
        }
        .el-upload--picture-card {
          background-color: #fff;
          border: 2px solid #d4d6d9;
          border-radius: 8px;
          width: 100px;
          height: 100px;
          line-height: 100px;
        }
        .car-text {
          color: #999999;
          font-size: 14px;
          line-height: 20px;
          text-align: left;
          margin-bottom: 5px;
        }
        .car-picture {
          margin-bottom: 20px;
          & > div {
            display: flex;
          }
        }
        .person-picture {
          margin-bottom: 20px;
          & > div {
            display: flex;
          }
        }
      }
      .el-select {
        width: 100%;
      }
      .el-radio-group {
        width: 100%;
        text-align: left;
      }
      .el-form-item {
        margin-bottom: 18px;
      }
    }
  }
  .el-drawer.upload-pai {
    width: 380px;
    .el-drawer__header {
      margin-bottom: 0;
      padding: 20px;
      box-shadow: 0px 2px 4px rgb(0 0 0 / 8%);
      font-size: 14px;
    }
    .el-drawer__body {
    }
  }
}
@@ -1553,6 +1639,36 @@
  border-bottom: none;
  height: calc(100% - 100px);
  overflow: auto;
  .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;
    }
  }
  .head-search {
    .desc {
      min-width: fit-content;
      margin-right: 20px;
    }
    .right-group {
      .iconshangchuanchepai-09:hover,
      .icontianjiacheliang-09:hover {
        border: 1px solid var(--colorCard);
        background: var(--colorCard);
        color: #fff;
      }
    }
  }
}
.el-dialog__header {
  padding: 20px 0 10px;
@@ -1572,9 +1688,9 @@
  font-size: 14px;
  word-break: break-all;
}
.dialog-footer {
  text-align: center;
}
// .dialog-footer {
//   text-align: center;
// }
.comfirm-class-sure {
  background: #f53d3d;
  border-radius: 2px;
@@ -1618,96 +1734,35 @@
  min-height: 100px;
  border: 1px solid #eee;
}

.inputWidth {
  width: 270px !important;
}
.rightInputWidth {
  max-width: 270px;
}

.el-drawer.ltr,
.el-drawer.rtl {
  min-width: 450px;
  width: 25% !important;
  //height: 90%;
  //min-height: 1100px;
  //top: 9%;
  .el-drawer__header {
    border-bottom: 2px solid #eee;
    padding-bottom: 10px;
    font-size: 16px;
    margin-bottom: 0px;
    :focus {
      outline: 0;
.el-popover.el-popper.popper-caozuo1 {
  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;
    }
  }
}

.drawerSpace {
  height: calc(100% - 140px);
  box-sizing: border-box;
  margin-bottom: 30px;
  overflow-y: scroll;
  .uploadLine {
    height: 280px;

    .car-picture {
      float: left;
      margin: 15px;
      border: 1px solid #eee;
      width: 280px;
      height: 260px;
      overflow: hidden;
      .el-upload--picture-card {
        margin: 10px;
        width: 110px;
        height: 110px;
        line-height: 35px;
      }
      .el-upload-list--picture-card {
        .el-upload-list__item {
          margin: 10px;
          width: 110px;
          height: 110px;
          img {
            object-fit: contain;
          }
        }
        .el-progress--circle {
          width: 30px !important;
        }
      }
    }
    .person-picture {
      float: left;
      margin-top: 15px;
      width: 120px;
      height: 120px;
      overflow: hidden;
      .el-upload--picture-card {
        width: 110px;
        height: 110px;
        line-height: 35px;
      }
      .el-upload-list__item {
        margin: 10px;
        width: 110px;
        height: 110px;
        img {
          object-fit: contain;
        }
      }
    }
  & > span:hover {
    background: var(--colorCard);
    color: #fff;
  }
  .plateAttach {
    width: calc(100% - 40px);
    height: calc(100% - 40px);
    padding: 20px;
    p {
      margin-top: 20px;
      width: 400px;
      line-height: 20px;
  & > .del-wrap:hover {
    background: #fe6d68;
    .iconshanchu-09 {
      color: #fff;
    }
  }
}