haoxuan
2024-04-09 4bf10a1ba42ddaeab565c105b376c5732b0f3dab
src/views/systemSetting/workshopManage/index.vue
@@ -4,150 +4,217 @@
      <CommonSearch :show-add="false" :amount-view="false" placeholder="请输入关键词" @searchClick="onFilterSearch">
        <template slot="leftButton">
          <el-button size="small" type="primary" @click="addBtnClick" >新增</el-button>
          <!-- <el-button size="small" type="primary" @click="delBtnClick" >删除</el-button> -->
          <el-button size="small" type="primary" @click="saveBtnClick" >保存</el-button>
          |
          <!-- <el-button size="small" type="primary" @click="addBtnClick" >修改</el-button> -->
          <el-button size="small" type="primary" @click="refreshClick">刷新</el-button>
          <el-button size="small" type="primary" @click="printClick">打印</el-button>
        </template>
      </CommonSearch>
    </div>
    <div class="body-card">
      <!-- <div class="edit-save">
        <div class="edit-save-icon" @click="editSaveClick">
          <i :class="isEdit ? 'el-icon-unlock' : 'el-icon-lock'"></i>
        </div>
        <div class="edit-sace-label">{{ isEdit ? "锁定保存" : "界面设计" }}</div>
      </div> -->
      <div>
        <SilkTableList
          :detail-enter="isEdit"
          :silk-table-list="silkTableList"
          @inputContent="inputContent"
          @addProjectClick="addBtnClick"
          @clearupProject="clearupProject"
          @deleteClick="clearupProject"
          @addColumnClick="addColumnClick"
          @clearupColumn="clearupColumn"
        <TableCommonView
          :table-list="tableList"
          @selTableCol="selTableCol"
          @handleShow="handleShow"
          @tableRowClick="tableRowClick"
        >
        </SilkTableList>
          <template slot="tableButton">
            <el-table-column label="操作" width="180">
              <template slot-scope="scope">
                <el-button @click.stop="handleClick(scope.row, '查看')" type="text" size="small">查看</el-button>
                <el-button @click.stop="handleClick(scope.row, '修改')" type="text" size="small">修改</el-button>
                <el-button @click.stop="handleClick(scope.row, '删除')" type="text" size="small">删除</el-button>
              </template>
            </el-table-column>
          </template>
        </TableCommonView>
      </div>
    </div>
    <AddWorkshop
      ref="bomTypeDialog"
      @handleConfirmSave="handleConfirmSave"
      :workList="workList"
      title="添加节点类型"
    />
    <AddDataDictionaries
      :editDiaConfig="editConfig"
    />
  </div>
</template>
<script>
import SilkTableList from "@/views/systemSetting/workshopManage/components/silkTableList"
import AddDataDictionaries from "@/views/systemSetting/workshopManage/components/addDialog.vue"
import { getWorkshopManageList,deleteWorkshopManage } from "@/api/systemSetting/workshopManage"
import TableCommonView from '@/components/makepager/TableCommonView.vue'
import AddWorkshop from '@/views/systemSetting/workshopManage/components/addWorkshop.vue'
export default {
  name: "workshopManage",
  props: {},
  components: { SilkTableList },
  components: { TableCommonView,AddWorkshop,AddDataDictionaries },
  mixins: [],
  computed: {},
  data() {
    return {
      isEdit: false,
      silkTableList: {},
      tableData: [],
      tableList: {},
      showCol: ["车间", "组别", "开始车号", "结束车号", "半车标志", "备注"],
      tableColumn: [
        { label: "车间", prop: "projectName", projectName: true },
        { label: "组别", prop: "start", inputFloat: true },
        { label: "开始车号", prop: "end", inputFloat: true },
        { label: "结束车号", prop: "price1", inputFloat: true },
        { label: "半车标志", prop: "projectName", projectName: true },
        { label: "备注", prop: "price2", inputFloat: true },
        // { label: "车间", prop: "workshopNumber",iconRight:"el-icon-setting"},
        { label: "车间", prop: "workshopNumber",},
        { label: "组别", prop: "groupNumber", },
        { label: "开始车号", prop: "startCarNumber" },
        { label: "结束车号", prop: "endCarNumber" },
        { label: "半车标志", prop: "carFlag",isCallMethod: true, getCallMethod: this.getStatusCarFlag },
        { label: "备注", prop: "notes", },
      ],
      columnNum: 0,
      dataObj: {
        projectName: "",
        start: 0,
        end: 0,
        price1: 0,
        price2: 0,
        price3: 0
      }
      // 类型
      workList: [],
      getDataParams: {
        page: 1,
        pageSize: 10,
        keyWord: '',
      },
      editConfig:{
        visible:false,
        infomitton:{
          TabsIndex:0,
          workshopId:null,
        }
      },
    }
  },
  created() {
    this.setTableForm()
    this.setTable()
    this.getData()
  },
  methods: {
    setTableForm() {
      this.silkTableList = {
        tableData: this.tableData,
        isReturn: false,
        tableColumn: this.tableColumn
    setTable() {
      console.log(this.tableColumn,"看看")
      // top 明细单列表
      this.tableList = {
        selectIndex: true,
        tableInfomation: [],
        allcol: [],
        showcol: this.showCol,
        tableColumn: this.setColumnVisible(this.showCol, this.tableColumn)
      }
      this.setTableList(this.tableList)
    },
    setColumnVisible(showCol, tableColumn) {
      return tableColumn.map((ele) => {
        return {
          ...ele,
          isShowColumn: showCol.includes(ele.label)
        }
      })
    },
    setTableList(tableList) {
      tableList.allcol = tableList.tableColumn.filter((ele) => !ele.default).map((ele) => ele.label)
      this.searchOptions = []
      for (let i = 0; i < tableList.tableColumn.length; i++) {
        const label = tableList.tableColumn[i].label
        const value = tableList.tableColumn[i].prop
        this.searchOptions.push({ value: value, label: label })
      }
    },
    selTableCol(val) {
      this.showcol = val
      this.tableList.tableColumn = this.setColumnVisible(val, this.tableColumn)
    },
    // 表格行点击
    tableRowClick(row){
      console.log(row,"row")
    },
    // 搜索
    onFilterSearch(searchText) {
      console.log(searchText)
      console.log(searchText,"是啥")
      this.getDataParams.keyWord=searchText,
      this.getData()
    },
    // 新增
    addBtnClick() {
      if(this.isEdit){
        this.$message.warning("请先保存当前编辑")
      }else{
        this.isEdit = true
        // array.splice(index, 0, item)
        this.tableData.splice(0,0,{
          projectName: "",
          start: 0,
          end: 0,
          price1: 0,
          price2: 0,
          price3: 0,
          isAdd:true,
        })
      }
      this.editConfig.infomitton=[]
      this.editConfig.dialogTitle="新增"
      this.editConfig.visible=true
    },
    // 保存
    saveBtnClick(){
      this.tableData.forEach((item)=>{
        item.isAdd=false
      })
      this.isEdit = false
    },
    // 刷新
    refreshClick() {},
    // 打印
    printClick() {},
    // 列表输入回调
    inputContent(val, prop, row) {
      console.log(val, prop, row,"列表打印回调")
    },
    // 删除
    clearupProject(data, index) {
      console.log(data)
      this.tableData.splice(index, 1)
    delBtnClick(){},
    // 组别
    handleShow(item){
      console.log(item,"item")
      this.$refs.bomTypeDialog.editDialogVisible = true;
    },
    // 保存编辑按钮切换
    editSaveClick() {
      this.isEdit = !this.isEdit
    handleGetBomKindDictList() {
      // postGetBomKindDictList().then((res) => {
      //   this.workList = res.data;
      // });
    },
    // 添加列
    addColumnClick() {
      let propStr = "trends" + this.columnNum
      this.tableColumn.splice(2, 0, { label: "", prop: propStr, inputFloat: true, addColumn: true })
      this.$set(this.dataObj, propStr, 0)
      console.log(this.tableColumn)
      this.silkTableList.tableColumn = this.tableColumn
      this.columnNum += 1
    handleConfirmSave(data) {
      console.log(data,"data")
      // postSaveBomKindDict({ data: data }).then((res) => {
      //   if (res.code == 200) {
      //     this.$message({
      //       message: "操作成功!",
      //       type: "success",
      //     });
      //     this.$refs.bomTypeDialog.editDialogVisible = false;
      //     this.handleGetBomKindDictList();
      //   }
      // });
    },
    // 删除列
    clearupColumn(prop) {
      let currentIndex = 0
      this.tableColumn.map((item, index) => {
        if (item.prop == prop) {
          currentIndex = index
        }
    // 车间列表
    async getData() {
      await getWorkshopManageList({
        keyWord: this.getDataParams.keyWord,
        page: this.getDataParams.page,
        pageSize: this.getDataParams.pageSize,
      }).then((res) => {
        this.tableList.tableInfomation = res.data
      })
      this.tableColumn.splice(currentIndex, 1)
      this.silkTableList.tableColumn = this.tableColumn
      this.$delete(this.dataObj, prop)
    },
    getStatusCarFlag(val) {
      if (val) {
        return val == 1 ? '左半车' : val == 2 ? '右半车' : val == 3 ? '全车结束' : '--'
      } else {
        return "--";
      }
    },
    handleClick(row,type){
      console.log(row,"row")
      if(type==="查看"){
        this.editConfig.infomitton=row
        this.editConfig.infomitton.workshopId=row.ID
        this.editConfig.dialogTitle=type
        this.editConfig.visible=true
      }else if(type==="修改"){
        this.editConfig.infomitton=row
        this.editConfig.infomitton.workshopId=row.ID
        this.editConfig.dialogTitle=type
        this.editConfig.visible=true
      }else if(type==="删除"){
        this.$confirm(`确认删除${row.name}吗?`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          deleteWorkshopManage({id:row.ID}).then((res)=>{
            if(res&&res.code===200){
              this.getData()
              this.$message({
                type: 'success',
                message: '删除成功!'
              });
            }
          })
        })
      }
    }
  }
}
@@ -190,3 +257,4 @@
  }
}
</style>