240228

env.development

@@ -5,7 +5,7 @@ VUE_APP_BASE_URL2 = 'https://godown.coldbaozhida.com/godown/'
 
 
 
-VUE_APP_BASE_URL_PORT1 = '8100/' 
+VUE_APP_BASE_URL_PORT1 = '8100/'  
 VUE_APP_BASE_URL_PORT2 = '8110/'
 
 

env.production

@@ -1,9 +1,9 @@
 NODE_ENV = 'production'
 
-VUE_APP_BASE_URL1 = 'https://godown.coldbaozhida.com/oauth/'
-VUE_APP_BASE_URL2 = 'https://godown.coldbaozhida.com/godown/'
 
 
+VUE_APP_BASE_URL1 = 'https://godown.coldbaozhida.com/oauth/'
+VUE_APP_BASE_URL2 = 'https://godown.coldbaozhida.com/godown/'
 
 
 

src/api/module/medicine.ts

@@ -3,5 +3,8 @@ import $http from '@/utils/index'
 
 
 
-// 销售管理-列表
+// 药品-列表
 export const medicineList = (params: any) => $http.post('/medicine-img/list', params)
+
+// 药品-提交上传图片
+export const medicineimgedit = (params: any) => $http.post('/medicine-img/edit', params)

src/components/table.vue

@@ -120,6 +120,7 @@ getTableList,tableColumns,props
 
 </script>
 <style lang="scss">
+
 .y-tabs {
   background: var(--y-card-background);
   border-radius: var(--y-radius);

src/views/medicine/medicineManage/Scaninquire.vue

@@ -0,0 +1,42 @@
+<!-- saomachax扫码查询 -->
+<template>
+    <div class="Scaninquire">
+        <el-button round type="primary" :icon="Camera" @click="showdialog">扫码查询</el-button>
+        <el-drawer v-model="centerDialogVisible" direction="ttb" append-to-body destroy-on-close>
+            <inputSearch ref="inputSearchRef" @inputSearchData="inputSearchfn" />
+        </el-drawer>
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ref, nextTick, reactive } from "vue";
+import { Camera } from '@element-plus/icons-vue'
+import inputSearch from "./inputSearch.vue";
+import {
+    medicMsfx
+} from "@/api";
+const centerDialogVisible = ref(false)
+const inputSearchRef = ref<InstanceType<typeof inputSearch> | null>(null)
+
+const showdialog = () => {
+    centerDialogVisible.value = true
+    nextTick(() => {
+        inputSearchRef.value?.ClearFn()
+        inputSearchRef.value?.inputFocus()
+    })
+}
+const emit: any = defineEmits(['scanFun'])
+/**
+ * 搜索
+ * @param 追溯码
+ */
+const inputSearchfn = async (e: any) => {
+    const reslut: any = await medicMsfx({ code: e })
+    if (reslut.code == 200) {
+        emit('scanFun',reslut.data[0]);
+    }
+}
+</script>
+<style lang="scss">
+/* @import url(); 引入css类 */
+</style>

src/components/files.vue → src/views/medicine/medicineManage/files.vue

@@ -1,6 +1,6 @@
 <template>
     <div class="files">
-        <el-drawer v-model="drawer" direction="rtl" append-to-body>
+        <el-drawer v-model="drawer" direction="rtl" append-to-body style="min-width: 500px;">
             <template #header>
                 <h4>上传图片</h4>
             </template>
@@ -9,7 +9,8 @@
                     <el-upload v-model:file-list="fileList" multiple 
                         action="#" 
                         list-type="picture-card"
-                        :before-upload="beforeUpload"  
+                        :on-change="beforeUpload"
+                        :auto-upload="false"
                         :on-preview="handlePictureCardPreview">
                         <el-icon>
                             <Plus />
@@ -32,26 +33,31 @@
 </template>
 
 <script lang="ts" setup>
-import { ref } from "vue";
+import { ref,reactive} from "vue";
 import * as qiniu from 'qiniu-js';
-import { upFileToken } from "@/api";
+import { upFileToken,medicineimgedit } from "@/api";
 import type { UploadProps, UploadUserFile } from 'element-plus'
 
 const dialogImageUrl = ref('')
 const dialogVisible = ref(false)
 
-const fileList = ref<UploadUserFile[]>([])//上传的图片列表
+const fileList:any = ref<UploadUserFile[]>([])//上传的图片列表
 
 const beforeUpload = async(file:any) => {  
-    // 这里可以添加文件类型、大小等校验逻辑  
-    // 如果校验通过，返回 true 继续上传；否则返回 false 终止上传  
+    console.log('上传',file)
     var strtype:any = file.name.substring(file.name.lastIndexOf('.') + 1); //获取后缀 png jpg
     const token:any = await upFileTokenApi(strtype)
     handleUpload(file,token.data);
 }
-
+//获取token
+const upFileTokenApi = async (strtype:any)=>{
+    return await upFileToken({T_suffix: strtype})
+}
+/**
+ * 上传七牛云
+ */
 const handleUpload = (file:any,qiniuToken:any)=> {  
-    console.log('上传文件',file,qiniuToken,qiniu)
+    
     var config = {
         useCdnDomain: false, //表示是否使用 cdn 加速域名，为布尔值，true 表示使用，默认为 false。
         region: qiniu.region.z2,
@@ -64,13 +70,13 @@ const handleUpload = (file:any,qiniuToken:any)=> {
         mimeType: [] || null
     };
     var key = file.name || null
-    // const observable = qiniu.upload(file, key, qiniuToken);  
+    const observable = qiniu.upload(objectToBinary(file), key, qiniuToken);  
 
-    const observable = qiniu.upload(file, key, qiniuToken, putExtra, config);  
+    // const observable = qiniu.upload(file, key, qiniuToken, putExtra, config);  
     observable.subscribe({  
       next(res:any) {  
         // 上传进度信息  
-        console.log(`上传进度信息: ${res}`);  
+        console.log(res);  
       },  
       error(err:any) {  
         // 上传错误信息  
@@ -78,15 +84,32 @@ const handleUpload = (file:any,qiniuToken:any)=> {
       },  
       complete(res:any) {  
         // 上传完成信息  
-        console.log(`${res}`);  
+        const j = fileList.value.findIndex((item:any)=>{return item.name == file.name})
+        fileList.value[j] = { name: file.name, url: res.key }
         // 更新你的文件列表或进行其他操作  
-        fileList.value.push({ name: file.name, url: res.key });  
       },  
     });  
   }
 
   
-
+const objectToBinary = (obj:any)=> {
+    // 将对象转换为JSON字符串
+    const jsonStr = JSON.stringify(obj);
+    // 将字符串转换为二进制数据
+    const binaryStr = unescape(encodeURIComponent(jsonStr));
+    // 创建Blob对象
+    const blob = new Blob([binaryStr], { type: 'application/octet-stream' });
+    // 创建File对象
+    const file = new File([blob], "filename.bin", {
+        type: 'application/octet-stream',
+    });
+    return file;
+}
+ 
+// 示例用法
+const obj = { key: "value" };
+const file = objectToBinary(obj);
+console.log(file);
 
 
 
@@ -94,27 +117,44 @@ const handleUpload = (file:any,qiniuToken:any)=> {
  * 查看图片
  */
 const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
-    console.log('')
   dialogImageUrl.value = uploadFile.url!
   dialogVisible.value = true
 }
 
 const drawer = ref(false)
 
+//请求参数
+const initParam:any = reactive({
+    "id": "",//生产企业
+    "img": "",//图片地址逗号分隔
+})
+
 const confirmClick = () => {
-    console.log('提交',fileList.value)
+    let arr = [...fileList.value]
+    let array:any = []
+    arr.forEach((item)=>{
+        array.push(item.url)
+    })
+    initParam.img = array.join(',')
+    setMedicineeditApi()
+}
+
+const emit:any = defineEmits(['upTable'])
+const setMedicineeditApi = async()=>{
+    const reslut:any = await medicineimgedit(initParam)
+    if(reslut.code==200){
+        emit('upTable', '');
+        drawer.value = false
+    }
 }
 const showDrawer = () => {
     drawer.value = true
 }
-//函数
-const upFileTokenApi = async (strtype:any)=>{
-    return await upFileToken({T_suffix: strtype})
-}
+
 
 //暴露方法
 defineExpose({
-    showDrawer
+    showDrawer,initParam
 })
 </script>
 <style lang="scss">

src/views/medicine/medicineManage/index.vue

@@ -1,122 +1,187 @@
 <!--  -->
 <template>
   <div class="medicineManage">
-      <searchAdd isButtom="查询" :inline="true" @event="eventFun">
+      <searchAdd isButtom="查询" :inline="true" @event="eventFun"> 
           <template #searchConter>
-              <el-form-item label="日期">
-                  <el-date-picker v-model="data.datePicker" type="daterange" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
-                      start-placeholder="开始时间" end-placeholder="结束时间" clearable style="width: 200px;" @change="changeTime"/>
-              </el-form-item>
-              <el-form-item label="品种">
-                  <el-select v-model="data.initParam.productId" placeholder="品种" clearable @clear="data.initParam.productId=null">
-                      <el-option :label="item.name" :value="item.id" v-for="item,index in data.prodOptions" :key="index"/>
+              <el-form-item label="生产企业">
+                  <el-select v-model.number="data.initParam.enterprise" filterable remote reserve-keyword placeholder="生产企业"
+                      :remote-method="remoteMethod1" :loading="loading" clearable @clear="data.initParam.enterprise = null"
+                      @click="click1" style="width: 200px;">
+                      <el-option v-for="item in options1" :key="item.value" :label="item.label" :value="item.label" />
                   </el-select>
               </el-form-item>
-              <el-form-item label="购货单位">
-                  <el-select v-model="data.initParam.receivingUnit" filterable remote reserve-keyword placeholder="购货单位"
-                      :remote-method="remoteMethod" :loading="loading" @click="click2" clearable style="width: 200px;">
-                      <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
+              <el-form-item label="品名">
+                  <el-select v-model.number="data.initParam.product" filterable remote reserve-keyword placeholder="品名"
+                      :remote-method="remoteMethod2" :loading="loading" clearable @clear="data.initParam.product = null"
+                      @click="click2" style="width: 200px;">
+                      <el-option v-for="item in options2" :key="item.value" :label="item.label" :value="item.label" />
                   </el-select>
               </el-form-item>
+              <el-form-item label="规格">
+                  <el-input v-model="data.initParam.spec" placeholder="规格" clearable style="width: 200px;" />
+              </el-form-item>
+              <el-form-item label="批号">
+                  <el-input v-model="data.initParam.batchNumber" placeholder="批号" clearable style="width: 200px;" />
+              </el-form-item>
           </template>
       </searchAdd>
       <bg istitle="基本信息">
+          <template #btn>
+            <Scaninquire ref="scanRef" @scanFun="scanFun"></Scaninquire>
+          </template>
           <template #bg>
-              <tables ref="TableRef" :requestApi="salesList" :columns="columns" :initParam="data.initParam">
+              <tables ref="TableRef" :requestApi="medicineList" :columns="columns" :initParam="data.initParam">
+                <template #imgUrl="{ row }">
+                  <el-image
+                      style="width: 30px; height: 30px"
+                      :src="row.imgUrl"
+                      :zoom-rate="1.2"
+                      :max-scale="7"
+                      :min-scale="0.2"
+                      :preview-src-list="row.crcList"
+                      :initial-index="4"
+                      fit="cover">
+                  </el-image>
+                </template>
                 <template #right="{ row }">
-                    <el-button link type="primary" size="small">查看</el-button>
-                    <el-button link type="danger" size="small" @click="filesFn">上传</el-button>
+                    <!-- <el-button link type="primary" size="small" @click="showImgFn(row)">查看</el-button> -->
+                    <el-button link type="primary" size="small" @click="filesFn(row)">上传</el-button>
                 </template>
               </tables>
           </template>
       </bg>
-      <files ref="FilesRef"></files>
+      <files ref="FilesRef" @upTable="upTableFun"></files>
   </div>
 </template>
 
 <script setup lang="ts">
 import { reactive, ref, onMounted,nextTick} from 'vue'
-import { medicineList,prodList,stockunit,salesList} from "@/api";
-
+import { medicineList,
+  enterpriseList,//生产企业
+  prodList} from "@/api";
 import tables from "@/components/table.vue";
-import files from "@/components/files.vue";
+import files from "./files.vue";
+import Scaninquire from "./Scaninquire.vue";
+
+
 import searchAdd from "@/components/searchAdd.vue";
 import bg from '@/components/bg.vue'
 const TableRef = ref()
 const FilesRef = ref()
 
-//函数
-const filesFn = async ()=>{
+
+//上传图片
+const filesFn = async (row:any)=>{
   FilesRef.value.showDrawer()
+  FilesRef.value.initParam.id = row.id
 }
-const loading = ref(false)
-interface ListItem {
-  value: string
-  label: string
+//函数
+const upTableFun = async ()=>{
+  TableRef.value?.getTableList()
 }
-const list = ref<ListItem[]>([])
-const options = ref<ListItem[]>([])
-  const click2 = async ()=>{options.value = list.value }
+const loading = ref(false)
+
+
 onMounted(async() => {
-  prodListApi()
-  const result:any = await stockunit({type:2,name:''})
-  let arr = result.data?.list || []
-  list.value = arr.map((item:any) => {
-      return { value: item, label: item}
-  })
+  const result1: any = await enterpriseList({ age: 1, pageSize: 999 })//生产企业
+  list1.value = findMap(result1.data?.list || [], 'obj')
+
+  const result2: any = await prodList({ age: 1, pageSize: 999 })//品名
+  list2.value = findMap(result2.data?.list || [], 'obj')
 })
-//品名
-const prodListApi = async ()=>{
-  const result:any = await prodList({"page": 1,"pageSize": 99999})
-  data.prodOptions = result.data?.list
+
+
+
+interface ListItem {
+    value: string
+    label: string
 }
-const remoteMethod = async(query: string) => {
-  if (query) {
-      loading.value = true
-      setTimeout(() => {
-          loading.value = false
-          options.value =  list.value.filter((item:any) => {
-              return item.label.toLowerCase().includes(query.toLowerCase())
-          })
-      }, 200)
-  } else {
-      options.value = []
-  }
+//筛选出option需要的数据格式
+const findMap = (arr: any, obj: any) => {
+    return arr.map((item: any) => {
+        return { value: obj == 'obj' ? item.id : item, label: obj == 'obj' ? item.name : item }
+    })
 }
+const list1 = ref<ListItem[]>([])//生产企业
+const list2 = ref<ListItem[]>([])//品名
+
+
+const options1 = ref<ListItem[]>([])//生产企业
+const options2 = ref<ListItem[]>([])//品名
+
+
+const click1 = async () => { options1.value = list1.value }//生产企业
+const click2 = async () => { options2.value = list2.value }//品名
+
+
+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) => {
+                return item.label.toLowerCase().includes(query.toLowerCase())
+            })
+        }, 200)
+    } else {
+      options2.value = []
+    }
+}
+
+
+
+
+
 
 
 // 渲染表格
 const columns: any = [
-  { prop: 'date', label: '名称', width: 120 },
-  { prop: 'receiving_unit', label: '批号', width: 120},
-  { prop: 'product_name', label: '失效日期', width: 120},
-  { prop: 'enterprise_name', label: '生产日期', width: 120},
-  { prop: 'spec_name', label: '批准文号', width: 120},
-  { prop: 'dosage_form_name', label: '生产企业', width: 120},
-  { prop: 'batch_number', label: '规格（剂/粒/支）', width: 150},
-  { prop: 'unit_name', label: '单位', width: 120},
-  { prop: 'quantity', label: '剂型', width: 120},
-  { prop: 'unit_price', label: '批签发合格编号', width: 150},
-  { prop: 'operation', label: '图片', fixed: 'right', 'min-width': 150 }
+  { prop: 'product', label: '名称', width: 150 },
+  { prop: 'batchNumber', label: '批号', width: 120},
+  { prop: 'expiryDate', label: '失效日期', width: 120},
+  { prop: 'productionDate', label: '生产日期', width: 120},
+  { prop: 'approvalNumber', label: '批准文号', width: 150},
+  { prop: 'enterprise', label: '生产企业', width: 150},
+  { prop: 'spec', label: '规格（剂/粒/支）', width: 150},
+  { prop: 'unit', label: '单位', width: 120},
+  { prop: 'dosageForm', label: '剂型', width: 120},
+  { prop: 'qualificationNumber', label: '批签发合格编号', width: 150},
+  { prop: 'imgurl', label: '预览', width: 150, name: 'imgUrl' },
+  { prop: 'operation', label: '操作', fixed: 'right', 'min-width': 150 }
 ]
 
 //请求参数
 const data:any = reactive({
-  datePicker: [],//时间选择
-  prodOptions:[],
   initParam: {
-      "endDate": "",
-      "startDate": "",
-      "productId":null,
-      "receivingUnit": ""
+    "enterprise": "",//生产企业
+    "product": "",//品名
+    "spec": "",//规格
+    "batchNumber": ""//批号
   }
 })
 
-//函数
-const changeTime = async () => {
-  if(data.datePicker){data.initParam.startDate = data.datePicker[0];data.initParam.endDate = data.datePicker[1]}
-  else {data.initParam.startDate='';data.initParam.endDate = ''}
+//扫码搜索
+const scanFun = async (obj:any)=>{
+  data.initParam.enterprise = obj.enterprise_name
+  data.initParam.product = obj.product_name
+  data.initParam.spec = obj.spec_name
+  data.initParam.batchNumber = obj.batch_number
+  eventFun()
 }
+
 //搜索
 const eventFun = async ()=>{
   nextTick(() => {

src/views/medicine/medicineManage/inputSearch.vue

@@ -0,0 +1,128 @@
+<template>
+    <div class="Qr">
+        <div class="Qr-img">
+            <img src="@/assets/img/BarCodeQR.svg" style="width: 80%;height: 80%;">
+        </div>
+        <div class="Qr-input">
+            <input class="Qr-input-type" ref="myInput" v-model="data.value" type="text" :placeholder="props.placeholderData" style="background:#f7f7f7;">
+        </div>
+        <div class="Qr-isButton">
+            <div class="Qr-isButton-icons" @click="onSubmit"><el-icon><Search /></el-icon></div>
+            <div class="Qr-isButton-icons" @click="CloseFn"><el-icon><Close /></el-icon></div>
+        </div>
+        <!-- <button class="Qr-isButton" @click="onSubmit">确认搜索</button> -->
+    </div>
+</template>
+
+<script setup lang="ts">
+import { ref, reactive} from "vue";
+import { ElMessage } from 'element-plus'
+const myInput = ref()
+const data: any = reactive({
+    value: '',
+    num:0
+})
+const props = defineProps({
+    placeholderData:({
+        type:String,
+        default: () =>'请扫描追溯码'
+    })
+})
+const emit: any = defineEmits(['inputSearchData',])
+//函数
+const inputFocus = async () => {
+    setTimeout(() => {
+        if(myInput.value!=null)myInput.value.focus()
+    }, 1000)
+}
+//函数
+const CloseFn = async () => {
+    ClearFn()
+    setTimeout(() => {
+        if(myInput.value!=null)myInput.value.focus()
+    }, 1000)
+}
+/**
+ * 清空
+ */
+const ClearFn = async ()=>{
+    data.value = '';
+}
+
+document.addEventListener('keydown',(event:any)=>{
+    data.num += 1
+    if(data.num == 1){data.value = ''}
+    if (event.code === 'Enter') { // 判断是否按下了回车键
+        data.value = event.target.value; // 获取扫描枪输入框的值    
+        onSubmit()
+    }
+})
+const onSubmit = async () => {
+    if(data.value){
+        emit('inputSearchData', data.value);data.num = 0 
+    }else{
+        ElMessage.error('点击输入框在使用扫码枪扫码')
+        inputFocus()
+        return
+    }
+}
+defineExpose({
+    inputFocus, data,ClearFn
+})
+</script>
+<style lang="scss">
+/* @import url(); 引入css类 */
+.Qr {
+    display: flex;
+    margin-bottom: 20px;
+    background-color: #f7f7f7;
+    min-width: 450px;
+    width: 50%;
+    margin: 0 auto;
+    &-img {
+        width: 30px;
+        height: 30px;
+        margin-top: 10px;
+        margin-bottom: 10px;
+        padding: 0 20px;
+        flex-shrink: 0;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        border-right: .5px solid #409eff;
+        user-select: none;
+    }
+
+    &-input {
+        flex: 1;
+        padding: 0 20px;
+        display: flex;
+        align-items: center;
+        &-type {
+            outline: none;
+            border: none;
+            flex: 1;
+            font-weight: bold;
+            font-size: 18px;
+        }
+    }
+
+    &-isButton {
+        min-width: 100px;
+        flex-shrink: 0;
+        cursor: pointer;
+        user-select: none;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        &-icons{
+            flex: 1;
+            display: flex;
+            justify-content: center;
+            color: #666
+        }
+        &-icons:hover{
+            color: red;
+        }
+    }
+}</style>

src/views/medicine/medicineManage/showImg.vue

@@ -0,0 +1,46 @@
+<template>
+    <div class="demo-image__preview">
+      <el-image
+        style="width: 100px; height: 100px"
+        :src="url"
+        :zoom-rate="1.2"
+        :max-scale="7"
+        :min-scale="0.2"
+        :preview-src-list="srcList"
+        :initial-index="4"
+        fit="cover">
+    </el-image>
+    </div>
+  </template>
+  
+  <script lang="ts" setup>
+  import {  ref} from "vue";
+  const imgurl ='https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg'
+  const srcList = [
+    'https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg',
+    'https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg',
+    'https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg',
+    'https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg',
+    'https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg',
+    'https://fuss10.elemecdn.com/3/28/bbf893f792f03a54408b3b7a7ebf0jpeg.jpeg',
+    'https://fuss10.elemecdn.com/2/11/6535bcfb26e4c79b48ddde44f4b6fjpeg.jpeg',
+  ]
+  //暴露方法
+defineExpose({
+    
+})
+  </script>
+  
+  <style scoped>
+  .demo-image__error .image-slot {
+    font-size: 30px;
+  }
+  .demo-image__error .image-slot .el-icon {
+    font-size: 30px;
+  }
+  .demo-image__error .el-image {
+    width: 100%;
+    height: 200px;
+  }
+  </style>
+  

src/views/salesmanagement/sellManage/index.vue

@@ -7,8 +7,8 @@
                     <el-date-picker v-model="data.datePicker" type="daterange" format="YYYY-MM-DD" value-format="YYYY-MM-DD"
                         start-placeholder="开始时间" end-placeholder="结束时间" clearable style="width: 200px;" @change="changeTime"/>
                 </el-form-item>
-                <el-form-item label="品种">
-                    <el-select v-model="data.initParam.productId" placeholder="品种" clearable @clear="data.initParam.productId=null">
+                <el-form-item label="品名">
+                    <el-select v-model="data.initParam.productId" placeholder="品名" clearable @clear="data.initParam.productId=null">
                         <el-option :label="item.name" :value="item.id" v-for="item,index in data.prodOptions" :key="index"/>
                     </el-select>
                 </el-form-item>