From 3f24fbc89959ec4aa9f3308e1af453e43d504ac5 Mon Sep 17 00:00:00 2001
From: charles <981744753@qq.com>
Date: 星期三, 10 七月 2024 20:04:16 +0800
Subject: [PATCH] feat:完成车间管理部分的重构

---
 src/views/systemSetting/silkStandardSetting/index.vue |  396 +++++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 390 insertions(+), 6 deletions(-)

diff --git a/src/views/systemSetting/silkStandardSetting/index.vue b/src/views/systemSetting/silkStandardSetting/index.vue
index 7584acc..6ff2501 100644
--- a/src/views/systemSetting/silkStandardSetting/index.vue
+++ b/src/views/systemSetting/silkStandardSetting/index.vue
@@ -1,21 +1,405 @@
 <template>
-  <div class="container"></div>
+  <div class="silkStandardSetting-container">
+    <div class="filter-card">
+      <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="refreshClick">鍒锋柊</el-button>
+          <el-button size="small" type="primary" @click="printClick" disabled>鎵撳嵃</el-button>
+        </template>
+      </CommonSearch>
+    </div>
+    <div class="body-card">
+      <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>
+        <SilkTableList
+          :detail-enter="isEdit"
+          :silk-table-list="silkTableList"
+          @inputContent="inputContent"
+          @addProjectClick="addBtnClick"
+          :isEdit='isEdit'
+          @clearupProject="clearupProject"
+          @deleteClick="clearupProject"
+          @addColumnClick="addColumnClick"
+          @clearupColumn="clearupColumn"
+          @addColumnInputChange="addColumnInputChange"
+        >
+        </SilkTableList>
+      </div>
+    </div>
+  </div>
 </template>
 
 <script>
+import SilkTableList from "@/views/systemSetting/silkStandardSetting/components/silkTableList"
+import { getRankStandard, saveRankStandard } from "@/api/systemSetting/silkStandardSetting"
+import { getDataByType } from "@/api/data"
 export default {
   name: "silkStandardSetting",
   props: {},
-  components: {},
+  components: { SilkTableList },
   mixins: [],
   computed: {},
   data() {
-    return {}
+    return {
+      isEdit: false,
+      silkTableList: {},
+      tableData: [],
+      defaultColumn: [
+        {
+          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 }
+      ],
+      tableColumn: [],
+      dataObj: {
+        checkItem: 1,
+        startFineness: 0,
+        endFineness: 0,
+        rankA: 0,
+        rankB: 0,
+        rankC: 0
+      },
+      projectOptions: getDataByType("projectOptions"),
+      rankObj: {},
+      columnInputList: [],
+      dynamicsRanks: [],
+    }
   },
-  created() {},
-  methods: {}
+  created() {
+    this.setTableForm()
+    this.getData()
+  },
+  methods: {
+    // 鑾峰彇鏁版嵁
+    getData() {
+      getRankStandard().then((res) => {
+        console.log(res)
+        if (res.code === 200) {
+          if (res.data.length > 0) {
+            this.tableData = []
+            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)
+          }
+        }
+      })
+    },
+    // 鏁翠綋鏁版嵁澶勭悊
+    allDataProcess(dataList) {
+      let rankList = dataList.map((ite) => {
+        for (let i = 0; i < ite.dynamicsRanks.length; i++) {
+          this.$set(this.rankObj, ite.dynamicsRanks[i].rankProp, ite.dynamicsRanks[i].rankValue)
+          this.$set(this.dataObj, ite.dynamicsRanks[i].rankProp, 0)
+        }
+        return {
+          ...ite,
+          ...this.rankObj
+        }
+      })
+      this.tableData = rankList || []
+      this.silkTableList.tableData = this.tableData
+    },
+    // 鍒椾俊鎭暟鎹鐞�
+    columnDataProcess(data) {
+      this.columnInputList = data.map((ite) => {
+        return { ...ite }
+      })
+      let list = data.map((item) => {
+        return {
+          label: item.rankName,
+          prop: item.rankProp,
+          inputFloat: true
+        }
+      })
+      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(currentIndex+j, 0, list[j])
+      }
+      this.silkTableList.tableColumn = this.tableColumn
+    },
+    setTableForm() {
+      this.silkTableList = {
+        tableData: this.tableData,
+        isReturn: false,
+        tableColumn: [
+          { 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) {
+      console.log(searchText)
+    },
+    // 鏂板
+    addBtnClick() {
+      console.log(this.silkTableList.tableData,'===1')
+      console.log(this.tableData,'===2')
+      if(this.isEdit){
+        this.silkTableList.tableData.push({
+          projectName: "",
+          start: 0,
+          end: 0,
+          price1: 0,
+          price2: 0,
+          price3: 0
+        })
+        this.tableData=this.silkTableList.tableData
+      }else{
+        this.$message.error('璇峰厛瑙i攣鍐嶆柊澧烇紒')
+      }
+      
+    },
+    // 鍒锋柊
+    refreshClick() {
+      this.getData()
+    },
+    // 鎵撳嵃
+    printClick() {},
+    // 鍒楄〃杈撳叆鍥炶皟
+    inputContent(val, prop, scope) {
+      console.log(val, prop, scope)
+      let list = this.tableData.map((item, index) => {
+        let dynamicsRanks = this.columnInputList.map((ite) => {
+          if (ite.rankProp == prop) {
+            ite.rankValue = val
+          }
+          return {
+            ...ite
+          }
+        })
+        if (index === scope.$index) {
+          item[prop] = val
+          item.dynamicsRanks = dynamicsRanks
+        }
+        return {
+          ...item
+        }
+      })
+      console.log(list)
+      this.tableData = list
+    },
+    // 鍒犻櫎
+    clearupProject(data, index) {
+        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(tableData)
+        saveRankStandard({
+          rankStandard: params
+        }).then((res) => {
+          if (res.code == 200) {
+            this.$message.success("淇濆瓨鎴愬姛")
+            this.getData()
+          }
+        })
+      }
+    },
+    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,
+          endFineness: item.endFineness,
+          lineId: item.lineId || "",
+          rankA: item.rankA,
+          rankB: item.rankB,
+          rankC: item.rankC,
+          startFineness: item.startFineness
+        }
+      })
+      return saveList
+    },
+    // 娣诲姞鍒�
+    addColumnClick() {
+      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)
+      this.columnInputList.push({ rankProp: propStr, rankName: "", rankValue: 0 })
+      this.silkTableList.tableColumn = this.tableColumn
+      let allList = this.tableData.map((item) => {
+        return {
+          ...item,
+          [propStr]: 0
+        }
+      })
+      this.tableData = allList
+      this.silkTableList.tableData = allList
+      this.$forceUpdate()
+    },
+    // 鍒犻櫎鍒�
+    clearupColumn(prop) {
+      let currentIndex = 0
+      this.tableColumn.map((item, index) => {
+        if (item.prop == 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) {
+      this.columnInputList.forEach((item) => {
+        if (item.rankProp == prop) {
+          item.rankName = val
+        }
+      })
+    },
+    getCheckItemName(val) {
+      if (val) {
+        for (let i in this.projectOptions) {
+          if (this.projectOptions[i].id == val) {
+            return this.projectOptions[i].value
+          }
+        }
+      } else {
+        return "--"
+      }
+    }
+  }
 }
 </script>
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.silkStandardSetting-container {
+  height: 100%;
+  .filter-card {
+    margin: 20px 30px;
+    height: 80px;
+    display: flex;
+    align-items: center;
+    padding: 0 20px 0 20px;
+    border-radius: 4px;
+    background-color: #fff;
+  }
+  .body-card {
+    margin: 0 30px;
+    background-color: #fff;
+    padding: 10px 15px;
+    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;
+      }
+      .edit-sace-label {
+        margin-left: 10px;
+        font-size: 14px;
+        color: #000000d8;
+      }
+    }
+  }
+}
+</style>

--
Gitblit v1.8.0