20231205

src/plugins/rulesData.ts

@@ -3,7 +3,7 @@ export const syrulesData = {
         required: true,
         message: '必填项',
         trigger: 'blur',
-    }],
+    }, { pattern: /^(?:[1-9]\d*)$/, message: '数量必须为正整数', trigger: "blur" }],
     date: [{
         required: true,
         message: '必填项',
@@ -14,4 +14,12 @@ export const syrulesData = {
         message: '必填项',
         trigger: 'change',
     }]
-}
+}
+
+export const columnsTable = [
+    { prop: 'quantity', label: '数量', width: 200 },    
+    { prop: 'unitPrice', label: '购进单价', width: 200 },
+    { prop: 'forwardingUnit', label: '发货单位', width: 200 },    
+    { prop: 'date', label: '入库日期', width: 200 },
+    { prop: 'operator', label: '经办人', width: 200 },    
+]

src/views/stockcontrol/storagePut/scanCode.vue

@@ -9,7 +9,7 @@
                     <el-select v-model="initParam.medicineInfo[item.field_name]" :placeholder="'请选择'+item.name" class="inputWidth" v-if="[1,2,3,4,5].includes(item.type)">
                         <el-option :label="itemIt.name" :value="itemIt.id" v-for="itemIt,i in item.list" :key="i"/>
                     </el-select>
-                    <el-input v-model="initParam.medicineInfo[item.field_name]" autocomplete="off" :placeholder="'请输入'+item.name" class="inputWidth" v-if="item.type==6"/>
+                    <el-input v-model="initParam.medicineInfo[item.field_name]" autocomplete="off" :placeholder="'请输入'+item.name" @blur="initParam.medicineInfo[item.field_name] = Number(initParam.medicineInfo[item.field_name]).toFixed(2)" class="inputWidth" v-if="item.type==6"/>
                     <el-input v-model="initParam.medicineInfo[item.field_name]" autocomplete="off" :placeholder="'请输入'+item.name" class="inputWidth" v-if="item.type==7"/>
                     <el-input v-model="initParam.medicineInfo[item.field_name]" autocomplete="off" :placeholder="'请输入'+item.name" class="inputWidth" v-if="item.type==8"/>
                     <el-date-picker v-model="initParam.medicineInfo[item.field_name]" type="date" value-format="YYYY-MM-DD" :placeholder="'请输入'+item.name" clearable style="width: 200px;" v-if="item.type==9"/>
@@ -38,30 +38,28 @@
             </el-form>
             <template #footer>
                 <span class="dialog-footer">
-                    <el-button @click="submitForm(ruleFormRef)">加入暂存</el-button>
-                    <el-button type="primary" @click="showinnerVisible">查看暂存</el-button>
+                    <el-button type="primary" @click="submitForm(ruleFormRef)">加入暂存</el-button>
+                    <el-button @click="showinnerVisible">查看暂存</el-button>
+                    <el-button type="danger" @click="resetForm(ruleFormRef)">重置数据</el-button>
                 </span>
             </template>
             <el-dialog v-model="innerVisible" title="入库数据" width="95%" append-to-body draggable :close-on-click-modal="false" :close-on-press-escape="false">
-                <el-table :data="tableData" style="width: 100%" border max-height="450"   :header-cell-style="{'background-color':'#ccc','color': 'white'}">
-                    <el-table-column fixed prop="date" label="疫苗名称" width="150" />
-                    <el-table-column prop="name" label="生产企业" width="120" />
-                    <el-table-column prop="state" label="批准文号" width="120" />
-                    <el-table-column prop="city" label="批签发合格编号" width="140" />
-                    <el-table-column prop="address" label="规格（剂/支或粒）" width="150" />
-                    <el-table-column prop="zip" label="生产日期" width="120" />
-                    <el-table-column prop="tag" label="疫苗批号" width="120" />
-                    <el-table-column prop="zip" label="疫苗效期" width="120" />
-                    <el-table-column prop="num" label="数量" width="70" />
-                    <el-table-column prop="danwei" label="单位" width="70" />
-                    <el-table-column prop="leixing" label="剂型" width="120" />
-                    <el-table-column prop="names" label="领苗人" width="80" />
-                    <el-table-column prop="fahuo" label="发货单位" width="120" />
-                    <el-table-column prop="zip" label="入库日期" width="120" />
+                <el-table :data="data.tableData" style="width: 100%" border max-height="450"   :header-cell-style="{'background-color':'#ccc','color': 'white'}">
+                    <el-table-column :label="item.label" v-for="item,i in data.columns" :key="i">
+                        <template #default="scope"><!--scope.row.medicineInfo[item.prop] -->
+                            {{ findFun(scope.row.medicineInfo[item.prop],item.list)}}
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="quantity" label="数量"/>
+                    <el-table-column prop="unitPrice" label="购进单价"/>
+                    <el-table-column prop="forwardingUnit" label="发货单位" />
+                    <el-table-column prop="date" label="入库日期"/>
+                    <el-table-column prop="operator" label="经办人"/>
+
                     <el-table-column fixed="right" label="操作" min-width="110">
                         <template #default="scope">
-                            <el-button type="primary" :icon="Edit" @click="handleClick(scope.row)" circle />
-                            <el-button type="danger" :icon="Delete" @click="delClick(scope.row)" circle />
+                            <el-button type="primary" :icon="Edit" @click="handleClick(scope.row,scope.$index)" circle />
+                            <el-button type="danger" :icon="Delete" @click="delClick(scope.$index)" circle />
                         </template>
                     </el-table-column>
                 </el-table>
@@ -78,8 +76,9 @@
 
 <script setup lang="ts">
 import { reactive, ref } from 'vue'
-import type { FormInstance, FormRules } from 'element-plus'
-import { syrulesData } from "@/plugins/rulesData";
+import type { FormInstance, FormRules} from 'element-plus'
+import { ElNotification} from 'element-plus'
+import { syrulesData,columnsTable } from "@/plugins/rulesData";
 const dialogFormVisible = ref(false)
 const ruleFormRef = ref<FormInstance>()
 
@@ -94,7 +93,7 @@ const innerVisible = ref(false)
 import { ElMessage, ElMessageBox } from 'element-plus'
 import {Delete,Edit,} from '@element-plus/icons-vue'
 const formLabelWidth = '110px'
-const initParam:any = reactive({
+let initParam:any = reactive({
     "date": "",
     "forwardingUnit": "",
     "medicineInfo": {},
@@ -102,21 +101,57 @@ const initParam:any = reactive({
     "quantity": null,
     "unitPrice":null
 })
+let data:any = reactive({
+    tableData:[],
+    showDiaData:[],
+    itemPir:[],
+    itemOpen:[],
+    rules1:{},
+    columns:[],// 渲染表格
+    selectType:[],//表格的下拉对应
+    editStrot:false,
+    editIndex:null
+}) 
+//函数
+const findFun =  (data:any,list:any)=>{
+    if(list){
+        const b = list.find((item:any) => item.id==data)
+        if(b) return b.name
+        else return ''
+    }else{
+        return data
+    }
+}
+const resetForm = (formEl: FormInstance | undefined) => {
+  if (!formEl) return
+  formEl.resetFields()
+}
+//加入暂存区
 const submitForm = async (formEl: FormInstance | undefined) => {
   if (!formEl) return
   await formEl.validate((valid, fields) => {
     if (valid) {
-      console.log('submit!',initParam)
+        ElNotification({
+            title: '暂存成功',
+            message: 'ok，加入暂存成功,右下角按钮查看/提交暂存',
+            type: 'success',
+        })
+        console.log('提交',data.editStrot)
+        if(data.editStrot){//编辑状态
+            let {date,forwardingUnit,operator,quantity,unitPrice,medicineInfo} = initParam
+            data.tableData.splice(data.editIndex,1,{date,forwardingUnit,operator,quantity,unitPrice,medicineInfo:{...medicineInfo}})
+            console.log('编辑状态',data.tableData)
+        }else{//正常添加
+            let {date,forwardingUnit,operator,quantity,unitPrice,medicineInfo} = initParam
+            data.tableData.push({date,forwardingUnit,operator,quantity,unitPrice,medicineInfo:{...medicineInfo}})
+            console.log('正常添加',data.tableData)
+        }
     } else {
-      console.log('error submit!', initParam)
+        ElMessage.error('请完善必填项')
     }
   })
 }
-let data:any = reactive({
-    showDiaData:[],
-    itemPir:[],
-    itemOpen:[]
-}) 
+
 //函数
 const closeFun = async () => {
     ElMessageBox.confirm('请检查录入数据是否已经提交，该操作将放弃录入信息，是否放弃?', '提示', {
@@ -147,172 +182,85 @@ const operatorListApi = async()=>{
 //函数
 const showinnerVisible = async ()=>{
     innerVisible.value = true
+    data.editStrot = false
+    console.log(data.tableData)
 }
+
 const showDia = async ()=>{
-    dialogFormVisible.value = true
+    data.tableData = []
+    data.showDiaData = []
+    data.itemPir = []
+    data.itemOpen = []
+    data.rules1 = []
+    data.columns = []
+    data.selectType = []
+    data.editStrot = false
+    resetFun()//复原表单
+
+    medicListStockFun()//获取入库表单
     itemPirFun()//发货单位
     operatorListApi()//经办人
+}
+//复原表单
+const resetFun = async ()=>{
+    initParam.date = ''
+    initParam.forwardingUnit = ''
+    initParam.medicineInfo = {}
+    initParam.operator = ''
+    initParam.quantity = null
+    initParam.unitPrice = null
+    resetForm(ruleFormRef.value)
+}
+//获取入库表单Api
+const medicListStockFun = async ()=>{
+    data.columns = []
     const reslut:any = await medicListStock({})
-    console.log('返回',reslut)
     if(reslut.code==200 && reslut.msg=='查询成功'){
         data.showDiaData = reslut.data.list
-        let rules1:any = {}
+        data.rules1 = {}
+        data.columns = []
+        data.selectType = []
         reslut.data.list.forEach((value:any) => { //value设置成key
+            data.selectType.push({type:value.type,list:value.list})
+            data.columns.push({ prop: value.field_name, label: value.name, list:value.list})
             initParam.medicineInfo[value.field_name] = ''; // 这里可以根据需要设置其他值作为键的内容
             if(['product_id','enterprise_id','spec_id','batch_number','expiry_date','approval_number'].includes(value.field_name)){
-                rules1['medicineInfo.'+value.field_name] = [{required: true,message: '必填项',trigger: 'change',}]
+                if(value.type==6){
+                    data.rules1['medicineInfo.'+value.field_name] =  [{required: true,message: '必填项',trigger: 'change'},{ pattern: /^([1-9]\d*|0)(\.\d{1,2})?$/, message: '请输入>=0，(最多两位小数)', trigger: "blur" },]
+                }else if(value.type==7){
+                    data.rules1['medicineInfo.'+value.field_name] =  [{required: true,message: '必填项',trigger: 'change'},{ pattern: /^(?:[1-9]\d*)$/, message: '请输入正整数', trigger: "blur" },]
+                }else{
+                    data.rules1['medicineInfo.'+value.field_name] = [{required: true,message: '必填项',trigger: 'change',}]
+                }
             }
         });
-        Object.assign(rules,{...rules1,...syrulesData})
+        Object.assign(rules,{...data.rules1,...syrulesData})
+        console.log('表格', data.selectType)
+        dialogFormVisible.value = true
     }
 }
 
-const handleClick = (data:any) => {
-  console.log('click',data)
+const handleClick = (datas:any,index:any) => {
+  data.editStrot = true
+  data.editIndex = index
+  let {date,forwardingUnit,operator,quantity,unitPrice,medicineInfo} = datas
+  Object.assign(initParam,{date,forwardingUnit,operator,quantity,unitPrice,medicineInfo:{...medicineInfo}})
+  innerVisible.value = false
 }
-const delClick = (data:any) => {
-  console.log('click',data)
-  window.print()
+const delClick = (index:any) => {
+    ElMessageBox.confirm('删除一条信息，是否继续?','删除',{
+      confirmButtonText: '确认删除',
+      cancelButtonText: 'Cancel',
+      type: 'warning',
+      center: true,
+    }).then(() => {
+        data.tableData.splice(index, 1);
+      ElMessage.success('已删除')
+    })
+      
+//   window.print() //打印
 }
 
-const tableData = [
-  {
-    date: '马蜂二联疫苗',
-    name: '成都生物',
-    state: 'S19980016',
-    city: 'LRA20190005',
-    address: '0.25mg',
-    zip: '2022-11-22',
-    tag: '20141a072',
-    num:'870',
-    danwei:'支',
-    leixing:'注射剂',
-    names:'张xx',
-    fahuo:'疾控中心',
-  },
-  {
-    date: '马蜂二联疫苗',
-    name: '成都生物',
-    state: 'S19980016',
-    city: 'LRA20190005',
-    address: '0.25mg',
-    zip: '2022-11-22',
-    tag: '20141a072',
-    num:'870',
-    danwei:'支',
-    leixing:'注射剂',
-    names:'张xx',
-    fahuo:'疾控中心',
-  },{
-    date: '马蜂二联疫苗',
-    name: '成都生物',
-    state: 'S19980016',
-    city: 'LRA20190005',
-    address: '0.25mg',
-    zip: '2022-11-22',
-    tag: '20141a072',
-    num:'870',
-    danwei:'支',
-    leixing:'注射剂',
-    names:'张xx',
-    fahuo:'疾控中心',
-  },
-  {
-    date: '马蜂二联疫苗',
-    name: '成都生物',
-    state: 'S19980016',
-    city: 'LRA20190005',
-    address: '0.25mg',
-    zip: '2022-11-22',
-    tag: '20141a072',
-    num:'870',
-    danwei:'支',
-    leixing:'注射剂',
-    names:'张xx',
-    fahuo:'疾控中心',
-  },{
-    date: '马蜂二联疫苗',
-    name: '成都生物',
-    state: 'S19980016',
-    city: 'LRA20190005',
-    address: '0.25mg',
-    zip: '2022-11-22',
-    tag: '20141a072',
-    num:'870',
-    danwei:'支',
-    leixing:'注射剂',
-    names:'张xx',
-    fahuo:'疾控中心',
-  },
-  {
-    date: '马蜂二联疫苗',
-    name: '成都生物',
-    state: 'S19980016',
-    city: 'LRA20190005',
-    address: '0.25mg',
-    zip: '2022-11-22',
-    tag: '20141a072',
-    num:'870',
-    danwei:'支',
-    leixing:'注射剂',
-    names:'张xx',
-    fahuo:'疾控中心',
-  },{
-    date: '马蜂二联疫苗',
-    name: '成都生物',
-    state: 'S19980016',
-    city: 'LRA20190005',
-    address: '0.25mg',
-    zip: '2022-11-22',
-    tag: '20141a072',
-    num:'870',
-    danwei:'支',
-    leixing:'注射剂',
-    names:'张xx',
-    fahuo:'疾控中心',
-  },
-  {
-    date: '马蜂二联疫苗',
-    name: '成都生物',
-    state: 'S19980016',
-    city: 'LRA20190005',
-    address: '0.25mg',
-    zip: '2022-11-22',
-    tag: '20141a072',
-    num:'870',
-    danwei:'支',
-    leixing:'注射剂',
-    names:'张xx',
-    fahuo:'疾控中心',
-  },{
-    date: '马蜂二联疫苗',
-    name: '成都生物',
-    state: 'S19980016',
-    city: 'LRA20190005',
-    address: '0.25mg',
-    zip: '2022-11-22',
-    tag: '20141a072',
-    num:'870',
-    danwei:'支',
-    leixing:'注射剂',
-    names:'张xx',
-    fahuo:'疾控中心',
-  },
-  {
-    date: '马蜂二联疫苗',
-    name: '成都生物',
-    state: 'S19980016',
-    city: 'LRA20190005',
-    address: '0.25mg',
-    zip: '2022-11-22',
-    tag: '20141a072',
-    num:'870',
-    danwei:'支',
-    leixing:'注射剂',
-    names:'张xx',
-    fahuo:'疾控中心',
-  },
-]
 </script>
 <style lang="scss">
 .inputWidth {

vue.config.js

@@ -12,7 +12,7 @@ module.exports = {
 	outputDir: '出入库管理系统',// 输出文件目录(默认dist)
 	devServer: {
 		open: false,//打开浏览器
-		host: '0.0.0.0',
+		// host: '0.0.0.0',
 		// proxy: {
 		// 	[process.env.VUE_APP_BASE_API]: {
 		// 		target: process.env.VUE_APP_BASE_URL,