web_dist/src/views/yp-codg/YpInMatch.vue

<template>
  <div class="layout_container">
    <header>
      <el-input v-model.trim="inDocuNo" class="w-50 m-2" style="width: 220px" placeholder="请输入入库单号" clearable>
        <template #prepend>入库单号</template>
      </el-input>
      <el-input v-model.trim="reptNo" class="w-50 m-2" style="width: 220px; margin-left: 3px" placeholder="请输入传票号" clearable>
        <template #prepend>传票号</template>
      </el-input>
      <el-select v-model="supplyCode" placeholder="请选择供应商" style="width: 240px; margin-left: 3px" filterable clearable>
        <el-option v-for="item in supplyList" :key="item.value" :label="item.label" :value="item.value">
        </el-option>
      </el-select>
      <el-select v-model="groupNo" placeholder="请选择药库" style="width: 140px; margin-left: 3px">
        <el-option v-for="item in groupNoYkData" :key="item.value" :label="item.label" :value="item.value">
        </el-option>
      </el-select>
      <el-date-picker v-model="dateRange" type="daterange" range-separator="至" start-placeholder="开始日期" :clearable="false"
                      end-placeholder="结束日期" :shortcuts="shortcuts" style="width: 300px; margin-left: 3px">
      </el-date-picker>
      <el-divider direction="vertical" />
      <el-button type="primary" icon="Search" @click="queryCodgData" style="margin-left: 5px">查询</el-button>
    </header>
    <div class="layout_main">
      <el-tabs class="el-tabs__fill" v-model="editableTabsValue" type="border-card" @tab-click="handleClick">
        <el-tab-pane key="inMatch" label="入库匹配" name="inMatch">
          <div class="layout_display_flex_y">
            <div class="layout_flex_1-y">
              <el-table :data="inMatchData.slice(pageSize * (currentPage - 1), pageSize * currentPage)" border
                        stripe highlight-current-row height="100%">
                <el-table-column type="index" label="序号" width="50" fixed/>
                <el-table-column prop="isMatch" label="是否下载" width="80" fixed>
                  <template #default="scope">
                    <el-button v-if="scope.row.isMatch === '1'" type="primary" size="small">已下载</el-button>
                    <el-button v-else-if="scope.row.isMatch === '0' " type="warning" size="small">未下载</el-button>
                    <el-button v-else type="primary" size="small">其他</el-button>
                  </template>
                </el-table-column>
                <el-table-column prop="inDate" label="入库日期" width="140" />
                <el-table-column prop="inDocuNo" label="入库单号" width="100" />
                <el-table-column prop="inSeri" label="入库序号" width="60" />
                <el-table-column prop="reptNo" label="传票号" width="160" />
                <el-table-column prop="purchaserName" label="采购员" width="80"/>
                <el-table-column prop="supplyId" label="供应商企业代码" width="150"/>
                <el-table-column prop="supplyName" label="供应商" width="240"/>
                <el-table-column prop="chargeName" label="药品" width="220" show-overflow-tooltip/>
                <el-table-column prop="specification" label="药品规格" width="150"/>
                <el-table-column prop="buyAmt" label="购入数量" width="80"/>
                <el-table-column prop="buyPrice" label="购入金额" width="80"/>
                <el-table-column prop="manuNo" label="生产批号" width="120"/>
                <el-table-column prop="producingDate" label="生产日期" width="140"/>
                <el-table-column prop="effDate" label="有效期止" width="100"/>
                <el-table-column fixed="right" prop="cz" label="操作" min-width="200" width="200" header-align="center" align="center">
                  <template #default="scope">
                    <el-button type="primary" size="small" @click="downloadCodg(scope.row)">下载追溯码</el-button>
                    <el-button type="danger" size="small" v-if="scope.row.isMatch === '1'" @click="queryYpMatchDetail(scope.row)">追溯码明细
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
            <div>
              <el-pagination :current-page="currentPage" :page-size="pageSize" :page-sizes="[10, 15, 20, 25]"
                             :total="inMatchData.length" layout="total, sizes, prev, pager, next, jumper"
                             style="margin-top: 5px" @size-change="handleSizeChange"
                             @current-change="handleCurrentChange">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
        <el-tab-pane key="codgLine" label="追溯码数据集" name="codgLine">
          <div class="layout_display_flex_y">
            <div class="layout_flex_1-y">
              <el-table :data="codgLineData.slice(pageSizeLine * (currentPageLine - 1), pageSizeLine * currentPageLine)" border
                        stripe highlight-current-row height="100%">
                <el-table-column type="index" label="序号" width="50" />
                <el-table-column prop="medListCodg" label="医疗目录编码" width="180" />
                <el-table-column prop="medinsListCodg" label="医药机构目录编码" width="180" />
                <el-table-column prop="medinsListName" label="医药机构目录名称" width="180" v-if="false"/>
                <el-table-column prop="delvBchno" label="传票号" width="150"/>
                <el-table-column prop="fixmedinsCode" label="医疗机构编码" width="100" />
                <el-table-column prop="fixmedinsName" label="医疗机构名称" width="120" />
                <el-table-column prop="bigPacTracCodg" label="大包装追溯码" width="150"/>
                <el-table-column prop="midPacTracCodg" label="中包装追溯码" width="150"/>
                <el-table-column prop="smlPacTracCodg" label="小包装追溯码" width="150"/>
                <el-table-column prop="delventpUscc" label="供应商企业代码" width="150"/>
                <el-table-column prop="delventpName" label="供应商企业名称" width="130" show-overflow-tooltip/>
                <el-table-column prop="delventpProdInvTracId" label="企业配送商品追溯信息ID" width="160"/>
                <el-table-column prop="delvDate" label="配送日期" width="140"/>
                <el-table-column prop="delvOpter" label="配送操作员" width="70"/>
                <el-table-column prop="drugProdname" label="药品商品名称" width="240" show-overflow-tooltip/>
                <el-table-column prop="drugSpec" label="药品规格" width="160" show-overflow-tooltip/>
                <el-table-column prop="drugDosform" label="药品剂型" width="80"/>
                <el-table-column prop="manuBchno" label="生产批次号" width="100"/>
                <el-table-column prop="manuDate" label="生产日期" width="140"/>
                <el-table-column prop="expyEnd" label="有效期止" width="140"/>
                <el-table-column prop="prodentpName" label="生产企业名称" width="130" show-overflow-tooltip/>
                <el-table-column prop="prop" label="包装比例" width="70"/>
                <el-table-column prop="rxFlag" label="处方药标志" width="70"/>
                <el-table-column prop="rxFlagName" label="是否处方药" width="80"/>
                <el-table-column prop="aprvno" label="批准文号" width="140" show-overflow-tooltip/>
                <el-table-column prop="barcode" label="药品条形码" width="120"/>
                <el-table-column prop="invChgType" label="库存变更类型" width="90"/>
                <el-table-column prop="pric" label="单价" width="100"/>
                <el-table-column prop="cnt" label="数量" width="90"/>
                <el-table-column prop="minPacCnt" label="最小包装数量" width="90"/>
                <el-table-column prop="minPacunt" label="最小包装单位" width="90"/>
                <el-table-column prop="minPrepunt" label="最小制剂单位" width="90"/>
                <el-table-column prop="crteTime" label="数据创建时间" width="140"/>
                <el-table-column prop="updtTime" label="数据更新时间" width="140"/>
                <el-table-column prop="regName" label="注册名称" width="170"/>
                <el-table-column prop="valiFlag" label="有效标志" width="70"/>
                <el-table-column prop="valiFlagName" label="是否有效" width="70"/>
                <el-table-column prop="upldStas" label="上传状态" width="70"/>
                <el-table-column prop="upldStasName" label="上传状态名称" width="100"/>
                <el-table-column prop="upldRslt" label="上传结果描述" width="120" show-overflow-tooltip/>
                <el-table-column prop="optTime" label="经办时间" width="140"/>
                <el-table-column prop="memo" label="备注" width="160" show-overflow-tooltip/>
              </el-table>
            </div>
            <div>
              <el-pagination :current-page="currentPageLine" :page-size="pageSizeLine" :page-sizes="[10, 15, 20, 25]"
                             :total="codgLineData.length" layout="total, sizes, prev, pager, next, jumper"
                             style="margin-top: 5px" @size-change="handleSizeChangeLine"
                             @current-change="handleCurrentChangeLine">
              </el-pagination>
            </div>
          </div>
        </el-tab-pane>
      </el-tabs>
    </div>
    <el-dialog v-model="dialogFormDownload" title="下载追溯码" width="500" draggable :before-close="handleClose"
               :close-on-press-escape="false" :close-on-click-modal="false" destroy-on-close>
      <el-form :model="formData">
        <el-input v-model="formData.serial" v-show="false" />
        <el-form-item label="入库单号" :label-width="formLabelWidth">
          <el-input v-model="formData.inDocuNo" disabled />
        </el-form-item>
        <el-form-item label="传票号" :label-width="formLabelWidth">
          <el-input v-model="formData.delvBchno" disabled />
        </el-form-item>
        <el-form-item label="供应商企业代码" :label-width="formLabelWidth">
          <el-input v-model="formData.delventpUscc" disabled />
        </el-form-item>
        <el-form-item label="供应商" :label-width="formLabelWidth">
          <el-input v-model="formData.delventpName" disabled />
        </el-form-item>
        <el-form-item label="购入数量" :label-width="formLabelWidth">
          <el-input v-model.trim="formData.buyAmt" disabled />
        </el-form-item>
        <el-form-item label="下载页数" :label-width="formLabelWidth">
          <el-input v-model.trim="formData.pageNum" autocomplete="off" />
        </el-form-item>
        <el-form-item label="每页数量" :label-width="formLabelWidth">
          <el-input v-model.trim="formData.pageSize" autocomplete="off" />
        </el-form-item>
      </el-form>
      <template #footer>
        <div class="dialog-footer">
          <el-button @click="dialogFormDownload = false">取消</el-button>
          <el-button type="primary" @click="saveDownloadCodg">下载</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
  <el-dialog v-model="showYpCodgInfo" :close-on-click-modal="false" :before-close="handleClose" top="8vh"
             :close-on-press-escape="false" :title="ypCodgInfoName" width="80%" destroy-on-close>
    <YpCodgInfo :ypCodgDetail="ypCodgDetail"/>
  </el-dialog>
</template>
<script setup name="YpInMatch">
import { nextTick, onMounted, ref } from "vue";
import {shortcuts} from "@/data/shortcuts.js";
import {formatDatetime, getDateRangeFormatDate} from "@/utils/date.js";
import {selectGroupNoInfo, selectSupplyType} from "@/api/yp-dict/yp-comm-dict.js";
import {selectDownloadCodgBchno, selectYpCodgLineData, selectYpInDetlData} from "@/api/yp-codg/yp-in-match.js";
import {isEmpty} from "xe-utils";
import {ElMessage} from "element-plus";
import YpCodgInfo from "@/views/yp-codg/YpCodgInfo.vue";

const inDocuNo = ref('')
const reptNo = ref('')
const supplyCode = ref('')
const dateRange = ref([])
const groupNo = ref('11')
const groupNoYkData = ref([]);
const supplyList = ref([]);
const start = formatDatetime(shortcuts[0].value[0])
const end = formatDatetime(shortcuts[0].value[0])
const editableTabsValue = ref("inMatch")
const inMatchData = ref([])

const pageSize = ref(20)
const currentPage = ref(1)
const handleSizeChange = (val) => {
  pageSize.value = val
}
const handleCurrentChange = (val) => {
  currentPage.value = val
}

// 追溯码相关
const codgLineData = ref([])
const pageSizeLine = ref(20)
const currentPageLine = ref(1)
const handleSizeChangeLine = (val) => {
  pageSizeLine.value = val
}
const handleCurrentChangeLine = (val) => {
  currentPageLine.value = val
}

const queryCodgData = () => {
  if (editableTabsValue.value === "inMatch") {
    queryYpInMatch();
  } else if(editableTabsValue.value === "codgLine"){
    queryYpCodgLine()
  }
}

const handleClick = (tab, event) => {
  // 查询哪个tab页面
  editableTabsValue.value = tab.props.name;
  if (editableTabsValue.value === "inMatch") {
    queryYpInMatch();
  } else if(editableTabsValue.value === "codgLine"){
    queryYpCodgLine()
  }
}

const queryGroupNoInfo = () => {
  selectGroupNoInfo()
      .then(res => {
        groupNoYkData.value = res.ykList;
      })
      .catch(() => {
        groupNoYkData.value = [];
      });
};

const queryData = ref({
  detlNo: '', // 入库单号（院内）
  reptNo: '', // 传票号（供应批次流水号）
  supplyCode: '', // 供应商编码（院内）
  groupNo: '', // 药库编码（院内）
  supplyId: '', // 供应商企业信用代码
  manuNo: '', // 生产批次号
  startTime: '',
  endTime: '',
})

onMounted(() => {
  nextTick(() => {
    queryData.value.startTime = start;
    queryData.value.endTime = end + " 23:59:59";
    dateRange.value = [start, end];
    queryGroupNoInfo()
    querySupplyType()
    queryYpInMatch()
  })
})

const queryYpInMatch = () => {
  if (dateRange.value) {
    let dateS = getDateRangeFormatDate(dateRange.value)
    queryData.value.startTime = dateS.startTime
    queryData.value.endTime = dateS.endTime
  }
  queryData.value.detlNo = inDocuNo.value
  queryData.value.reptNo = reptNo.value
  queryData.value.supplyCode = supplyCode.value
  queryData.value.groupNo = groupNo.value
  selectYpInDetlData(queryData.value).then((res) => {
    inMatchData.value = res
  })
}

const showYpCodgInfo = ref(false)
const ypCodgInfoName = ref('追溯码下载明细')
const ypCodgDetail = ref([])
const queryYpMatchDetail = (row) => {
  if(isEmpty(row.supplyId)){
    ElMessage({
      message: row.supplyName + '企业信用代码不存在，请检查！',
      type: 'warning',
      duration: 2000,
      showClose: true,
    })
    return false;
  }
  showYpCodgInfo.value = true
  let paramData = ref({
    reptNo: row.reptNo, // 传票号（配送批次流水号）
    supplyId: row.supplyId, // 配送企业信用代码
    manuNo: row.manuNo, // 生产批号
  })
  selectYpCodgLineData(paramData.value).then((res) => {
    ypCodgDetail.value = res
  })
}

const handleClose = (done) => {
  queryCodgData()
  done()
}

// 根据条件获取供应商企业追溯码下载信息
const dialogFormDownload = ref(false);
const formLabelWidth = "140px";
let formData = ref({
  inDocuNo: '',
  buyAmt: 0,
  delvBchno: '',
  delventpUscc: '',
  delventpName: '',
  pageNum: 1,
  pageSize: 10,
})
const downloadCodg = row => {
  dialogFormDownload.value = true
  formData.value.inDocuNo = row.inDocuNo
  formData.value.delvBchno = row.reptNo
  formData.value.delventpUscc = row.supplyId
  formData.value.delventpName = row.supplyName
  // 计算当前传票号所属供应商追溯码购入数量总和
  let data = inMatchData.value.filter(item => {
    return item.reptNo === row.reptNo;
  })
  let total = 0
  for (const key in data) {
    total = total + data[key].buyAmt
  }
  formData.value.buyAmt = total
  formData.value.pageNum = 1
  formData.value.pageSize = total
}

const saveDownloadCodg = () => {
  if(isEmpty(formData.value.delvBchno)){
    ElMessage({
      message: '传票号不存在，请检查！',
      type: 'warning',
      duration: 2000,
      showClose: true,
    })
    return false;
  }
  if(isEmpty(formData.value.delventpUscc)){
    ElMessage({
      message: '供应商企业代码不存在，请检查！',
      type: 'warning',
      duration: 2000,
      showClose: true,
    })
    return false;
  }
  selectDownloadCodgBchno(formData.value).then((res) => {
    ElMessage({
      message: res.msg,
      type: 'success',
      duration: 2000,
      showClose: true,
    })
    dialogFormDownload.value = false
    queryYpCodgLine()
  })
}

const queryYpCodgLine = () => {
  if (dateRange.value) {
    let dateS = getDateRangeFormatDate(dateRange.value)
    queryData.value.startTime = dateS.startTime
    queryData.value.endTime = dateS.endTime
  }
  queryData.value.supplyId = ''
  queryData.value.reptNo = reptNo.value
  let supplyData = supplyList.value.filter((item) => {
    return item.value === supplyCode.value
  })
  if(supplyData.length > 0){
    if(isEmpty(supplyData[0].code)){
      ElMessage({
        message: supplyData[0].label + '企业信用代码不存在，请检查！',
        type: 'warning',
        duration: 2000,
        showClose: true,
      })
      return false;
    }
    queryData.value.supplyId = supplyData[0].code
  }
  selectYpCodgLineData(queryData.value).then((res) => {
    codgLineData.value = res
  })
}

const querySupplyType = () => {
  selectSupplyType().then((res) => {
    supplyList.value = res.supplyList
  })
}

</script>