新增后台配置模块

yangfeng

2023-07-12 245912b3b595400ecdd5965ce5e466d190f06ae4

新增后台配置模块

 src/assets/style/index.scss

@@ -1 +1,3 @@
@import "element-ui/lib/theme-chalk/index.css";
@import "./variable.scss";
@import "./reset-element.scss";

 src/assets/style/reset-element.scss

New file
@@ -0,0 +1,24 @@
// element 样式补丁
.el-dialog__header {
  padding: 12.5px 10px;
  border-bottom: 1px solid #e5e5e5;
  .el-dialog__title {
    font-size: 15px;
    color: #323232;
    font-weight: bold;
  }
}
.el-dialog__body {
  padding: 0px;
}
.el-dialog__footer {
  padding: 0px;
  text-align: center;
  box-sizing: border-box;
  border-top: 1px solid #dadee5;
}
.product-view {
  .el-form-item__label {
    padding: 0;
  }
}

 src/assets/style/variable.scss

New file
@@ -0,0 +1,23 @@
// 主色
$color-primary: #2a78fb;

// 辅助色
$color-info: #909399;
$color-success: #67c23a;
$color-warning: #e6a23c;
$color-danger: #f56c6c;

// 文字
$color-text-main: #303133;
$color-text-normal: #606266;
$color-text-sub: #909399;
$color-text-placehoder: #c0c4cc;

// 边框
$color-border-1: #dcdfe6;
$color-border-2: #e4e7ed;
$color-border-3: #ebeef5;
$color-border-4: #f2f6fc;

// 背景
$color-bg: #f8f8f9;

 src/components/layout/components/appsidebar/index.vue

@@ -48,6 +48,14 @@
          <el-menu-item index="/service/serviceFollowup">服务回访单</el-menu-item>
          <el-menu-item index="/service/serviceFeeManage">服务收费管理</el-menu-item>
        </el-submenu>
        <el-submenu index="4">
          <template slot="title">
            <i class="el-icon-location"></i>
            <span>后台配置</span>
          </template>
          <el-menu-item index="/backgroundConfig/memberManage">成员管理</el-menu-item>
          <el-menu-item index="/backgroundConfig/rolePermssion">角色权限</el-menu-item>
        </el-submenu>
      </el-menu>
    </div>
  </div>
@@ -75,7 +83,7 @@
      // console.log(this.$route.name)
    },
    handleOpen(index) {
      console.log("aaa", index)
      console.log(index)
    },
    handleClose() {}
  }

 src/components/makepager/PublicFunctionBtnView.vue

@@ -3,8 +3,8 @@
    <div class="btn-list">
      <el-button size="small" type="text" class="blue" @click="addBtnClick">新建</el-button>
      <el-button v-if="receive" size="small" type="text" class="gray" @click="receiveBtnClick">领取</el-button>
      <el-button size="small" type="text" class="gray" @click="allocationBtnClick">分配</el-button>
      <el-button size="small" type="text" class="gray" @click="deleteBtnClick">删除</el-button>
      <el-button v-if="allocation" size="small" type="text" class="gray" @click="allocationBtnClick">分配</el-button>
      <el-button v-if="deleteButton" size="small" type="text" class="gray" @click="deleteBtnClick">删除</el-button>
      <el-button v-if="submitApproval" size="small" type="text" class="gray width64" @click="submitApprovalBtnClick"
        >提交审批</el-button
      >
@@ -12,6 +12,13 @@
        >查重</el-button
      >
      <el-button v-if="importButton" size="small" type="text" class="gray" @click="importBtnClick">导入</el-button>
      <el-button v-if="departmentSet" size="small" type="text" class="gray" @click="departmentSetClick"
        >部门设置</el-button
      >
      <el-button v-if="dataRange" size="small" type="text" class="gray" @click="dataRangeClick">数据范围</el-button>
      <el-button v-if="loginControl" size="small" type="text" class="gray" @click="loginControlClick"
        >登录控制</el-button
      >

      <el-dropdown trigger="click">
        <div class="gray btn-icon" @click="operateBtnClick">
@@ -32,7 +39,7 @@
          <el-option v-for="item in viewScopeOptions" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
        <div class="view-scope-btn">
        <div class="view-scope-btn" @click="viewScopeClick">
          <i class="el-icon-user"></i>
        </div>
      </div>
@@ -53,16 +60,28 @@
        <i class="el-icon-postcard"></i>
      </div>
    </div>
    <!-- 高级查看范围 -->
    <HighViewScopeDialog v-if="highViewScopeConfig.visible" :editCommonConfig="highViewScopeConfig" />
  </div>
</template>

<script>
import HighViewScopeDialog from "@/views/other/commonDialog/HighViewScopeDialog"
export default {
  name: "PublicFunctionBtnView",
  components: { HighViewScopeDialog },
  props: {
    receive: {
      type: Boolean,
      default: false
    },
    allocation: {
      type: Boolean,
      default: true
    },
    deleteButton: {
      type: Boolean,
      default: true
    },
    duplicateCheck: {
      type: Boolean,
@@ -79,6 +98,18 @@
    importButton: {
      type: Boolean,
      default: true
    },
    departmentSet: {
      type: Boolean,
      default: false
    },
    dataRange: {
      type: Boolean,
      default: false
    },
    loginControl: {
      type: Boolean,
      default: false
    },
    mapButton: {
      type: Boolean,
@@ -107,7 +138,11 @@
        { value: "5", label: "共享给我的" },
        { value: "6", label: "我共享给他人的" }
      ],
      viewScopeValue: "全部"
      viewScopeValue: "全部",
      highViewScopeConfig: {
        visible: false,
        infomation: {}
      }
    }
  },
  methods: {
@@ -127,6 +162,16 @@
    duplicateCheckBtnClick() {},
    // 导入
    importBtnClick() {},
    // 部门设置
    departmentSetClick() {},
    // 数据范围
    dataRangeClick() {},
    // 登录控制
    loginControlClick() {},
    // 高级查看范围
    viewScopeClick() {
      this.highViewScopeConfig.visible = true
    },
    // 操作
    operateBtnClick() {},
    // 列表

 src/components/makepager/SearchCommonView.vue

@@ -89,7 +89,7 @@
</template>

<script>
import QueryClassSettingDialog from "@/views/other/QueryClassSettingDialog.vue"
import QueryClassSettingDialog from "@/views/other/commonDialog/QueryClassSettingDialog"

export default {
  name: "SearchCommonView",

 src/components/makepager/TableCommonView.vue

@@ -13,7 +13,8 @@
      @selection-change="handleSelectionChange"
      :header-cell-style="{ background: '#ECF4FF', color: '#666' }"
    >
      <el-table-column type="selection" width="40"> </el-table-column>
      <el-table-column v-if="selectBox" type="selection" width="40"> </el-table-column>

      <el-table-column
        v-for="(item, i) in tableList.tableColumn"
        :key="i"
@@ -26,7 +27,7 @@
      >
        <template slot-scope="scope">
          <span v-if="item.price">{{ "￥" + number_format(scope.row[item.prop], 2, ".", ",") }}</span>
          <span v-else-if="item.status" :class="scope.row.status">{{ scope.row[item.prop] }}</span>
          <div v-else-if="item.status" :class="scope.row.status">{{ scope.row[item.prop] }}</div>
          <span v-else>{{ scope.row[item.prop] }}</span>
        </template>
      </el-table-column>
@@ -42,10 +43,16 @@
export default {
  name: "TableCommonView",
  props: {
    selectBox: {
      type: Boolean,
      default: true
    },

    tableList: {
      type: Object,
      default: () => {
        return {
          selectBox: true,
          tableInfomation: [], // 接口返回数据
          tableColumn: [
            // table表单
@@ -104,19 +111,19 @@
            sums[index] = "本页总计"
          }
          const values = data.map((item) => Number(item[column.property]))
          // if (column.property === this.showSummary.sumProp) {
          if (this.showSummary.sumProp.includes(column.property)) {
            sums[index + 1] = values.reduce((prev, curr) => {
              const value = Number(curr)
              if (!isNaN(value)) {
                return this.number_format(prev + curr, 2, ".", ",")
                return prev + curr
              } else {
                return this.number_format(prev, 2, ".", ",")
                return prev
              }
            }, 0)
            sums[index + 1]
          }
        })
        console.log(sums)
        return sums
      }
    },
@@ -159,9 +166,10 @@
  margin-right: 10px;
  margin-bottom: 40px;
  .blue {
    padding: 10px;
    width: 70px;
    text-align: center;
    color: #fff;
    background-color: blue;
    background-color: $color-primary;
    border-radius: 4px;
  }
}

 src/router/backgroundConfig/index.js

New file
@@ -0,0 +1,27 @@
// const type from '@/router/deployCode'

const memberManage = (resolve) => require(["@/views/backgroundConfig/memberManage/index"], resolve) // 成员管理
const rolePermssion = (resolve) => require(["@/views/backgroundConfig/rolePermssion/index"], resolve) // 角色权限

const appconfig = [
  {
    path: "/backgroundConfig/memberManage",
    name: "memberManage",
    component: memberManage,
    meta: {
      title: "成员管理",
      requireAuth: true
    }
  },
  {
    path: "/backgroundConfig/rolePermssion",
    name: "rolePermssion",
    component: rolePermssion,
    meta: {
      title: "角色权限",
      requireAuth: true
    }
  }
]

export default appconfig

 src/router/index.js

@@ -5,12 +5,14 @@
import customRouter from "./custom/index.js"
import salesRouter from "./sales/index.js"
import serviceRouter from "./service/index.js"
import backgroundConfigRouter from "./backgroundConfig/index.js"

Vue.use(Router)
const login = (resolve) => require(["@/views/login/index"], resolve)
const custom = (resolve) => require(["@/views/custom/index"], resolve)
const sales = (resolve) => require(["@/views/sales/index"], resolve)
const service = (resolve) => require(["@/views/service/index"], resolve)
const background = (resolve) => require(["@/views/backgroundConfig/index"], resolve)

export const routes = [
  {
@@ -42,6 +44,16 @@
      title: "服务管理",
      isAllways: true
    }
  },
  {
    path: "background", // 后台设置
    name: "background",
    component: background,
    children: backgroundConfigRouter,
    meta: {
      title: "后台设置",
      isAllways: true
    }
  }
]
export const constantRoutes = [
@@ -69,7 +81,7 @@
  },
  {
    path: "*",
    component: () => import("@/views/error/404"),
    component: () => import("@/views/other/error/404"),
    meta: {
      title: "404"
    }

 src/views/backgroundConfig/index.vue

New file
@@ -0,0 +1,21 @@
<template>
  <div class="content">
    <router-view />
  </div>
</template>

<script>
export default {
  name: "BackgroundConfig",
  props: {}
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.content {
  width: 100%;
  background-color: #fff;
  height: calc(100vh - 60px);
}
</style>

 src/views/backgroundConfig/memberManage/index.vue

New file
@@ -0,0 +1,197 @@
<template>
  <div class="memeber-manage">
    <div class="left"></div>
    <div class="right">
      <SearchCommonView
        ref="searchCommonView"
        :query-class-options="queryClassOptions"
        :search-options="searchOptions"
      />
      <div class="btn-pager">
        <PublicFunctionBtnView
          :allocation="false"
          :receive="false"
          :delete-button="false"
          :import-button="false"
          :department-set="true"
          :data-range="true"
          :login-control="true"
          :operates-list="operatesList"
        />
        <PagerView class="page" />
      </div>
      <TableCommonView ref="tableListRef" :table-list="tableList">
        <template slot="tableButton">
          <el-table-column label="操作" width="160">
            <template slot-scope="scope">
              <el-button @click="editClick(scope.row)" type="text" size="small">编辑</el-button>
              <el-button v-if="!scope.row.enableStatus" @click="enableClick(scope.row)" type="text" size="small"
                >启用</el-button
              >
              <el-button v-else @click="stopClick(scope.row)" type="text" size="small">停用</el-button>
              <el-button @click="copyClick(scope.row)" type="text" size="small">复制</el-button>
              <el-button @click="deleteClick(scope.row)" type="text" size="small">删除</el-button>
            </template>
          </el-table-column>
        </template>
      </TableCommonView>
    </div>

    <!-- 新建/编辑 -->
    <AddContractManageDialog v-if="editConfig.visible" :edit-common-config="editConfig" />
  </div>
</template>

<script>
import AddContractManageDialog from "@/views/sales/contractManage/AddContractManageDialog"

export default {
  name: "MemberManage",
  props: {},
  components: {
    AddContractManageDialog
  },
  computed: {
    searchCommonHeight() {
      return this.$refs.searchCommonView.offsetHeight
    }
  },
  data() {
    return {
      tableList: {},
      queryClassOptions: [
        { value: "1", label: "全部" },
        { value: "2", label: "已批准" },
        { value: "3", label: "审批中" },
        { value: "4", label: "未提交" },
        { value: "5", label: "已驳回" },
        { value: "6", label: "已拒绝" }
      ],
      searchOptions: [],
      operatesList: [
        { id: "1", name: "共享" },
        { id: "2", name: "批量编辑" },
        { id: "3", name: "导出" },
        { id: "4", name: "下载全部附件" },
        { id: "5", name: "更改创建人" },
        { id: "6", name: "树结构设置" },
        { id: "7", name: "审批设置" },
        { id: "8", name: "恢复预设列宽" }
      ],
      editConfig: {
        visible: false,
        title: "新建",
        infomation: {}
      }
    }
  },
  created() {
    this.setTable()
  },
  methods: {
    setTable() {
      this.tableList = {
        tableInfomation: [
          {
            name: "小刘",
            account: "xiaoliu",
            department: "市场部",
            creator: "系统管理员",
            rolePermssion: "主管",
            phone: "18511112222",
            email: "xiaoliu@aaa.ccom",
            isAdmin: "是",
            state: "在职",
            enableStatus: true
          }
        ],
        tableColumn: [
          { label: "姓名", prop: "name", min: 120 },
          { label: "账号", prop: "account", min: 90 },
          { label: "部门", prop: "department" },
          { label: "角色权限", prop: "rolePermssion", min: 100 },
          { label: "手机", prop: "phone" },
          { label: "Email", prop: "email" },
          { label: "是否管理员", prop: "isAdmin", min: 100 },
          { label: "状态", prop: "state" }
        ]
      }
      this.searchOptions = []
      for (let i = 0; i < this.tableList.tableColumn.length; i++) {
        const label = this.tableList.tableColumn[i].label
        this.searchOptions.push({ value: (i + 1).toString(), label: label })
      }
    },
    // 新建
    addBtnClick() {
      this.editConfig.visible = true
      this.editConfig.title = "新建"
      this.editConfig.infomation = {
        customName: "",
        documentNumber: "ZDYBD01-3",
        owner: "",
        contractStatus: "",
        salesQuotation: "",
        approvalWorkflow: "",
        approvalSteps: "",
        approvalPerson: "",
        approvalOpinion: ""
      }
    },
    // 编辑
    editClick(row) {
      console.log(row)
      this.editConfig.visible = true
      this.editConfig.title = "编辑"
      this.editConfig.infomation = {
        customName: "",
        documentNumber: "TKD20230521-12",
        owner: "",
        contractStatus: "",
        salesQuotation: "",
        approvalWorkflow: "",
        approvalSteps: "",
        approvalPerson: "",
        approvalOpinion: ""
      }
    },
    // 启用
    enableClick(row) {
      console.log(row)
    },
    // 停用
    stopClick(row) {
      console.log(row)
    },
    // 复制
    copyClick(row) {
      console.log(row)
    },
    // 删除
    deleteClick(row) {
      console.log(row)
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.memeber-manage {
  display: flex;
  .left {
    width: 260px;
    height: 100vh;
    border-right: 1px solid #ebeef5;
  }
  .right {
    flex: 1;
    .btn-pager {
      display: flex;
      .page {
        margin-left: auto;
      }
    }
  }
}
</style>

 src/views/backgroundConfig/rolePermssion/index.vue

New file
@@ -0,0 +1,120 @@
<template>
  <div class="role-peimission">
    <div class="btn-pager">
      <el-button @click="addpermssionClick" type="primary" size="small">新增权限</el-button>
    </div>
    <TableCommonView ref="tableListRef" :select-box="false" :table-list="tableList">
      <template slot="tableButton">
        <el-table-column label="操作" width="320">
          <template slot-scope="scope">
            <el-button @click="handleClick(scope.row)" type="text" size="small">编辑</el-button>
            <el-button @click="handleClick(scope.row)" type="text" size="small">复制</el-button>
            <el-button @click="handleClick(scope.row)" type="text" size="small">设置成员</el-button>
            <el-button @click="handleClick(scope.row)" type="text" size="small">字段权限</el-button>
            <el-button @click="handleClick(scope.row)" type="text" size="small">删除</el-button>
            <el-button @click="handleClick(scope.row)" type="text" size="small">上移</el-button>
            <el-button @click="handleClick(scope.row)" type="text" size="small">下移</el-button>
          </template>
        </el-table-column>
      </template>
    </TableCommonView>
    <!-- 新建/编辑 -->
    <AddContractManageDialog v-if="editConfig.visible" :edit-common-config="editConfig" />
  </div>
</template>

<script>
import AddContractManageDialog from "@/views/sales/contractManage/AddContractManageDialog"

export default {
  name: "RoleOeimission",
  props: {},
  components: {
    AddContractManageDialog
  },
  computed: {
    searchCommonHeight() {
      return this.$refs.searchCommonView.offsetHeight
    }
  },
  data() {
    return {
      tableList: {},
      editConfig: {
        visible: false,
        title: "新建",
        infomation: {}
      }
    }
  },
  created() {
    this.setTable()
  },
  methods: {
    setTable() {
      this.tableList = {
        tableInfomation: [
          {
            number: "1",
            owner: "总经理",
            notes: ""
          }
        ],
        tableColumn: [
          { label: "#", prop: "number", width: 80 },
          { label: "权限名称", prop: "owner", width: 160 },
          { label: "备注", prop: "notes" }
        ]
      }
      this.searchOptions = []
      for (let i = 0; i < this.tableList.tableColumn.length; i++) {
        const label = this.tableList.tableColumn[i].label
        this.searchOptions.push({ value: (i + 1).toString(), label: label })
      }
    },
    // 新建
    addBtnClick() {
      this.editConfig.visible = true
      this.editConfig.title = "新建"
      this.editConfig.infomation = {
        customName: "",
        documentNumber: "ZDYBD01-3",
        owner: "",
        contractStatus: "",
        salesQuotation: "",
        approvalWorkflow: "",
        approvalSteps: "",
        approvalPerson: "",
        approvalOpinion: ""
      }
    },
    // 编辑
    handleClick(row) {
      console.log(row)
      this.editConfig.visible = true
      this.editConfig.title = "编辑"
      this.editConfig.infomation = {
        customName: "",
        documentNumber: "TKD20230521-12",
        owner: "",
        contractStatus: "",
        salesQuotation: "",
        approvalWorkflow: "",
        approvalSteps: "",
        approvalPerson: "",
        approvalOpinion: ""
      }
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.role-peimission {
  .btn-pager {
    margin: 0px 20px 20px;
    float: right;
  }
}
</style>

 src/views/custom/contacts/AddContactsDialog.vue

@@ -345,24 +345,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
}
</style>

 src/views/custom/customManage/AddCustomManageDialog.vue

@@ -518,24 +518,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
}
</style>

 src/views/custom/followupRecords/AddFollowupRecordsDialog.vue

@@ -330,24 +330,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
}
</style>

 src/views/custom/salesLead/AddSalesLeadDialog.vue

@@ -177,7 +177,7 @@
            contactName: "",
            contactDuties: "",
            phoneNumber: "",
            businessStatus: "新建",
            businessStatus: "",
            businessSource: "1",
            owner: "",
            position: "",
@@ -302,26 +302,6 @@
    background-color: #f5f5f5;
    height: 55px;
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
}
</style>

 src/views/other/commonDialog/HighViewScopeDialog.vue

New file
@@ -0,0 +1,162 @@
<template>
  <div class="high-view-scope">
    <el-dialog
      title="查询范围-高级"
      :visible.sync="editConfig.visible"
      :width="dialogWidth"
      :before-close="handleClose"
    >
      <div class="view-sel-bg">
        <div class="title">查询选择</div>
        <el-input v-model="searchInput" size="mini" placeholder="请输入要查找的成员"></el-input>
        <el-checkbox v-model="resignMember">显示离职成员</el-checkbox>
        <el-checkbox v-model="defaultCollapse">子部门默认收起</el-checkbox>
      </div>
      <div class="view-tree">
        <el-tree
          :data="data"
          show-checkbox
          default-expand-all
          node-key="id"
          ref="tree"
          highlight-current
          :props="defaultProps"
        >
        </el-tree>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" size="small" @click="editConfig.visible = false">确认</el-button>
        <el-button size="small" @click="editConfig.visible = false">取消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: "HighViewScopeDialog",
  props: {
    editCommonConfig: {
      type: Object,
      default: () => {
        return {
          visible: false,
          infomation: {}
        }
      }
    }
  },
  components: {},
  computed: {},
  data() {
    return {
      dialogWidth: "35%",
      editConfig: this.editCommonConfig,
      data: [
        {
          id: 1,
          label: "上海灵当信息科技有限公司",
          children: [
            {
              id: 1 - 1,
              label: "销售部",
              children: [
                {
                  id: 1 - 1 - 1,
                  label: "Mia"
                },
                {
                  id: 1 - 1 - 2,
                  label: "系统管理员"
                },
                {
                  id: 1 - 1 - 3,
                  label: "销售"
                },
                {
                  id: 1 - 1 - 4,
                  label: "销售总监"
                },
                {
                  id: 1 - 1 - 5,
                  label: "销售一部",
                  children: []
                },
                {
                  id: 1 - 1 - 6,
                  label: "销售二部",
                  children: []
                }
              ]
            },
            {
              id: 2 - 1,
              label: "管理层",
              children: [
                {
                  id: 2 - 1 - 1,
                  label: "BOSS"
                },
                {
                  id: 2 - 1 - 2,
                  label: "系统管理员"
                }
              ]
            },
            {
              id: 3 - 1,
              label: "财务部",
              children: []
            },
            {
              id: 4 - 1,
              label: "市场部",
              children: []
            }
          ]
        }
      ],
      defaultProps: {
        children: "children",
        label: "label"
      },
      searchInput: "",
      resignMember: false,
      defaultCollapse: false
    }
  },
  created() {},
  methods: {
    handleClose() {
      this.editConfig.visible = false
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="scss" scoped>
.high-view-scope {
  .view-sel-bg {
    display: flex;
    align-items: center;
    margin: 20px 20px 0;
    .el-input {
      width: 240px;
      margin-left: 5px;
    }
    .el-checkbox {
      margin-left: 5px;
      margin-right: 0;
    }
  }
  .view-tree {
    margin: 10px 20px 20px;
  }
  .dialog-footer {
    background-color: #f5f5f5;
    height: 55px;
    line-height: 55px;
  }
}
</style>

 src/views/other/commonDialog/QueryClassSettingDialog.vue

File was renamed from src/views/other/QueryClassSettingDialog.vue
@@ -125,24 +125,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
}
</style>

 src/views/other/error/404.vue

 src/views/other/login/index.vue

 src/views/sales/contractManage/AddContractManageDialog.vue

@@ -273,29 +273,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
  .product-view {
    .el-form-item__label {
      padding: 0;
    }
  }
}
</style>

 src/views/sales/generatePlan/AddGeneratePlanDialog.vue

@@ -251,29 +251,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
  .product-view {
    .el-form-item__label {
      padding: 0;
    }
  }
}
</style>

 src/views/sales/masterOrder/AddMasterOrderDialog.vue

@@ -222,29 +222,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
  .product-view {
    .el-form-item__label {
      padding: 0;
    }
  }
}
</style>

 src/views/sales/quotation/AddQuotationDialog.vue

@@ -362,29 +362,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
  .product-view {
    .el-form-item__label {
      padding: 0;
    }
  }
}
</style>

 src/views/sales/refundForm/AddRefundFormDialog.vue

@@ -380,29 +380,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
  .product-view {
    .el-form-item__label {
      padding: 0;
    }
  }
}
</style>

 src/views/sales/salesDetails/AddSalesDetailsDialog.vue

@@ -411,29 +411,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
  .product-view {
    .el-form-item__label {
      padding: 0;
    }
  }
}
</style>

 src/views/sales/salesOpportunity/AddSalesOpportunityDialog.vue

@@ -548,24 +548,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
}
</style>

 src/views/sales/salesReturn/AddSalesReturnDialog.vue

@@ -329,29 +329,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
  .product-view {
    .el-form-item__label {
      padding: 0;
    }
  }
}
</style>

 src/views/sales/subOrder/AddSubOrderDialog.vue

@@ -304,29 +304,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
  .product-view {
    .el-form-item__label {
      padding: 0;
    }
  }
}
</style>

 src/views/service/orderManage/AddOrderManageDialog.vue

@@ -280,24 +280,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
}
</style>

 src/views/service/serviceContract/AddServiceContractDialog.vue

@@ -426,29 +426,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
  .product-view {
    .el-form-item__label {
      padding: 0;
    }
  }
}
</style>

 src/views/service/serviceFeeManage/AddServiceFeeManageDialog.vue

@@ -39,7 +39,7 @@
                    style="width: 63%"
                  >
                    <el-option
                      v-for="item in serviceCharger"
                      v-for="item in serviceChargerOptions"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
@@ -449,26 +449,6 @@
    background-color: #f5f5f5;
    height: 55px;
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
}
</style>

 src/views/service/serviceFollowup/AddServiceFollowupDialog.vue

@@ -277,24 +277,4 @@
    line-height: 55px;
  }
}
::v-deep {
  .el-dialog__header {
    padding: 12.5px 10px;
    border-bottom: 1px solid #e5e5e5;
    .el-dialog__title {
      font-size: 15px;
      color: #323232;
      font-weight: bold;
    }
  }
  .el-dialog__body {
    padding: 0px;
  }
  .el-dialog__footer {
    padding: 0px;
    text-align: center;
    box-sizing: border-box;
    border-top: 1px solid #dadee5;
  }
}
</style>

 vue.config.js

@@ -50,5 +50,13 @@
        symbolId: "icon-[name]"
      })
      .end()
  },
  css: {
    loaderOptions: {
      // 设置 scss 公用变量文件
      sass: {
        additionalData: `@import "@/assets/style/variable.scss";`
      }
    }
  }
}