zuozhengqing
2024-03-27 b8bd2b2da2b62da9565fd62b74d5b4a403abe15c
Merge branch 'master' of ssh://192.168.5.5:29418/web/SRM
4个文件已添加
935 ■■■■■ 已修改文件
src/api/supplierManage/outsourceSupplier.js 54 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/supplierManage/outsourceSupplier/components/VersionType.vue 168 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/supplierManage/outsourceSupplier/components/addEnterprise.vue 358 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/supplierManage/outsourceSupplier/index.vue 355 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/api/supplierManage/outsourceSupplier.js
New file
@@ -0,0 +1,54 @@
import request from "@/common/untils/request.js"
// 委外企业新增
export const addEnterprise = (data) => {
  return request({
    url: "/api-s/v1/outsourcing/enterprise/add",
    method: "post",
    data
  })
}
// 委外企业修改
export const updateEnterprise = (data) => {
  return request({
    url: "/api-s/v1/outsourcing/enterprise/update",
    method: "post",
    data
  })
}
// 委外企业列表
export const enterpriseList = (data) => {
  return request({
    url: "/api-s/v1/outsourcing/enterprise/list",
    method: "get",
    params: data
  })
}
// 委外企业统计
export const enterpriseOverview = () => {
  return request({
    url: "/api-s/v1/outsourcing/enterprise/overview",
    method: "get"
  })
}
// 添加外部用户账号
export const addOutsideUser = (data) => {
  return request({
    url: "/api/outsideUser/addUser",
    method: "post",
    data
  })
}
// 启用/禁用外部用户
export const editOutsideUser = (data) => {
  return request({
    url: "/api/outsideUser/editUser",
    method: "post",
    data
  })
}
src/views/supplierManage/outsourceSupplier/components/VersionType.vue
New file
@@ -0,0 +1,168 @@
<template>
  <div class="versionType">
    <!-- title + '组件' -->
    <el-dialog
      :title="'编辑下拉框>' + title"
      :visible.sync="isvisible"
      :width="dialogWidth"
      :before-close="handleClose"
      append-to-body
      custom-class="iframe-dialog"
    >
      <div class="drawerContent">
        <el-table
          v-if="isTableShow"
          :header-cell-style="{ background: '#f1f3f8', color: '#000009' }"
          ref="multipleTable"
          :data="BomTableData"
          tooltip-effect="dark"
          height="460"
        >
          <el-table-column prop="unit" label="类别">
            <template slot-scope="scope">
              <el-input v-model="scope.row.name"></el-input>
            </template>
          </el-table-column>
          <el-table-column prop="createdAt" label="设为默认">
            <template slot-scope="scope">
              <el-switch @change="switchChange(scope, scope.row.isDefault)" v-model="scope.row.isDefault"></el-switch>
            </template>
          </el-table-column>
          <el-table-column label="操作" width="100">
            <template slot-scope="scope">
              <!-- <i class="el-icon-top" id="iconStyle"></i>
           <i class="el-icon-bottom"  id="iconStyle"></i> -->
              <i class="el-icon-delete" id="iconStyle" @click="handleDelete(scope.row.id)"></i>
            </template>
          </el-table-column>
        </el-table>
        <el-button @click="handleAdd()" type="text" class="margin_top_15px margin_left_20px">新增下拉框</el-button>
      </div>
      <div slot="footer">
        <!-- <el-button
          @click="handleAdd()"
          style="margin-left: 16px; color: #fff; background-color: #ee790c"
          >新增</el-button
        > -->
        <el-button @click="handleClose">取消</el-button
        ><el-button
          type="primary"
          @click="handleConfirmSave()"
          style="margin-left: 16px; color: #fff; background-color: #2a78fb"
          >确定</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>
<script>
export default {
  name: "VersionType",
  mixins: [],
  components: {},
  props: {
    title: {
      type: String,
      default: "版本类型"
    },
    editRow: {
      type: Object,
      default: () => {
        return {}
      }
    },
    workList: {
      type: Array
    }
  },
  computed: {},
  data() {
    return {
      dialogWidth: "30%",
      isvisible: false,
      isTableShow: true,
      BomTableData: [1]
    }
  },
  created() {},
  watch: {
    editDialogVisible(newVal) {
      if (newVal) {
        this.BomTableData = this.workList
      }
    },
    workList(newVal) {
      console.log(newVal)
      this.BomTableData = this.workList
    }
  },
  mounted() {},
  methods: {
    handleAdd() {
      this.BomTableData.push({ name: "", isDefault: false })
    },
    handleDelete(id) {
      this.BomTableData = this.BomTableData.filter((i) => {
        return i.id != id
      })
    },
    switchChange(scope, val) {
      let arr = []
      for (let i in this.BomTableData) {
        if (this.BomTableData[i].isDefault) {
          arr.push(i)
        }
      }
      if (arr.length > 1) {
        this.$message({
          message: "只能设一个为默认",
          type: "warning"
        })
        scope.row.isDefault = !val
      }
    },
    handleConfirmSave() {
      let arr = []
      for (let i in this.BomTableData) {
        if (this.BomTableData[i].isDefault) {
          arr.push(i)
        }
      }
      if (arr.length > 1) {
        this.$message({
          message: "只能设一个为默认",
          type: "warning"
        })
      } else {
        this.$emit("handleConfirmSave", this.BomTableData)
        this.isvisible = false
      }
    },
    handleClose() {
      this.isvisible = false
    }
  }
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
::v-deep {
  .iframe-dialog .el-dialog__body {
  }
  .el-dialog__footer {
    height: 55px;
    line-height: 55px;
    background-color: #f5f5f5;
    padding: 0px 20px 0;
    text-align: right;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
}
::v-deep .el-dialog__body {
  padding-bottom: 10px !important;
}
</style>
src/views/supplierManage/outsourceSupplier/components/addEnterprise.vue
New file
@@ -0,0 +1,358 @@
<template>
  <el-dialog
    :close-on-click-modal="false"
    :visible.sync="islook"
    width="35rem"
    class="add-event-dialog"
    @close="shutdown"
  >
    <div slot="title" class="tac drawerHeader">
      <span>{{ titleName }}企业</span>
    </div>
    <div class="dialog-content-box">
      <el-form ref="form" :rules="rules" :model="form" label-width="100px" label-position="left">
        <el-form-item label="企业编码" prop="number">
          <span v-if="editRow.look == 'look'">{{ form.number }}</span>
          <el-input v-else v-model="form.number" clearable placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="企业名称" prop="name">
          <span v-if="editRow.look == 'look'">{{ form.name }}</span>
          <el-input v-else v-model="form.name" clearable placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="企业类型" prop="enterpriseType">
          <span v-if="editRow.look == 'look'">{{ form.enterpriseType }}</span>
          <el-select v-model="form.enterpriseType" placeholder="企业类型" filterable style="width: calc(100% - 30px)">
            <el-option v-for="ele in enterpriseTypeList" :key="ele.id" :label="ele.name" :value="ele.name"></el-option>
          </el-select>
          <i
            class="el-icon-setting margin_left_10px cursor_pointer"
            style="font-size: 20px; color: gray"
            @click="handleCommonShow(5)"
          ></i>
        </el-form-item>
        <el-form-item label="联系人" prop="contact">
          <span v-if="editRow.look == 'look'">{{ form.contact }}</span>
          <el-input v-else v-model="form.contact" clearable placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="联系方式" prop="tel">
          <span v-if="editRow.look == 'look'">{{ form.tel }}</span>
          <el-input
            v-else
            v-model="form.tel"
            clearable
            placeholder="请输入"
            :disabled="titleName == '编辑' ? true : false"
          ></el-input>
        </el-form-item>
        <el-form-item label="登录密码" prop="password">
          <span v-if="editRow.look == 'look'">{{ form.password }}</span>
          <div v-else class="login-password-box">
            <el-input
              v-model="form.password"
              placeholder="请输入登录密码"
              :auto-complete="'new-password'"
              type="password"
              :disabled="titleName == '编辑' ? true : false"
              show-password
            ></el-input>
            <el-button v-if="titleName !== '编辑'" type="text" style="margin-left: 5px" @click="generateRandomNumber"
              >生成随机密码</el-button
            >
          </div>
        </el-form-item>
        <el-form-item label="信用等级" prop="creditGrade">
          <span v-if="editRow.look == 'look'">{{ form.creditGrade }}</span>
          <el-select
            v-else
            v-model="form.creditGrade"
            clearable
            placeholder="请选择"
            filterable
            style="width: calc(100% - 30px)"
          >
            <el-option v-for="item in creditGradeList" :key="item.id" :label="item.name" :value="item.name">
            </el-option>
          </el-select>
          <i
            class="el-icon-setting margin_left_10px cursor_pointer"
            style="font-size: 20px; color: gray"
            @click="handleCommonShow(6)"
          ></i>
        </el-form-item>
        <el-form-item label="详细地址" prop="address">
          <span v-if="editRow.look == 'look'">{{ form.address }}</span>
          <el-input v-else v-model="form.address" clearable placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="供货能力" prop="supplyCapacity">
          <span v-if="editRow.look == 'look'">{{ form.supplyCapacity }}</span>
          <el-input v-else v-model="form.supplyCapacity" clearable placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="组织机构代码" prop="organizationCode">
          <span v-if="editRow.look == 'look'">{{ form.organizationCode }}</span>
          <el-input v-else v-model="form.organizationCode" clearable placeholder="请输入"></el-input>
        </el-form-item>
        <el-form-item label="供货范围" prop="supplyRange">
          <span v-if="editRow.look == 'look'">{{ form.supplyRange }}</span>
          <el-select
            v-else
            v-model="form.supplyRange"
            clearable
            placeholder="请选择"
            filterable
            style="width: calc(100% - 30px)"
          >
            <el-option v-for="item in supplyRangeList" :key="item.id" :label="item.name" :value="item.name">
            </el-option>
          </el-select>
          <i
            class="el-icon-setting margin_left_10px cursor_pointer"
            style="font-size: 20px; color: gray"
            @click="handleCommonShow(7)"
          ></i>
        </el-form-item>
      </el-form>
    </div>
    <div slot="footer" class="dialog-footer tac">
      <el-button @click="shutdown">取消</el-button>
      <el-button type="primary" @click="onSubmit(form)">确定</el-button>
    </div>
    <!-- 企业类型 -->
    <VersionType
      ref="editDialog"
      @sucessSet="handleGetList"
      @handleConfirmSave="handleConfirmSave"
      :workList="editDropdownList"
      :title="editDropdownTitle"
    ></VersionType>
  </el-dialog>
</template>
<script>
import { addEnterprise, updateEnterprise, addOutsideUser } from "@/api/supplierManage/outsourceSupplier"
import { getMiniDictList, saveMiniDict } from "@/api/common/other" // 质检方式
import VersionType from "@/views/supplierManage/outsourceSupplier/components/VersionType"
export default {
  components: {
    VersionType
  },
  props: {
    titleName: {
      type: String,
      default: "新增"
    },
    editRow: {
      type: [Object],
      default: () => {
        return {}
      }
    },
    showList: {
      type: [Array]
    }
  },
  data() {
    return {
      islook: false,
      form: {
        number: "",
        name: "",
        enterpriseType: "",
        contact: "",
        tel: "",
        creditGrade: "",
        address: "",
        supplyCapacity: "",
        organizationCode: "",
        supplyRange: "",
        status: 0,
        password: "123456"
      },
      rules: {
        number: [
          { required: true, message: "请填写企业编码", trigger: "blur" } // 企业编码
        ],
        name: [
          { required: true, message: "请填写企业名称", trigger: "blur" } // 企业名称
        ],
        enterpriseType: [
          { required: true, message: "请选择企业类型", trigger: "change" } // 企业类型
        ],
        tel: [
          { required: true, message: "请填写联系方式", trigger: "blur" } // 联系方式
        ],
        password: [
          { required: true, message: "请填写登录密码", trigger: "blur" } // 登录密码
        ]
      },
      editDropdownList: [],
      enterpriseTypeList: [], // 企业类型列表
      creditGradeList: [], // 信用等级
      supplyRangeList: [], // 供货范围
      currentType: 0,
      editDropdownTitle: ""
    }
  },
  mounted() {
    this.handleGetList(5)
    this.handleGetList(6)
    this.handleGetList(7)
  },
  watch: {
    editRow(val) {
      if (val.id && this.islook) {
        this.initFormData(val)
      } else {
        this.$nextTick(() => {
          this.$refs.form.resetFields()
        })
      }
    },
    islook(val) {
      if (val) {
        this.form = {
          number: "",
          name: "",
          enterpriseType: "",
          contact: "",
          tel: "",
          password: "123456",
          creditGrade: "",
          address: "",
          supplyCapacity: "",
          organizationCode: "",
          supplyRange: "",
          status: 0
        }
        if (this.editRow && this.editRow.id) {
          this.initFormData(this.editRow)
        } else {
          this.$nextTick(() => {
            this.$refs.form.resetFields()
          })
        }
      }
    }
  },
  methods: {
    addPreProduction() {
      this.$refs.add.materialVisible = true
    },
    initFormData(row) {
      if (row.id) {
        this.form = JSON.parse(JSON.stringify(row))
        // if (this.form.takerId && this.form.takerName) {
        //   this.form.takerObj = this.form.takerId + "&" + this.form.takerName;
        // }
      }
    },
    onSubmit() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          let params = JSON.parse(JSON.stringify(this.form))
          // params.takerId = params.takerObj.split("&")[0];
          // params.takerName = params.takerObj.split("&")[1];
          if (this.editRow && this.editRow.id) {
            params.id = this.editRow.id
            updateEnterprise(params).then((res) => {
              if (res.code == 200) {
                this.$message.success("编辑成功!")
                this.$emit("shutdown", this.form)
                this.shutdown()
              }
            })
          } else {
            addEnterprise(params).then((res) => {
              if (res.code == 200) {
                console.log(res, "5555")
                this.addOutsideUser(res.data)
              }
            })
          }
        }
      })
    },
    // 添加外部用户
    addOutsideUser(data) {
      addOutsideUser({
        companyId: data.id,
        companyName: data.name,
        companyNumber: data.number,
        passWord: this.form.password,
        userName: data.tel
      }).then((res) => {
        console.log(res)
        if (res.code == 200) {
          this.$message.success("添加成功!")
          this.$emit("shutdown", this.form)
          this.shutdown()
        }
      })
    },
    // 企业类型?信用等级/供货范围点击
    handleCommonShow(type) {
      this.currentType = type
      this.editDropdownTitle = type == 5 ? "企业类型" : type == 6 ? "信用等级" : type == 7 ? "供货范围" : ""
      this.editDropdownList = []
      this.handleGetList(type)
      this.$refs.editDialog.isvisible = true
    },
    // 获取企业类型?信用等级/供货范围
    handleGetList(type) {
      this.currentType = type
      getMiniDictList({ type: type }).then((res) => {
        this.editDropdownList = res.data
        if (type == 5) {
          this.enterpriseTypeList = res.data
        } else if (type == 6) {
          this.creditGradeList = res.data
        } else if (type == 7) {
          this.supplyRangeList = res.data
        }
      })
    },
    // 保存企业类型?信用等级/供货范围
    handleConfirmSave(data) {
      saveMiniDict({ list: data, type: this.currentType }).then((res) => {
        if (res.code == 200) {
          this.$message({
            message: "操作成功!",
            type: "success"
          })
          this.$refs.editDialog.isvisible = false
          this.handleGetList(this.currentType)
        }
      })
    },
    shutdown() {
      this.$refs.form.resetFields()
      this.islook = false
    },
    // 随机生成六位数密码
    generateRandomNumber() {
      let passwordStr = Math.floor(100000 + Math.random() * 900000)
      console.log(passwordStr)
      this.$set(this.form, "password", passwordStr)
    }
  }
}
</script>
<style lang="scss" scoped>
.dialog-content-box {
  padding: 0px 30px;
  //   overflow-y: auto;
  //   .el-form {
  //     overflow: hidden;
  //   }
  .login-password-box {
    display: flex;
  }
}
::v-deep {
  .el-tabs__content {
    height: calc(100% - 55px);
    overflow-y: auto;
  }
}
</style>
src/views/supplierManage/outsourceSupplier/index.vue
New file
@@ -0,0 +1,355 @@
<template>
  <d2-container>
    <template slot="header">
      <div class="top">
        <SearchCommonView
          :add-title="'新增企业'"
          :total-object="totalObject"
          :other-options="otherOptions"
          :placeholder="'请输入名称'"
          @addCommonClick="addEnterpriseClick"
          @searchClick="getEnterpriseList"
        />
      </div>
    </template>
    <div class="content">
      <div class="content-top">
        <TableCommonView ref="tableListRef" :table-list="tableList" @selTableCol="selTableCol">
          <template slot="tableButton">
            <el-table-column label="操作" width="160" fixed="right">
              <template slot-scope="scope">
                <el-button v-if="scope.row.status == 1" type="text" size="small" @click="statusModifyClick(scope.row)"
                  >停用</el-button
                >
                <el-button v-else type="text" size="small" @click="statusModifyClick(scope.row)">启用</el-button>
                <el-button @click="editClick(scope.row)" type="text" size="small">编辑</el-button>
              </template>
            </el-table-column>
          </template>
        </TableCommonView>
      </div>
      <div class="btn-pager">
        <PagerView class="page" :pager-options="pagerOptions" v-on="pagerEvents" />
      </div>
    </div>
    <!-- <div class="overSpread" v-show="isopen || isCreateShop"></div> -->
    <!-- 添加/编辑备件 -->
    <AddEnterprise ref="add" :showList="showList" :titleName="titleName" :editRow="editRow" @shutdown="shutdown" />
  </d2-container>
</template>
<script>
import {
  enterpriseList,
  updateEnterprise,
  enterpriseOverview,
  editOutsideUser
} from "@/api/supplierManage/outsourceSupplier"
import AddEnterprise from "@/views/supplierManage/outsourceSupplier/components/addEnterprise"
import pageMixin from "@/components/makepager/pager/mixin/pageMixin"
export default {
  name: "outsourceManage",
  mixins: [pageMixin],
  components: {
    AddEnterprise
  },
  beforeMount() {
    this.getData()
  },
  computed: {},
  data() {
    return {
      deviceDataList: [],
      searchParam: {
        keyword: "",
        page: 1,
        pageSize: 15
      },
      total: 0,
      isopen: false,
      titleName: "新增",
      editRow: {},
      selectRow: {},
      isCreateShop: false,
      more: false,
      totalObject: {
        value: 0,
        label: "企业总量"
      },
      otherOptions: [
        {
          value: 0,
          label: "停用",
          status: "error"
        },
        {
          value: 0,
          label: "启用",
          status: "success"
        }
      ],
      tableList: {},
      showcol: [
        "企业编号",
        "名称",
        "类型",
        "联系人",
        "联系电话",
        "信用等级",
        "详细地址",
        "供货能力",
        "组织机构代码",
        "供货范围",
        "添加时间",
        "状态"
      ],
      showList: []
    }
  },
  mounted() {
    this.setTable()
  },
  methods: {
    setTable() {
      this.tableList = {
        tableInfomation: [],
        selectIndex: true,
        showcol: this.showcol,
        allcol: [],
        tableColumn: this.setTableColumn(this.showcol)
      }
      let allcol = []
      for (let i = 0; i < this.tableList.tableColumn.length; i++) {
        if (!this.tableList.tableColumn[i].default) {
          const label = this.tableList.tableColumn[i].label
          allcol.push(label)
        }
      }
      this.tableList.allcol = allcol
    },
    setTableColumn(showcol) {
      let tableColumn = [
        {
          label: "企业编号",
          prop: "number",
          isShowColumn: true,
          default: true
        },
        {
          label: "名称",
          prop: "name",
          isShowColumn: showcol.includes("名称"),
          default: false
        },
        {
          label: "类型",
          prop: "enterpriseType",
          isShowColumn: showcol.includes("类型"),
          default: false
        },
        {
          label: "联系人",
          prop: "contact",
          isShowColumn: showcol.includes("联系人"),
          default: false
        },
        {
          label: "联系电话",
          prop: "tel",
          isShowColumn: showcol.includes("联系电话"),
          default: false
        },
        {
          label: "信用等级",
          prop: "creditGrade",
          isShowColumn: showcol.includes("信用等级"),
          default: false
        },
        {
          label: "详细地址",
          prop: "address",
          isShowColumn: showcol.includes("详细地址"),
          default: false
        },
        {
          label: "供货能力",
          prop: "supplyCapacity",
          isShowColumn: showcol.includes("供货能力"),
          default: false
        },
        {
          label: "组织机构代码",
          prop: "organizationCode",
          isShowColumn: showcol.includes("组织机构代码"),
          default: false
        },
        {
          label: "供货范围",
          prop: "supplyRange",
          isShowColumn: showcol.includes("供货范围"),
          default: false
        },
        {
          label: "添加时间",
          prop: "createdAt",
          width: "160",
          isShowColumn: showcol.includes("添加时间"),
          default: false
        },
        {
          label: "状态",
          prop: "status",
          isShowColumn: showcol.includes("状态"),
          default: false,
          isCallMethod: true,
          getCallMethod: this.getStatus
        }
      ]
      return tableColumn
    },
    selTableCol(val) {
      this.showcol = val
      this.tableList.tableColumn = this.setTableColumn(val)
    },
    overview() {
      enterpriseOverview().then((reply) => {
        this.totalObject.value = reply.data.total || 0
        this.otherOptions.map((item) => {
          if (item.label === "停用") {
            item.value = reply.data.close
          } else if (item.label === "启用") {
            item.value = reply.data.open
          }
        })
      })
    },
    //查询备件列表
    async getData() {
      this.searchParam.page = this.pagerOptions.currPage
      this.searchParam.pageSize = this.pagerOptions.pageSize
      let rsp = await enterpriseList(this.searchParam)
      let list = rsp
      console.log(list)
      if (list && list.code == 200) {
        // this.deviceDataList = list.data.data;
        // this.total = list.data.total;
        this.tableList.tableInfomation = list.data
        this.pagerOptions.totalCount = list.total
        this.overview()
      }
    },
    // 搜索触发
    async getEnterpriseList(val) {
      this.searchParam.keyword = val
      this.pagerOptions.currPage = 1
      this.getData()
    },
    // 新增企业
    addEnterpriseClick() {
      this.titleName = "新增"
      this.editRow = {}
      this.$refs.add.islook = true
    },
    // 编辑
    editClick(val) {
      let params = JSON.parse(JSON.stringify(val))
      this.titleName = "编辑"
      this.editRow = { ...params, password: "000000" }
      this.$refs.add.islook = true
    },
    // 启用/停用
    statusModifyClick(row) {
      let tipStr = row.status == 1 ? "是否停用该企业?" : "是否启用该企业"
      this.$confirm(tipStr, "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        let params = JSON.parse(JSON.stringify(row))
        params.status = row.status == 1 ? 2 : 1
        updateEnterprise(params)
          .then((reply) => {
            if (reply && reply.code == 200) {
              this.editOutsideUser(row)
              // this.getData();
              // this.$message.success(row.status == 1 ? "停用成功" : "启用成功");
            } else {
              this.$message.error(row.status == 1 ? "停用失败" : "启用失败")
            }
          })
          .catch(() => {})
      })
    },
    // 启用停用外部用户
    editOutsideUser(row) {
      editOutsideUser({
        enable: row.status == 1 ? false : true,
        username: row.tel
      }).then((res) => {
        if (res && res.code == 200) {
          this.getData()
          this.$message.success(row.status == 1 ? "停用成功" : "启用成功")
        }
      })
    },
    //子组件传递参数控制弹窗
    shutdown(val) {
      this.$refs.add.islook = val
      this.getData()
    },
    // 获取状态
    getStatus(val) {
      return val == 0 ? "新建" : val == 1 ? "启用" : val == 2 ? "停用" : "--"
    }
  }
}
</script>
<style lang="scss" scoped>
.top {
  width: 100%;
  height: 61px;
  display: flex;
  align-items: center;
  .fon_weight {
    font-size: 28px;
    height: 32px;
  }
  .top_right_bottom {
    font-size: 14px;
    line-height: 20px;
    color: #000;
    opacity: 0.6;
    margin-top: 9px;
    font-family: "PingFangSC-Medium," sans-serif;
  }
}
.el-button {
  font-family: "PingFangSC";
}
.content {
  width: 100%;
  height: calc(100% - 30px);
  background: #fff;
  border-radius: 12px;
  box-sizing: border-box;
  .content-top {
    height: calc(100% - 60px);
  }
}
::v-deep {
  .el-table {
    height: auto !important;
    .el-table--fit {
      height: 90%;
    }
    .onSelect {
      background: #ebf2ff;
    }
  }
  .el-table {
    height: 100% !important;
  }
}
</style>