From d552260e5b6a350b1721552e1b6f7472079311fb Mon Sep 17 00:00:00 2001
From: ssc <273702440@qq.com>
Date: Sun, 7 May 2023 10:39:01 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E8=AF=A6=E6=83=85=E6=A8=A1=E5=BC=8F?=
 =?UTF-8?q?=E8=A1=A8=E5=8D=95=E4=B8=BB=E9=A2=98=E9=85=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/plugin/workflow/form-theme.js         |  50 ++
 .../plugin/workflow/design/form-theme.vue     | 455 ++++++++++++++++++
 src/views/plugin/workflow/mixins/ex-form.js   |   2 +-
 src/views/plugin/workflow/mixins/theme.js     |  37 +-
 .../workflow/process/components/detail.vue    |   7 +-
 .../process/external/Leave/detail.vue         |   3 +-
 src/views/plugin/workflow/styles/theme.scss   |  82 ++++
 .../plugin/workflow/styles/theme/blue.scss    |  63 ---
 .../plugin/workflow/styles/theme/border.scss  |  47 --
 .../plugin/workflow/styles/theme/default.scss | 134 ------
 10 files changed, 620 insertions(+), 260 deletions(-)
 create mode 100644 src/api/plugin/workflow/form-theme.js
 create mode 100644 src/views/plugin/workflow/design/form-theme.vue
 create mode 100644 src/views/plugin/workflow/styles/theme.scss
 delete mode 100644 src/views/plugin/workflow/styles/theme/blue.scss
 delete mode 100644 src/views/plugin/workflow/styles/theme/border.scss
 delete mode 100644 src/views/plugin/workflow/styles/theme/default.scss

diff --git a/src/api/plugin/workflow/form-theme.js b/src/api/plugin/workflow/form-theme.js
new file mode 100644
index 0000000..0c9dcb0
--- /dev/null
+++ b/src/api/plugin/workflow/form-theme.js
@@ -0,0 +1,50 @@
+import request from '@/router/axios';
+
+const prefix = '/api/blade-workflow/design/form/theme'
+
+export const getList = (current, size, params) => {
+  return request({
+    url: `${prefix}/list`,
+    method: 'get',
+    params: {
+      ...params,
+      current,
+      size,
+    }
+  })
+}
+
+export const getDetail = (params) => {
+  return request({
+    url: `${prefix}/detail`,
+    method: 'get',
+    params
+  })
+}
+
+export const remove = (ids) => {
+  return request({
+    url: `${prefix}/remove`,
+    method: 'post',
+    params: {
+      ids,
+    }
+  })
+}
+
+export const add = (row) => {
+  return request({
+    url: `${prefix}/submit`,
+    method: 'post',
+    data: row
+  })
+}
+
+export const update = (row) => {
+  return request({
+    url: `${prefix}/update`,
+    method: 'post',
+    data: row
+  })
+}
+
diff --git a/src/views/plugin/workflow/design/form-theme.vue b/src/views/plugin/workflow/design/form-theme.vue
new file mode 100644
index 0000000..cf93b5b
--- /dev/null
+++ b/src/views/plugin/workflow/design/form-theme.vue
@@ -0,0 +1,455 @@
+<template>
+  <basic-container>
+    <avue-crud
+      :option="option"
+      :search.sync="search"
+      :table-loading="loading"
+      :data="data"
+      :page.sync="page"
+      :permission="permissionList"
+      :before-open="beforeOpen"
+      v-model="form"
+      ref="crud"
+      @row-update="rowUpdate"
+      @row-save="rowSave"
+      @row-del="rowDel"
+      @search-change="searchChange"
+      @search-reset="searchReset"
+      @selection-change="selectionChange"
+      @current-change="currentChange"
+      @size-change="sizeChange"
+      @refresh-change="refreshChange"
+      @on-load="onLoad"
+    >
+      <template slot="menuLeft">
+        <el-button
+          type="danger"
+          size="small"
+          icon="el-icon-delete"
+          plain
+          v-if="permission.wf_design_form_theme_delete"
+          @click="handleDelete"
+          >删 除
+        </el-button>
+      </template>
+      <template #menu="{ row }">
+        <el-button
+          type="text"
+          size="small"
+          icon="el-icon-view"
+          @click="handlePreview(row)"
+          >预览
+        </el-button>
+      </template>
+    </avue-crud>
+
+    <el-drawer
+      title="预览"
+      :visible.sync="previewVisible"
+      append-to-body
+      destroy-on-close
+      size="50%"
+    >
+      <div class="wf-theme-custom">
+        <avue-form
+          v-model="previewForm"
+          :option="previewOption"
+          :style="themeCustomStyle"
+        ></avue-form>
+      </div>
+    </el-drawer>
+  </basic-container>
+</template>
+
+<script>
+import { getList, getDetail, add, update, remove } from "@/api/plugin/workflow/form-theme";
+import { mapGetters } from "vuex";
+import theme from '../mixins/theme'
+
+export default {
+  mixins: [theme],
+  data() {
+    return {
+      form: {},
+      query: {},
+      search: {},
+      loading: true,
+      page: {
+        pageSize: 10,
+        currentPage: 1,
+        total: 0
+      },
+      selectionList: [],
+      option: {
+        height: 'auto',
+        calcHeight: 30,
+        tip: false,
+        searchMenuSpan: 6,
+        border: true,
+        index: true,
+        viewBtn: false,
+        selection: true,
+        dialogClickModal: false,
+        dialogType: 'drawer',
+        dialogWidth: '50%',
+        labelWidth: 140,
+        menuWidth: 240,
+        column: [
+          {
+            label: "名称",
+            prop: "name",
+            type: "input",
+            rules: [{
+              required: true,
+              message: "请输入名称",
+              trigger: "blur"
+            }],
+            search: true
+          },
+          {
+            label: "主题key",
+            prop: "themeKey",
+            type: "input",
+            rules: [{
+              required: true,
+              message: "请输入主题key",
+              trigger: "blur"
+            }],
+            search: true
+          },
+          {
+            label: "边框宽度",
+            prop: "borderWidth",
+            type: "input",
+            hide: true,
+            span: 24,
+          },
+          {
+            label: "边框颜色",
+            prop: "borderColor",
+            type: "color",
+            hide: true,
+            span: 24,
+          },
+          {
+            label: "label字体颜色",
+            prop: "labelColor",
+            type: "color",
+            hide: true,
+            span: 24,
+          },
+          {
+            label: "label背景颜色",
+            prop: "labelBg",
+            type: "color",
+            hide: true,
+            span: 24,
+          },
+          // {
+          //   label: "label宽度",
+          //   prop: "labelWidth",
+          //   type: "input",
+          //   hide: true,
+          //   span: 24,
+          // },
+          {
+            label: "label字体大小",
+            prop: "labelFontSize",
+            type: "input",
+            hide: true,
+            span: 24,
+          },
+          {
+            label: "value字体颜色",
+            prop: "valueColor",
+            type: "color",
+            hide: true,
+            span: 24,
+          },
+          {
+            label: "value背景颜色",
+            prop: "valueBg",
+            type: "color",
+            hide: true,
+            span: 24,
+          },
+          {
+            label: "value字体大小",
+            prop: "valueFontSize",
+            type: "input",
+            hide: true,
+            span: 24,
+          },
+        ]
+      },
+      data: [],
+      previewVisible: false,
+      previewForm: {},
+      previewOption: {
+        detail: true,
+        column: [
+          {
+            type: 'input',
+            label: '输入框',
+            prop: 'input',
+            value: '输入框',
+          },
+          {
+            type: 'select',
+            label: '下拉框',
+            prop: 'select',
+            value: '下拉框',
+          },
+          {
+            type: 'radio',
+            label: '单选框',
+            prop: 'radio',
+            value: '单选框1',
+            dicData: [{
+              label: '单选框1',
+              value: '单选框1'
+            }, {
+              label: '单选框2',
+              value: '单选框2'
+            }]
+          },
+          {
+            type: 'checkbox',
+            label: '多选框',
+            prop: 'checkbox',
+            value: ['多选框1', '多选框2'],
+            dicData: [{
+              label: '多选框1',
+              value: '多选框1'
+            }, {
+              label: '多选框2',
+              value: '多选框2'
+            }]
+          },
+          {
+            type: 'datetime',
+            label: '日期时间',
+            prop: 'date',
+            value: '2020-01-01 12:00:00'
+          },
+          {
+            type: 'slider',
+            label: '滑块',
+            prop: 'slider',
+            range: true,
+            value: [20, 50]
+          },
+          {
+            type: 'rate',
+            label: '评分',
+            prop: 'rate',
+            value: 3
+          },
+          {
+            type: 'switch',
+            label: '开关',
+            prop: 'switch',
+            value: true
+          },
+          {
+            component: 'avue-ueditor',
+            label: '富文本',
+            prop: 'editor',
+            span: 24,
+          },
+          {
+            type: 'dynamic',
+            label: '子表单',
+            prop: 'dynamic',
+            span: 24,
+            value: [
+              {
+                input1: '输入框1',
+                input2: '输入框2'
+              }
+            ],
+            children: {
+              addBtn: false,
+              align: 'center',
+              column: [
+                {
+                  type: 'input',
+                  label: '输入框1',
+                  prop: 'input1',
+                },
+                {
+                  type: 'input',
+                  label: '输入框2',
+                  prop: 'input2',
+                },
+              ]
+            }
+          }
+        ],
+        group: [
+          {
+            label: '分组1',
+            column: [
+              {
+                type: 'input',
+                label: '输入框',
+                prop: 'input3',
+                value: '输入框'
+              },
+              {
+                type: 'select',
+                label: '下拉框',
+                prop: 'select3',
+                value: '下拉框',
+              },
+            ]
+          },
+        ]
+      },
+      theme: 'default'
+    };
+  },
+  computed: {
+    ...mapGetters(["permission"]),
+    permissionList() {
+      return {
+        addBtn: this.vaildData(this.permission.wf_design_form_theme_add, false),
+        viewBtn: this.vaildData(this.permission.wf_design_form_theme_view, false),
+        delBtn: this.vaildData(this.permission.wf_design_form_theme_delete, false),
+        editBtn: this.vaildData(this.permission.wf_design_form_theme_edit, false)
+      };
+    },
+    ids() {
+      let ids = [];
+      this.selectionList.forEach(ele => {
+        ids.push(ele.id);
+      });
+      return ids.join(",");
+    }
+  },
+  methods: {
+    handlePreview(row) {
+      this.theme = row.themeKey
+      this.setThemeStyle()
+      this.previewVisible = true
+    },
+    rowSave(row, done, loading) {
+      add(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        this.initTheme()
+        done();
+      }, error => {
+        loading();
+        window.console.log(error);
+      });
+    },
+    rowUpdate(row, index, done, loading) {
+      update(row).then(() => {
+        this.onLoad(this.page);
+        this.$message({
+          type: "success",
+          message: "操作成功!"
+        });
+        this.initTheme()
+        done();
+      }, error => {
+        loading();
+        console.log(error);
+      });
+    },
+    rowDel(row) {
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(row.id);
+        })
+        .then(() => {
+          this.onLoad(this.page);
+          this.initTheme()
+          this.$message({
+            type: "success",
+            message: "操作成功!"
+          });
+        });
+    },
+    handleDelete() {
+      if (this.selectionList.length === 0) {
+        this.$message.warning("请选择至少一条数据");
+        return;
+      }
+      this.$confirm("确定将选择数据删除?", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      })
+        .then(() => {
+          return remove(this.ids);
+        })
+        .then(() => {
+          this.onLoad(this.page);
+          this.initTheme()
+          this.$message({
+            type: "success",
+            message: "操作成功!"
+          });
+          this.$refs.crud.toggleSelection();
+        });
+    },
+    beforeOpen(done, type) {
+      if (["edit", "view"].includes(type)) {
+        getDetail({ id: this.form.id }).then(res => {
+          this.form = res.data.data;
+        })
+      }
+      done();
+    },
+    searchReset() {
+      this.query = {};
+      this.onLoad(this.page);
+    },
+    searchChange(params, done) {
+      this.query = params;
+      this.page.currentPage = 1;
+      this.onLoad(this.page, params);
+      done();
+    },
+    selectionChange(list) {
+      this.selectionList = list;
+    },
+    selectionClear() {
+      this.selectionList = [];
+      this.$refs.crud.toggleSelection();
+    },
+    currentChange(currentPage) {
+      this.page.currentPage = currentPage;
+    },
+    sizeChange(pageSize) {
+      this.page.pageSize = pageSize;
+    },
+    refreshChange() {
+      this.onLoad(this.page, this.query);
+    },
+    onLoad(page, params = {}) {
+      this.loading = true;
+
+      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
+        const data = res.data.data;
+        this.page.total = data.total;
+        this.data = data.records;
+        this.loading = false;
+        this.selectionClear();
+      });
+    }
+  }
+};
+</script>
+
+<style>
+</style>
diff --git a/src/views/plugin/workflow/mixins/ex-form.js b/src/views/plugin/workflow/mixins/ex-form.js
index 3ee7091..4bcff6b 100644
--- a/src/views/plugin/workflow/mixins/ex-form.js
+++ b/src/views/plugin/workflow/mixins/ex-form.js
@@ -99,7 +99,7 @@ export default {
             // event.forEach(e => delete col[e])
           }
           if (col.type == 'dynamic') { // 处理子表单
-            col.children.column = _this.filterAvueColumn(col.children.column, taskForm).column
+            col.children.column = _this.filterAvueColumn(col.children.column, taskForm, isExForm).column
           }
           if (col.rules && col.pattern) { // 处理正则
             col.rules.forEach(c => {
diff --git a/src/views/plugin/workflow/mixins/theme.js b/src/views/plugin/workflow/mixins/theme.js
index 7fc8a1f..45924fa 100644
--- a/src/views/plugin/workflow/mixins/theme.js
+++ b/src/views/plugin/workflow/mixins/theme.js
@@ -1,20 +1,14 @@
+import { getList } from '@/api/plugin/workflow/form-theme.js'
 export default {
   data() {
     return {
       theme: '',
-      themeList: [{
-        label: '默认',
-        value: 'default'
-      }, {
-        label: '边框',
-        value: 'border'
-      }, {
-        label: '蓝色',
-        value: 'blue'
-      }]
+      themeList: [],
+      themeCustomStyle: {},
     }
   },
   created() {
+    this.initTheme()
     const theme = localStorage.getItem("wf-form-theme")
     if (theme || theme == '') this.theme = theme || 'default'
     else this.theme = 'default'
@@ -23,11 +17,30 @@ export default {
     theme: {
       handler(val) {
         if (val) {
-          import(`../styles/theme/${val}.scss`)
+          import(`../styles/theme.scss`)
           localStorage.setItem('wf-form-theme', val)
+          this.setThemeStyle()
         }
       },
       immediate: true
     },
   },
-}
\ No newline at end of file
+  methods: {
+    initTheme() {
+      getList(1, -1).then(res => {
+        this.themeList = res.data.data.records
+        this.themeList.forEach(e => {
+          e.label = e.name
+          e.value = e.themeKey
+        })
+        this.setThemeStyle()
+      });
+    },
+    setThemeStyle() {
+      let obj = this.themeList.find(item => item.themeKey == this.theme)
+      for (let i in obj) {
+        this.themeCustomStyle[`--${i}`] = obj[i]
+      }
+    },
+  },
+}
diff --git a/src/views/plugin/workflow/process/components/detail.vue b/src/views/plugin/workflow/process/components/detail.vue
index 35cb5b9..b146fa2 100644
--- a/src/views/plugin/workflow/process/components/detail.vue
+++ b/src/views/plugin/workflow/process/components/detail.vue
@@ -11,7 +11,8 @@
             主题：<avue-select v-model="theme"
                          size="mini"
                          :clearable="false"
-                         :dic="themeList"></avue-select>
+                         :dic="themeList"
+                         @change="setThemeStyle"></avue-select>
           </div>
         </div>
       </avue-affix>
@@ -20,15 +21,17 @@
                      name="first">
           <el-card shadow="never">
             <div id="printBody"
-                 :class="process.status != 'todo' ? `wf-theme-${theme}`: ''">
+                 :class="process.status != 'todo' ? `wf-theme-custom`: ''">
               <avue-form v-if="summaryOption && ((summaryOption.column && summaryOption.column.length > 0) || (summaryOption.group && summaryOption.group.length > 0))"
                          v-model="form"
+                         :style="themeCustomStyle"
                          ref="summaryForm"
                          :option="summaryOption"
                          :upload-preview="handleUploadPreview"
                          style="margin-bottom: 20px;"></avue-form>
               <avue-form v-if="option && ((option.column && option.column.length > 0) || (option.group && option.group.length > 0))"
                          v-model="form"
+                         :style="themeCustomStyle"
                          ref="form"
                          :defaults.sync="defaults"
                          :option="option"
diff --git a/src/views/plugin/workflow/process/external/Leave/detail.vue b/src/views/plugin/workflow/process/external/Leave/detail.vue
index 8ff4c09..8f3e512 100644
--- a/src/views/plugin/workflow/process/external/Leave/detail.vue
+++ b/src/views/plugin/workflow/process/external/Leave/detail.vue
@@ -20,9 +20,10 @@
                      name="first">
           <el-card shadow="never">
             <div id="printBody"
-                 :class="process.status != 'todo' ? `wf-theme-${theme}`: ''">
+                 :class="process.status != 'todo' ? `wf-theme-custom`: ''">
               <avue-form v-if="option && ((option.column && option.column.length > 0) || (option.group && option.group.length > 0))"
                          v-model="form"
+                         :style="themeCustomStyle"
                          ref="form"
                          :defaults.sync="defaults"
                          :option="option"
diff --git a/src/views/plugin/workflow/styles/theme.scss b/src/views/plugin/workflow/styles/theme.scss
new file mode 100644
index 0000000..d9c4e17
--- /dev/null
+++ b/src/views/plugin/workflow/styles/theme.scss
@@ -0,0 +1,82 @@
+// form - border
+.wf-theme-custom {
+  //google chrome explore
+  -webkit-print-color-adjust: exact;
+  //firefox  explore
+  -moz-print-color-adjust: exact;
+  color-adjust: exact;
+
+  .avue--detail {
+
+    .avue-form__group,
+    .avue-form__row {
+      border: var(--borderWidth) solid var(--borderColor) !important;
+    }
+
+    .el-col:nth-child(1) {
+      border-top: var(--borderWidth) solid var(--borderColor) !important;
+    }
+
+    .el-col,
+    .el-row {
+      border: none;
+    }
+
+    .el-form-item>.el-form-item__content {
+      border-left: var(--borderWidth) solid var(--borderColor) !important;
+    }
+
+    .el-table__row .el-form-item__content {
+      border-left: none !important;
+    }
+
+    .avue-form__row {
+      margin-bottom: 0px !important;
+    }
+
+    .el-form-item {
+      margin-bottom: 0px !important;
+      background: var(--labelBg);
+    }
+
+    .el-col>.el-form-item>.el-form-item__label {
+      // width: var(--labelWidth) !important;
+      color: var(--labelColor);
+      font-size: var(--labelFontSize);
+      text-align: center !important;
+    }
+
+    .el-col>.el-form-item>.el-form-item__content {
+      // margin-left: var(--labelWidth) !important;
+      background-color: var(--valueBg, #fff)
+    }
+
+    .el-radio.is-disabled .el-radio__label,
+    .el-checkbox.is-disabled .el-checkbox__label,
+    .el-input.is-disabled .el-input__inner,
+    .el-range-editor.is-disabled,
+    .el-range-editor.is-disabled input,
+    .el-textarea.is-disabled .el-textarea__inner {
+      color: var(--valueColor) !important;
+      -webkit-text-fill-color: var(--valueColor) !important;
+      font-size: var(--valueFontSize);
+      border: var(--borderWidth) solid transparent;
+      background: #fff;
+      background-color: #fff;
+    }
+
+    .el-input-number.is-disabled .el-input-number__decrease,
+    .el-input-number.is-disabled .el-input-number__increase {
+      display: none;
+    }
+
+    .el-rate {
+      line-height: 2.5;
+    }
+
+    .avue-dynamic,
+    .avue-ueditor {
+      margin-left: -20px;
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/views/plugin/workflow/styles/theme/blue.scss b/src/views/plugin/workflow/styles/theme/blue.scss
deleted file mode 100644
index c42b03b..0000000
--- a/src/views/plugin/workflow/styles/theme/blue.scss
+++ /dev/null
@@ -1,63 +0,0 @@
-// form - border
-.wf-theme-blue {
-  //google chrome explore
-  -webkit-print-color-adjust: exact;
-  //firefox  explore
-  -moz-print-color-adjust: exact;
-  color-adjust: exact;
-
-  .avue--detail {
-
-    .avue-form__group,
-    .avue-form__row {
-      border: 1px solid #cbdcf0 !important;
-    }
-
-    .el-col {
-      border: none;
-    }
-
-    .el-col:nth-child(1) {
-      border-top: 1px solid #cbdcf0 !important;
-    }
-
-    .el-row {
-      border: none;
-    }
-
-    .el-form-item>.el-form-item__content {
-      border-left: 1px solid #cbdcf0 !important;
-    }
-
-    .el-table__row .el-form-item__content {
-      border-left: none !important;
-    }
-
-    .avue-form__row {
-      margin-bottom: 0px !important;
-    }
-
-    .el-form-item {
-      margin-bottom: 0px !important;
-      background: #eef6ff !important;
-    }
-
-    .el-form-item__label {
-      color: #01418a !important;
-      text-align: center !important;
-    }
-
-    .el-input.is-disabled .el-input__inner,
-    .el-range-editor.is-disabled,
-    .el-textarea.is-disabled .el-textarea__inner {
-      border: 1px solid transparent;
-      background: #fff;
-      background-color: #fff;
-    }
-
-    .el-input-number.is-disabled .el-input-number__decrease,
-    .el-input-number.is-disabled .el-input-number__increase {
-      display: none;
-    }
-  }
-}
diff --git a/src/views/plugin/workflow/styles/theme/border.scss b/src/views/plugin/workflow/styles/theme/border.scss
deleted file mode 100644
index 040fff9..0000000
--- a/src/views/plugin/workflow/styles/theme/border.scss
+++ /dev/null
@@ -1,47 +0,0 @@
-// form - border
-.wf-theme-border {
-  //google chrome explore
-  -webkit-print-color-adjust: exact;
-  //firefox  explore
-  -moz-print-color-adjust: exact;
-  color-adjust: exact;
-  
-  .avue--detail {
-    .avue-form__group,
-    .avue-form__row {
-      border: 1px solid #333 !important;
-    }
-    .el-form-item > .el-form-item__content {
-      border-left: 2px solid #333 !important;
-    }
-
-    .el-table__row .el-form-item__content {
-      border-left: none !important;
-    }
-
-    .avue-form__row {
-      margin-bottom: 0px !important;
-    }
-
-    .el-form-item {
-      margin-bottom: 0px !important;
-    }
-
-    .el-form-item__label {
-      text-align: center !important;
-    }
-
-    .el-input.is-disabled .el-input__inner,
-    .el-range-editor.is-disabled,
-    .el-textarea.is-disabled .el-textarea__inner {
-      border: 1px solid transparent;
-      background: #fff;
-      background-color: #fff;
-    }
-
-    .el-input-number.is-disabled .el-input-number__decrease,
-    .el-input-number.is-disabled .el-input-number__increase {
-      display: none;
-    }
-  }
-}
diff --git a/src/views/plugin/workflow/styles/theme/default.scss b/src/views/plugin/workflow/styles/theme/default.scss
deleted file mode 100644
index 897dbf0..0000000
--- a/src/views/plugin/workflow/styles/theme/default.scss
+++ /dev/null
@@ -1,134 +0,0 @@
-.wf-theme-default {
-  //google chrome explore
-  -webkit-print-color-adjust: exact;
-  //firefox  explore
-  -moz-print-color-adjust: exact;
-  color-adjust: exact;
-  
-  .avue--detail {
-    .el-col {
-      margin-bottom: 0 !important;
-    }
-    .hover-row td {
-      background-color: #fff !important;
-    }
-    .avue-group__header {
-      padding-left: 10px;
-    }
-    .el-collapse-item__header {
-      margin-bottom: 0;
-    }
-    .el-input.is-disabled .el-input__inner,
-    .el-textarea.is-disabled .el-textarea__inner,
-    .el-range-editor.is-disabled,
-    .el-range-editor.is-disabled input {
-      color: #606266;
-      background-color: #fff;
-      padding-left: 0;
-      cursor: default;
-    }
-    .el-input-number__decrease,
-    .el-input-number__increase {
-      display: none;
-    }
-    .el-input-group__append,
-    .el-input-group__prepend {
-      background-color: transparent;
-      border: none;
-    }
-    .el-input__suffix {
-      display: none;
-    }
-    .el-input__inner,
-    .el-textarea__inner {
-      border: none;
-      &::-webkit-input-placeholder {
-        color: transparent !important;
-      }
-      &::-moz-placeholder {
-        color: transparent !important;
-      }
-      &::-moz-placeholder {
-        color: transparent !important;
-      }
-      &::-ms-input-placeholder {
-        color: transparent !important;
-      }
-      &::-ms-input-placeholder {
-        color: transparent !important;
-      }
-    }
-    .avue-checkbox__all {
-      display: none;
-    }
-    .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
-      background-color: #409eff;
-      border-color: #409eff;
-    }
-    .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
-      border-color: #fff;
-    }
-    .el-radio__input.is-disabled.is-checked .el-radio__inner {
-      background-color: #409eff;
-      border-color: #409eff;
-    }
-    .el-radio__input.is-disabled.is-checked .el-radio__inner::after {
-      background-color: #fff;
-    }
-    .el-checkbox__input.is-disabled + span.el-checkbox__label,
-    .el-radio__input.is-disabled + span.el-radio__label {
-      color: #606266;
-    }
-    .el-form-item.is-required:not(.is-no-asterisk)
-      .el-form-item__label-wrap
-      > .el-form-item__label:before,
-    .el-form-item.is-required:not(.is-no-asterisk)
-      > .el-form-item__label:before {
-      display: none;
-    }
-    .el-row {
-      border-top: 1px solid #ebeef5;
-      border-left: 1px solid #ebeef5;
-    }
-    .el-col {
-      padding: 0 !important;
-      border-bottom: 1px solid #ebeef5;
-      border-right: 1px solid #ebeef5;
-    }
-    .el-form-item {
-      margin: 0;
-      background: #fafafa;
-    }
-    .el-form-item__label,
-    .el-form-item__content {
-      padding: 2px 0;
-    }
-    .el-form-item__label {
-      padding: 0 10px;
-      color: #909399;
-      box-sizing: border-box;
-    }
-    .el-tag {
-      margin-left: 0 !important;
-      margin-right: 6px !important;
-    }
-    .el-form-item__content {
-      border-left: 1px solid #ebeef5;
-      padding-left: 20px;
-      box-sizing: border-box;
-      background-color: #fff;
-    }
-    &__column {
-      .el-form-item {
-        background-color: #fff;
-      }
-      .el-form-item__label {
-        padding-right: 12px;
-      }
-      .el-form-item__content {
-        padding-left: 0;
-        border-left: none;
-      }
-    }
-  }
-}