|
|
@@ -0,0 +1,272 @@
|
|
|
+<template>
|
|
|
+ <el-button el-button type="primary" icon="Download" @click="showFirstissue">导出首发登记表</el-button>
|
|
|
+ <el-button el-button type="primary" icon="Download" @click="printFun('导出运输登记表')">导出运输登记表</el-button>
|
|
|
+ <el-button el-button type="primary" icon="Tickets" @click="printFun('打印运输登记表')">打印运输登记表</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-form-item>
|
|
|
+ <el-form-item label="下载文件" :label-width="formLabelWidth">
|
|
|
+ <el-radio-group v-model="initParam.type">
|
|
|
+ <el-radio label="excel">excel</el-radio>
|
|
|
+ <el-radio label="pdf">pdf</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </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)">导出</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog v-model="dialogFormVisible1" :title="showTit" :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-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-item label="下载文件" :label-width="formLabelWidth">
|
|
|
+ <el-radio-group v-model="initParamWord.type">
|
|
|
+ <el-radio label="word">word</el-radio>
|
|
|
+ <el-radio label="pdf">pdf</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </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)">提交</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup lang="ts">
|
|
|
+import { inventoryExcel, transportWord } from "@/api";
|
|
|
+import { gradeName, enterpriseFun, stockunitFun, specification, LotNumber } from "@/plugins/selectData";
|
|
|
+import { reactive, ref, onMounted } from 'vue'
|
|
|
+import { downloadFile, downloadExcelFun } from "@/utils/download";
|
|
|
+import type { FormInstance, FormRules } from 'element-plus'
|
|
|
+const dialogFormVisible = ref(false)
|
|
|
+const dialogFormVisible1 = ref(false)
|
|
|
+const ruleFormRef = ref<FormInstance>()
|
|
|
+const ruleFormRef1 = ref<FormInstance>()
|
|
|
+const showTit = ref('')
|
|
|
+const formLabelWidth = '80px'
|
|
|
+const loading = ref(false)
|
|
|
+interface RuleForm {
|
|
|
+ batchNumber: any,
|
|
|
+ enterpriseId?: any,
|
|
|
+ productId?: any,
|
|
|
+ specId: any,
|
|
|
+ type: string
|
|
|
+}
|
|
|
+const initParam = reactive<RuleForm>({//请求参数
|
|
|
+ "batchNumber": null,
|
|
|
+ "enterpriseId": null,
|
|
|
+ "productId": null,
|
|
|
+ "specId": null,
|
|
|
+ "type": 'excel'
|
|
|
+})
|
|
|
+interface RuleForm1 {
|
|
|
+ date: any,
|
|
|
+ receivingUnit?: any,
|
|
|
+ productId?: any,
|
|
|
+ type: string
|
|
|
+}
|
|
|
+const initParamWord = reactive<RuleForm1>({//请求参数
|
|
|
+ "date": null,
|
|
|
+ "receivingUnit": null,
|
|
|
+ "productId": null,
|
|
|
+ "type": 'word'
|
|
|
+})
|
|
|
+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 options5 = 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 = []
|
|
|
+ }
|
|
|
+}
|
|
|
+onMounted(async () => {
|
|
|
+ options5.value = await LotNumber()
|
|
|
+})
|
|
|
+//导出首发登记表
|
|
|
+const showFirstissue = async () => {
|
|
|
+ dialogFormVisible.value = true
|
|
|
+}
|
|
|
+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) => {
|
|
|
+ if (!formEl) return
|
|
|
+ await formEl.validate(async (valid, fields) => {
|
|
|
+ if (valid) {
|
|
|
+ const result = await inventoryExcel(initParam)
|
|
|
+ downloadExcelFun(result, '首发登记表', initParam.type=='excel'?'xlsx':'pdf')
|
|
|
+ } 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) => {
|
|
|
+ if (!formEl) return
|
|
|
+ await formEl.validate(async (valid, fields) => {
|
|
|
+ if (valid) {
|
|
|
+ const result:any = await transportWord(initParamWord)
|
|
|
+ if(showTit.value=='导出运输登记表'){
|
|
|
+ downloadExcelFun(result, '运输登记表', initParamWord.type=='word'?'docx':'pdf')
|
|
|
+ }else {
|
|
|
+ let fileAddress = URL.createObjectURL(new Blob([result], { type: `application/${initParamWord.type=='word'?'docx':'pdf'};charset=utf-8` }))
|
|
|
+ let innHtml = window.open(fileAddress, '_blank');
|
|
|
+ innHtml?.print();
|
|
|
+ }
|
|
|
+
|
|
|
+ } else {
|
|
|
+ console.log('error submit!', fields)
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
+const printFun = async (tit: any) => {
|
|
|
+ showTit.value = tit
|
|
|
+ console.log('导出', initParam)
|
|
|
+ dialogFormVisible1.value = true
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style lang="scss">
|
|
|
+/* @import url(); 引入css类 */
|
|
|
+</style>
|
YangJian0701