|
@@ -0,0 +1,313 @@
|
|
|
+<template>
|
|
|
+ <!-- <el-button el-button type="primary" icon="Download" @click="showdialog">收发登记表</el-button> -->
|
|
|
+ <el-button el-button type="primary" icon="Download" @click="showdialogdialog">运输登记表</el-button>
|
|
|
+ <el-dialog v-model="dialogFormVisible" title="收发登记表" :append-to-body="true" draggable width="30%">
|
|
|
+ <el-form :model="initParam" ref="ruleFormRef" :rules="rules">
|
|
|
+ <el-form-item label="品名" :label-width="formLabelWidth" prop="productId">
|
|
|
+ <el-select v-model.number="initParam.productId" filterable remote reserve-keyword placeholder="品名"
|
|
|
+ :remote-method="remoteMethod1" :loading="loading" clearable style="width: 100%;"
|
|
|
+ @clear="initParam.productId = null" @click="click1">
|
|
|
+ <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="生产企业" :label-width="formLabelWidth" prop="enterpriseId">
|
|
|
+ <el-select v-model.number="initParam.enterpriseId" filterable remote reserve-keyword placeholder="生产企业"
|
|
|
+ :remote-method="remoteMethod2" :loading="loading" clearable style="width: 100%;"
|
|
|
+ @clear="initParam.enterpriseId = null" @click="click2">
|
|
|
+ <el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="规格" :label-width="formLabelWidth" prop="specId">
|
|
|
+ <el-select v-model.number="initParam.specId" filterable remote reserve-keyword placeholder="规格"
|
|
|
+ :remote-method="remoteMethod3" :loading="loading" clearable style="width: 100%;"
|
|
|
+ @clear="initParam.specId = null" @click="click3">
|
|
|
+ <el-option v-for="item in options3" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="批号" :label-width="formLabelWidth" prop="batchNumber">
|
|
|
+ <!-- <el-select v-model="initParam.batchNumber" class="m-2" placeholder="Select" style="width: 100%;">
|
|
|
+ <el-option v-for="item in options5" :key="item" :label="item" :value="item" />
|
|
|
+ </el-select> -->
|
|
|
+ <el-autocomplete v-model="initParam.batchNumber" :fetch-suggestions="querySearch" clearable
|
|
|
+ class="inputWidth" placeholder="批号" style="width: 100%;"/>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="dialogFormVisible = false">Cancel</el-button>
|
|
|
+ <el-button type="primary" @click="submitForm(ruleFormRef,'excel')">导出</el-button>
|
|
|
+ <el-button type="primary" @click="submitForm(ruleFormRef,'pdf')">打印</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog v-model="dialogFormVisible1" title="运输登记表" :append-to-body="true" draggable width="30%">
|
|
|
+ <el-form :model="initParamWord" ref="ruleFormRef1" :rules="rules1">
|
|
|
+ <el-form-item label="出库日期" :label-width="formLabelWidth" prop="date">
|
|
|
+ <el-date-picker v-model="initParamWord.date" type="date" value-format="YYYY-MM-DD" clearable
|
|
|
+ style="width: 100%;" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="收货单位" :label-width="formLabelWidth" prop="receivingUnit">
|
|
|
+ <!-- <el-select v-model.number="initParamWord.receivingUnit" filterable remote reserve-keyword placeholder="收货单位"
|
|
|
+ :remote-method="remoteMethod4" :loading="loading" clearable style="width: 100%;"
|
|
|
+ @clear="initParamWord.receivingUnit = null" @click="click4">
|
|
|
+ <el-option v-for="item in options4" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
+ </el-select> -->
|
|
|
+
|
|
|
+ <el-autocomplete v-model="initParamWord.receivingUnit" :fetch-suggestions="querySearch1" clearable class="inputWidth"
|
|
|
+ placeholder="收货单位" style="width: 100%;" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="品名" :label-width="formLabelWidth">
|
|
|
+ <el-select v-model.number="initParamWord.productId" filterable remote reserve-keyword placeholder="品名"
|
|
|
+ :remote-method="remoteMethod1" :loading="loading" clearable style="width: 100%;"
|
|
|
+ @clear="initParamWord.productId = null" @click="click1">
|
|
|
+ <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button @click="dialogFormVisible1 = false">Cancel</el-button>
|
|
|
+ <el-button type="primary" @click="submitForm1(ruleFormRef1,'word')">导出</el-button>
|
|
|
+ <el-button type="primary" @click="submitForm1(ruleFormRef1,'pdf')">打印</el-button>
|
|
|
+
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup lang="ts">
|
|
|
+import { inventoryExcel, transportWord,stockunit } from "@/api";
|
|
|
+import { gradeName, enterpriseFun, stockunitFun, specification, LotNumber,shoubat } from "@/plugins/selectData";
|
|
|
+import { reactive, ref, onMounted } from 'vue'
|
|
|
+import { downPDF, downloadExcelFun } from "@/utils/download";
|
|
|
+import type { FormInstance } from 'element-plus'
|
|
|
+const dialogFormVisible = ref(false)
|
|
|
+const dialogFormVisible1 = ref(false)
|
|
|
+const ruleFormRef = ref<FormInstance>()
|
|
|
+const ruleFormRef1 = ref<FormInstance>()
|
|
|
+const formLabelWidth = '80px'
|
|
|
+const loading = ref(false)
|
|
|
+interface RuleForm {
|
|
|
+ batchNumber: any,
|
|
|
+ enterpriseId?: any,
|
|
|
+ productId?: any,
|
|
|
+ specId: any,
|
|
|
+ type: string
|
|
|
+}
|
|
|
+const initParam = reactive<RuleForm>({//请求参数
|
|
|
+ "batchNumber":'',
|
|
|
+ "enterpriseId": null,
|
|
|
+ "productId": null,
|
|
|
+ "specId": null,
|
|
|
+ "type": ''
|
|
|
+})
|
|
|
+interface RuleForm1 {
|
|
|
+ date: any,
|
|
|
+ receivingUnit?: any,
|
|
|
+ productId?: any,
|
|
|
+ type: string
|
|
|
+}
|
|
|
+const initParamWord = reactive<RuleForm1>({//请求参数
|
|
|
+ "date": null,
|
|
|
+ "receivingUnit": '',
|
|
|
+ "productId": null,
|
|
|
+ "type": ''
|
|
|
+})
|
|
|
+onMounted(async () => {
|
|
|
+ const result1: any = await gradeName()//疫苗名称
|
|
|
+ const result2: any = await enterpriseFun()//生产企业
|
|
|
+ const result3: any = await specification()//规格
|
|
|
+ const result4: any = await stockunitFun(2)//收发货单位
|
|
|
+
|
|
|
+ list1.value = findMap(result1 || [], 'obj')
|
|
|
+ list2.value = findMap(result2 || [], 'obj')
|
|
|
+ list3.value = findMap(result3 || [], 'obj')
|
|
|
+ list4.value = findMap(result4 || [], 'map')
|
|
|
+})
|
|
|
+//函数
|
|
|
+const findMap = (arr: any, obj: any) => {
|
|
|
+ return arr.map((item: any) => {
|
|
|
+ return { value: obj == 'obj' ? item.id : item, label: obj == 'obj' ? item.name : item }
|
|
|
+ })
|
|
|
+}
|
|
|
+interface ListItem {
|
|
|
+ value: string
|
|
|
+ label: string
|
|
|
+}
|
|
|
+
|
|
|
+const click1 = async () => { options1.value = list1.value }
|
|
|
+const click2 = async () => { options2.value = list2.value }
|
|
|
+const click3 = async () => { options3.value = list3.value }
|
|
|
+const click4 = async () => { options4.value = list4.value }
|
|
|
+
|
|
|
+
|
|
|
+const list1 = ref<ListItem[]>([])//疫苗名称
|
|
|
+const list2 = ref<ListItem[]>([])//生产企业
|
|
|
+const list3 = ref<ListItem[]>([])//收发货单位
|
|
|
+const list4 = ref<ListItem[]>([])//收发货单位
|
|
|
+
|
|
|
+
|
|
|
+const options1 = ref<ListItem[]>([])
|
|
|
+const options2 = ref<ListItem[]>([])
|
|
|
+const options3 = ref<ListItem[]>([])
|
|
|
+const options4 = ref<ListItem[]>([])
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+const remoteMethod1 = async (query: string) => {
|
|
|
+ if (query) {
|
|
|
+ loading.value = true
|
|
|
+ setTimeout(() => {
|
|
|
+ loading.value = false
|
|
|
+ options1.value = list1.value.filter((item: any) => {
|
|
|
+ return item.label.toLowerCase().includes(query.toLowerCase())
|
|
|
+ })
|
|
|
+ }, 200)
|
|
|
+ } else {
|
|
|
+ options1.value = []
|
|
|
+ }
|
|
|
+}
|
|
|
+const remoteMethod2 = async (query: string) => {
|
|
|
+ if (query) {
|
|
|
+ loading.value = true
|
|
|
+ setTimeout(() => {
|
|
|
+ loading.value = false
|
|
|
+ options2.value = list2.value.filter((item: any) => {
|
|
|
+ console.log('第一个', query, item)
|
|
|
+ return item.label.toLowerCase().includes(query.toLowerCase())
|
|
|
+ })
|
|
|
+ }, 200)
|
|
|
+ } else {
|
|
|
+ options2.value = []
|
|
|
+ }
|
|
|
+}
|
|
|
+const remoteMethod3 = async (query: string) => {
|
|
|
+ if (query) {
|
|
|
+ loading.value = true
|
|
|
+ setTimeout(() => {
|
|
|
+ loading.value = false
|
|
|
+ options3.value = list3.value.filter((item: any) => {
|
|
|
+ return item.label.toLowerCase().includes(query.toLowerCase())
|
|
|
+ })
|
|
|
+ }, 200)
|
|
|
+ } else {
|
|
|
+ options3.value = []
|
|
|
+ }
|
|
|
+}
|
|
|
+const remoteMethod4 = async (query: string) => {
|
|
|
+ if (query) {
|
|
|
+ loading.value = true
|
|
|
+ setTimeout(() => {
|
|
|
+ loading.value = false
|
|
|
+ options4.value = list4.value.filter((item: any) => {
|
|
|
+ return item.label.toLowerCase().includes(query.toLowerCase())
|
|
|
+ })
|
|
|
+ }, 200)
|
|
|
+ } else {
|
|
|
+ options3.value = []
|
|
|
+ }
|
|
|
+}
|
|
|
+//函数
|
|
|
+const showdialog = async ()=>{
|
|
|
+ dialogFormVisible.value = true
|
|
|
+ const reslut:any = await LotNumber()
|
|
|
+ console.log('数据1',reslut)
|
|
|
+ const arrMap = reslut
|
|
|
+ const arr:any = []
|
|
|
+ arrMap.forEach((item:any)=>{
|
|
|
+ arr.push({ value: item, link: item})
|
|
|
+ })
|
|
|
+ restaurants.value = arr
|
|
|
+ console.log('数据2',restaurants.value)
|
|
|
+}
|
|
|
+
|
|
|
+interface RestaurantItem {
|
|
|
+ value: string
|
|
|
+ link: string
|
|
|
+}
|
|
|
+const restaurants = ref<RestaurantItem[]>([])
|
|
|
+const querySearch = (queryString: string, cb: any) => {
|
|
|
+ const results = queryString
|
|
|
+ ? restaurants.value.filter(createFilter(queryString))
|
|
|
+ : restaurants.value
|
|
|
+ cb(results)
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+const createFilter = (queryString: string) => {
|
|
|
+ return (restaurant: RestaurantItem) => {
|
|
|
+ return (
|
|
|
+ restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0
|
|
|
+ )
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+//显示运输登记
|
|
|
+const showdialogdialog = async ()=>{
|
|
|
+ dialogFormVisible1.value = true
|
|
|
+ const reslut:any = await shoubat()
|
|
|
+ console.log('数据1',reslut)
|
|
|
+ const arrMap = reslut
|
|
|
+ const arr:any = []
|
|
|
+ arrMap.forEach((item:any)=>{
|
|
|
+ arr.push({ value: item, link: item})
|
|
|
+ })
|
|
|
+ restaurants1.value = arr
|
|
|
+ console.log('数据2',restaurants1.value)
|
|
|
+}
|
|
|
+const restaurants1 = ref<RestaurantItem[]>([])
|
|
|
+const querySearch1 = (queryString: string, cb: any) => {
|
|
|
+ const results = queryString
|
|
|
+ ? restaurants1.value.filter(createFilter(queryString))
|
|
|
+ : restaurants1.value
|
|
|
+ cb(results)
|
|
|
+}
|
|
|
+
|
|
|
+
|
|
|
+const rules = reactive({
|
|
|
+ batchNumber: [{ required: true, message: '必填项', trigger: 'change' }],
|
|
|
+ enterpriseId: [{ required: true, message: '必填项', trigger: 'change' }],
|
|
|
+ productId: [{ required: true, message: '必填项', trigger: 'change' }],
|
|
|
+ specId: [{ required: true, message: '必填项', trigger: 'change' }],
|
|
|
+})
|
|
|
+const submitForm = async (formEl: FormInstance | undefined,ty:string) => {
|
|
|
+ if (!formEl) return
|
|
|
+ await formEl.validate(async (valid, fields) => {
|
|
|
+ if (valid) {
|
|
|
+ initParam.type = ty
|
|
|
+ const result = await inventoryExcel(initParam)
|
|
|
+ ty=='excel'?downloadExcelFun(result):downPDF(result)
|
|
|
+ } else {
|
|
|
+ console.log('error submit!', fields)
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+const rules1 = reactive({
|
|
|
+ date: [{ required: true, message: '必填项', trigger: 'change' }],
|
|
|
+ receivingUnit: [{ required: true, message: '必填项', trigger: 'change' }],
|
|
|
+})
|
|
|
+const submitForm1 = async (formEl: FormInstance | undefined,ty:any) => {
|
|
|
+ if (!formEl) return
|
|
|
+ await formEl.validate(async (valid, fields) => {
|
|
|
+ if (valid) {
|
|
|
+ initParamWord.type = ty
|
|
|
+ const result:any = await transportWord(initParamWord)
|
|
|
+
|
|
|
+ console.log('result',result,ty)
|
|
|
+ ty=='word'?downloadExcelFun(result):downPDF(result)
|
|
|
+ } else {
|
|
|
+ console.log('error submit!', fields)
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang="scss">
|
|
|
+/* @import url(); 引入css类 */
|
|
|
+.inputWidth {
|
|
|
+ width: 200px;
|
|
|
+}
|
|
|
+</style>
|