ZZJ
2022-06-23 feaf0a9778879ef211c5587a513ba4cbdabb52d0
src/pages/library/components/carList.vue
@@ -20,6 +20,7 @@
        </div>
        <div class="right-btns">
          <span style="margin-right: 2px">底库状态(生效/失效)</span>
          <el-switch
            :active-value="1"
            :width="52"
@@ -238,7 +239,7 @@
              >
                <span
                  class="iconfont iconbianjixinxi-09"
                  style="    font-size: 24px;cursor: pointer"
                  style="font-size: 24px; cursor: pointer"
                  @click="handleClick(scope.row)"
                ></span>
              </el-tooltip>
@@ -249,62 +250,61 @@
              popper-class="popper-caozuo1"
            >
              <el-tooltip
              content="查找此车"
              placement="top"
              popper-class="atooltip"
            >
                content="查找此车"
                placement="top"
                popper-class="atooltip"
              >
                <span
                  class="iconfont iconchazhaociren-09"
                  @click="tosearch(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">
                <el-tooltip
                  content="删除"
                  placement="top"
                  popper-class="atooltip"
                >
                  <span
                    class="iconfont iconshanchu-09"
                    style="color: #e74c3c"
                    @click="askDelete('single', scope.row.id)"
                    title="删除"
                  ></span>
                </el-tooltip>
              </fTemplate>
              <span
                class="iconfont iconchazhaociren-09"
                @click="tosearch(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">
              <el-tooltip
                content="删除"
                placement="top"
                popper-class="atooltip"
              >
                <span
                  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>
@@ -369,8 +369,7 @@
      :visible.sync="copyVisiabled"
      :append-to-body="true"
      okText="保存"
      width="35%"
      class="copy"
      custom-class="copy-dialog"
      cancelText="取消"
    >
      <div class="addToBase1">
@@ -436,8 +435,7 @@
      :visible.sync="moveVisiabled"
      :append-to-body="true"
      okText="保存"
      class="move"
      width="35%"
      custom-class="copy-dialog"
      cancelText="取消"
    >
      <div class="addToBase1">
@@ -516,7 +514,9 @@
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="askDeleteShow = false">取 消</el-button>
        <el-button type="primary" @click="handleDel">确 定</el-button>
        <el-button type="primary" @click="handleDel" :loading="delBtnLoading"
          >确 定</el-button
        >
      </span>
    </el-dialog>
@@ -563,7 +563,7 @@
        :model="form"
        label-width="80px"
        style="margin-top: 20px; margin-bottom: 30px"
        :rule="rules"
        :rule="carRules"
      >
        <el-form-item label="车牌号" prop="carNo">
          <el-input
@@ -572,7 +572,7 @@
            class="inputWidth"
          ></el-input>
        </el-form-item>
        <el-form-item label="车辆类型">
        <el-form-item label="车辆类型" prop="carType">
          <el-select
            v-model="form.carType"
            placeholder="请选择车辆类型"
@@ -586,7 +586,7 @@
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="车辆品牌">
        <el-form-item label="车辆品牌" prop="carBrand">
          <el-select
            v-model="form.carBrand"
            placeholder="请选择车辆品牌"
@@ -600,7 +600,7 @@
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="车身颜色">
        <el-form-item label="车身颜色" prop="carColor">
          <el-select
            v-model="form.carColor"
            placeholder="请选择车身颜色"
@@ -614,33 +614,24 @@
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="车主姓名">
        <el-form-item label="车主姓名" prop="personName">
          <el-input v-model="form.personName" class="inputWidth"></el-input>
        </el-form-item>
        <el-form-item label="车主性别">
        <el-form-item label="车主性别" prop="sex">
          <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-form-item label="身份证号" prop="idCard">
          <el-input v-model="form.idCard" class="inputWidth"></el-input>
        </el-form-item>
        <el-form-item label="手机号">
        <el-form-item label="手机号" prop="phoneNum">
          <el-input v-model="form.phoneNum" class="inputWidth"></el-input>
        </el-form-item>
        <el-form-item label="其他">
        <el-form-item label="其他" prop="reserved">
          <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
@@ -715,9 +706,10 @@
  deleteBasePersons,
  plateBatch,
  updateDbTableStatus,
  deleteDbPersonById,
  deleteDBtablesById,
} from "@/api/baseLibrary";
import axios from "axios";
import Upload from "./upload";
import fTemplate from "@/components/fTemplate";
import request from "@/scripts/httpRequest";
export default {
@@ -733,7 +725,53 @@
      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() {
    var checkCar = (rule, value, callback) => {
      debugger;
      if (!value) {
        return callback();
      } else {
        var result = false;
        if (value.length === 7) {
          var express = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/;
          result = express.test(value);
        } else if (value.length === 8) {
          var express2 = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{5}[A-Z0-9挂学警港澳]{1}$/;
          result = express2.test(value);
        }
        if (result) {
          callback();
        } else {
          callback(new Error("请输入正确车牌号码"));
        }
        return result;
      }
    };
    return {
      dialogFormVisible: false,
      addDrawer: false,
@@ -784,12 +822,11 @@
        enable: 0,
        reserved: "",
      },
      rules: {
        carNo: [{ required: true, message: "请输入车牌号", trigger: "change" }],
        // sex: [{ required: true, message: "请勾选性别", trigger: "change" }],
        // monitorLevel: [
        //   { required: true, message: "请选择人员等级", trigger: "change" },
        // ],
      carRules: {
        carNo: [
          { required: true, message: "请输入活动名称", trigger: "blur" },
          // { validator: checkCar, trigger: 'blur' }
        ],
      },
      tableData: [],
      oldWidth: "",
@@ -804,56 +841,67 @@
        multiFaceList: [],
        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();
    },
    delText() {
      switch (this.delType) {
        case "base":
          return ["删除底库", "确定删除该底库?"];
        case "single":
          return ["删除人员", "确定删除该底库人员?"];
        case "batch":
          return ["批量删除", "确定删除该底库选中人员?"];
        default:
          return ["", ""];
      }
    "BaseManageData.selectWhites": function (value) {
      this.blackAngWhite();
    },
  },
  methods: {
    handleDel() {
      if (this.delType == "single") {
        this.deleteThis();
      } else if (this.delType == "base") {
        this.deleteBase();
      } else if (this.delType == "batch") {
        this.deleteBatch();
  mounted() {
    this.getCarList();
    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;
      if (width !== this.oldWidth && width < 1750) {
      }
      this.$nextTick(() => {
        this.$refs.multipleTable.doLayout();
      });
    };
    this.$nextTick(() => {
      this.$refs.multipleTable.doLayout();
    });
  },
  beforeDestroy() {
    window.onresize = null;
  },
  methods: {
    checkCarNo(value) {
      var result = false;
      if (value.length === 7) {
        var express = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/;
        result = express.test(value);
      } else if (value.length === 8) {
        var express2 = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{5}[A-Z0-9挂学警港澳]{1}$/;
        result = express2.test(value);
      }
      return result;
    },
    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;
    },
    deleteBase() {
      let token =
        sessionStorage.getItem("loginedInfo") &&
        JSON.parse(sessionStorage.getItem("loginedInfo")).access_token;
      fetch(`/data/api-v/dbtable/deleteDBtablesById?id=${this.baseObject.id}`, {
        method: "GET",
        headers: {
          "Content-Type": "application/json",
          Authorization: token,
        },
      })
        .then((res) => {
          return res.json();
        })
      deleteDBtablesById({ id: this.baseObject.id })
        .then((res) => {
          if (res.success) {
            this.$notify({
@@ -861,6 +909,7 @@
              message: "底库删除成功!",
            });
          }
          this.askDeleteShow = false;
          this.$emit("onDelete");
        })
        .catch((err) => {
@@ -913,6 +962,7 @@
        data: fd,
      });
      if (res.success) {
        debugger;
        this.form.carUrls.push({ url: "/httpImage/" + res.data.picUrl });
      }
    },
@@ -979,24 +1029,12 @@
      }
    },
    deleteThis() {
      let token =
        sessionStorage.getItem("loginedInfo") &&
        JSON.parse(sessionStorage.getItem("loginedInfo")).access_token;
      fetch(`/data/api-v/dbperson/deleteDbPersonById?id=${this.toDeleteId}`, {
        method: "GET",
        headers: {
          "Content-Type": "application/json",
          Authorization: token,
        },
      })
        .then((res) => {
          return res.json();
        })
      deleteDbPersonById({ id: this.toDeleteId })
        .then((data) => {
          if (data.success) {
            this.$notify({
              type: "success",
              message: "该人员删除成功!",
              message: "车辆信息删除成功!",
            });
          }
          this.getCarList();
@@ -1008,7 +1046,7 @@
      this.dialogVisible = true;
      this.getCarList();
    },
    async getCarList() {
    getCarList() {
      if (this.baseObject.id && this.baseObject.id !== undefined) {
        this.BaseManageData.tableId = this.baseObject.id;
        this.setLoadSearch(this.BaseManageData.queryPersonList());
@@ -1050,13 +1088,13 @@
          if (res.success) {
            this.$notify({
              type: "success",
              message: "人员修改成功!",
              message: "车辆信息修改成功!",
            });
            this.dialogFormVisible = false;
          } else {
            this.$notify({
              type: "error",
              message: "人员修改失败,请重试!!",
              message: "车辆信息修改失败,请重试!!",
            });
          }
        } else {
@@ -1088,12 +1126,12 @@
      if (res.success) {
        this.$notify({
          type: "success",
          message: "底库人员成功变更生效状态!",
          message: "车辆信息成功变更生效状态!",
        });
      } else {
        this.$notify({
          type: "error",
          message: "底库人员变更生效状态失败!",
          message: "车辆信息变更生效状态失败!",
        });
      }
    },
@@ -1163,7 +1201,7 @@
      this.selectedRowKeys.map((item, index) => {
        ids.push(item.id);
      });
      let res = await deleteBasePersons(ids);
      let res = await deleteBasePersons({ ids: ids });
      if (res.success) {
        this.$notify({
          type: "success",
@@ -1197,7 +1235,7 @@
        if (this.selectedRowKeys.length === 0) {
          this.$notify({
            type: "warning",
            message: "请选择要删除的人员",
            message: "请选择要删除的车辆信息",
          });
          return;
        }
@@ -1295,16 +1333,24 @@
        });
      }
    },
    async submitCar() {
    submitCar() {
      this.$refs["formForCar"].validate(async (valid) => {
        if (valid) {
          let { ...json } = this.form;
          json.carPicUrls = "";
          for (let index in json.carUrls) {
            if (index == 0) {
              json.carPicUrls += json.carUrls[index].url.substring(11);
            } else {
              json.carPicUrls += ";" + json.carUrls[index].url.substring(11);
            }
          }
          if (!this.checkCarNo(json.carNo)) {
            this.$notify({
              type: "warning",
              message: "请输入正确的车牌号",
            });
            return;
          }
          json.carColor = parseInt(json.carColor);
          json.carType = parseInt(json.carType);
@@ -1321,14 +1367,14 @@
          if (res.success) {
            this.$notify({
              type: "success",
              message: res.data.msg,
              message: "保存成功",
            });
            this.getCarList();
            this.addDrawer = false;
          } else {
            this.$notify({
              type: "error",
              message: res.data.msg,
              message: res.msg,
            });
          }
        } else {
@@ -1439,44 +1485,6 @@
      fn.then((_) => {
        this.AuthData.closeLoad();
      });
    },
  },
  mounted() {
    this.getCarList();
    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;
      if (width !== this.oldWidth && width < 1750) {
      }
      this.$nextTick(() => {
        this.$refs.multipleTable.doLayout();
      });
    };
    this.$nextTick(() => {
      this.$refs.multipleTable.doLayout();
    });
  },
  beforeDestroy() {
    window.onresize = null;
  },
  watch: {
    baseObject: {
      handler(newVal, oldVal) {
        this.BaseManageData.cleanData();
        this.getCarList();
      },
      deep: true,
    },
    "BaseManageData.selectBlacks": function (value) {
      this.blackAngWhite();
    },
    "BaseManageData.selectWhites": function (value) {
      this.blackAngWhite();
    },
  },
};
@@ -1624,8 +1632,6 @@
      box-shadow: 0px 2px 4px rgb(0 0 0 / 8%);
      font-size: 14px;
    }
    .el-drawer__body {
    }
  }
}
@@ -1721,10 +1727,115 @@
  padding-right: 0px !important;
}
.copy,
.move {
// .copy,
// .move {
//   .el-dialog__body {
//     padding: 0px !important;
//   }
// }
.el-dialog.copy-dialog {
  width: 550px;
  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: 0px !important;
    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: 10px;
      .lable {
        font-size: 16px;
        font-weight: bold;
        text-align: left;
        margin-bottom: 10px;
      }
      .baseList {
        height: 100%;
        overflow: auto;
        .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);
        }
      }
    }
  }
}