modified: src/api/basic/param.js new file: src/views/basic/param/inde...

zouyu

2023-11-04 c6ce3cbd3adffc741a9bb926dd556cd48c6e2c17

	modified:   src/api/basic/param.js
	new file:   src/views/basic/param/index-bad.vue
	modified:   src/views/basic/param/index.vue
	modified:   src/views/common/ztt-table.vue

 src/api/basic/param.js

@@ -73,3 +73,12 @@
    data: obj
  })
}

export function uploadParam(obj) {
  return request({
    url: '/mes/param/upload',
    method: 'post',
    headers:{"Content-Type":"multipart/form-data"},
    data: obj
  })
}

 src/views/basic/param/index-bad.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,381 @@
<template>
  <div class="mod-config">
    <basic-container>
      <!-- <ttable
        :table="table"
        :row-key="id"
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
        @handleSelectionChange="handleSelectionChange"
        :uploadInfo="uploadInfo"
        :prelang="prelang"
        :options="options"
        :ajaxFun="ajaxFun"
        ref="paramTable"
      >
        <template #toolbar></template>
      </ttable> -->
      <el-row style="margin-left: 10px;">
        <el-form :inline="true" :model="table" class="demo-form-inline">
          <el-form-item label="参数项">
            <el-input v-model="table.param" placeholder="参数项"></el-input>
          </el-form-item>
          <el-form-item label="参数编号">
            <el-input v-model="table.code" placeholder="参数编号"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="onSearch">查询</el-button>
          </el-form-item>
        </el-form>
      </el-row>
      <el-row style="margin-left: 10px;height: 80vh;">
        <el-row>
          <el-button type="defult" @click="addOrUpdateHandle">新增</el-button>
          <el-button type="defult" @click="onSearch">导入</el-button>
          <!-- <el-button type="defult" @click="isExpandAllClick">展开/折叠</el-button> -->
        </el-row>
        <el-row style="padding-top: 20px;">
          <!--    è¡¨æ ¼æ•°æ®åŒº-->
          <el-table  height="480" style="width: 100%;" :data="table.data" row-key="id"
            :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
            <el-table-column type="index" label="序号" width="50">
            </el-table-column>
            <el-table-column prop="code" label="参数编号"></el-table-column>
            <el-table-column prop="parameterItem" label="参数项"></el-table-column>
            <el-table-column prop="type" label="参数类型">
              <template slot-scope="scope">
                <el-col v-show="scope.row.bianJi===false">{{ scope.row.type }}</el-col>
                <el-col v-show="scope.row.bianJi">
                  111
                  <!-- <el-select v-model="scope.row.type" filterable placeholder="请选择参数类型" style="width:100%"
                    @change="changeType">
                    <el-option v-for="(item, index) in this.typeOptions" :label="item.label" :value="item.value"
                      :key="item.value">
                    </el-option>
                  </el-select> -->
                </el-col>
              </template>
            </el-table-column>
            <el-table-column prop="parameterFormat" label="参数格式"></el-table-column>
            <el-table-column prop="unit" label="单位"></el-table-column>
            <el-table-column prop="code" label="操作">
              <template slot-scope="scope">
                <el-row style=" display: flex;width: 100%;">
                  <el-col><el-button type="text">删除</el-button></el-col>
                  <el-col v-if="scope.row.isBianji">
                  <el-button @click="bianji(scope.row)" type="text">{{ scope.row.bianJiBtn }}</el-button>
                  </el-col>
                </el-row>
              </template>
            </el-table-column>
          </el-table>
          <el-row style="display: flex; justify-content: end;">
            <el-pagination :current-page="table.currentPage" @current-change="handlesCurrentChange"
              @size-change="sizeChangeHandle" :page-sizes="[10, 20, 50, 100]" :page-size="table.pageSize"
              layout="total, sizes, prev, pager, next, jumper" :total="table.total"></el-pagination>
          </el-row>
        </el-row>
      </el-row>
      <!-- å¼¹çª—, æ–°å¢ž / ä¿®æ”¹ -->
      <table-form v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getData"></table-form>
    </basic-container>
  </div>
</template>
<script>
import { fetchList, delObj } from '@/api/basic/param'
import TableForm from './param-form'
import ttable from '@/views/common/ztt-table.vue'
import { mapGetters } from 'vuex'
import { remote } from '../../../api/admin/dict'
export default {
  data() {
    return {
      isExpandAll: false,
      // é‡æ–°æ¸²æŸ“表格状态
      refreshTable: true,
      ajaxFun: fetchList,
      typeOptions: [],
      multipleSelection: [],
      isShowQuery: false,
      uploadInfo: {
        // æ˜¯å¦å±•ç¤ºä¸Šä¼ EXCEL以及对应的url
        isShow: true,
        url: '/mes/param/upload'
      },
      prelang: 'operation',
      options: {
        height: 300, // é»˜è®¤é«˜åº¦-为了表头固定
        stripe: true, // æ˜¯å¦ä¸ºæ–‘马纹 table
        highlightCurrentRow: false, // æ˜¯å¦è¦é«˜äº®å½“前行
        border: true, // æ˜¯å¦æœ‰çºµå‘边框
        lazy: false, // æ˜¯å¦éœ€è¦æ‡’加载
        fit: true, // åˆ—的宽度是否自撑开
        multiSelect: false, //
        seqNo: true,
        isShowHide: true, // æ˜¯å¦æ˜¾ç¤ºæ˜¾å½±æŒ‰é’®
        isSearch: false, // é«˜çº§æŸ¥è¯¢æŒ‰é’®
        defaultOrderBy: { column: 'createTime', direction: 'desc' }
      },
      table: {
        param: null,
        total: 0,
        code: null,
        currentPage: 1,
        pageSize: 20,
        data: [],
        // æ ‡é¢˜
        column: [
          {
            minWidth: 'code',
            prop: 'code',
            label: '参数编号',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text',
            render: { fun: this.addOrUpdateHandle }
          },
          {
            minWidth: '120',
            prop: 'parameterItem',
            label: '参数项',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text'
          },
          {
            minWidth: '120',
            prop: 'second',
            label: '二级参数',
            sort: true,
            isTrue: true,
            isSearch: false,
            searchInfoType: 'text'
          },
          {
            minWidth: '130',
            prop: 'third',
            label: '三级参数',
            sort: true,
            isTrue: true,
            isSearch: false,
            searchInfoType: 'text'
          },
          {
            minWidth: '140',
            prop: 'type',
            label: '参数类型',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'select',
            formatter: this.getParam,
            optList: () => {
              return this.typeOptions
            }
          },
          {
            minWidth: '120',
            prop: 'parameterFormat',
            label: '参数格式',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text'
          },
          {
            minWidth: '120',
            prop: 'unit',
            label: '单位',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text'
          },
          {
            minWidth: '200',
            prop: 'createUser',
            label: '创建人',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text'
          },
          {
            minWidth: '140',
            prop: 'updateUser',
            label: '更新人',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text'
          },
          {
            minWidth: '120',
            prop: 'createTime',
            label: '创建日期',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'datetimerange'
          },
          {
            minWidth: '200',
            prop: 'updateTime',
            label: '更新日期',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'datetimerange'
          }
        ],
        toolbar: [
          {
            text: '新增',
            type: 'primary',
            fun: this.addOrUpdateHandle
          }
        ],
        operator: [
          {
            text: '删除',
            icon: 'el-icon-delete',
            type: 'text',
            size: 'small',
            fun: this.deleteHandle
          }
        ],
        operatorConfig: {
          fixed: 'right',
          label: '操作',
          width: 100,
          minWidth: 100
        }
      },
      addOrUpdateVisible: false
    }
  },
  components: {
    ttable,
    TableForm
  },
  computed: {
    ...mapGetters(['permissions'])
  },
  created() {
    this.getParamType()
    this.getData()
  },
  methods: {
    changeType(){},
    bianji(row){
      // this.$set(row.bianJi,false,true)
      row.bianJi=true
      row.bianJiBtn='保存'
      console.log(row)
    },
    isExpandAllClick() {
      // console.log(1111);
      this.isExpandAll = !this.isExpandAll;
      this.$nextTick(() => {
        this.refreshTable = true;
      });
      // console.log(this.isExpandAll);
    },
    handlesCurrentChange() { },
    sizeChangeHandle() { },
    onSearch() { },
    // èŽ·å–数据列表
    getData() {
      let param = {
        parentId: 0,
        code: this.table.code,
        size: this.table.pageSize,
        current: this.table.currentPage,
        parameterItem: this.table.param
      }
      fetchList(param).then((res) => {
        console.log(res.data);
        this.table.total = res.data.data.total
        this.table.data = res.data.data.records
        let datas=JSON.parse(JSON.stringify(this.table.data))
        datas.forEach(l => {
          l.bianJi = false
          if (l.children.length < 1) {
            l.isBianji = true
            l.bianJiBtn='编辑'
          }
          if (l.children.length > 0) {
            l.isBianji = false
            l.children.forEach(c => {
              c.bianji = false
              if (c.children.length < 1) {
                c.isBianji = true
                c.bianJiBtn='编辑'
              } else {
                l.isBianji = false
                c.children.forEach(cc => {
                  cc.bianJi = false
                  cc.isBianji = true
                  c.bianJiBtn='编辑'
                })
              }
            })
          }
        })
        this.table.data=datas
        console.log(this.table.data);
      })
    },
    // æ–°å¢ž / ä¿®æ”¹
    addOrUpdateHandle(row) {
      this.addOrUpdateVisible = true
      this.$nextTick(() => {
        this.$refs.addOrUpdate.init(row == null ? null : row.id)
      })
    },
    // èŽ·å–工序参数类型
    getParamType() {
      remote('technology_param').then((response) => {
        if (response.data.code === 0) {
          this.typeOptions = response.data.data
        }
      })
    },
    // é€‰ä¸­ä»“库行
    handleSelectionChange(val) {
      this.multipleSelection = val
    },
    // è¡¨æ ¼å­—段格式化
    getParam(row, column, cellValue) {
      for (let i = 0, len = this.typeOptions.length; i < len; i++) {
        if (cellValue == this.typeOptions[i].value) {
          return this.typeOptions[i].label
        }
      }
    },
    // åˆ é™¤
    deleteHandle(row) {
      this.$confirm('是否确认删除编号为' + row.code, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(function () {
          return delObj(row.id)
        })
        .then((data) => {
          this.$message.success('删除成功')
          this.getData()
        })
    }
  }
}
</script>
<style scoped>
table,
tr,
td {
  text-align: center;
}
</style>

 src/views/basic/param/index.vue

@@ -1,338 +1,354 @@
<template>
  <div class="mod-config">
    <basic-container>
      <!-- <ttable
        :table="table"
        :row-key="id"
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
        @handleSelectionChange="handleSelectionChange"
        :uploadInfo="uploadInfo"
        :prelang="prelang"
        :options="options"
        :ajaxFun="ajaxFun"
        ref="paramTable"
      >
        <template #toolbar></template>
      </ttable> -->
      <el-row style="margin-left: 10px;">
        <el-form :inline="true" :model="table" class="demo-form-inline">
          <el-form-item label="参数项">
            <el-input v-model="table.param" placeholder="参数项"></el-input>
          </el-form-item>
          <el-form-item label="参数编号">
            <el-input v-model="table.code" placeholder="参数编号"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="onSearch">查询</el-button>
          </el-form-item>
        </el-form>
      </el-row>
      <el-row style="margin-left: 10px;height: 80vh;">
        <el-row>
          <el-button type="defult" @click="addOrUpdateHandle">新增</el-button>
          <el-button type="defult" @click="onSearch">导入</el-button>
          <!-- <el-button type="defult" @click="isExpandAllClick">展开/折叠</el-button> -->
        </el-row>
        <el-row style="padding-top: 20px;">
          <!--    è¡¨æ ¼æ•°æ®åŒº-->
          <el-table  height="480" style="width: 100%;" :data="table.data" row-key="id"
            :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
            <el-table-column type="index" label="序号" width="50">
            </el-table-column>
            <el-table-column prop="code" label="参数编号"></el-table-column>
            <el-table-column prop="parameterItem" label="参数项"></el-table-column>
            <el-table-column prop="type" label="参数类型">
              <template slot-scope="scope">
                <el-col v-show="scope.row.bianJi===false">{{ scope.row.type }}</el-col>
                <el-col v-show="scope.row.bianJi">
                  111
                  <!-- <el-select v-model="scope.row.type" filterable placeholder="请选择参数类型" style="width:100%"
                    @change="changeType">
                    <el-option v-for="(item, index) in this.typeOptions" :label="item.label" :value="item.value"
                      :key="item.value">
                    </el-option>
                  </el-select> -->
                </el-col>
              </template>
            </el-table-column>
            <el-table-column prop="parameterFormat" label="参数格式"></el-table-column>
            <el-table-column prop="unit" label="单位"></el-table-column>
            <el-table-column prop="code" label="操作">
              <template slot-scope="scope">
                <el-row style=" display: flex;width: 100%;">
                  <el-col><el-button type="text">删除</el-button></el-col>
                  <el-col v-if="scope.row.isBianji">
                  <el-button @click="bianji(scope.row)" type="text">{{ scope.row.bianJiBtn }}</el-button>
                  </el-col>
                </el-row>
              </template>
            </el-table-column>
          </el-table>
          <el-row style="display: flex; justify-content: end;">
            <el-pagination :current-page="table.currentPage" @current-change="handlesCurrentChange"
              @size-change="sizeChangeHandle" :page-sizes="[10, 20, 50, 100]" :page-size="table.pageSize"
              layout="total, sizes, prev, pager, next, jumper" :total="table.total"></el-pagination>
  <div>
    <div class="param-basic">
        <el-form style="width:100%;margin-top: 20px;" class="l-mes" :inline="true" :model="searchForm">
          <el-row>
            <el-col :span="4">
              <el-form-item label="参数项:">
                <el-input clearable style="width:200px" v-model="searchForm.param" placeholder="参数项"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="4">
              <el-form-item label="参数编号:">
                <el-input clearable style="width:200px" v-model="searchForm.code" placeholder="参数编号"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item  class="btn-group">
                <el-button type="" @click="onSearch">查询</el-button>
                <el-button type="primary" @click="addOrUpdateHandle">新增</el-button>
                <el-button @click="showImportDialog">导入</el-button>
              </el-form-item>
            </el-col>
          </el-row>
        </el-row>
      </el-row>
      <!-- å¼¹çª—, æ–°å¢ž / ä¿®æ”¹ -->
      <table-form v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getData"></table-form>
        </el-form>
    </div>
    <basic-container>
        <avue-crud :data="tableData"
              ref="crud"
             :option="option"
             :span-method="spanMethod"
             @refresh-change="getData"
             :page="page"
             :table-loading="loading"
             @row-update="updateParam"
             @row-del="delParam">
             <template #menu="{row,index}">
              <el-button type="text" icon="el-icon-edit" size="small" @click="showEdit(row,index)">编辑</el-button>
              <el-button type="text" icon="el-icon-delete" size="small" @click="showDel(row,index)">删除</el-button>
            </template>
             <template slot-scope="scope" slot="paramTypeForm">
                <el-select v-model="scope.row.paramType" @change="changeType(scope.row)" 
                filterable placeholder="请选择参数类型" :disabled="formDisabled">
                  <el-option v-for="(item,index) in typeOptions" 
                  :key="index" :label="item.label" :value="item.value"/>
                </el-select>
             </template>
             <template slot="paramFormatLabel" slot-scope="scope">
                <span v-if="scope.row.paramType!='2'">参数格式</span>
                <span v-else>数据字典</span>
             </template>
             <template slot-scope="scope" slot="paramFormatForm">
               <el-input v-if="scope.row.paramType!='2'" v-model="scope.row.paramFormat" 
               placeholder="请输入参数格式" :disabled="formDisabled"/>
               <el-select v-else v-model="scope.row.paramFormat" filterable 
               placeholder="请选择数据字典" :disabled="formDisabled">
                 <el-option v-for="(item,index) in dictOptions" 
                 :key="index" :label="item.description" :value="item.type"/>
               </el-select>
             </template>
        </avue-crud>
    </basic-container>
    <!-- å¼¹çª—, æ–°å¢ž / ä¿®æ”¹ -->
    <table-form v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getData"></table-form>
    <el-dialog
      title="导入"
      :visible.sync="importDialog"
      width="22%">
        <el-upload ref="upload" style="width:100%;" class="upload-demo" drag action="#" 
        :multiple="false" :file-list="fileList" :auto-upload="false" show-file-list
        :on-change="handleUpload">
          <i class="el-icon-upload"></i>
          <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
          <div class="el-upload__tip" slot="tip">
            åªèƒ½ä¸Šä¼ xls/xlsx文件，且不超过10MB
            <el-button type="text" style="font-size:15px;text-decoration: underline;" 
            @click="downloadTemplate">下载模板</el-button>
          </div>
        </el-upload>
        <span slot="footer" class="dialog-footer">
          <el-button @click="importDialog = false">取 æ¶ˆ</el-button>
          <el-button type="primary" @click="confirmImport()">ç¡® å®š</el-button>
        </span>
    </el-dialog>
  </div>
</template>

<script>
import { fetchList, delObj } from '@/api/basic/param'
import { fetchList, delObj,putObj,uploadParam } from '@/api/basic/param'
import { uploadTemplate } from '@/api/basic/template'
import TableForm from './param-form'
import ttable from '@/views/common/ztt-table.vue'
import { mapGetters } from 'vuex'
import { remote } from '../../../api/admin/dict'
import { remote,fetchList as fetchDictList } from '@/api/admin/dict'
export default {
  data() {
    data() {
    return {
      isExpandAll: false,
      // é‡æ–°æ¸²æŸ“表格状态
      refreshTable: true,
      ajaxFun: fetchList,
      fileList: [],
      importDialog: false,
      formDisabled: false,
      dictOptions: [],
      typeOptions: [],
      multipleSelection: [],
      isShowQuery: false,
      uploadInfo: {
        // æ˜¯å¦å±•ç¤ºä¸Šä¼ EXCEL以及对应的url
        isShow: true,
        url: '/mes/param/upload'
      },
      prelang: 'operation',
      options: {
        height: 300, // é»˜è®¤é«˜åº¦-为了表头固定
        stripe: true, // æ˜¯å¦ä¸ºæ–‘马纹 table
        highlightCurrentRow: false, // æ˜¯å¦è¦é«˜äº®å½“前行
        border: true, // æ˜¯å¦æœ‰çºµå‘边框
        lazy: false, // æ˜¯å¦éœ€è¦æ‡’加载
        fit: true, // åˆ—的宽度是否自撑开
        multiSelect: false, //
        seqNo: true,
        isShowHide: true, // æ˜¯å¦æ˜¾ç¤ºæ˜¾å½±æŒ‰é’®
        isSearch: false, // é«˜çº§æŸ¥è¯¢æŒ‰é’®
        defaultOrderBy: { column: 'createTime', direction: 'desc' }
      },
      table: {
      searchForm: {
        param: null,
        total: 0,
        code: null,
        code: null
      },
      loading: true,
      page:{
        total: 10,
        currentPage: 1,
        pageSize: 20,
        data: [],
        // æ ‡é¢˜
        pageSize: 10
      },
      tableData: [],
      option: {
        height: 585,
        columnBtn: false,
        index: true,
        indexLabel: '序号',
        menuAlign: 'center',
        editBtn: false,
        delBtn: false,
        addBtn: false,
        border: true,
        align: 'center',
        column: [
          {
            minWidth: 'code',
            prop: 'code',
            label: '参数编号',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text',
            render: { fun: this.addOrUpdateHandle }
            prop: 'code',
            disabled: true
          },
          {
            minWidth: '120',
            prop: 'parameterItem',
            label: '参数项',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text'
            prop: 'paramItem',
            disabled: true
          },
          {
            minWidth: '120',
            prop: 'second',
            label: '二级参数',
            sort: true,
            isTrue: true,
            isSearch: false,
            searchInfoType: 'text'
            prop: 'paramItemTwo',
            disabled: true
          },
          {
            minWidth: '130',
            prop: 'third',
            label: '三级参数',
            sort: true,
            isTrue: true,
            isSearch: false,
            searchInfoType: 'text'
            prop: 'paramItemThree',
            disabled: true
          },
          {
            minWidth: '140',
            prop: 'type',
            label: '参数类型',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'select',
            formatter: this.getParam,
            optList: () => {
              return this.typeOptions
            }
            prop: 'paramType',
            formslot: true,
            rules:[{
              required: true,
              message: "请选择参数类型",
              trigger: "change"
            }]
          },
          {
            minWidth: '120',
            prop: 'parameterFormat',
            label: '参数格式',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text'
          },
          {
            minWidth: '120',
            prop: 'unit',
            prop: 'paramFormat',
            formslot: true,
            labelslot: true
          }, {
            label: '单位',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text'
            prop: 'unit',
            rules:[{
              required: true,
              message: "单位不能为空",
              trigger: "blur"
            }]
          },
          {
            minWidth: '200',
            prop: 'createUser',
            label: '创建人',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text'
          },
          {
            minWidth: '140',
            prop: 'updateUser',
            label: '更新人',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'text'
          },
          {
            minWidth: '120',
            prop: 'createTime',
            label: '创建日期',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'datetimerange'
          },
          {
            minWidth: '200',
            prop: 'updateTime',
            label: '更新日期',
            sort: true,
            isTrue: true,
            isSearch: true,
            searchInfoType: 'datetimerange'
          }
        ],
        toolbar: [
          {
            text: '新增',
            type: 'primary',
            fun: this.addOrUpdateHandle
          }
        ],
        operator: [
          {
            text: '删除',
            icon: 'el-icon-delete',
            type: 'text',
            size: 'small',
            fun: this.deleteHandle
          }
        ],
        operatorConfig: {
          fixed: 'right',
          label: '操作',
          width: 100,
          minWidth: 100
        }
        ]
      },
      spanArr: [{
        prop: 'code',
        span: []
      },{
        prop: 'paramItem',
        span: []
      }, {
        prop: 'paramItemTwo',
        span: []
      }],
      addOrUpdateVisible: false
    }
  },
  components: {
    ttable,
    TableForm
  },
  computed: {
    ...mapGetters(['permissions'])
  },
  created() {
    this.getParamType()
    this.getData()
    this.getParamType()
  },
  beforeUpdate(){
    console.log("updated");
    this.rowSort()
    this.rowCalc()
    this.loading = false
  },
  watch:{ },
  methods: {
    changeType(){},
    bianji(row){
      // this.$set(row.bianJi,false,true)
      row.bianJi=true
      row.bianJiBtn='保存'
      console.log(row)
    },
    isExpandAllClick() {
      // console.log(1111);
      this.isExpandAll = !this.isExpandAll;
      this.$nextTick(() => {
        this.refreshTable = true;
      });
      // console.log(this.isExpandAll);
    },
    handlesCurrentChange() { },
    sizeChangeHandle() { },
    onSearch() { },
    // èŽ·å–数据列表
    getData() {
      let param = {
        parentId: 0,
        code: this.table.code,
        size: this.table.pageSize,
        current: this.table.currentPage,
        parameterItem: this.table.param
      }
      fetchList(param).then((res) => {
        console.log(res.data);
        this.table.total = res.data.data.total
        this.table.data = res.data.data.records
        let datas=JSON.parse(JSON.stringify(this.table.data))
        datas.forEach(l => {
          l.bianJi = false
          if (l.children.length < 1) {
            l.isBianji = true
            l.bianJiBtn='编辑'
          }
          if (l.children.length > 0) {
            l.isBianji = false
            l.children.forEach(c => {
              c.bianji = false
              if (c.children.length < 1) {
                c.isBianji = true
                c.bianJiBtn='编辑'
              } else {
                l.isBianji = false
                c.children.forEach(cc => {
                  cc.bianJi = false
                  cc.isBianji = true
                  c.bianJiBtn='编辑'
                })
              }
            })
          }
    //下载模板
    downloadTemplate() {
      uploadTemplate('param').then((response) => {
        const blob = new Blob([response.data], {
          type: 'application/force-download'
        })
        this.table.data=datas
        console.log(this.table.data);
        const filename = decodeURI('参数模板.xlsx')
        // åˆ›å»ºä¸€ä¸ªè¶…链接，将文件流赋进去，然后实现这个超链接的单击事件
        const elink = document.createElement('a')
        elink.download = filename
        elink.style.display = 'none'
        elink.href = URL.createObjectURL(blob)
        document.body.appendChild(elink)
        elink.click()
        URL.revokeObjectURL(elink.href) // é‡Šæ”¾URL å¯¹è±¡
        document.body.removeChild(elink)
      })
    },
    // æ–°å¢ž / ä¿®æ”¹
    addOrUpdateHandle(row) {
      this.addOrUpdateVisible = true
      this.$nextTick(() => {
        this.$refs.addOrUpdate.init(row == null ? null : row.id)
    // æ–‡ä»¶ä¸Šä¼ 
        handleUpload(file, fileList) {
      const maxSize = 10 * 1024 * 1024 * 1024;//10MB
      const xlsType = "application/vnd.ms-excel";
      const xlsxType = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
      if(file.raw.type != xlsType && file.raw.type != xlsxType){
        this.$message.warning("导入文件格式不符！");
        fileList.pop()
        return;
      }
      if(Number.parseInt(file.size) > maxSize){
        this.$message.warning("导入文件过大！");
        fileList.pop()
        return;
      }
      if(fileList.length > 1){
        this.$message.warning("只能导入单个文件!")
        fileList.pop()
      }
      this.fileList = fileList;
      // this.importFile = file;
    },
    showImportDialog(){
      this.importDialog = true
    },
    //确定导入
    confirmImport(){
      console.log(this.fileList)
      const fileData =  new FormData();
      fileData.append('file', this.fileList[0].raw);
      uploadParam(fileData).then((res)=>{
        console.log(res);
        // this.exportLoading = false;
      }).catch()
    },
    // ä¿®æ”¹å‚数类型
    changeType(row) {
      if (row.paramType === '1') {
        row.paramFormat = '#.0000'
      } else if(row.paramType === '2'){
        this.getDictOptions()
      }else {
        row.paramFormat = ''
      }
    },
    // èŽ·å–所有字典
    getDictOptions() {
      fetchDictList(
        Object.assign({
          current: 1,
          size: 9999
        })
      ).then((response) => {
        if (response.data.code === 0) {
          this.dictOptions = response.data.data.records
        }
      })
    },
    showEdit(row,index){
      this.option.column.forEach(item=>{
        if(row.paramItemThree=="" && item.prop=='paramItemThree'){
          item.display = false
        }
        if(row.paramItemTwo=="" && item.prop=='paramItemTwo'){
          item.display = false
        }
      })
      this.$refs.crud.rowEdit(row,index)
    },
    showDel(row,index){
      this.$refs.crud.rowDel(row,index)
    },
    updateParam(row,index,done,loading){
      // this.formDisabled = true
      let data = {
        dict: '',
        id: 0,
        parameterFormat: '',
        parameterItem: '',
        type: row.paramType,
        unit: row.unit,
      }
      row.paramType=='2' ? data.dict=row.paramFormat : data.parameterFormat=row.paramFormat
      if(row.threeId){
        data.id = row.threeId
        data.parameterItem = row.paramItemThree
      }else{
        if(row.twoId){
          data.id = row.twoId
          data.parameterItem = row.paramItemTwo
        }else{
          data.id = row.oneId
          data.parameterItem = row.paramItem
        }
      }
      console.log(data)
      putObj(data).then(res=>{
        if(res.data.data.code==0){
          this.$message.success("更新成功")
        }else{
          this.$message.error(res.data.data.msg)
        }
        this.getData()
        done(row)
      }).catch(error=>{
        console.log(error)
      })
    },
    delParam(row){
      let id;
      if(row.threeId){
        id = row.threeId
      }else{
        if(row.twoId){
          id = row.twoId
        }else{
          id = row.oneId
        }
      }
      this.$confirm('是否确认删除编号为【' + row.code+'】的数据?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          delObj(id).then(res=>{
            if(res.data.code==0){
              this.$message.success("删除成功")
            }else{
              this.$message.error("删除失败")
            }
            this.getData()
          })
        }).catch(() => {});
    },
    // èŽ·å–工序参数类型
    getParamType() {
@@ -342,40 +358,201 @@
        }
      })
    },
    // é€‰ä¸­ä»“库行
    handleSelectionChange(val) {
      this.multipleSelection = val
    onSearch() { 
      this.getData()
    },
    // è¡¨æ ¼å­—段格式化
    getParam(row, column, cellValue) {
      for (let i = 0, len = this.typeOptions.length; i < len; i++) {
        if (cellValue == this.typeOptions[i].value) {
          return this.typeOptions[i].label
    // æ–°å¢ž / ä¿®æ”¹
    addOrUpdateHandle(row) {
      this.addOrUpdateVisible = true
      this.$nextTick(() => {
        this.$refs.addOrUpdate.init(row == null ? null : row.id)
      })
    },
    // èŽ·å–数据列表
    getData() {
      this.loading = true
      let param = {
        code: this.searchForm.code,
        size: 20,
        current: 1,
        parameterItem: this.searchForm.param
      }
      fetchList(param).then((res) => {
        this.tableData = res.data.data.records
        this.page.total = res.data.data.total
        this.page.currentPage = res.data.data.records.pages
      })
    },
    //动态合并方法
    rowCalc () {
      this.spanArr.forEach((ele, index) => {
        let parent
        if (index !== 0) parent = this.spanArr[ele.parent || index - 1].span
        ele.span = this.rowSpan(ele.prop, parent)
      })
    },
    rowSort (list) {
      let propList = this.spanArr.map(ele => ele.prop)
      this.spanArr.forEach((ele, index) => {
        let key = ele.prop
        this.tableData = this.tableData.sort((a, b) => {
          let flag = true;
          for (let i = 0; i < index; i++) {
            let prop = this.spanArr[i].prop
            flag = flag && a[prop] == b[prop]
          }
          if (flag) {
            if (a[key] < b[key]) { return 1; }
            else if (a[key] > b[key]) { return -1; }
            return 0;
          }
          return 0;
        })
      })
    },
    rowSpan (key, parent) {
      let list = [];
      let position = 0;
      this.tableData.forEach((item, index) => {
        if (index === 0) {
          list.push(1)
          let position = 0;
        } else {
          if (this.tableData[index][key] === this.tableData[index - 1][key]) {
            if (parent && parent[index] !== 0) {
              list.push(1)
              position = index
            } else {
              list[position] += 1;
              list.push(0)
            }
          } else {
            list.push(1)
            position = index
          }
        }
      })
      return list
    },
    spanMethod ({ row, column, rowIndex, columnIndex }) {
      for (let i = 0; i < this.spanArr.length; i++) {
        const ele = this.spanArr[i]
        if (column.property == ele.prop) {
          const _row = ele.span[rowIndex];
          const _col = _row > 0 ? 1 : 0;
          return {
            rowspan: _row,
            colspan: _col
          }
        }
      }
    },
    // åˆ é™¤
    deleteHandle(row) {
      this.$confirm('是否确认删除编号为' + row.code, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(function () {
          return delObj(row.id)
        })
        .then((data) => {
          this.$message.success('删除成功')
          this.getData()
        })
    }
  }
}
</script>
<style scoped>
table,
tr,
td {
  text-align: center;

<style>
.grid-header {
  display: none;
}
</style>
.param-basic {
  margin: 0 10px;
  border-radius: 0px;
  background-color: #fff;
  height: 100px;
  display: flex;
  flex-wrap: wrap;
  padding: 10px 20px;
  border: 1px solid #ddd;
  box-sizing: border-box;
}

.btn-group .el-button,
.btn-custom .el-button {
  border-radius: 0;
  padding: 9px 30px;
}

.btn-group .el-dropdown .el-button {
  border-radius: 0;
  padding: 9px 20px;
}

/*自定义disabled状态下checkbox的样式*/
.completeproductstructure-checkout
  .el-checkbox__input.is-disabled.is-checked
  .el-checkbox__inner {
  background-color: #006eff;
  border-color: #006eff;
}

.completeproductstructure-checkout
  .el-checkbox__input.is-disabled.is-checked
  + span.el-checkbox__label {
  color: #006eff;
  border-color: #006eff;
}

.completeproductstructure-checkout
  .el-checkbox__input.is-disabled
  .el-checkbox__inner {
  background-color: #ffffff;
  cursor: pointer;
}

.completeproductstructure-checkout
  .el-checkbox__input.is-disabled
  + span.el-checkbox__label {
  color: #606266;
  cursor: pointer;
}

.completeproductstructure-checkout .el-checkbox__inner::after {
  border: 1px solid #fff !important;
  border-left: 0 !important;
  border-top: 0 !important;
  cursor: pointer !important;
}

.structure-detail-table th.gutter {
  display: table-cell !important;
  width: 10px !important;
}

.structure-detail-table colgroup.gutter {
  display: table-cell !important;
  width: 10px !important;
}

.final-product-checkout .el-card__header {
  padding: 0px 20px;
  border-bottom: 0px;
}

.final-product-checkout .el-card__body {
  padding: 0px 20px 20px;
}

.orimaterial-quantity .el-card__header {
  padding: 0px 20px;
  border-bottom: 0px;
}

.orimaterial-quantity .el-card__body {
  padding: 0px 20px 20px;
}

.GooFlow .ico .ico_start:before {
  color: red;
}
.highlight-tab-class {
  color: #006eff;
  background: #e4e7ed;
  border-top: 1px solid #006eff;
}
.unhighlight-tab-class {
  border: 1px solid #e4e7ed;
  border-bottom: none;
}

</style>

 src/views/common/ztt-table.vue

@@ -478,7 +478,7 @@
        <el-button type="primary" @click="startExport()">确认</el-button>
      </span>
    </el-dialog>
    <el-dialog title="导入" :visible.sync="importDialogVisible" width="30%">
    <el-dialog title="导入" :visible.sync="importDialogVisible" width="22%">
      <span>
        <div>
          <div>
@@ -505,7 +505,7 @@
              <div class="el-upload__tip" slot="tip">
                åªèƒ½ä¸Šä¼ xlsx/xls文件，且不超过10M<el-button
                  type="text"
                  style="font-size:12px;"
                  style="font-size:15px;text-decoration: underline;"
                  @click="downDataTemplate"
                  >下载模板</el-button
                >