modified: src/views/basic/crew/index.vue modified: src/views/basic/lo...

Fixiaobai

2023-11-04 2ecd6a1d2501ff0f80d9e177250ce76830436ef5

 src/views/basic/param/index.vue

@@ -1,8 +1,10 @@
<template>
  <div class="mod-config">
    <basic-container>
      <ttable
      <!-- <ttable
        :table="table"
        :row-key="id"
        :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
        @handleSelectionChange="handleSelectionChange"
        :uploadInfo="uploadInfo"
        :prelang="prelang"
@@ -11,13 +13,85 @@
        ref="paramTable"
      >
        <template #toolbar></template>
      </ttable>
      </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">
                  <el-select @change="changeType(scope.row)" v-model="scope.row.type" placeholder="请选择">
                    <el-option v-for="item in optionType" :key="item.id" :label="item.label" :value="item.label">
                    </el-option>
                  </el-select>
                </el-col>
              </template>
            </el-table-column>
            <el-table-column prop="parameterFormat" label="参数格式">
              <template slot-scope="scope">
                <el-col v-if="scope.row.bianJi === false">
                  {{ scope.row.parameterFormat }}
                </el-col>
                <el-col style="margin-bottom: 0 !important;" v-if="scope.row.bianJi">
                  <el-col v-if="scope.row.isSelect === false">
                    <el-input v-model="scope.row.parameterFormat" placeholder="参数格式"></el-input>
                  </el-col>
                  <el-col v-if="scope.row.isSelect">
                    <el-select v-model="scope.row.dict" filterable placeholder="请选择数据字典" style="width:100%">
                      <el-option v-for="(item, index) in dictOptions" :label="item.description" :value="item.type"
                        :key="index">
                      </el-option>
                    </el-select>
                  </el-col>
                </el-col>
              </template>
            </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>
      <table-form v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getData"></table-form>
    </basic-container>
  </div>
</template>
@@ -30,6 +104,11 @@
export default {
  data() {
    return {
      dictOptions: [],
      optionType: [],
      isExpandAll: false,
      // 重新渲染表格状态
      refreshTable: true,
      ajaxFun: fetchList,
      typeOptions: [],
      multipleSelection: [],
@@ -47,14 +126,16 @@
        border: true, // 是否有纵向边框
        lazy: false, // 是否需要懒加载
        fit: true, // 列的宽度是否自撑开
        multiSelect: true, //
        multiSelect: false, //
        seqNo: true,
        isShowHide: true, // 是否显示显影按钮
        isSearch: true, // 高级查询按钮
        isSearch: false, // 高级查询按钮
        defaultOrderBy: { column: 'createTime', direction: 'desc' }
      },
      table: {
        param: null,
        total: 0,
        code: null,
        currentPage: 1,
        pageSize: 20,
        data: [],
@@ -77,6 +158,24 @@
            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'
          },
          {
@@ -181,12 +280,98 @@
    ...mapGetters(['permissions'])
  },
  created() {
    this.getDictOptions()
    this.getParamType()
    this.getData()
  },
  methods: {
    // 获取所有字典
    getDictOptions() {
      fetchList(
        Object.assign({
          current: 1,
          size: 200
        })
      ).then((response) => {
        if (response.data.code === 0) {
          this.dictOptions = response.data.data.records
        }
      })
    },
    changeType(row) {
      if(row.type==='下拉选项'){
        row.isSelect=true
      }else{
        row.isSelect=false
      }
    },
    bianji(row) {
      if (!row.bianJi) {
        row.bianJi = true
        row.bianJiBtn = '保存'
      } else {
        row.bianJi = false
        row.isSelect=false
        row.bianJiBtn = '编辑'
      }
    },
    isExpandAllClick() {
      // console.log(1111);
      this.isExpandAll = !this.isExpandAll;
      this.$nextTick(() => {
        this.refreshTable = true;
      });
      // console.log(this.isExpandAll);
    },
    handlesCurrentChange() { },
    sizeChangeHandle() { },
    onSearch() { },
    // 获取数据列表
    getData() {
      this.$refs.paramTable.getDataList()
      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
        this.$nextTick(() => {
          let datas = JSON.parse(JSON.stringify(res.data.data.records))
          datas.forEach(l => {
            l.bianJi = false
            l.isSelect=false
            if (l.children.length < 1) {
              l.isBianji = true
              l.bianJiBtn = '编辑'
            } else {
              l.isBianji = false
              l.children.forEach(c => {
                c.isSelect=false
                c.bianji = false
                if (c.children.length < 1) {
                  c.isBianji = true
                  c.bianJiBtn = '编辑'
                } else {
                  l.isBianji = false
                  c.children.forEach(cc => {
                    cc.isSelect=false
                    cc.bianJi = false
                    cc.isBianji = true
                    cc.bianJiBtn = '编辑'
                  })
                }
              })
            }
          })
          console.log("test==>", datas);
          this.table.data = datas
          console.log(this.table.data);
        });
      })
    },
    // 新增 / 修改
    addOrUpdateHandle(row) {
@@ -200,6 +385,7 @@
      remote('technology_param').then((response) => {
        if (response.data.code === 0) {
          this.typeOptions = response.data.data
          this.optionType = response.data.data
        }
      })
    },
@@ -222,7 +408,7 @@
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(function() {
        .then(function () {
          return delObj(row.id)
        })
        .then((data) => {
@@ -233,3 +419,10 @@
  }
}
</script>
<style scoped>
table,
tr,
td {
  text-align: center;
}
</style>