入库单管理明细

src/types/components.d.ts

@@ -55,12 +55,15 @@ declare module 'vue' {
     ElSlider: typeof import('element-plus/es')['ElSlider']
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
     ElSwitch: typeof import('element-plus/es')['ElSwitch']
+    ElTable: typeof import('element-plus/es')['ElTable']
+    ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
     ElTag: typeof import('element-plus/es')['ElTag']
     ElText: typeof import('element-plus/es')['ElText']
     ElTimeline: typeof import('element-plus/es')['ElTimeline']
     ElTimelineItem: typeof import('element-plus/es')['ElTimelineItem']
     ElTooltip: typeof import('element-plus/es')['ElTooltip']
     ElTree: typeof import('element-plus/es')['ElTree']
+    ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
     ElUpload: typeof import('element-plus/es')['ElUpload']
     ExcelEditor: typeof import('./../components/ExcelEditor/index.vue')['default']
     FileUpload: typeof import('./../components/FileUpload/index.vue')['default']

src/views/comprehensiveGuarantee/MaterialReserveManagement/InboundDetails.vue

@@ -1,239 +1,3 @@
-<!--&lt;!&ndash;库存明细&ndash;&gt;-->
-<!--&lt;!&ndash;企业画像&ndash;&gt;-->
-<!--<template>-->
-<!--  <div>-->
-<!--    <div v-show="!BussinessAddState.show && !BussinessEditState.show" class="app-container">-->
-<!--      <div>-->
-<!--        <transition name="fade">-->
-<!--          <div v-show="showSearch" class="mb-[10px]">-->
-<!--            <el-form ref="queryFormRef" :model="queryParams" :inline="true">-->
-<!--              <el-form-item :span="5" label="商品信息：" prop="area_code" label-width="auto">-->
-<!--                <el-input v-model="queryParams.keyword1" placeholder="请输入物资ID" clearable @keyup.enter="handleQuery" />-->
-<!--              </el-form-item>-->
-<!--              <el-form-item :span="5" label="出入库单号：" prop="keyword" label-width="auto">-->
-<!--                <el-input v-model="queryParams.keyword2" placeholder="请输入出入库单号" clearable @keyup.enter="handleQuery" />-->
-<!--              </el-form-item>-->
-<!--              <el-form-item :span="5" prop="keyword" label-width="auto">-->
-<!--                <el-select v-model="queryParams.type" placeholder="全部" clearable>-->
-<!--                  <el-option v-for="item in type" :key="item.value" :label="item.label" :value="item.value"></el-option>-->
-<!--                </el-select>-->
-<!--              </el-form-item>-->
-<!--              <el-form-item>-->
-<!--                <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>-->
-<!--              </el-form-item>-->
-<!--              <el-form-item>-->
-<!--                <el-button icon="Refresh" @click="resetQuery">重置</el-button>-->
-<!--              </el-form-item>-->
-<!--            </el-form>-->
-<!--            &lt;!&ndash;            <el-row :gutter="10" class="mb8">&ndash;&gt;-->
-<!--            &lt;!&ndash;              <el-col :span="1.5">&ndash;&gt;-->
-<!--            &lt;!&ndash;                <el-button type="primary" icon="Plus" @click="handleAdd">新建</el-button>&ndash;&gt;-->
-<!--            &lt;!&ndash;              </el-col>&ndash;&gt;-->
-<!--            &lt;!&ndash;              <el-col :span="1.5">&ndash;&gt;-->
-<!--            &lt;!&ndash;                <el-button type="danger" plain :disabled="multiple" icon="Delete" @click="handleDelete(selectedRow)"> 删除 </el-button>&ndash;&gt;-->
-<!--            &lt;!&ndash;              </el-col>&ndash;&gt;-->
-<!--            &lt;!&ndash;            </el-row>&ndash;&gt;-->
-<!--          </div>-->
-<!--        </transition>-->
-<!--        <el-table-->
-<!--          ref="multipleTable"-->
-<!--          v-loading="loading"-->
-<!--          :data="tableData"-->
-<!--          border-->
-<!--          :max-height="maxHeight"-->
-<!--          style="width: 96%"-->
-<!--          @selection-change="handleSelectionChange"-->
-<!--        >-->
-<!--          <el-table-column type="selection" width="55" align="center" fixed />-->
-<!--          <el-table-column label="商品信息" align="center" prop="goods_information" fixed show-overflow-tooltip />-->
-<!--          <el-table-column label="出入库单号" align="center" prop="odd_numbers" show-overflow-tooltip />-->
-<!--          <el-table-column label="入库/出库" align="center" prop="type" show-overflow-tooltip />-->
-<!--          <el-table-column label="变动库存" align="center" prop="change_inventory" show-overflow-tooltip />-->
-<!--          <el-table-column label="剩余库存" align="center" prop="remaining_inventory" show-overflow-tooltip />-->
-<!--          <el-table-column label="创建时间" align="center" prop="created_time" show-overflow-tooltip />-->
-<!--          &lt;!&ndash;          <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">&ndash;&gt;-->
-<!--          &lt;!&ndash;            <template #default="scope">&ndash;&gt;-->
-<!--          &lt;!&ndash;              <el-button type="text" class="common-btn-text-primary" @click="handleedit(scope.row)">编辑</el-button>&ndash;&gt;-->
-<!--          &lt;!&ndash;              <el-button type="text" class="common-btn-text-primary" @click="handleDelete(scope.row)">移除</el-button>&ndash;&gt;-->
-<!--          &lt;!&ndash;            </template>&ndash;&gt;-->
-<!--          &lt;!&ndash;          </el-table-column>&ndash;&gt;-->
-<!--        </el-table>-->
-<!--        <pagination v-show="total > 0" v-model:page="queryParams.page" v-model:limit="queryParams.pageSize" :total="total" @pagination="tableData" />-->
-<!--      </div>-->
-<!--    </div>-->
-<!--    <BussinessAdd v-if="BussinessAddState.show" @close="handleCancel" />-->
-<!--    <BussinessEdit v-if="BussinessEditState.show" :event-id="BussinessEditState.eventId" @close="handleCancel" />-->
-<!--  </div>-->
-<!--</template>-->
-
-<!--<script setup lang="ts">-->
-<!--import { ref, reactive, onMounted, onBeforeUnmount } from 'vue';-->
-<!--import { companyDelete, getCompanyList } from '@/api/riskPrevention/BusinessPortraits';-->
-<!--import BussinessAdd from '@/views/riskPrevention/SafetyProductionManagement/BussinessAdd.vue';-->
-<!--// import BussinessEdit from "./BussinessEdit.vue";-->
-<!--import { to } from 'await-to-js';-->
-
-<!--const { proxy } = getCurrentInstance() as ComponentInternalInstance;-->
-<!--const showSearch = ref(true);-->
-<!--// const tableData = ref();-->
-<!--const multiple = ref(true);-->
-<!--const ids = ref<Array<number | string>>([]);-->
-<!--const single = ref(true);-->
-<!--// 定义响应式变量-->
-<!--const loading = ref(false);-->
-<!--const maxHeight = ref(window.innerHeight * 0.8);-->
-<!--const total = ref();-->
-<!--// 处理窗口大小变化-->
-<!--const handleResize = () => {-->
-<!--  maxHeight.value = window.innerHeight * 0.8;-->
-<!--};-->
-<!--const initFormData = reactive({-->
-<!--  goods_information: '',-->
-<!--  odd_numbers: '',-->
-<!--  type: '',-->
-<!--  change_inventory: '',-->
-<!--  remaining_inventory: '',-->
-<!--  created_time: ''-->
-<!--});-->
-<!--const data = reactive({-->
-<!--  form: { ...initFormData },-->
-<!--  queryParams: {-->
-<!--    page: '1',-->
-<!--    pageSize: '10',-->
-<!--    type: '',-->
-<!--    keycode1: '',-->
-<!--    keyword2: ''-->
-<!--  },-->
-<!--  selectedRow: null,-->
-<!--  selectedRowKeys: []-->
-<!--});-->
-<!--const tableData = ref([-->
-<!--  {-->
-<!--    'goods_information': '苹果 iPhone 13 Pro Max 256GB 石墨色',-->
-<!--    'odd_numbers': 'WH20230401001',-->
-<!--    'type': '入库',-->
-<!--    'change_inventory': 50,-->
-<!--    'remaining_inventory': 200,-->
-<!--    'created_time': '2023-04-01T10:30:00Z'-->
-<!--  },-->
-<!--  {-->
-<!--    'goods_information': '华为 MateBook X Pro 笔记本电脑',-->
-<!--    'odd_numbers': 'WH20230401002',-->
-<!--    'type': '出库',-->
-<!--    'change_inventory': -10,-->
-<!--    'remaining_inventory': 190,-->
-<!--    'created_time': '2023-04-01T11:15:00Z'-->
-<!--  },-->
-<!--  {-->
-<!--    'goods_information': '小米 Redmi Note 11 Pro+ 5G 手机',-->
-<!--    'odd_numbers': 'WH20230401003',-->
-<!--    'type': '入库',-->
-<!--    'change_inventory': 30,-->
-<!--    'remaining_inventory': 150,-->
-<!--    'created_time': '2023-04-01T13:45:00Z'-->
-<!--  },-->
-<!--  {-->
-<!--    'goods_information': '三星 Galaxy S22 Ultra 5G 手机',-->
-<!--    'odd_numbers': 'WH20230401004',-->
-<!--    'type': '出库',-->
-<!--    'change_inventory': -5,-->
-<!--    'remaining_inventory': 55,-->
-<!--    'created_time': '2023-04-01T15:00:00Z'-->
-<!--  },-->
-<!--  {-->
-<!--    'goods_information': '戴尔 XPS 13 9310 笔记本电脑',-->
-<!--    'odd_numbers': 'WH20230402001',-->
-<!--    'type': '入库',-->
-<!--    'change_inventory': 15,-->
-<!--    'remaining_inventory': 30,-->
-<!--    'created_time': '2023-04-02T09:00:00Z'-->
-<!--  }-->
-<!--]);-->
-
-<!--const { queryParams, form } = toRefs(data);-->
-
-<!--const type = [-->
-<!--  { value: '', label: '全部' },-->
-<!--  { value: '0', label: '出库' },-->
-<!--  { value: '1', label: '入库' }-->
-<!--];-->
-
-<!--const handleQuery = () => {-->
-<!--  queryParams.value.page = 1;-->
-<!--  // fetchWorkrData();-->
-<!--};-->
-<!--const resetQuery = () => {-->
-<!--  queryParams.value = { page: 1, pageSize: 10, area_code: '', keycode: '' };-->
-<!--  handleQuery();-->
-<!--};-->
-<!--const BussinessAddState = reactive({-->
-<!--  show: false // 初始化show为false-->
-<!--});-->
-
-<!--const BussinessEditState = reactive({-->
-<!--  show: false-->
-<!--});-->
-
-<!--const handleAdd = () => {-->
-<!--  BussinessAddState.show = true;-->
-<!--};-->
-
-<!--const handleDelete = async (row) => {-->
-<!--  let id = [];-->
-<!--  if (row) {-->
-<!--    id = [row.id];-->
-<!--  } else {-->
-<!--    id = ids.value;-->
-<!--  }-->
-<!--  const [err] = await to(proxy?.$modal.confirm('是否确认删除选择的数据项？') as any);-->
-<!--  if (!err) {-->
-<!--    await companyDelete(id);-->
-<!--    proxy.$modal.msgSuccess('删除成功');-->
-<!--    fetchWorkrData();-->
-<!--  }-->
-<!--};-->
-<!--const handleedit = (row) => {-->
-<!--  BussinessEditState.eventId = row.id + '';-->
-<!--  BussinessEditState.show = true;-->
-<!--};-->
-
-<!--const handleCancel = () => {-->
-<!--  BussinessAddState.show = false;-->
-<!--  BussinessEditState.show = false;-->
-<!--};-->
-
-<!--const fetchWorkrData = () => {-->
-<!--  // loading.value = true;-->
-<!--  // getCompanyList(queryParams.value)-->
-<!--  //   .then((res) => {-->
-<!--  //     tableData.value = res.data;-->
-<!--  //     total.value = res.total;-->
-<!--  //   })-->
-<!--  //   .finally(() => {-->
-<!--  //     loading.value = false;-->
-<!--  //   });-->
-<!--};-->
-
-<!--const handleSelectionChange = (selection) => {-->
-<!--  ids.value = selection.map((item) => item.id);-->
-<!--  selectedRow.value = selection.length === 1 ? selection[0] : null;-->
-<!--  single.value = selection.length != 1;-->
-<!--  multiple.value = !selection.length;-->
-<!--};-->
-
-<!--onMounted(() => {-->
-<!--  window.addEventListener('resize', handleResize);-->
-<!--  fetchWorkrData();-->
-<!--});-->
-
-<!--// 在组件卸载前移除窗口大小变化监听器-->
-<!--onBeforeUnmount(() => {-->
-<!--  window.removeEventListener('resize', handleResize);-->
-<!--});-->
-<!--</script>-->
-
-<!--<style lang="scss" scoped></style>-->
-
 <template>
   <div class="common-dialog">
     <div class="common-dialog-content">

src/views/comprehensiveGuarantee/MaterialReserveManagement/InboundManagement.vue

@@ -46,7 +46,7 @@
           <el-table-column label="操作" align="center" fixed="right" width="88" class-name="small-padding fixed-width">
               <template #default="scope">
                 <el-button type="text" class="common-btn-text-primary" @click="handleWrite(scope.row)">查看</el-button>
-                <el-button type="text" class="common-btn-text-primary" @click="handleView">明细</el-button>
+                <el-button type="text" class="common-btn-text-primary" @click="goToInventory(scope.row.inbound_order_number)">明细</el-button>
               </template>
           </el-table-column>
         </el-table>
@@ -69,6 +69,8 @@ import InboundDetails from "./InboundDetails.vue";
 import { ref, reactive, onMounted, onBeforeUnmount, toRefs } from 'vue';
 import { getWarehousingEntry } from '@/api/comprehensiveGuarantee/materialReserveManagement/InboundManagement';
 import { parseTime } from '@/utils/ruoyi';
+import InventoryDetails from '@/views/comprehensiveGuarantee/MaterialReserveManagement/InventoryDetails.vue';
+import router from '@/router';
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const { sys_store_type, sys_yes_no } = toRefs<any>(proxy?.useDict('sys_store_type','sys_yes_no'));
@@ -99,6 +101,10 @@ const getListData = () => {
   })
 }
 
+const goToInventory = (id) => {
+  router.push({ path:'/comprehensiveGuarantee/MaterialReserveManagement/InventoryDetails', query: { id } });
+};
+
 const submitRefresh = () => {
   handleCancel();
   queryParams.page = 1;
@@ -112,6 +118,7 @@ const inboundDetailsState = reactive({
   show: false, // 初始化show为false
 });
 
+
 const handleAdd = () => {
   addInboundState.show = true;
 };
@@ -132,7 +139,7 @@ const handleWrite = (item) => {
 };
 
 const handleView = () => {
-  inboundDetailsState.show=true;
+  // inboundDetailsState.show=true;
 };
 
 onMounted(() => {

src/views/comprehensiveGuarantee/MaterialReserveManagement/InventoryDetails.vue

@@ -14,7 +14,7 @@
                 <el-input v-model="queryParams.io_number" placeholder="请输入出入库单号" clearable @keyup.enter="handleQuery" />
               </el-form-item>
               <el-form-item :span="5" prop="io_flag" label-width="auto">
-                <el-select v-model="queryParams.type" placeholder="全部" clearable>
+                <el-select v-model="queryParams.io_flag" placeholder="全部" clearable>
                   <el-option v-for="item in type" :key="item.value" :label="item.label" :value="item.value"></el-option>
                 </el-select>
               </el-form-item>
@@ -44,13 +44,12 @@
           style="width: 96%"
           @selection-change="handleSelectionChange"
         >
-          <el-table-column type="selection" width="55" align="center" fixed />
-          <el-table-column label="商品信息" align="center" prop="goods_information" fixed show-overflow-tooltip />
-          <el-table-column label="出入库单号" align="center" prop="odd_numbers" show-overflow-tooltip />
-          <el-table-column label="入库/出库" align="center" prop="type" show-overflow-tooltip />
-          <el-table-column label="变动库存" align="center" prop="change_inventory" show-overflow-tooltip />
-          <el-table-column label="剩余库存" align="center" prop="remaining_inventory" show-overflow-tooltip />
-          <el-table-column label="创建时间" align="center" prop="created_time" show-overflow-tooltip />
+          <el-table-column label="商品信息" align="center" prop="product_info" fixed />
+          <el-table-column label="出入库单号" align="center" prop="io_number" />
+          <el-table-column label="入库/出库" align="center" prop="io_flag" />
+          <el-table-column label="变动库存" align="center" prop="changed_stock" />
+          <el-table-column label="剩余库存" align="center" prop="remaining_stock" />
+          <el-table-column label="创建时间" align="center" prop="create_time" />
         </el-table>
         <pagination v-show="total > 0" v-model:page="queryParams.page" v-model:limit="queryParams.pageSize" :total="total" @pagination="tableData" />
       </div>
@@ -61,6 +60,7 @@
 <script setup lang="ts">
 import { ref, reactive, onMounted, onBeforeUnmount } from 'vue';
 import { getMovementList } from '@/api/comprehensiveGuarantee/materialReserveManagement/InventoryDetails';
+import { parseTime } from '@/utils/ruoyi';
 
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
 const showSearch = ref(true);
@@ -68,6 +68,9 @@ const tableData = ref();
 const multiple = ref(true);
 const ids = ref<Array<number | string>>([]);
 const single = ref(true);
+
+
+
 // 定义响应式变量
 const loading = ref(false);
 const maxHeight = ref(window.innerHeight * 0.8);
@@ -99,10 +102,12 @@ const data = reactive({
 
 const { queryParams, form } = toRefs(data);
 
+
+
 const type = [
   { value: '', label: '全部' },
-  { value: '0', label: '出库' },
-  { value: '1', label: '入库' }
+  { value: 'O', label: '出库' },
+  { value: 'I', label: '入库' }
 ];
 
 const handleQuery = () => {
@@ -118,6 +123,10 @@ const fetchWorkrData = () => {
   loading.value = true;
   getMovementList(queryParams.value)
     .then((res) => {
+      res.data.forEach(item => {
+        item.create_time = parseTime(item.create_time);
+        item.io_flag = item.io_flag === 'I' ? "入库" : "出库";
+      })
       tableData.value = res.data;
       total.value = res.total;
     })
@@ -126,6 +135,21 @@ const fetchWorkrData = () => {
     });
 };
 
+const route = useRoute();
+const id = ref(route.query.id || null);
+data.queryParams.io_number = id;
+watch(
+  () => route.query.id, // 监听的对象
+  (newVal, oldVal) => {
+    // 当路由查询参数变化时，更新响应式引用
+    id.value = newVal;
+    handleQuery();
+    // 在这里可以执行其他操作，比如更新组件状态
+  },
+  { immediate: true } // 立即执行一次回调，以同步初始值
+
+);
+
 const handleSelectionChange = (selection) => {
   ids.value = selection.map((item) => item.id);
   selectedRow.value = selection.length === 1 ? selection[0] : null;

src/views/comprehensiveGuarantee/MaterialReserveManagement/addOutbound.vue

@@ -57,7 +57,7 @@
         </el-form>
         <div class="common-dialog-footer">
           <el-button @click="closeDialog">取消</el-button>
-          <el-button :loading="buttonLoading" type="primary" @click="submitForm">确定</el-button>
+          <el-button :loading="buttonLoading" type="primary" @click="submitForm(eventFormRef)">确定</el-button>
         </div>
       </div>
     </div>
@@ -67,6 +67,7 @@
 import { ref, reactive, toRefs } from 'vue';
 const emits = defineEmits(['close']);
 const buttonLoading = ref(false);
+const eventFormRef = ref('');
 // 表单初始数据
 const initFormData = {
   invoice_number: '', // 出库单号