| | |
| | | </CommonSearch> |
| | | </div> |
| | | <div class="body-card"> |
| | | <div class="edit-save"> |
| | | <div class="edit-save-icon" @click="editSaveClick"> |
| | | <div class="edit-save" @click="editSaveClick"> |
| | | <div class="edit-save-icon"> |
| | | <i :class="isEdit ? 'el-icon-unlock' : 'el-icon-lock'"></i> |
| | | </div> |
| | | <div class="edit-sace-label">{{ isEdit ? "锁定保存" : "界面设计" }}</div> |
| | | </div> |
| | | <div> |
| | | 111:{{ this.silkTableList.tableData }} |
| | | <SilkTableList |
| | | :detail-enter="isEdit" |
| | | :silk-table-list="silkTableList" |
| | | @inputContent="inputContent" |
| | | @addProjectClick="addBtnClick" |
| | | :isEdit='isEdit' |
| | | @clearupProject="clearupProject" |
| | | @deleteClick="clearupProject" |
| | | @addColumnClick="addColumnClick" |
| | |
| | | prop: "checkItem", |
| | | projectName: true, |
| | | isCallMethod: true, |
| | | getCallMethod: this.getCheckItemName |
| | | getCallMethod: this.getCheckItemName, |
| | | }, |
| | | { label: "开始纤度", prop: "startFineness", inputFloat: true }, |
| | | { label: "结束纤度", prop: "endFineness", inputFloat: true }, |
| | |
| | | { label: "特野", prop: "rankC", inputFloat: true } |
| | | ], |
| | | tableColumn: [], |
| | | columnNum: 0, |
| | | dataObj: { |
| | | checkItem: 1, |
| | | startFineness: 0, |
| | |
| | | if (res.code === 200) { |
| | | if (res.data.length > 0) { |
| | | this.tableData = [] |
| | | this.tableColumn = this.defaultColumn |
| | | this.tableColumn = [ |
| | | { |
| | | label: "检查项目名称", |
| | | prop: "checkItem", |
| | | projectName: true, |
| | | isCallMethod: true, |
| | | getCallMethod: this.getCheckItemName, |
| | | }, |
| | | { label: "开始纤度", prop: "startFineness", inputFloat: true }, |
| | | { label: "结束纤度", prop: "endFineness", inputFloat: true }, |
| | | { label: "野纤", prop: "rankA", inputFloat: true }, |
| | | { label: "大野", prop: "rankB", inputFloat: true }, |
| | | { label: "特野", prop: "rankC", inputFloat: true } |
| | | ] |
| | | // this.tableColumn=this.defaultColumn |
| | | this.columnDataProcess(res.data[0].dynamicsRanks) |
| | | this.rankObj = {} |
| | | this.allDataProcess(res.data) |
| | |
| | | inputFloat: true |
| | | } |
| | | }) |
| | | this.columnNum = list.length + 1 |
| | | let currentIndex=0 |
| | | this.tableColumn.map((item, index) => { |
| | | if (item.prop == 'rankA') { |
| | | currentIndex = index |
| | | } |
| | | }) |
| | | for (let j = 0; j < list.length; j++) { |
| | | this.tableColumn.splice(2, 0, list[j]) |
| | | this.tableColumn.splice(currentIndex+j, 0, list[j]) |
| | | } |
| | | console.log(this.tableColumn) |
| | | this.silkTableList.tableColumn = this.tableColumn |
| | | }, |
| | | setTableForm() { |
| | |
| | | tableData: this.tableData, |
| | | isReturn: false, |
| | | tableColumn: [ |
| | | { label: "检查项目名称", prop: "projectName", projectName: true }, |
| | | { label: "开始纤度", prop: "start", inputFloat: true }, |
| | | { label: "结束纤度", prop: "end", inputFloat: true }, |
| | | { label: "野纤", prop: "price1", inputFloat: true }, |
| | | { label: "大野", prop: "price2", inputFloat: true }, |
| | | { label: "特野", prop: "price3", inputFloat: true } |
| | | { label: "检查项目名称", prop: "checkItem", projectName: true }, |
| | | { label: "开始纤度", prop: "startFineness", inputFloat: true }, |
| | | { label: "结束纤度", prop: "endFineness", inputFloat: true }, |
| | | { label: "野纤", prop: "rankA", inputFloat: true }, |
| | | { label: "大野", prop: "rankB", inputFloat: true }, |
| | | { label: "特野", prop: "rankC", inputFloat: true } |
| | | ] |
| | | } |
| | | this.tableColumn=this.silkTableList.tableColumn |
| | | }, |
| | | // 搜索 |
| | | onFilterSearch(searchText) { |
| | |
| | | }, |
| | | // 新增 |
| | | addBtnClick() { |
| | | console.log(this.silkTableList.tableData,'===1') |
| | | console.log(this.tableData,'===2') |
| | | if(this.isEdit){ |
| | | this.tableData.push({ |
| | | this.silkTableList.tableData.push({ |
| | | projectName: "", |
| | | start: 0, |
| | | end: 0, |
| | |
| | | price2: 0, |
| | | price3: 0 |
| | | }) |
| | | this.tableData=this.silkTableList.tableData |
| | | }else{ |
| | | this.$message.error('请先解锁再新增!') |
| | | } |
| | |
| | | }, |
| | | // 删除 |
| | | clearupProject(data, index) { |
| | | console.log(data) |
| | | this.tableData.splice(index, 1) |
| | | this.$confirm('确定要删除吗, 是否继续?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | this.tableData.splice(index, 1) |
| | | this.silkTableList.tableData=this.tableData |
| | | }).catch(() => { |
| | | }); |
| | | }, |
| | | // 保存编辑按钮切换 |
| | | editSaveClick() { |
| | | let isOk=false; |
| | | this.silkTableList.tableColumn.map((item)=>{ |
| | | if(!item.label||!item.prop){ |
| | | isOk=true |
| | | } |
| | | }) |
| | | if(isOk){ |
| | | this.$message.error('请先填写完成表头!') |
| | | return true; |
| | | } |
| | | this.isEdit = !this.isEdit |
| | | this.silkTableList.tableData.map((item)=>{ |
| | | item.addColumn=false; |
| | | }) |
| | | |
| | | let tableData=JSON.parse( |
| | | JSON.stringify(this.silkTableList.tableData) |
| | | ); |
| | | // if(tableData.length==0&&!this.isEdit){ |
| | | // this.$message.error('请先新增再保存!') |
| | | // return true; |
| | | // } |
| | | if (!this.isEdit) { |
| | | let params = this.saveParam() |
| | | let params = this.saveParam(tableData) |
| | | saveRankStandard({ |
| | | rankStandard: params |
| | | }).then((res) => { |
| | | console.log(res) |
| | | if (res.code == 200) { |
| | | this.$message.success("保存成功") |
| | | this.getData() |
| | |
| | | }) |
| | | } |
| | | }, |
| | | saveParam() { |
| | | let saveList = this.tableData.map((item) => { |
| | | saveParam(tableData) { |
| | | for(let i in tableData){ |
| | | tableData[i].dynamicsRanks=[] |
| | | for(let j in this.columnInputList){ |
| | | tableData[i].dynamicsRanks.push({ |
| | | rankName:this.columnInputList[j].rankName, |
| | | rankProp:this.columnInputList[j].rankProp, |
| | | rankValue:tableData[i][this.columnInputList[j].rankProp] |
| | | }) |
| | | } |
| | | } |
| | | let saveList = tableData.map((item) => { |
| | | return { |
| | | checkItem: item.checkItem, |
| | | dynamicsRanks: item.dynamicsRanks, |
| | |
| | | }, |
| | | // 添加列 |
| | | addColumnClick() { |
| | | let propStr = "prop" + this.columnNum |
| | | this.tableColumn.splice(2, 0, { label: "", prop: propStr, inputFloat: true, addColumn: true }) |
| | | let currentIndex=0 |
| | | this.tableColumn.map((item, index) => { |
| | | if (item.prop == 'rankA') { |
| | | currentIndex = index |
| | | } |
| | | }) |
| | | let num=0 |
| | | if(this.tableColumn.length>0){ |
| | | if(this.tableColumn[Number(currentIndex)-1].prop.indexOf('prop')!=-1){ |
| | | num=this.tableColumn[Number(currentIndex)-1].prop.slice(4) |
| | | } |
| | | } |
| | | let propStr = "prop" + (Number(num)+1) |
| | | |
| | | this.tableColumn.splice(currentIndex, 0, { label: "", prop: propStr, inputFloat: true, addColumn: true }) |
| | | this.$set(this.dataObj, propStr, 0) |
| | | this.$set(this.rankObj, propStr, 0) |
| | | console.log(this.columnInputList) |
| | | this.columnInputList.push({ rankProp: propStr, rankName: "", rankValue: 0 }) |
| | | console.log(this.tableColumn, this.dataObj, "32323", this.columnInputList) |
| | | this.silkTableList.tableColumn = this.tableColumn |
| | | this.columnNum += 1 |
| | | let allList = this.tableData.map((item) => { |
| | | return { |
| | | ...item, |
| | |
| | | }) |
| | | this.tableData = allList |
| | | this.silkTableList.tableData = allList |
| | | this.$forceUpdate() |
| | | }, |
| | | // 删除列 |
| | | clearupColumn(prop) { |
| | |
| | | currentIndex = index |
| | | } |
| | | }) |
| | | let columnInputIndex=0 |
| | | this.columnInputList.forEach((item,index) => { |
| | | if (item.rankProp == prop) { |
| | | columnInputIndex = index |
| | | } |
| | | }) |
| | | this.columnInputList.splice(columnInputIndex,1) |
| | | this.tableColumn.splice(currentIndex, 1) |
| | | this.silkTableList.tableColumn = this.tableColumn |
| | | this.$delete(this.dataObj, prop) |
| | | }, |
| | | // 列表头输入回调 |
| | | addColumnInputChange(val, prop) { |
| | | console.log(val, prop, this.columnInputList) |
| | | this.columnInputList.forEach((item) => { |
| | | if (item.rankProp == prop) { |
| | | item.rankName = val |
| | | } |
| | | }) |
| | | console.log(this.columnInputList, "888") |
| | | }, |
| | | getCheckItemName(val) { |
| | | if (val) { |
| | |
| | | height: calc(100% - 180px); |
| | | border-radius: 4px; |
| | | .edit-save { |
| | | width:100px; |
| | | padding:0 10px; |
| | | display: flex; |
| | | align-items: center; |
| | | margin-bottom: 10px; |
| | | cursor: pointer; |
| | | .edit-save-icon { |
| | | font-size: 24px; |
| | | color: #5582f3; |
| | | cursor: pointer; |
| | | } |
| | | .edit-sace-label { |
| | | margin-left: 10px; |