|
|
@@ -1,12 +1,12 @@
|
|
|
<script setup lang="ts">
|
|
|
import {
|
|
|
- Storehouse_Stock_List,
|
|
|
- Storehouse_Depot_List,
|
|
|
- Storehouse_ProductClass_List,
|
|
|
- Storehouse_Product_Model_List,
|
|
|
- Storehouse_Product_Name_List,
|
|
|
- Storehouse_Stock_Detail_List,
|
|
|
- Storehouse_Stock_Detail_Excel
|
|
|
+ Storehouse_Stock_List,
|
|
|
+ Storehouse_Depot_List,
|
|
|
+ Storehouse_ProductClass_List,
|
|
|
+ Storehouse_Product_Model_List,
|
|
|
+ Storehouse_Product_Name_List,
|
|
|
+ Storehouse_Stock_Detail_List,
|
|
|
+ Storehouse_Stock_Detail_Excel
|
|
|
} from '@/api/storehouse/index'
|
|
|
import { ref, reactive, onMounted } from 'vue'
|
|
|
import { List } from '@element-plus/icons-vue'
|
|
|
@@ -19,8 +19,8 @@ import ImageCom from '@/components/Image/index.vue'
|
|
|
import { useTablePublic } from '@/hooks/useTablePublic'
|
|
|
|
|
|
const userInfo = ref({
|
|
|
- Id: '',
|
|
|
- T_name: ''
|
|
|
+ Id: '',
|
|
|
+ T_name: ''
|
|
|
})
|
|
|
const loading = ref(false)
|
|
|
const globalStore = GlobalStore()
|
|
|
@@ -31,52 +31,52 @@ const { tableRowClassName } = useTablePublic()
|
|
|
const tableRowClassNameHandle = (data: any): any => tableRowClassName(data.row.Id, userInfo.value.Id)
|
|
|
|
|
|
const initParam = reactive({
|
|
|
- User_tokey: globalStore.GET_User_tokey,
|
|
|
- T_depot_id: '',
|
|
|
- T_product_class: '',
|
|
|
- T_product_name: '',
|
|
|
- T_product_model: ''
|
|
|
+ User_tokey: globalStore.GET_User_tokey,
|
|
|
+ T_depot_id: '',
|
|
|
+ T_product_class: '',
|
|
|
+ T_product_name: '',
|
|
|
+ T_product_model: ''
|
|
|
})
|
|
|
const detailInitParam = reactive({
|
|
|
- T_depot_id: '',
|
|
|
- T_product_id: '',
|
|
|
- T_start_date: '',
|
|
|
- T_end_date: ''
|
|
|
+ T_depot_id: '',
|
|
|
+ T_product_id: '',
|
|
|
+ T_start_date: '',
|
|
|
+ T_end_date: ''
|
|
|
})
|
|
|
const columns: ColumnProps[] = [
|
|
|
- { type: 'index', label: '序号', width: 80 },
|
|
|
- { prop: 'T_depot_name', label: '仓库名称' },
|
|
|
- { prop: 'T_product_img', label: '产品图片', name: 'T_product_img' },
|
|
|
- { prop: 'T_product_name', label: '产品名称' },
|
|
|
- { prop: 'T_product_class_name', label: '产品分类' },
|
|
|
- { prop: 'T_product_model', label: '产品型号', ellipsis: true },
|
|
|
- { prop: 'T_product_spec', label: '产品规格' },
|
|
|
- { prop: 'T_total', label: '库存数量' },
|
|
|
- { prop: 'operation', label: '操作', width: 80, fixed: 'right' }
|
|
|
+ { type: 'index', label: '序号', width: 80 },
|
|
|
+ { prop: 'T_depot_name', label: '仓库名称' },
|
|
|
+ { prop: 'T_product_img', label: '产品图片', name: 'T_product_img' },
|
|
|
+ { prop: 'T_product_name', label: '产品名称' },
|
|
|
+ { prop: 'T_product_class_name', label: '产品分类' },
|
|
|
+ { prop: 'T_product_model', label: '产品型号', ellipsis: true },
|
|
|
+ { prop: 'T_product_spec', label: '产品规格' },
|
|
|
+ { prop: 'T_total', label: '库存数量' },
|
|
|
+ { prop: 'operation', label: '操作', width: 80, fixed: 'right' }
|
|
|
]
|
|
|
|
|
|
const detailColumns: ColumnProps[] = [
|
|
|
- { type: 'index', label: '序号', width: 80 },
|
|
|
- { prop: 'T_product_name', label: '产品名称' },
|
|
|
- { prop: 'T_product_model', label: '产品型号', ellipsis: true },
|
|
|
- { prop: 'T_product_spec', label: '产品规格' },
|
|
|
- { prop: 'T_month', label: '月份' },
|
|
|
- { prop: 'T_beginning', label: '期初库存' },
|
|
|
- { prop: 'T_in', label: '入库' },
|
|
|
- { prop: 'T_out', label: '出库' },
|
|
|
- { prop: 'T_ending', label: '期末库存' }
|
|
|
+ { type: 'index', label: '序号', width: 80 },
|
|
|
+ { prop: 'T_product_name', label: '产品名称' },
|
|
|
+ { prop: 'T_product_model', label: '产品型号', ellipsis: true },
|
|
|
+ { prop: 'T_product_spec', label: '产品规格' },
|
|
|
+ { prop: 'T_month', label: '月份' },
|
|
|
+ { prop: 'T_beginning', label: '期初库存' },
|
|
|
+ { prop: 'T_in', label: '入库' },
|
|
|
+ { prop: 'T_out', label: '出库' },
|
|
|
+ { prop: 'T_ending', label: '期末库存' }
|
|
|
]
|
|
|
|
|
|
const searchHandle = () => {
|
|
|
- TableRef.value?.searchTable()
|
|
|
+ TableRef.value?.searchTable()
|
|
|
}
|
|
|
const dataCallback = (res: any) => {
|
|
|
- return res.Data.Data.map((item: any) => {
|
|
|
- if (item.T_depot_id === userInfo.value.Id) {
|
|
|
- item.T_depot_name = userInfo.value.T_name
|
|
|
- }
|
|
|
- return item
|
|
|
- })
|
|
|
+ return res.Data.Data.map((item: any) => {
|
|
|
+ if (item.T_depot_id === userInfo.value.Id) {
|
|
|
+ item.T_depot_name = userInfo.value.T_name
|
|
|
+ }
|
|
|
+ return item
|
|
|
+ })
|
|
|
}
|
|
|
const detailDataCallback = (res: any) => res.Data
|
|
|
/**
|
|
|
@@ -88,315 +88,283 @@ const T_date_export = ref<string[]>([])
|
|
|
const visible = ref(false)
|
|
|
const exportExcel = () => (visible.value = true)
|
|
|
const confirmExpor = async (project_id?: string) => {
|
|
|
- const params = {
|
|
|
- User_tokey: globalStore.GET_User_tokey,
|
|
|
- T_depot_id: initParam.T_depot_id,
|
|
|
- T_start_date: T_date.value[0],
|
|
|
- T_end_date: T_date.value[1],
|
|
|
- T_product_id: ''
|
|
|
- }
|
|
|
- if (typeof project_id === 'number') {
|
|
|
- params['T_product_id'] = project_id
|
|
|
- }
|
|
|
- const res: any = await Storehouse_Stock_Detail_Excel(params)
|
|
|
- if (res.Code === 200) {
|
|
|
- window.open(res.Data)
|
|
|
- }
|
|
|
+ const params = {
|
|
|
+ User_tokey: globalStore.GET_User_tokey,
|
|
|
+ T_depot_id: initParam.T_depot_id,
|
|
|
+ T_start_date: T_date.value[0],
|
|
|
+ T_end_date: T_date.value[1],
|
|
|
+ T_product_id: ''
|
|
|
+ }
|
|
|
+ if (typeof project_id === 'number') {
|
|
|
+ params['T_product_id'] = project_id
|
|
|
+ }
|
|
|
+ const res: any = await Storehouse_Stock_Detail_Excel(params)
|
|
|
+ if (res.Code === 200) {
|
|
|
+ window.open(res.Data)
|
|
|
+ }
|
|
|
}
|
|
|
const NameOptions = ref<any[]>([])
|
|
|
const classOptions = ref<any[]>([])
|
|
|
const modelOptions = ref<any[]>([])
|
|
|
// 获取产品分类
|
|
|
const getProductClassList = async () => {
|
|
|
- const res: any = await Storehouse_ProductClass_List({ page: 1, page_z: 999 })
|
|
|
- classOptions.value = res.Data.Data
|
|
|
+ const res: any = await Storehouse_ProductClass_List({ page: 1, page_z: 999 })
|
|
|
+ classOptions.value = res.Data.Data
|
|
|
}
|
|
|
/**
|
|
|
* 模糊搜索名称
|
|
|
* @param str 名称字符串
|
|
|
*/
|
|
|
const getNameAsync = async (str: string): Promise<any> => {
|
|
|
- const res: any = await Storehouse_Product_Name_List({ T_name: str, T_class: initParam.T_product_class })
|
|
|
- if (!res.Data) return
|
|
|
- return res.Data.map((item: any, index: number) => {
|
|
|
- return {
|
|
|
- value: item,
|
|
|
- index: index
|
|
|
- }
|
|
|
- })
|
|
|
+ const res: any = await Storehouse_Product_Name_List({ T_name: str, T_class: initParam.T_product_class })
|
|
|
+ if (!res.Data) return
|
|
|
+ return res.Data.map((item: any, index: number) => {
|
|
|
+ return {
|
|
|
+ value: item,
|
|
|
+ index: index
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
/**
|
|
|
* 模糊搜索名称
|
|
|
* @param queryString 输入框的输入字符
|
|
|
*/
|
|
|
const querySearchAsync = async (queryString: string) => {
|
|
|
- if (queryString) {
|
|
|
- loading.value = true
|
|
|
- globalStore.SET_isloading(true)
|
|
|
- const results = await getNameAsync(queryString)
|
|
|
- NameOptions.value = results
|
|
|
- globalStore.SET_isloading(false)
|
|
|
- loading.value = false
|
|
|
- }
|
|
|
+ if (queryString) {
|
|
|
+ loading.value = true
|
|
|
+ globalStore.SET_isloading(true)
|
|
|
+ const results = await getNameAsync(queryString)
|
|
|
+ NameOptions.value = results
|
|
|
+ globalStore.SET_isloading(false)
|
|
|
+ loading.value = false
|
|
|
+ }
|
|
|
}
|
|
|
/**
|
|
|
* 异步获取产品型号
|
|
|
*/
|
|
|
const getProductModelList = async () => {
|
|
|
- globalStore.SET_isloading(true)
|
|
|
- const res: any = await Storehouse_Product_Model_List({ T_name: initParam.T_product_name })
|
|
|
- modelOptions.value = res.Data.map((item: any, index: number) => {
|
|
|
- return {
|
|
|
- value: item,
|
|
|
- index: index
|
|
|
- }
|
|
|
- })
|
|
|
- globalStore.SET_isloading(false)
|
|
|
+ globalStore.SET_isloading(true)
|
|
|
+ const res: any = await Storehouse_Product_Model_List({ T_name: initParam.T_product_name })
|
|
|
+ modelOptions.value = res.Data.map((item: any, index: number) => {
|
|
|
+ return {
|
|
|
+ value: item,
|
|
|
+ index: index
|
|
|
+ }
|
|
|
+ })
|
|
|
+ globalStore.SET_isloading(false)
|
|
|
}
|
|
|
const handleSelect = (item: any) => {
|
|
|
- initParam.T_product_name = item.value
|
|
|
- getProductModelList()
|
|
|
+ initParam.T_product_name = item.value
|
|
|
+ getProductModelList()
|
|
|
}
|
|
|
|
|
|
// 明细
|
|
|
const callbackDrawer = (done: () => void) => done()
|
|
|
const previewDetail = (id: string) => {
|
|
|
- DrawerRef.value?.openDrawer()
|
|
|
- T_date_detail.value = [...T_date.value]
|
|
|
- if (detailInitParam.T_product_id === id) return
|
|
|
- detailInitParam.T_depot_id = initParam.T_depot_id
|
|
|
- detailInitParam.T_product_id = id
|
|
|
- detailInitParam.T_start_date = T_date.value[0]
|
|
|
- detailInitParam.T_end_date = T_date.value[1]
|
|
|
- TableDetailRef.value?.searchTable()
|
|
|
+ DrawerRef.value?.openDrawer()
|
|
|
+ T_date_detail.value = [...T_date.value]
|
|
|
+ if (detailInitParam.T_product_id === id) return
|
|
|
+ detailInitParam.T_depot_id = initParam.T_depot_id
|
|
|
+ detailInitParam.T_product_id = id
|
|
|
+ detailInitParam.T_start_date = T_date.value[0]
|
|
|
+ detailInitParam.T_end_date = T_date.value[1]
|
|
|
+ TableDetailRef.value?.searchTable()
|
|
|
}
|
|
|
const dateDetailChange = (str: string[]) => {
|
|
|
- if (!str) return
|
|
|
- detailInitParam.T_start_date = str[0]
|
|
|
- detailInitParam.T_end_date = str[1]
|
|
|
- TableDetailRef.value?.searchTable()
|
|
|
+ if (!str) return
|
|
|
+ detailInitParam.T_start_date = str[0]
|
|
|
+ detailInitParam.T_end_date = str[1]
|
|
|
+ TableDetailRef.value?.searchTable()
|
|
|
}
|
|
|
onMounted(() => {
|
|
|
- getProductClassList()
|
|
|
+ getProductClassList()
|
|
|
|
|
|
- T_date.value = [dayJs().startOf('year').format('YYYY-MM-DD'), dayJs().format('YYYY-MM-DD')]
|
|
|
- T_date_export.value = [...T_date.value]
|
|
|
+ T_date.value = [dayJs().startOf('year').format('YYYY-MM-DD'), dayJs().format('YYYY-MM-DD')]
|
|
|
+ T_date_export.value = [...T_date.value]
|
|
|
})
|
|
|
|
|
|
const getSalaryParams = (row: any) => {
|
|
|
- userInfo.value.Id = ''
|
|
|
- setTimeout(() => {
|
|
|
- userInfo.value = { ...row }
|
|
|
- initParam.T_depot_id = userInfo.value.Id
|
|
|
- }, 100)
|
|
|
+ userInfo.value.Id = ''
|
|
|
+ setTimeout(() => {
|
|
|
+ userInfo.value = { ...row }
|
|
|
+ initParam.T_depot_id = userInfo.value.Id
|
|
|
+ }, 100)
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
- <div class="inventory-statistics">
|
|
|
- <div style="width: 290px" class="inventory-table">
|
|
|
- <TableBase
|
|
|
- ref="TableRef"
|
|
|
- :columns="[{ prop: 'T_name', label: '仓库名称' }]"
|
|
|
- :requestApi="Storehouse_Depot_List"
|
|
|
- :initParam="{ User_tokey: globalStore.GET_User_tokey }"
|
|
|
- layout="prev, pager, next"
|
|
|
- :rowClick="getSalaryParams"
|
|
|
- :tableRowClassName="tableRowClassNameHandle"
|
|
|
- >
|
|
|
- <template #table-header>
|
|
|
- <h3 class="title">仓库列表</h3>
|
|
|
- </template>
|
|
|
- </TableBase>
|
|
|
- </div>
|
|
|
- <transition
|
|
|
- leave-active-class="animate__animated animate__fadeOutRight"
|
|
|
- enter-active-class="animate__animated animate__fadeInLeft"
|
|
|
- >
|
|
|
- <div class="project-container" v-if="userInfo.Id">
|
|
|
- <TableBase
|
|
|
- ref="TableRef"
|
|
|
- :columns="columns"
|
|
|
- :requestApi="Storehouse_Stock_List"
|
|
|
- :initParam="initParam"
|
|
|
- :dataCallback="dataCallback"
|
|
|
- >
|
|
|
- <template #table-header>
|
|
|
- <div class="head-search active">
|
|
|
- <el-form :model="initParam" class="result-form" label-width="100px">
|
|
|
- <el-row>
|
|
|
- <el-col :span="12"
|
|
|
- ><el-form-item label="产品分类" :inline-message="true">
|
|
|
- <el-select v-model="initParam.T_product_class" clearable placeholder="请选择分类~" class="w-50">
|
|
|
- <el-option v-for="item in classOptions" :key="item.Id" :label="item.T_name" :value="item.Id" />
|
|
|
- </el-select> </el-form-item
|
|
|
- ></el-col>
|
|
|
- <el-col :span="12"
|
|
|
- ><el-form-item label="产品名称">
|
|
|
- <el-select
|
|
|
- v-model="initParam.T_product_name"
|
|
|
- filterable
|
|
|
- clearable
|
|
|
- remote
|
|
|
- reserve-keyword
|
|
|
- placeholder="按产品名称搜索"
|
|
|
- remote-show-suffix
|
|
|
- :remote-method="querySearchAsync"
|
|
|
- :loading="loading"
|
|
|
- @change="handleSelect"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in NameOptions"
|
|
|
- :key="item.value"
|
|
|
- :label="item.value"
|
|
|
- :value="item.value"
|
|
|
- />
|
|
|
- </el-select> </el-form-item
|
|
|
- ></el-col>
|
|
|
- </el-row>
|
|
|
- <el-row class="search-bottom">
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label="产品型号">
|
|
|
- <el-select v-model="initParam.T_product_model" clearable placeholder="请选择型号~" class="w-50">
|
|
|
- <el-option
|
|
|
- v-for="item in modelOptions"
|
|
|
- :key="item.index"
|
|
|
- :label="item.value"
|
|
|
- :value="item.value"
|
|
|
- />
|
|
|
- </el-select>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="6" :offset="6">
|
|
|
- <el-button type="primary" @click="searchHandle">搜索</el-button>
|
|
|
- <el-popover :visible="visible" placement="bottom" :width="400" trigger="click">
|
|
|
- <template #reference>
|
|
|
- <el-button type="success" @click="exportExcel">导出</el-button>
|
|
|
- </template>
|
|
|
- <el-date-picker
|
|
|
- v-model="T_date_export"
|
|
|
- type="daterange"
|
|
|
- range-separator="~"
|
|
|
- start-placeholder="开始时间"
|
|
|
- end-placeholder="结束时间"
|
|
|
- format="YYYY-MM-DD"
|
|
|
- value-format="YYYY-MM-DD"
|
|
|
- />
|
|
|
- <div class="export-popover">
|
|
|
- <el-button size="small" @click="visible = false">取消</el-button>
|
|
|
- <el-button size="small" type="primary" @click="confirmExpor">确认</el-button>
|
|
|
- </div>
|
|
|
- </el-popover>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </el-form>
|
|
|
+ <div class="inventory-statistics">
|
|
|
+ <div style="width: 290px" class="inventory-table">
|
|
|
+ <TableBase ref="TableRef" :columns="[{ prop: 'T_name', label: '仓库名称' }]" :requestApi="Storehouse_Depot_List"
|
|
|
+ :initParam="{ User_tokey: globalStore.GET_User_tokey }" layout="prev, pager, next"
|
|
|
+ :rowClick="getSalaryParams" :tableRowClassName="tableRowClassNameHandle">
|
|
|
+ <template #table-header>
|
|
|
+ <h3 class="title">仓库列表</h3>
|
|
|
+ </template>
|
|
|
+ </TableBase>
|
|
|
+ </div>
|
|
|
+ <transition leave-active-class="animate__animated animate__fadeOutRight"
|
|
|
+ enter-active-class="animate__animated animate__fadeInLeft">
|
|
|
+ <div class="project-container" v-if="userInfo.Id">
|
|
|
+ <TableBase ref="TableRef" :columns="columns" :requestApi="Storehouse_Stock_List" :initParam="initParam"
|
|
|
+ :dataCallback="dataCallback">
|
|
|
+ <template #table-header>
|
|
|
+ <div class="head-search active">
|
|
|
+ <el-form :model="initParam" class="result-form" label-width="100px">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12"><el-form-item label="产品分类" :inline-message="true">
|
|
|
+ <el-select v-model="initParam.T_product_class" clearable
|
|
|
+ placeholder="请选择分类~" class="w-50">
|
|
|
+ <el-option v-for="item in classOptions" :key="item.Id"
|
|
|
+ :label="item.T_name" :value="item.Id" />
|
|
|
+ </el-select> </el-form-item></el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="产品名称">
|
|
|
+ <el-input v-model="initParam.T_product_name" placeholder="请输入产品名称" />
|
|
|
+ <!-- <el-select v-model="initParam.T_product_name" filterable clearable remote
|
|
|
+ reserve-keyword placeholder="按产品名称搜索" remote-show-suffix
|
|
|
+ :remote-method="querySearchAsync" :loading="loading"
|
|
|
+ @change="handleSelect">
|
|
|
+ <el-option v-for="item in NameOptions" :key="item.value"
|
|
|
+ :label="item.value" :value="item.value" />
|
|
|
+ </el-select> -->
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row class="search-bottom">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="产品型号">
|
|
|
+ <el-input v-model="initParam.T_product_model" placeholder="请输入产品型号" />
|
|
|
+ <!-- <el-select v-model="initParam.T_product_model" clearable
|
|
|
+ placeholder="请选择型号~" class="w-50">
|
|
|
+ <el-option v-for="item in modelOptions" :key="item.index"
|
|
|
+ :label="item.value" :value="item.value" />
|
|
|
+ </el-select> -->
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="6" :offset="6">
|
|
|
+ <el-button type="primary" @click="searchHandle">搜索</el-button>
|
|
|
+ <el-popover :visible="visible" placement="bottom" :width="400" trigger="click">
|
|
|
+ <template #reference>
|
|
|
+ <el-button type="success" @click="exportExcel">导出</el-button>
|
|
|
+ </template>
|
|
|
+ <el-date-picker v-model="T_date_export" type="daterange" range-separator="~"
|
|
|
+ start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD"
|
|
|
+ value-format="YYYY-MM-DD" />
|
|
|
+ <div class="export-popover">
|
|
|
+ <el-button size="small" @click="visible = false">取消</el-button>
|
|
|
+ <el-button size="small" type="primary"
|
|
|
+ @click="confirmExpor">确认</el-button>
|
|
|
+ </div>
|
|
|
+ </el-popover>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <template #T_product_img="{ row }">
|
|
|
+ <ImageCom :src="row.T_product_img" />
|
|
|
+ </template>
|
|
|
+ <template #right="{ row }">
|
|
|
+ <el-button link type="primary" size="small" :icon="List"
|
|
|
+ @click="previewDetail(row.T_product_id)">明细</el-button>
|
|
|
+ </template>
|
|
|
+ </TableBase>
|
|
|
</div>
|
|
|
- </template>
|
|
|
- <template #T_product_img="{ row }">
|
|
|
- <ImageCom :src="row.T_product_img" />
|
|
|
- </template>
|
|
|
- <template #right="{ row }">
|
|
|
- <el-button link type="primary" size="small" :icon="List" @click="previewDetail(row.T_product_id)"
|
|
|
- >明细</el-button
|
|
|
- >
|
|
|
- </template>
|
|
|
- </TableBase>
|
|
|
- </div>
|
|
|
- </transition>
|
|
|
+ </transition>
|
|
|
|
|
|
- <Drawer ref="DrawerRef" :handleClose="callbackDrawer" size="80%">
|
|
|
- <template #header="{ params }">
|
|
|
- <h4 :id="params.titleId" :class="params.titleClass">库存明细</h4>
|
|
|
- </template>
|
|
|
- <TableBase
|
|
|
- border
|
|
|
- ref="TableDetailRef"
|
|
|
- :pagination="false"
|
|
|
- :columns="detailColumns"
|
|
|
- :requestApi="Storehouse_Stock_Detail_List"
|
|
|
- :initParam="detailInitParam"
|
|
|
- :dataCallback="detailDataCallback"
|
|
|
- >
|
|
|
- <template #table-header>
|
|
|
- <el-row class="head-search">
|
|
|
- <el-col :span="12"
|
|
|
- ><el-form-item label="日期范围">
|
|
|
- <el-date-picker
|
|
|
- v-model="T_date_detail"
|
|
|
- type="daterange"
|
|
|
- range-separator="~"
|
|
|
- start-placeholder="开始时间"
|
|
|
- end-placeholder="结束时间"
|
|
|
- format="YYYY-MM-DD"
|
|
|
- value-format="YYYY-MM-DD"
|
|
|
- @change="dateDetailChange" /></el-form-item
|
|
|
- ></el-col>
|
|
|
- <el-col :span="12">
|
|
|
- <el-button type="success" @click="confirmExpor(detailInitParam.T_product_id)">导出</el-button>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </template>
|
|
|
- </TableBase>
|
|
|
- </Drawer>
|
|
|
- </div>
|
|
|
+ <Drawer ref="DrawerRef" :handleClose="callbackDrawer" size="80%">
|
|
|
+ <template #header="{ params }">
|
|
|
+ <h4 :id="params.titleId" :class="params.titleClass">库存明细</h4>
|
|
|
+ </template>
|
|
|
+ <TableBase border ref="TableDetailRef" :pagination="false" :columns="detailColumns"
|
|
|
+ :requestApi="Storehouse_Stock_Detail_List" :initParam="detailInitParam"
|
|
|
+ :dataCallback="detailDataCallback">
|
|
|
+ <template #table-header>
|
|
|
+ <el-row class="head-search">
|
|
|
+ <el-col :span="12"><el-form-item label="日期范围">
|
|
|
+ <el-date-picker v-model="T_date_detail" type="daterange" range-separator="~"
|
|
|
+ start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD"
|
|
|
+ value-format="YYYY-MM-DD" @change="dateDetailChange" /></el-form-item></el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-button type="success" @click="confirmExpor(detailInitParam.T_product_id)">导出</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </template>
|
|
|
+ </TableBase>
|
|
|
+ </Drawer>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<style scoped lang="scss">
|
|
|
@import '@/styles/var.scss';
|
|
|
+
|
|
|
.export-popover {
|
|
|
- padding: 5px;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
+ padding: 5px;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
}
|
|
|
+
|
|
|
:deep(.drawer__content) {
|
|
|
- @include f-direction;
|
|
|
+ @include f-direction;
|
|
|
}
|
|
|
+
|
|
|
:deep(.el-drawer__header) {
|
|
|
- margin-bottom: 0;
|
|
|
+ margin-bottom: 0;
|
|
|
}
|
|
|
+
|
|
|
.inventory-statistics {
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- overflow: hidden;
|
|
|
- .title {
|
|
|
- width: 100%;
|
|
|
- text-align: center;
|
|
|
- line-height: 1.7em;
|
|
|
- font-size: 20px;
|
|
|
- color: #707b84;
|
|
|
- }
|
|
|
- :deep(.table-header),
|
|
|
- :deep(.card) {
|
|
|
- margin: 0;
|
|
|
- border-radius: 8px;
|
|
|
- }
|
|
|
- .inventory-table {
|
|
|
- @include f-direction;
|
|
|
- z-index: 1;
|
|
|
- }
|
|
|
- .project-container {
|
|
|
- @include f-direction;
|
|
|
- z-index: 0;
|
|
|
- margin-left: 12px;
|
|
|
- width: calc(100% - 290px);
|
|
|
- }
|
|
|
- .head-search {
|
|
|
- width: 100%;
|
|
|
- height: 33px;
|
|
|
+ height: 100%;
|
|
|
+ display: flex;
|
|
|
overflow: hidden;
|
|
|
- transition: all 0.5s ease-in-out;
|
|
|
- .result-form.el-form .el-form-item {
|
|
|
- margin-bottom: 0 !important;
|
|
|
+
|
|
|
+ .title {
|
|
|
+ width: 100%;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 1.7em;
|
|
|
+ font-size: 20px;
|
|
|
+ color: #707b84;
|
|
|
+ }
|
|
|
+
|
|
|
+ :deep(.table-header),
|
|
|
+ :deep(.card) {
|
|
|
+ margin: 0;
|
|
|
+ border-radius: 8px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .inventory-table {
|
|
|
+ @include f-direction;
|
|
|
+ z-index: 1;
|
|
|
}
|
|
|
- .search-bottom {
|
|
|
- margin-top: 18px;
|
|
|
+
|
|
|
+ .project-container {
|
|
|
+ @include f-direction;
|
|
|
+ z-index: 0;
|
|
|
+ margin-left: 12px;
|
|
|
+ width: calc(100% - 290px);
|
|
|
+ }
|
|
|
+
|
|
|
+ .head-search {
|
|
|
+ width: 100%;
|
|
|
+ height: 33px;
|
|
|
+ overflow: hidden;
|
|
|
+ transition: all 0.5s ease-in-out;
|
|
|
+
|
|
|
+ .result-form.el-form .el-form-item {
|
|
|
+ margin-bottom: 0 !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .search-bottom {
|
|
|
+ margin-top: 18px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .head-search.active {
|
|
|
+ height: 85px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .w-50 {
|
|
|
+ flex: 0 0 50%;
|
|
|
}
|
|
|
- }
|
|
|
- .head-search.active {
|
|
|
- height: 85px;
|
|
|
- }
|
|
|
- .w-50 {
|
|
|
- flex: 0 0 50%;
|
|
|
- }
|
|
|
}
|
|
|
</style>
|
YangJian0701