等后端数据处理

src/views/holding/holding1_add.vue

@@ -71,12 +71,14 @@
               </el-table-column>
               <el-table-column prop="integrity" label="完残程度" width="130">
               </el-table-column>
-              <el-table-column label="藏品位置" width="230">
-                <template #default>
+              <el-table-column label="藏品位置" width="300">
+                <template #default='scopt'>
                   <el-cascader
-                    v-model="value"
+                    style="width:100%"
+                    :props="{value:'id',label:'name'}"
+                    v-model="tableData[scopt.$index].location"
                     :options="options"
-                    @change="handleChange"
+                    @change="handleChange($event,scopt.row.id)"
                   ></el-cascader>
                 </template>
               </el-table-column>
@@ -96,6 +98,7 @@
 </template>
 
 <script>
+import { getTreeList } from '@/apis/statistics0'
 import { holding1submit, getDetailById } from '@/apis/holding1'
 import axios from '@/utils/request'
 import TabList from '@/components/tabLeft.vue'
@@ -108,6 +111,8 @@ export default {
   },
   data () {
     return {
+      // 位置信息
+      location: {},
       // 传递给弹窗的表格数据，用来筛选
       myTemp: [],
       // 处理从子组件拿到的数据的id集合数组
@@ -115,202 +120,7 @@ export default {
       // 服务器前缀地址
       baseURL: '',
       mydata: {},
-      value: [],
-      options: [{
-        value: 'zhinan',
-        label: '指南',
-        children: [{
-          value: 'shejiyuanze',
-          label: '设计原则',
-          children: [{
-            value: 'yizhi',
-            label: '一致'
-          }, {
-            value: 'fankui',
-            label: '反馈'
-          }, {
-            value: 'xiaolv',
-            label: '效率'
-          }, {
-            value: 'kekong',
-            label: '可控'
-          }]
-        }, {
-          value: 'daohang',
-          label: '导航',
-          children: [{
-            value: 'cexiangdaohang',
-            label: '侧向导航'
-          }, {
-            value: 'dingbudaohang',
-            label: '顶部导航'
-          }]
-        }]
-      }, {
-        value: 'zujian',
-        label: '组件',
-        children: [{
-          value: 'basic',
-          label: 'Basic',
-          children: [{
-            value: 'layout',
-            label: 'Layout 布局'
-          }, {
-            value: 'color',
-            label: 'Color 色彩'
-          }, {
-            value: 'typography',
-            label: 'Typography 字体'
-          }, {
-            value: 'icon',
-            label: 'Icon 图标'
-          }, {
-            value: 'button',
-            label: 'Button 按钮'
-          }]
-        }, {
-          value: 'form',
-          label: 'Form',
-          children: [{
-            value: 'radio',
-            label: 'Radio 单选框'
-          }, {
-            value: 'checkbox',
-            label: 'Checkbox 多选框'
-          }, {
-            value: 'input',
-            label: 'Input 输入框'
-          }, {
-            value: 'input-number',
-            label: 'InputNumber 计数器'
-          }, {
-            value: 'select',
-            label: 'Select 选择器'
-          }, {
-            value: 'cascader',
-            label: 'Cascader 级联选择器'
-          }, {
-            value: 'switch',
-            label: 'Switch 开关'
-          }, {
-            value: 'slider',
-            label: 'Slider 滑块'
-          }, {
-            value: 'time-picker',
-            label: 'TimePicker 时间选择器'
-          }, {
-            value: 'date-picker',
-            label: 'DatePicker 日期选择器'
-          }, {
-            value: 'datetime-picker',
-            label: 'DateTimePicker 日期时间选择器'
-          }, {
-            value: 'upload',
-            label: 'Upload 上传'
-          }, {
-            value: 'rate',
-            label: 'Rate 评分'
-          }, {
-            value: 'form',
-            label: 'Form 表单'
-          }]
-        }, {
-          value: 'data',
-          label: 'Data',
-          children: [{
-            value: 'table',
-            label: 'Table 表格'
-          }, {
-            value: 'tag',
-            label: 'Tag 标签'
-          }, {
-            value: 'progress',
-            label: 'Progress 进度条'
-          }, {
-            value: 'tree',
-            label: 'Tree 树形控件'
-          }, {
-            value: 'pagination',
-            label: 'Pagination 分页'
-          }, {
-            value: 'badge',
-            label: 'Badge 标记'
-          }]
-        }, {
-          value: 'notice',
-          label: 'Notice',
-          children: [{
-            value: 'alert',
-            label: 'Alert 警告'
-          }, {
-            value: 'loading',
-            label: 'Loading 加载'
-          }, {
-            value: 'message',
-            label: 'Message 消息提示'
-          }, {
-            value: 'message-box',
-            label: 'MessageBox 弹框'
-          }, {
-            value: 'notification',
-            label: 'Notification 通知'
-          }]
-        }, {
-          value: 'navigation',
-          label: 'Navigation',
-          children: [{
-            value: 'menu',
-            label: 'NavMenu 导航菜单'
-          }, {
-            value: 'tabs',
-            label: 'Tabs 标签页'
-          }, {
-            value: 'breadcrumb',
-            label: 'Breadcrumb 面包屑'
-          }, {
-            value: 'dropdown',
-            label: 'Dropdown 下拉菜单'
-          }, {
-            value: 'steps',
-            label: 'Steps 步骤条'
-          }]
-        }, {
-          value: 'others',
-          label: 'Others',
-          children: [{
-            value: 'dialog',
-            label: 'Dialog 对话框'
-          }, {
-            value: 'tooltip',
-            label: 'Tooltip 文字提示'
-          }, {
-            value: 'popover',
-            label: 'Popover 弹出框'
-          }, {
-            value: 'card',
-            label: 'Card 卡片'
-          }, {
-            value: 'carousel',
-            label: 'Carousel 走马灯'
-          }, {
-            value: 'collapse',
-            label: 'Collapse 折叠面板'
-          }]
-        }]
-      }, {
-        value: 'ziyuan',
-        label: '资源',
-        children: [{
-          value: 'axure',
-          label: 'Axure Components'
-        }, {
-          value: 'sketch',
-          label: 'Sketch Templates'
-        }, {
-          value: 'jiaohu',
-          label: '组件交互文档'
-        }]
-      }],
+      options: [],
       // 控制弹出层显示隐藏
       isShow: false,
       // 表单数据
@@ -361,13 +171,17 @@ export default {
       // console.log(999, this.goodsIds)
       this.tableData = data
       this.tableData.forEach(v => {
-        if (v.integrity.length <= 1) v.integrity = this.spoil(v.integrity)
-        if (v.goodsTypeId.length <= 1) v.goodsTypeId = this.category(v.goodsTypeId)
+        v.integrity = this.spoil(v.integrity)
+        v.goodsTypeId = this.category(v.goodsTypeId)
+        if (v.storageId === '') v.location = ''
+        else v.location = [880, 881, 882]
       })
     },
     // 多层选择器的事件
-    handleChange (value) {
-      console.log(value)
+    handleChange (value, id) {
+      // console.log(999, id)
+      this.location[id] = value[2]
+      // console.log(999, this.location)
     },
     // 表格的多选
     handleSelectionChange (val) {
@@ -417,7 +231,7 @@ export default {
     },
     // 点击返回
     goBack () {
-      const obj = { description: this.fromData.textarea, goodsIds: this.goodsIds.join(','), id: this.mydata.id, status: null }
+      const obj = { description: this.fromData.textarea, goodsIds: this.goodsIds.join(','), id: this.mydata.id, status: null, location: this.location }
       this.$confirm('您需要保存这条数据吗?', '提示', {
         confirmButtonText: '保存',
         cancelButtonText: '放弃',
@@ -442,7 +256,7 @@ export default {
     // 点击提交
     async submit () {
       if (this.fromData.textarea.trim() === '') return this.$message.warning('入库说明不能为空')
-      const obj = { description: this.fromData.textarea, goodsIds: this.goodsIds.join(','), id: this.mydata.id, status: 1 }
+      const obj = { description: this.fromData.textarea, goodsIds: this.goodsIds.join(','), id: this.mydata.id, status: 1, location: this.location }
       await holding1submit(obj)
       this.$message.success('提交成功')
       this.$router.push('/layout/holding1')
@@ -461,6 +275,9 @@ export default {
   },
   // 生命周期 - 挂载完成（可以访问DOM元素）
   async mounted () {
+    // 获取位置信息
+    const res = await getTreeList()
+    this.options = res.data
     // 如果是编辑
     if (this.mydata.goodsIds) {
       // 通过id获取列表详情
@@ -469,8 +286,9 @@ export default {
       this.tableData.forEach(v => {
         v.integrity = this.spoil(v.integrity)
         v.goodsTypeId = this.category(v.goodsTypeId)
+        // 找到第三层的id回显
+        v.location = [880, 881, 882]
       })
-
       this.goodsIds = this.mydata.goodsIds.split(',')
     }
   },