入库管理ids的拼接

src/apis/holding1.js

@@ -0,0 +1,24 @@
+import axios from '../utils/request'
+// 第一层获取列表
+export const getList = (data) => {
+  return axios({
+    method: 'post',
+    url: '/cms/storageIn/list',
+    data
+  })
+}
+// 点击申请入库
+export const enterBank = () => {
+  return axios({
+    method: 'post',
+    url: '/cms/storageIn/add'
+  })
+}
+// 第二层获取藏品列表
+export const getListTow = (data) => {
+  return axios({
+    method: 'post',
+    url: '/cms/storageIn/goodsList',
+    data
+  })
+}

src/views/holding/holding1.vue

@@ -34,7 +34,7 @@
             >
             </el-date-picker>
             <el-button style="margin-left: 20px">查询</el-button>
-            <el-button type="primary">申请入库</el-button>
+            <el-button type="primary" @click="enterBank">申请入库</el-button>
           </div>
           <!--表格 -->
           <div class="table">
@@ -44,17 +44,17 @@
               border
               style="width: 100%"
             >
-              <el-table-column prop="date" label="入库编号" width="130">
+              <el-table-column prop="num" label="入库编号" width="180">
               </el-table-column>
-              <el-table-column prop="name" label="登记人" width="150">
+              <el-table-column prop="realName" label="登记人" width="150">
               </el-table-column>
-              <el-table-column prop="address" label="入库说明">
+              <el-table-column prop="reason" label="入库说明">
               </el-table-column>
-              <el-table-column prop="name" label="创建日期" width="130">
+              <el-table-column prop="createTime" label="创建日期" width="180">
               </el-table-column>
-              <el-table-column prop="name" label="完成日期" width="130">
+              <el-table-column prop="updateTime" label="完成日期" width="180">
               </el-table-column>
-              <el-table-column prop="name" label="状态" width="130">
+              <el-table-column prop="status" label="状态" width="130">
               </el-table-column>
               <el-table-column label="操作" width="195">
                 <template #default>
@@ -81,12 +81,21 @@
 </template>
 
 <script>
+import { getList, enterBank } from '@/apis/holding1'
 import TabList from '@/components/tabLeft.vue'
 export default {
   name: 'Holding1',
   components: { TabList },
   data () {
     return {
+      myData: {
+        endTime: '', // 结束时间
+        pageNum: 1, // 起始页码，默认1为第一页
+        pageSize: 10, // 每页数量
+        searchKey: '', // 搜索条件
+        startTime: '', // 开始时间
+        status: null // 状态，不传返回全部，0：草稿中， 1：待审核， 2：审核不通过， 3：审核通过,
+      },
       // 选择状态的变量
       stateInd: 0,
       stateArr: [
@@ -99,18 +108,7 @@ export default {
       type: '',
       time: '',
       // 表格数据
-      tableData: [
-        {
-          date: '2016-05-03',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        },
-        {
-          date: '2016-05-02',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        }
-      ]
+      tableData: []
     }
   },
   // 监听属性 类似于data概念
@@ -124,14 +122,33 @@ export default {
   },
   // 方法集合
   methods: {
+    // 点击申请入库
+    async enterBank () {
+      const res = await enterBank()
+      this.$router.push({
+        path: 'holding1_add',
+        query: res.data
+      })
+    },
+    // 封装获取列表方法
+    async getList (data) {
+      const res = await getList(data)
+      // console.log(666, res.data.list)
+      this.tableData = res.data.list
+      this.tableData.forEach(v => {
+        v.status = this.myState(v.status)
+        // v.updateTime = v.updateTime.slice(0, 10)
+        // v.createTime = v.createTime.slice(0, 10)
+      })
+    },
     // 时间处理----------------
     handleSelect (e) {
       const date = []
       for (const i in e) {
         date.push(this.gettime(e[i]))
       }
-      // this.myData.startTime = date[0]
-      // this.myData.endTime = date[1]
+      this.myData.startTime = date[0]
+      this.myData.endTime = date[1]
     },
     gettime (data) {
       const value = data.getFullYear() + '-' +
@@ -150,7 +167,9 @@ export default {
     }
   },
   // 生命周期 - 创建完成（可以访问当前this实例）
-  created () {},
+  created () {
+    this.getList(this.myData)
+  },
   // 生命周期 - 挂载完成（可以访问DOM元素）
   mounted () {
   },

src/views/holding/holding1_Dialog.vue

@@ -3,37 +3,42 @@
     <div class="query">
       <span>藏品名称：</span>
       <el-input
-        v-model="name"
+        v-model="myData.searchKey"
         placeholder="请输入"
         style="width: 280px; margin-right: 40px"
       ></el-input>
-      <el-button>查 询</el-button>
+      <el-button @click="search">查 询</el-button>
     </div>
     <!-- 表格 -->
     <el-table
+      @selection-change="handleSelectionChange"
       :header-cell-style="{ background: '#eef1f6', color: '#606266' }"
       :data="tableData"
       border
       style="width: 100%"
     >
+      <el-table-column type="selection" width="55"> </el-table-column>
       <el-table-column label="缩略图" width="140">
-        <template #default>
+        <template #default="{ row }">
           <div class="smimg">
-            <img src="../../assets/img/user.png" alt="" />
+            <img :src="baseURL + row.thumb" alt="" />
           </div>
         </template>
       </el-table-column>
-      <el-table-column prop="name" label="总登记号" width="180">
+      <el-table-column prop="registerNum" label="总登记号" width="180">
+      </el-table-column>
+      <el-table-column prop="name" label="藏品名称"> </el-table-column>
+      <el-table-column prop="goodsTypeName" label="类别" width="180">
       </el-table-column>
-      <el-table-column prop="address" label="藏品名称"> </el-table-column>
-      <el-table-column prop="name" label="类别" width="140"> </el-table-column>
     </el-table>
     <!-- 分页器 -->
     <div class="paging">
       <el-pagination
+        @current-change="currentChange"
+        @size-change="sizeChange"
         background
         layout="prev, pager, next,sizes,jumper"
-        :total="30"
+        :total="total"
       >
       </el-pagination>
     </div>
@@ -44,6 +49,8 @@
 </template>
 
 <script>
+import axios from '@/utils/request'
+import { getListTow } from '@/apis/holding1'
 export default {
   name: 'Holding0_Dialog',
   components: {},
@@ -51,24 +58,26 @@ export default {
     dialogFormVisible: {
       type: Boolean,
       default: false
+    },
+    bigId: {
+      type: Number
     }
   },
   data () {
     return {
-      name: '',
+      goodsIds: '',
+      // 表格数据的筛选
+      myData: {
+        pageNum: 1,
+        pageSize: 10,
+        searchKey: ''
+      },
+      // 分页器总数
+      total: 0,
+      // 服务器前缀地址
+      baseURL: '',
       // 表格数据
-      tableData: [
-        {
-          date: '2016-05-03',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        },
-        {
-          date: '2016-05-02',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        }
-      ]
+      tableData: []
     }
   },
   // 监听属性 类似于data概念
@@ -77,13 +86,60 @@ export default {
   watch: {},
   // 方法集合
   methods: {
+    // 分页器页码改变
+    currentChange (val) {
+      // console.log(val)
+      this.myData.pageNum = val
+      this.getListTow(this.myData)
+      this.$nextTick(() => {
+        // 所有dom加载完毕之后---要执行的代码
+        setTimeout(() => {
+          if (this.tableData.length === 0) {
+            this.myData.pageNum = 1
+            this.getListTow(this.myData)
+          }
+        }, 100)
+      })
+    },
+    // 每一页显示条数改变
+    sizeChange (val) {
+      // console.log(val)
+      this.myData.pageSize = val
+      this.getListTow(this.myData)
+    },
+    // 点击查询
+    search () {
+      this.getListTow(this.myData)
+    },
+    // 表格的多选
+    handleSelectionChange (rows) {
+      const temp = []
+      rows.forEach(v => {
+        temp.push(v.id)
+      })
+      const temp2 = new Set(temp)
+      this.goodsIds = [...temp2]
+      console.log(666, this.goodsIds)
+    },
     // 点击取消
     cancel () {
       this.$emit('update:dialogFormVisible', false)
+      this.myData.searchKey = ''
+    },
+    // 获取藏品列表---让父组件调用
+    async getListTow (data) {
+      const res = await getListTow(data)
+      // console.log(666, res)
+      this.tableData = res.data.list
+      this.total = res.data.total
     }
   },
-  created () {},
-  mounted () {},
+  created () {
+    // 获取服务器前缀地址
+    this.baseURL = axios.defaults.baseURL
+  },
+  mounted () {
+  },
   beforeCreate () {}, // 生命周期 - 创建之前
   beforeMount () {}, // 生命周期 - 挂载之前
   beforeUpdate () {}, // 生命周期 - 更新之前

src/views/holding/holding1_add.vue

@@ -9,7 +9,7 @@
           <el-breadcrumb-item to="">首页</el-breadcrumb-item>
           <el-breadcrumb-item to="">馆藏管理</el-breadcrumb-item>
           <el-breadcrumb-item>入库管理</el-breadcrumb-item>
-          <el-breadcrumb-item id="mytitle">编辑</el-breadcrumb-item>
+          <el-breadcrumb-item id="mytitle">新增</el-breadcrumb-item>
         </el-breadcrumb>
       </div>
       <div class="conten">
@@ -42,7 +42,7 @@
           <div class="title">
             <h3>藏品信息</h3>
             <div class="btn">
-              <el-button size="small" @click="isShow = true">添 加</el-button>
+              <el-button size="small" @click="addObject">添 加</el-button>
               <el-button size="small">删 除</el-button>
             </div>
           </div>
@@ -89,8 +89,8 @@
         </div>
       </div>
     </div>
-    <!-- 点击添加或者编辑出现弹窗 -->
-    <Holding1Dialog :dialogFormVisible.sync="isShow" />
+    <!-- 点击添加出现弹窗 -->
+    <Holding1Dialog :dialogFormVisible.sync="isShow" ref="myDialog" :bigId='mydata.id'/>
   </div>
 </template>
 
@@ -105,6 +105,7 @@ export default {
   },
   data () {
     return {
+      mydata: {},
       value: [],
       options: [{
         value: 'zhinan',
@@ -305,8 +306,8 @@ export default {
       isShow: false,
       // 表单数据
       fromData: {
-        number: 'DJ2021081701',
-        people: 'Admin',
+        number: '',
+        people: '',
         textarea: ''
       },
       // 表单验证
@@ -316,18 +317,7 @@ export default {
         textarea: [{ max: 255, message: '不能超过255个字符', trigger: 'blur' }]
       },
       // 表格数据
-      tableData: [
-        {
-          date: '2016-05-03',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        },
-        {
-          date: '2016-05-02',
-          name: '王小虎',
-          address: '上海市普陀区金沙江路 1518 弄'
-        }
-      ]
+      tableData: []
     }
   },
   // 监听属性 类似于data概念
@@ -336,16 +326,29 @@ export default {
   watch: {},
   // 方法集合
   methods: {
-
     // 多层选择器的事件
     handleChange (value) {
       console.log(value)
+    },
+    // 点击添加
+    addObject () {
+      // 调用子组件方法
+      this.$refs.myDialog.getListTow({ pageNum: 1, pageSize: 10 })
+      this.isShow = true
     }
+
   },
   // 生命周期 - 创建完成（可以访问当前this实例）
-  created () {},
+  created () {
+    // 从第一层拿到传过来的数据
+    this.mydata = this.$route.query
+    this.mydata.id = Number(this.mydata.id)
+    this.fromData.people = this.mydata.realName
+    this.fromData.number = this.mydata.num
+  },
   // 生命周期 - 挂载完成（可以访问DOM元素）
-  mounted () {},
+  mounted () {
+  },
   beforeCreate () {}, // 生命周期 - 创建之前
   beforeMount () {}, // 生命周期 - 挂载之前
   beforeUpdate () {}, // 生命周期 - 更新之前