替换组件

2023-01-11 14:23:09 +08:00 · 2023-01-11 14:23:09 +08:00 · 703813eafd
commit 703813eafd
parent 9e9d6dde22
40 changed files with 195 additions and 890 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -9,6 +9,7 @@
      "version": "0.1.0",
      "dependencies": {
        "axios": "^0.27.2",
+        "code-brick-zj": "^0.0.7",
        "core-js": "^3.8.3",
        "echarts": "^5.4.0",
        "element-ui": "^2.15.8",
@ -4079,6 +4080,11 @@
        "node": ">=6"
      }
    },
+    "node_modules/code-brick-zj": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/code-brick-zj/-/code-brick-zj-0.0.7.tgz",
+      "integrity": "sha512-ZuhseY/9RUUUweAiTdumq5pJKAKAJxpvD8yjcVluY+cGDEKyoKzN9PjycPh2tUsE/gmwShfgrcIcm5DKcmzqvA=="
+    },
    "node_modules/collection-visit": {
      "version": "1.0.0",
      "resolved": "https://registry.npmmirror.com/collection-visit/-/collection-visit-1.0.0.tgz",
@ -16035,6 +16041,11 @@
        "shallow-clone": "^3.0.0"
      }
    },
+    "code-brick-zj": {
+      "version": "0.0.7",
+      "resolved": "https://registry.npmjs.org/code-brick-zj/-/code-brick-zj-0.0.7.tgz",
+      "integrity": "sha512-ZuhseY/9RUUUweAiTdumq5pJKAKAJxpvD8yjcVluY+cGDEKyoKzN9PjycPh2tUsE/gmwShfgrcIcm5DKcmzqvA=="
+    },
    "collection-visit": {
      "version": "1.0.0",
      "resolved": "https://registry.npmmirror.com/collection-visit/-/collection-visit-1.0.0.tgz",
--- a/package.json
+++ b/package.json
@ -9,6 +9,7 @@
  },
  "dependencies": {
    "axios": "^0.27.2",
+    "code-brick-zj": "^0.0.7",
    "core-js": "^3.8.3",
    "echarts": "^5.4.0",
    "element-ui": "^2.15.8",
--- a/src/components/BaseDialog/index.vue
+++ b/src/components/BaseDialog/index.vue
@ -1,71 +0,0 @@
-<template>
-  <div class="baseDialog">
-    <el-dialog
-      v-el-drag-dialog
-      :visible.sync="dialogShow"
-      v-bind="$attrs"
-      v-on="$listeners"
-      :close-on-click-modal="false"
-    >
-      <slot />
-      <template #footer>
-        <!--对外继续暴露footer插槽，有个别弹框按钮需要自定义-->
-        <slot name="footer">
-          <!--将取消与确定按钮集成到内部-->
-          <el-row slot="footer" type="flex" justify="end">
-            <el-col :span="6">
-              <el-button size="small" @click="$_handleCancel">取消</el-button>
-              <el-button type="primary" size="small" @click="$_handleConfirm">
-                确定
-              </el-button>
-            </el-col>
-          </el-row>
-        </slot>
-      </template>
-    </el-dialog>
-  </div>
-</template>
-<script>
-import elDragDialog from '@/directive/el-drag-dialog'
-export default {
-  inheritAttrs: false,
-  name: 'BaseDialog',
-  directives: { elDragDialog },
-  props: {
-    dialogVisible: {
-      type: Boolean,
-      default: false
-    }
-  },
-  computed: {
-    dialogShow: {
-      get() {
-        return this.dialogVisible
-      },
-      set(val) {
-        this.$emit('update:dialogVisible', val)
-      }
-    }
-  },
-  methods: {
-    $_handleConfirm() {
-      this.$emit('confirm')
-    },
-    $_handleCancel() {
-      this.$emit('cancel')
-    }
-  }
-}
-</script>
-<style lang="scss">
-.baseDialog {
-  .el-dialog__title {
-    font-size: 16px;
-    font-weight: 500;
-  }
-  .el-dialog__header {
-    padding: 12px 20px;
-    border-bottom: 1px solid #e9e9e9;
-  }
-}
-</style>
--- a/src/components/BaseTable/index.vue
+++ b/src/components/BaseTable/index.vue
@ -1,243 +0,0 @@
-<template>
-  <div class="baseTable">
-    <el-table
-      border
-      :ref="id"
-      :data="renderData"
-      v-bind="$attrs"
-      @current-change="currentChange"
-      @selection-change="handleSelectionChange"
-      style="width: 100%"
-      :header-cell-style="{
-        background: '#F2F4F9',
-        color: '#606266'
-      }"
-    >
-      <!-- 多选 -->
-      <el-table-column
-        v-if="selectWidth"
-        type="selection"
-        :width="selectWidth"
-      />
-      <!-- 序号 -->
-      <el-table-column
-        v-if="page && limit"
-        prop="_pageIndex"
-        :width="pageWidth"
-        align="center"
-        fixed
-      >
-        <template slot="header">
-          <el-popover placement="bottom-start" width="300" trigger="click">
-            <div
-              class="setting-box"
-              style="max-height: 400px; overflow-y: auto"
-            >
-              <el-checkbox
-                v-for="(item, index) in tableProps"
-                :key="'cb' + index"
-                v-model="selectedBox[index]"
-                :label="item.label"
-              />
-            </div>
-            <i slot="reference" class="el-icon-s-tools" />
-          </el-popover>
-        </template>
-      </el-table-column>
-
-      <el-table-column
-        v-for="item in renderTableHeadList"
-        :key="item.prop"
-        v-bind="item"
-        :label="item.label"
-        :prop="item.prop"
-        :fixed="item.fixed || false"
-        :showOverflowTooltip="true"
-        :sortable="item.sortable || false"
-      >
-        <template slot="header">
-          <span>{{ item.label }}</span>
-        </template>
-        <!-- 多表头 -->
-        <template v-if="item.children">
-          <el-table-column
-            v-for="sub in item.children"
-            :prop="sub.prop"
-            :key="sub.prop"
-            v-bind="sub"
-            :label="sub.label"
-          >
-            <template slot-scope="scopeInner">
-              <component
-                :is="sub.subcomponent"
-                v-if="sub.subcomponent"
-                :key="scopeInner.row.id"
-                :inject-data="{ ...scopeInner.row, ...sub }"
-                @emitData="emitData"
-              />
-              <span v-else>{{
-                scopeInner.row[sub.prop] | commonFilter(sub.filter)
-              }}</span>
-            </template>
-          </el-table-column>
-        </template>
-        <template slot-scope="scope">
-          <component
-            :is="item.subcomponent"
-            v-if="item.subcomponent"
-            :key="scope.row.id"
-            :itemProp="item.prop"
-            :inject-data="{ ...scope.row, ...item }"
-            @emitData="emitData"
-          />
-          <span v-else>{{
-            scope.row[item.prop] | commonFilter(item.filter)
-          }}</span>
-        </template>
-      </el-table-column>
-      <slot name="handleBtn" />
-    </el-table>
-    <el-button
-      v-if="addButtonShow"
-      class="addButton"
-      icon="el-icon-plus"
-      @click="emitButtonClick"
-      >{{ addButtonShow }}</el-button
-    >
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'BaseTable',
-  filters: {
-    commonFilter: (source, filterType = (a) => a) => {
-      return filterType(source)
-    }
-  },
-  props: {
-    tableData: {
-      type: Array,
-      required: true,
-      default: () => {
-        return []
-      }
-    },
-    tableProps: {
-      type: Array,
-      default: () => {
-        return []
-      }
-    },
-    id: {
-      type: String,
-      required: false,
-      default: ''
-    },
-    page: {
-      type: Number,
-      required: false,
-      default: 0
-    },
-    pageWidth: {
-      type: Number,
-      required: false,
-      default: 70
-    },
-    limit: {
-      type: Number,
-      required: false,
-      default: 0
-    },
-    selectWidth: {
-      type: Number,
-      required: false,
-      default: 0
-    },
-    addButtonShow: {
-      type: String,
-      required: false,
-      default: ''
-    }
-  },
-  data() {
-    return {
-      selectedBox: new Array(100).fill(true)
-    }
-  },
-  computed: {
-    renderTableHeadList() {
-      return this.tableProps.filter((item, index) => {
-        return this.selectedBox[index]
-      })
-    },
-    renderData() {
-      return this.tableData.map((item, index) => {
-        return {
-          ...item,
-          _pageIndex: (this.page - 1) * this.limit + index + 1
-        }
-      })
-    }
-  },
-  beforeMount() {
-    this.selectedBox = new Array(100).fill(true)
-  },
-  methods: {
-    currentChange(newVal, oldVal) {
-      this.$emit('current-change', { newVal, oldVal })
-    },
-    emitData(val) {
-      this.$emit('emitFun', val)
-    },
-    emitButtonClick() {
-      this.$emit('emitButtonClick')
-    },
-    handleSelectionChange(val) {
-      this.$emit('selection-change', val)
-    },
-    setCurrent(name, index) {
-      let _this = this
-      let obj = _this.$refs[name].data[index]
-      _this.$refs[name].setCurrentRow(obj)
-    }
-  }
-}
-</script>
-<style lang="scss" scoped>
-.baseTable {
-  .show-col-btn {
-    margin-right: 5px;
-    line-height: inherit;
-    cursor: pointer;
-  }
-  .el-icon-refresh {
-    cursor: pointer;
-  }
-}
-</style>
-<style lang="scss">
-.el-table .el-table__cell {
-  padding: 0;
-  height: 35px;
-}
-.baseTable {
-  .addButton {
-    width: 100%;
-    height: 35px;
-    border-top: none;
-    color: #0b58ff;
-    border-color: #ebeef5;
-    border-radius: 0;
-  }
-  .addButton:hover {
-    color: #0b58ff;
-    border-color: #ebeef5;
-    background-color: #fff;
-  }
-  .addButton:focus {
-    border-color: #ebeef5;
-    background-color: #fff;
-  }
-}
-</style>
--- a/src/components/BaseTable/subcomponents/MethodBtn.vue
+++ b/src/components/BaseTable/subcomponents/MethodBtn.vue
@ -1,147 +0,0 @@
-<template>
-  <el-table-column
-    v-if="methodList.length > 0"
-    slot="handleBtn"
-    prop="operation"
-    v-bind="$attrs"
-  >
-    <template slot-scope="scope">
-      <span v-for="(item, index) in methodList" :key="'btn' + index">
-        <span
-          v-show="index === 0 ? false : true"
-          style="margin: 0 4px; font-size: 18px; color: #e5e7eb"
-          >|</span
-        >
-        <el-button
-          :disabled="
-            item.showParam ? !showFilter(item.showParam, scope.row) : false
-          "
-          type="text"
-          style="margin: 5px 0; padding: 0"
-          @click="
-            clickButton({
-              data: scope.row,
-              type: item.type
-            })
-          "
-        >
-          <i
-            v-if="
-              item.type === 'delete' ||
-              item.type === 'edit' ||
-              item.type === 'detail'
-            "
-            :class="
-              item.type === 'delete'
-                ? 'el-icon-delete' +
-                  (item.showParam
-                    ? !showFilter(item.showParam, scope.row)
-                      ? ''
-                      : ' delete-color'
-                    : ' delete-color')
-                : item.type === 'edit'
-                ? 'el-icon-edit-outline'
-                : item.type === 'detail'
-                ? 'el-icon-view'
-                : ''
-            "
-            style="font-size: 16px"
-          ></i>
-          <span v-else>{{ item.btnName }}</span>
-        </el-button>
-      </span>
-    </template>
-  </el-table-column>
-</template>
-
-<script>
-/**
- * 传入的组件prop格式
- * methodList<MethodItem> = []
- * Interface MethodItem = {
- *  btnName: string,
- *  type: string
- * }
- *
- */
-export default {
-  props: {
-    methodList: {
-      type: Array,
-      default: () => {
-        return []
-      }
-    }
-  },
-  methods: {
-    clickButton(raw) {
-      this.$emit('clickBtn', {
-        data: raw.data,
-        type: raw.type
-      })
-    },
-    showFilter(showParam, row) {
-      let showStatus = true
-      const showStatusArr = showParam.data.map((item) => {
-        let showStatusItem = true
-        if (item.type === 'unequal') {
-          if (row[item.name] !== item.value) {
-            showStatusItem = true
-          } else {
-            showStatusItem = false
-          }
-        }
-        if (item.type === 'equal') {
-          if (row[item.name] === item.value) {
-            showStatusItem = true
-          } else {
-            showStatusItem = false
-          }
-        }
-        if (item.type === 'more') {
-          if (row[item.name] >= item.value) {
-            showStatusItem = true
-          } else {
-            showStatusItem = false
-          }
-        }
-        if (item.type === 'less') {
-          if (row[item.name] <= item.value) {
-            showStatusItem = true
-          } else {
-            showStatusItem = false
-          }
-        }
-        if (item.type === 'indexof') {
-          if (item.value.indexOf(row[item.name]) >= 0) {
-            showStatusItem = true
-          } else {
-            showStatusItem = false
-          }
-        }
-        if (item.type === 'unindexof') {
-          if (item.value.indexOf(row[item.name]) < 0) {
-            showStatusItem = true
-          } else {
-            showStatusItem = false
-          }
-        }
-        return showStatusItem
-      })
-      if (showStatusArr.indexOf(false) >= 0 && showParam.type === '&') {
-        showStatus = false
-      }
-      if (showStatusArr.indexOf(true) < 0 && showParam.type === '|') {
-        showStatus = false
-      }
-      return showStatus
-    }
-  }
-}
-</script>
-
-<style>
-.delete-color {
-  color: #ff5454;
-}
-</style>
--- a/src/components/Pagination/index.vue
+++ b/src/components/Pagination/index.vue
@ -1,102 +0,0 @@
-<template>
-  <div v-show="total > 0" class="pagination-container">
-    <el-pagination
-      small
-      :current-page.sync="currentPage"
-      :page-size.sync="pageSize"
-      :layout="layout"
-      :page-sizes="pageSizes"
-      :total="total"
-      v-bind="$attrs"
-      @size-change="handleSizeChange"
-      @current-change="handleCurrentChange"
-    />
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'PaginationPage',
-  props: {
-    total: {
-      required: true,
-      type: Number
-    },
-    page: {
-      type: Number,
-      default: 1
-    },
-    limit: {
-      type: Number,
-      default: 20
-    },
-    pageSizes: {
-      type: Array,
-      default() {
-        return [10, 20, 30, 50]
-      }
-    },
-    layout: {
-      type: String,
-      default: 'total, sizes, prev, pager, next, jumper'
-    }
-  },
-  computed: {
-    currentPage: {
-      get() {
-        return this.page
-      },
-      set(val) {
-        this.$emit('update:page', val)
-      }
-    },
-    pageSize: {
-      get() {
-        return this.limit
-      },
-      set(val) {
-        this.$emit('update:limit', val)
-      }
-    }
-  },
-  methods: {
-    handleSizeChange(val) {
-      this.$emit('pagination', { page: this.currentPage, limit: val })
-    },
-    handleCurrentChange(val) {
-      this.$emit('pagination', { page: val, limit: this.pageSize })
-    }
-  }
-}
-</script>
-
-<style scoped>
-.pagination-container {
-  background: #fff;
-  padding-top: 20px;
-  text-align: right;
-}
-</style>
-<style>
-.el-pagination {
-  position: relative;
-}
-
-.el-pagination__jump {
-  margin-left: 125px;
-}
-
-.el-pagination__sizes {
-  position: absolute;
-  right: 100px;
-}
-
-.el-pager li.active {
-  background-color: #0b58ff;
-  color: #fff;
-}
-
-.el-input--mini .el-input__inner {
-  height: 22px;
-}
-</style>
--- a/src/components/SearchBar/index.vue
+++ b/src/components/SearchBar/index.vue
@ -1,235 +0,0 @@
-<template>
-  <el-form
-    :inline="true"
-    ref="searchBarForm"
-    :model="formInline"
-    class="searchBar"
-  >
-    <template v-for="item in formConfig">
-      <el-form-item
-        v-if="item.type !== ''"
-        :key="item.param"
-        :label="item.label ? item.label : ''"
-        :required="item.required ? item.required : false"
-        :style="{ float: item.float ? item.float : 'left' }"
-      >
-        <el-input
-          v-if="item.type === 'input'"
-          v-model="formInline[item.param]"
-          :size="item.size ? item.size : 'small'"
-          clearable
-          :disabled="item.disabled ? item.disabled : false"
-          :style="item.width ? 'width:' + item.width + 'px' : 'width:200px'"
-          :placeholder="item.placeholder ? item.placeholder : ''"
-        />
-        <el-select
-          v-if="item.type === 'select'"
-          v-model="formInline[item.param]"
-          :size="item.size ? item.size : 'small'"
-          :filterable="item.filterable ? item.filterable : false"
-          :multiple="item.multiple ? item.multiple : false"
-          :clearable="item.clearable === false ? false : true"
-          :style="item.width ? 'width:' + item.width + 'px' : 'width:200px'"
-          :placeholder="item.label"
-          @change="
-            item.onchange
-              ? $emit('select-changed', {
-                  param: item.param,
-                  value: formInline[item.param]
-                })
-              : null
-          "
-        >
-          <el-option
-            v-for="(sub, i) in item.selectOptions"
-            :key="i"
-            :label="item.labelField ? sub[item.labelField] : sub['name']"
-            :value="item.valueField ? sub[item.valueField] : sub['id']"
-          />
-        </el-select>
-        <el-date-picker
-          v-if="item.type === 'datePicker'"
-          :key="item.param"
-          :size="item.size ? item.size : 'small'"
-          v-model="formInline[item.param]"
-          :type="item.dateType"
-          :format="item.format ? item.format : 'yyyy-MM-dd'"
-          :value-format="item.valueFormat ? item.valueFormat : null"
-          :default-time="item.defaultTime || null"
-          :range-separator="item.rangeSeparator || null"
-          :start-placeholder="item.startPlaceholder || null"
-          :end-placeholder="item.endPlaceholder || null"
-          :placeholder="item.placeholder"
-          :picker-options="item.pickerOptions ? item.pickerOptions : null"
-          :style="item.width ? 'width:' + item.width + 'px' : 'width:250px'"
-        />
-        <el-autocomplete
-          v-if="item.type === 'autocomplete'"
-          v-model="formInline[item.param]"
-          :value-key="item.valueKey ? item.valueKey : 'value'"
-          :fetch-suggestions="item.querySearch"
-          :placeholder="item.placeholder"
-          :clearable="item.clearable === false ? false : true"
-          :style="item.width ? 'width:' + item.width + 'px' : 'width:200px'"
-          filterable
-        />
-        <el-cascader
-          v-if="item.type === 'cascader'"
-          v-model="formInline[item.param]"
-          :options="item.selectOptions"
-          :props="item.cascaderProps"
-          :clearable="item.clearable === false ? false : true"
-          :show-all-levels="item.showAllLevels === false ? false : true"
-          :collapse-tags="item.collapseTags === true ? true : false"
-          :style="item.width ? 'width:' + item.width + 'px' : 'width:200px'"
-          @change="
-            item.onChange
-              ? $emit('cascader-change', {
-                  param: item.param,
-                  value: formInline[item.param]
-                })
-              : null
-          "
-        ></el-cascader>
-        <el-button
-          v-if="item.type === 'button'"
-          :type="item.color"
-          :size="item.size ? item.size : 'small'"
-          :plain="item.plain ? item.plain : false"
-          :round="item.round ? item.round : false"
-          @click="headBtnClick(item.name)"
-          >{{ item.btnName }}</el-button
-        >
-        <!-- 可用于显示其他按钮 -->
-      </el-form-item>
-    </template>
-    <el-form-item>
-      <slot></slot>
-    </el-form-item>
-  </el-form>
-</template>
-<script>
-export default {
-  name: 'SearchBar',
-  props: {
-    formConfigs: {
-      type: Array,
-      default: () => {
-        return []
-      }
-    }
-  },
-  data() {
-    const formInline = {}
-    const formConfig = this.formConfigs
-    let hasExtraOptions = false
-    for (const obj of formConfig) {
-      if (obj.type !== 'button') {
-        if (obj.defaultSelect === false || obj.defaultSelect === 0) {
-          formInline[obj.param] = obj.defaultSelect
-        } else {
-          formInline[obj.param] = obj.defaultSelect || '' // defaultSelect下拉框默认选中项
-        }
-      }
-      if (obj.extraOptions) {
-        hasExtraOptions = true
-      }
-    }
-    return {
-      formInline,
-      formConfig,
-      hasExtraOptions
-    }
-  },
-  watch: {
-    formConfig: {
-      handler() {
-        for (const obj of this.formConfig) {
-          if (obj.defaultSelect) {
-            this.formInline[obj.param] = obj.defaultSelect
-          } else if (obj.defaultSelect === null) {
-            // 需要手动从外部清除选项缓存的情况，确保在外部配置项中可直接设置null
-            this.formInline[obj.param] = ''
-          }
-        }
-      },
-      deep: true,
-      immediate: true
-    },
-    formInline: {
-      handler: function () {
-        this.$forceUpdate()
-      },
-      deep: true,
-      immediate: true
-    }
-  },
-  mounted() {
-    this.$nextTick(() => {
-      this.init()
-    })
-  },
-  methods: {
-    init() {
-      if (this.hasExtraOptions) {
-        // 如果有额外参数就处理，如果没有就算了
-        for (const obj of this.formConfig) {
-          if (obj.extraOptions) {
-            // 注: 对obj.extraOptions的选择是互斥的!
-            this.$watch(
-              `formInline.${obj.param}`,
-              function (newVal) {
-                let deleteCount = 0
-                if (obj.index + 1 < this.formConfig.length) {
-                  // 如果obj不是最后一个配置
-                  const nextConfig = this.formConfig[obj.index + 1]
-                  if (nextConfig.parent && nextConfig.parent === obj.param)
-                    deleteCount = 1
-                }
-                const currentConfig = Object.assign(
-                  {},
-                  obj.extraOptions[newVal]
-                )
-                this.formConfig.splice(
-                  obj.index + 1,
-                  deleteCount,
-                  currentConfig
-                )
-                // 修改 formInline
-                this.$set(this.formInline, currentConfig.param, '')
-              },
-              { immediate: true }
-            )
-          }
-        }
-      }
-    },
-    headBtnClick(btnName) {
-      this.formInline.btnName = btnName
-      this.$emit('headBtnClick', this.formInline)
-    },
-    resetForm() {
-      this.$refs.searchBarForm.resetFields()
-      const formInline = {}
-      const formConfig = this.formConfigs
-      for (const obj of formConfig) {
-        if (obj.type !== 'button') {
-          if (obj.defaultSelect === false || obj.defaultSelect === 0) {
-            formInline[obj.param] = obj.defaultSelect
-          } else {
-            formInline[obj.param] = obj.defaultSelect || '' // defaultSelect下拉框默认选中项
-          }
-        }
-      }
-      this.formInline = formInline
-    }
-  }
-}
-</script>
-<style lang="scss">
-.searchBar {
-  .el-form-item {
-    margin-bottom: 10px;
-  }
-}
-</style>
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@ -4,7 +4,7 @@
      <img src="./../../assets/logo.png" alt="中建材" class="logo-img" />
      <span class="title">G8.5 TFT-LCD 玻璃基板后工程段制造执行系统</span>
    </div>
-    <breadcrumb v-show="activeModule !== 'home'" />
+    <!-- <breadcrumb v-show="activeModule !== 'home'" /> -->
    <div class="fr">
      <div class="fr avatar-area">
        <el-dropdown>
--- a/src/main.js
+++ b/src/main.js
@ -11,6 +11,9 @@ import './premission' // 路由守卫
 Vue.config.productionTip = false
 Vue.use(ElementUI)

+import myComponents from 'code-brick-zj'
+
+Vue.use(myComponents)
 import './components/index'

 new Vue({
--- a/src/views/basicConfig/accountConfig.vue
+++ b/src/views/basicConfig/accountConfig.vue
@ -29,7 +29,7 @@
    />
    <!-- 新增 -->
    <base-dialog
-      :title="addOrEditTitle"
+      :dialogTitle="addOrEditTitle"
      :dialogVisible="centervisible"
      @cancel="handleCancel"
      @confirm="handleConfirm"
@ -135,11 +135,14 @@ export default {
          btnName: '重置',
          name: 'reset'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '新增',
          name: 'add',
-          color: 'primary',
+          color: 'success',
          plain: true
        }
      ],
--- a/src/views/basicConfig/consumablesConfig.vue
+++ b/src/views/basicConfig/consumablesConfig.vue
@ -29,7 +29,7 @@
    />
    <!-- 新增 -->
    <base-dialog
-      :title="addOrEditTitle"
+      :dialogTitle="addOrEditTitle"
      :dialogVisible="centervisible"
      @cancel="handleCancel"
      @confirm="handleConfirm"
@ -118,11 +118,14 @@ export default {
          btnName: '重置',
          name: 'reset'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '新增',
          name: 'add',
-          color: 'primary',
+          color: 'success',
          plain: true
        }
      ],
--- a/src/views/basicConfig/deviceConfig.vue
+++ b/src/views/basicConfig/deviceConfig.vue
@ -51,7 +51,7 @@
        </div>
        <!-- 新增 -->
        <base-dialog
-          :title="addOrEditTitle"
+          :dialogTitle="addOrEditTitle"
          :dialogVisible="centervisible"
          @cancel="handleCancel"
          @confirm="handleConfirm"
@ -180,11 +180,14 @@ export default {
          name: 'search',
          color: 'primary'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '新增',
          name: 'add',
-          color: 'primary',
+          color: 'success',
          plain: true
        }
      ],
--- a/src/views/basicConfig/lineSideLibraryConfig.vue
+++ b/src/views/basicConfig/lineSideLibraryConfig.vue
@ -25,7 +25,7 @@
    />
    <!-- 新增 -->
    <base-dialog
-      :title="addOrEditTitle"
+      :dialogTitle="addOrEditTitle"
      :dialogVisible="centervisible"
      @cancel="handleCancel"
      @confirm="handleConfirm"
@ -105,11 +105,14 @@ export default {
          name: 'search',
          color: 'primary'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '新增',
          name: 'add',
-          color: 'primary',
+          color: 'success',
          plain: true
        }
      ],
--- a/src/views/basicConfig/sparePartsConfig.vue
+++ b/src/views/basicConfig/sparePartsConfig.vue
@ -29,7 +29,7 @@
    />
    <!-- 新增 -->
    <base-dialog
-      :title="addOrEditTitle"
+      :dialogTitle="addOrEditTitle"
      :dialogVisible="centervisible"
      @cancel="handleCancel"
      @confirm="handleConfirm"
@ -124,11 +124,14 @@ export default {
          btnName: '重置',
          name: 'reset'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '新增',
          name: 'add',
-          color: 'primary',
+          color: 'success',
          plain: true
        }
      ],
--- a/src/views/consumablesManagement/inAndOutManagement.vue
+++ b/src/views/consumablesManagement/inAndOutManagement.vue
@ -31,7 +31,7 @@
    />
    <!-- 入库 -->
    <base-dialog
-      :title="addAndEdit"
+      :dialogTitle="addAndEdit"
      :dialogVisible="centervisible"
      @cancel="handleCancel"
      @confirm="handleConfirm"
@ -161,6 +161,9 @@ export default {
          name: 'search',
          color: 'primary'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '入库',
--- a/src/views/consumablesManagement/materialTracking.vue
+++ b/src/views/consumablesManagement/materialTracking.vue
@ -15,7 +15,7 @@
    />
    <!-- 设置预警值 -->
    <base-dialog
-      title="设置预警值"
+      dialogTitle="设置预警值"
      :dialogVisible="centervisible"
      @cancel="handleCancel"
      @confirm="handleConfirm"
@ -95,10 +95,15 @@ export default {
          name: 'search',
          color: 'primary'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '设置预警值',
-          name: 'warning'
+          name: 'warning',
+          color: 'primary',
+          plain: true
        }
      ],
      tableProps,
--- a/src/views/deviceManagement/maintenanceManagement/plannedMaintenance.vue
+++ b/src/views/deviceManagement/maintenanceManagement/plannedMaintenance.vue
@ -30,7 +30,7 @@
    />
    <!-- 新增&未派工修改 -->
    <base-dialog
-      :title="addAndEdit"
+      :dialogTitle="addAndEdit"
      :dialogVisible="centervisibleAdd"
      @cancel="handleCancelAdd"
      @confirm="handleConfirmAdd"
@ -43,7 +43,7 @@
    </base-dialog>
    <!-- 确认&已派工的修改 -->
    <base-dialog
-      :title="sureAndEdit"
+      :dialogTitle="sureAndEdit"
      :dialogVisible="centervisibleSure"
      @cancel="handleCancelSure"
      @confirm="handleConfirmSure"
@ -270,11 +270,7 @@ export default {
          name: 'reset'
        },
        {
-          type: 'button',
-          btnName: '新增',
-          name: 'add',
-          color: 'primary',
-          plain: true
+          type: 'separate'
        },
        {
          type: 'button',
@ -282,6 +278,13 @@ export default {
          name: 'export',
          color: 'primary',
          plain: true
+        },
+        {
+          type: 'button',
+          btnName: '新增',
+          name: 'add',
+          color: 'success',
+          plain: true
        }
      ],
      tableProps,
--- a/src/views/deviceManagement/maintenanceManagement/selfMaintenance.vue
+++ b/src/views/deviceManagement/maintenanceManagement/selfMaintenance.vue
@ -30,7 +30,7 @@
    />
    <!-- 新增 -->
    <base-dialog
-      :title="addAndEdit"
+      :dialogTitle="addAndEdit"
      :dialogVisible="centervisible"
      @cancel="handleCancel"
      @confirm="handleConfirm"
@ -176,6 +176,9 @@ export default {
          btnName: '重置',
          name: 'reset'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '新增',
--- a/src/views/deviceManagement/performanceAnalysis/devicePage.vue
+++ b/src/views/deviceManagement/performanceAnalysis/devicePage.vue
@ -20,20 +20,10 @@
              <el-col :span="18">
                <div class="top-left">
                  <div>
-                    <span class="title">月份选择</span>
-                    <el-date-picker
-                      v-model="chooseMonth"
-                      type="month"
-                      placeholder="默认选择本月"
-                      size="small"
-                    >
-                    </el-date-picker>
-                    <el-button
-                      type="primary"
-                      size="small"
-                      style="margin-left: 24px"
-                      >查询</el-button
-                    >
+                    <search-bar
+                      :formConfigs="formConfig"
+                      @headBtnClick="buttonClick"
+                    />
                    <base-table
                      :page="listQuery.current"
                      :limit="listQuery.size"
@ -87,7 +77,7 @@
    </el-row>
    <!-- 编辑 -->
    <base-dialog
-      title="产能维护"
+      dialogTitle="产能维护"
      :dialogVisible="centervisible"
      @cancel="handleCancel"
      @confirm="handleConfirm"
@ -180,6 +170,24 @@ export default {
        label: 'name'
      },
      chooseMonth: '',
+      formConfig: [
+        {
+          type: 'datePicker',
+          label: '月份选择',
+          dateType: 'month',
+          format: 'yyyy-MM',
+          valueFormat: 'yyyy-MM',
+          placeholder: '月份选择',
+          param: 'testTime',
+          width: 200
+        },
+        {
+          type: 'button',
+          btnName: '查询',
+          name: 'search',
+          color: 'primary'
+        }
+      ],
      listQuery: {
        current: 1,
        size: 500
@ -226,6 +234,9 @@ export default {
        console.log(res)
      })
    },
+    buttonClick(val) {
+      console.log(val)
+    },
    getPlan() {
      // 获取计划产能
      performanceAnalysisPlan({ name: '精切磨边', year: '2022' }).then(
--- a/src/views/deviceManagement/performanceAnalysis/utilizationRateAnalysis.vue
+++ b/src/views/deviceManagement/performanceAnalysis/utilizationRateAnalysis.vue
@ -15,19 +15,7 @@
      </el-col>
      <el-col :span="20">
        <div class="right-box">
-          <div>
-            <span class="title">月份选择</span>
-            <el-date-picker
-              v-model="chooseMonth"
-              type="month"
-              placeholder="默认选择本月"
-              size="small"
-            >
-            </el-date-picker>
-            <el-button type="primary" size="small" style="margin-left: 24px"
-              >查询</el-button
-            >
-          </div>
+          <search-bar :formConfigs="formConfig" @headBtnClick="buttonClick" />
          <rate-analysis-chart></rate-analysis-chart>
        </div>
      </el-col>
@ -46,7 +34,25 @@ export default {
        children: 'children',
        label: 'name'
      },
-      chooseMonth: ''
+      chooseMonth: '',
+      formConfig: [
+        {
+          type: 'datePicker',
+          label: '月份选择',
+          dateType: 'month',
+          format: 'yyyy-MM',
+          valueFormat: 'yyyy-MM',
+          placeholder: '月份选择',
+          param: 'testTime',
+          width: 200
+        },
+        {
+          type: 'button',
+          btnName: '查询',
+          name: 'search',
+          color: 'primary'
+        }
+      ]
    }
  },
  components: {
@ -61,6 +67,9 @@ export default {
        this.treeData = res.data
      })
    },
+    buttonClick(val) {
+      console.log(val)
+    },
    clickDevice(val) {
      console.log(val)
      if (!val.children) {
--- a/src/views/deviceManagement/spareParts/sparePartsRecord.vue
+++ b/src/views/deviceManagement/spareParts/sparePartsRecord.vue
@ -163,6 +163,9 @@ export default {
          btnName: '重置',
          name: 'reset'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '导出',
--- a/src/views/deviceManagement/spareParts/sparePartsStock.vue
+++ b/src/views/deviceManagement/spareParts/sparePartsStock.vue
@ -31,7 +31,7 @@
    />
    <!-- 入库 -->
    <base-dialog
-      title="入库"
+      dialogTitle="入库"
      :dialogVisible="centervisibleIn"
      @cancel="handleCancelIn"
      @confirm="handleConfirmIn"
@ -41,7 +41,7 @@
    </base-dialog>
    <!-- 编辑 -->
    <base-dialog
-      title="编辑"
+      dialogTitle="编辑"
      :dialogVisible="centervisibleEdit"
      @cancel="handleCancelEdit"
      @confirm="handleConfirmEdit"
@ -54,7 +54,7 @@
    </base-dialog>
    <!-- 出库 -->
    <base-dialog
-      title="出库"
+      dialogTitle="出库"
      :dialogVisible="centervisibleOut"
      @cancel="handleCancelOut"
      @confirm="handleConfirmOut"
@ -189,6 +189,9 @@ export default {
          btnName: '重置',
          name: 'reset'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '入库',
--- a/src/views/processManagement/processConfiguration.vue
+++ b/src/views/processManagement/processConfiguration.vue
@ -30,7 +30,7 @@
    />
    <!-- 编辑 -->
    <base-dialog
-      title="编辑"
+      dialogTitle="编辑"
      :dialogVisible="centervisible"
      @cancel="handleCancel"
      @confirm="handleConfirm"
--- a/src/views/productionScheduling/generateReports.vue
+++ b/src/views/productionScheduling/generateReports.vue
@ -22,6 +22,9 @@ export default {
      activeName: 'productionReport'
    }
  },
+  mounted() {
+    console.log(this.$router)
+  },
  methods: {
    handleSelect(name) {
      this.$router.push({ name: name })
--- a/src/views/productionScheduling/offShelfPackaging.vue
+++ b/src/views/productionScheduling/offShelfPackaging.vue
@ -30,7 +30,7 @@
    />
    <!-- 新增 -->
    <base-dialog
-      :title="addOrEditTitle"
+      :dialogTitle="addOrEditTitle"
      :dialogVisible="centervisible"
      @cancel="handleCancel"
      @confirm="handleConfirm"
@ -45,7 +45,7 @@
    <off-shelf-packaging-detail v-if="detailVisible" ref="packagingDetail" />
    <!-- 继续包装 -->
    <base-dialog
-      title="请选择上架的玻璃架工位"
+      dialogTitle="请选择上架的玻璃架工位"
      :dialogVisible="centervisible2"
      @cancel="handleCancel2"
      @confirm="handleConfirm2"
@ -228,11 +228,14 @@ export default {
          btnName: '重置',
          name: 'reset'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '新增',
          name: 'add',
-          color: 'primary',
+          color: 'success',
          plain: true
        }
      ],
--- a/src/views/productionScheduling/productionData.vue
+++ b/src/views/productionScheduling/productionData.vue
@ -129,6 +129,9 @@ export default {
          name: 'search',
          color: 'primary'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '导出',
--- a/src/views/productionScheduling/productionReport.vue
+++ b/src/views/productionScheduling/productionReport.vue
@ -98,6 +98,9 @@ export default {
          name: 'search',
          color: 'primary'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '导出',
--- a/src/views/productionScheduling/substrateGlassQuality.vue
+++ b/src/views/productionScheduling/substrateGlassQuality.vue
@ -185,6 +185,9 @@ export default {
          name: 'search',
          color: 'primary'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '导出',
--- a/src/views/productionScheduling/thicknessDetection.vue
+++ b/src/views/productionScheduling/thicknessDetection.vue
@ -117,6 +117,9 @@ export default {
          name: 'search',
          color: 'primary'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '导出',
--- a/src/views/productionScheduling/workOrderManagement.vue
+++ b/src/views/productionScheduling/workOrderManagement.vue
@ -46,7 +46,7 @@
    />
    <!-- 新增 -->
    <base-dialog
-      :title="addOrEditTitle"
+      :dialogTitle="addOrEditTitle"
      :dialogVisible="centervisible"
      @cancel="handleCancel"
      @confirm="handleConfirm"
@ -184,7 +184,8 @@ const tableProps = [
  {
    prop: 'remark',
    label: '备注',
-    width: 150
+    width: 150,
+    showOverflowtooltip: true
  }
 ]
 const tableBtn = [
@ -322,11 +323,14 @@ export default {
          btnName: '重置',
          name: 'reset'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '新增',
          name: 'add',
-          color: 'primary',
+          color: 'success',
          plain: true
        },
        {
--- a/src/views/qualityManagement/components/InputArea.vue
+++ b/src/views/qualityManagement/components/InputArea.vue
@ -5,7 +5,7 @@
 </template>
 <script>
 export default {
-  name: 'inputArea',
+  name: 'InputArea',
  props: {
    injectData: {
      type: Object,
--- a/src/views/qualityManagement/components/samplingAdd.vue
+++ b/src/views/qualityManagement/components/samplingAdd.vue
@ -92,7 +92,7 @@
  </el-drawer>
 </template>
 <script>
-import inputArea from '@/components/BaseTable/subcomponents/InputArea'
+import inputArea from './InputArea'
 import { tableHeight } from '@/utils/index'
 import { getProcessDetectList, detectInput } from '@/api/qualityManagement'
 import moment from 'moment'
--- a/src/views/qualityManagement/components/standardSetting.vue
+++ b/src/views/qualityManagement/components/standardSetting.vue
@ -79,7 +79,7 @@
  </el-drawer>
 </template>
 <script>
-import inputArea from '@/components/BaseTable/subcomponents/InputArea'
+import inputArea from './InputArea'
 import { tableHeight } from '@/utils/index'
 import {
  getProcessDetectList,
--- a/src/views/qualityManagement/finalInspectionDailyReport.vue
+++ b/src/views/qualityManagement/finalInspectionDailyReport.vue
@ -89,6 +89,9 @@ export default {
          name: 'search',
          color: 'primary'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '导出',
--- a/src/views/qualityManagement/finalInspectionData.vue
+++ b/src/views/qualityManagement/finalInspectionData.vue
@ -3,11 +3,7 @@
    <el-row class="box-top">
      <el-col>
        <div class="search-box">
-          <search-bar
-            :formConfigs="formConfig"
-            ref="searchBarForm"
-            @headBtnClick="buttonClick"
-          />
+          <search-bar :formConfigs="formConfig" @headBtnClick="buttonClick" />
        </div>
      </el-col>
    </el-row>
@ -110,11 +106,15 @@ export default {
          name: 'search',
          color: 'primary'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '导出',
          name: 'export',
-          color: 'success'
+          color: 'primary',
+          plain: true
        }
      ],
      tablePropsL,
--- a/src/views/qualityManagement/processFullInspection/defectScatterPlot.vue
+++ b/src/views/qualityManagement/processFullInspection/defectScatterPlot.vue
@ -3,18 +3,7 @@
    <el-row :gutter="8" class="top-box">
      <el-col :span="12">
        <div class="top-left">
-          <div style="margin-bottom: 10px">
-            <span class="title">检验时间</span>
-            <el-date-picker
-              v-model="searchTime"
-              type="datetime"
-              size="small"
-              placeholder="检验时间"
-              style="margin: 0 24px 0 8px"
-            >
-            </el-date-picker>
-            <el-button type="primary" size="small">查询</el-button>
-          </div>
+          <search-bar :formConfigs="formConfig" @headBtnClick="buttonClick" />
          <base-table
            :selectWidth="50"
            :page="listQuery.current"
@ -124,6 +113,24 @@ export default {
  components: { defectScatterPlotTotal, defectScatterPlotChart },
  data() {
    return {
+      formConfig: [
+        {
+          type: 'datePicker',
+          label: '检验时间',
+          dateType: 'datetime',
+          format: 'yyyy-MM-dd HH:mm:ss',
+          valueFormat: 'yyyy-MM-dd HH:mm:ss',
+          placeholder: '抽检时间',
+          param: 'testTime',
+          width: 200
+        },
+        {
+          type: 'button',
+          btnName: '查询',
+          name: 'search',
+          color: 'primary'
+        }
+      ],
      searchTime: '',
      listQuery: {
        current: 1,
@ -178,6 +185,9 @@ export default {
        arr.push(obj)
      }
      this.tableData = arr
+    },
+    buttonClick(val) {
+      console.log(val)
    }
  }
 }
--- a/src/views/qualityManagement/processFullInspection/fullInspection.vue
+++ b/src/views/qualityManagement/processFullInspection/fullInspection.vue
@ -107,6 +107,9 @@ export default {
          name: 'search',
          color: 'primary'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '导出',
--- a/src/views/qualityManagement/processFullInspection/particleLineChart.vue
+++ b/src/views/qualityManagement/processFullInspection/particleLineChart.vue
@ -1,11 +1,7 @@
 <template>
  <div class="particleLine-chart">
    <div style="margin-bottom: 30px">
-      <search-bar
-        :formConfigs="formConfig"
-        ref="searchBarForm"
-        @headBtnClick="buttonClick"
-      />
+      <search-bar :formConfigs="formConfig" @headBtnClick="buttonClick" />
    </div>
    <div
      id="particleLineChart"
--- a/src/views/qualityManagement/processFullInspection/thicknessDistributionMap.vue
+++ b/src/views/qualityManagement/processFullInspection/thicknessDistributionMap.vue
@ -2,11 +2,7 @@
  <el-row :gutter="8" class="thicknessDistributionMap">
    <el-col :span="10">
      <div class="left-box">
-        <search-bar
-          :formConfigs="formConfig"
-          ref="searchBarForm"
-          @headBtnClick="buttonClick"
-        />
+        <search-bar :formConfigs="formConfig" @headBtnClick="buttonClick" />
        <base-table
          :page="listQuery.current"
          :limit="listQuery.size"
--- a/src/views/qualityManagement/processSampling.vue
+++ b/src/views/qualityManagement/processSampling.vue
@ -150,6 +150,9 @@ export default {
          btnName: '重置',
          name: 'reset'
        },
+        {
+          type: 'separate'
+        },
        {
          type: 'button',
          btnName: '录入',