udiwms-vue-frame/src/views/inout/PanelCreateOrderBizDetail.vue

<template>
  <div>
    <el-row>
      <div style="margin: 0px 60px 10px auto; height: 35px;  float: right;">
        <el-button-group>
          <!--          <el-button-->
          <!--            type="primary"-->
          <!--            ref="mainTable"-->
          <!--            @click.native.stop="selectWarlockBagFunction()"-->
          <!--            :loading="loading"-->
          <!--          >术式套包录入-->
          <!--          </el-button>-->
          <el-button
              type="primary"
              ref="mainTable"
              @click.native.stop="selectProductFunction()"
              :loading="loading"
          >物资录入
          </el-button>
        </el-button-group>
      </div>

    </el-row>

    <el-table v-loading="loading" :data="detailList" style="width: 100%;"
              :row-class-name="tableRowClassName"
              border
              :row-style="rowStyle"
              max-height="350" height="350" ref="multipleTable">
      <el-table-column label="序号" type="index" width="50"></el-table-column>
      <el-table-column
          label="DI/物资编码" width="150"
          prop="nameCode"
          show-overflow-tooltip
      ></el-table-column>
      <el-table-column width="150"
                       label="物资名称"
                       prop="coName"
                       show-overflow-tooltip
      ></el-table-column>
      <el-table-column width="150"
                       label="规格型号"
                       prop="spec"
                       show-overflow-tooltip
      ></el-table-column>
      <el-table-column width="120" label="批次号">
        <template slot-scope="scope">
          <el-input v-model="scope.row.batchNo"
                    :disabled="scope.row.index !== selectedIndex"
                    ref='inputBatchNoRef'
                    placeholder="请输入批次号"></el-input>
          <!--@input="scope.row.batchNo =scope.row.batchNo.replace(/[\W]/g, '')"-->
        </template>
      </el-table-column>
      <el-table-column width="120" label="生产日期">
        <template slot-scope="scope">
          <el-input v-model="scope.row.productDate" auto-complete="off"
                    oninput="if(value.length>6)value=value.slice(0,6)"
                    :disabled="scope.row.index !== selectedIndex"
                    type="number"
          ></el-input>
        </template>
      </el-table-column>
      <el-table-column width="120" label="失效日期">
        <template slot-scope="scope">

          <el-input v-model="scope.row.expireDate" auto-complete="off"
                    oninput="if(value.length>6)value=value.slice(0,6)"
                    :disabled="scope.row.index !== selectedIndex"
                    type="number"
          ></el-input>
        </template>
      </el-table-column>
      <el-table-column width="100" label="单据数量">
        <template slot-scope="scope">
          <el-input v-model="scope.row.count"
                    type='number'
                    :disabled="scope.row.index !== selectedIndex"
                    oninput="value=value.replace(/[^\d]/g,'')"></el-input>
        </template>
      </el-table-column>

      <el-table-column width="100"
                       label="扫码数量"
                       prop="scanCount"
                       v-if="viewType!=2"
                       show-overflow-tooltip
      ></el-table-column>

      <el-table-column width="120" label="价格">
        <template slot-scope="scope">
          <el-input v-model="scope.row.price"
                    type='number'
                    :disabled="scope.row.index !== selectedIndex"
                    placeholder="请输入价格"
          ></el-input>
        </template>
      </el-table-column>
      <el-table-column width="100" label="计量单位" prop="measname">
      </el-table-column>


      <el-table-column width="160" label="注册/备案号" prop="certCode" show-overflow-tooltip></el-table-column>
      <el-table-column width="150" label="生产企业" prop="manufacturer" show-overflow-tooltip></el-table-column>
      <el-table-column label="操作" width="200" fixed="right">
        <template slot-scope="scope">
          <el-button type="text" size="small" v-if="scope.row.index == selectedIndex" @click.stop="true"
                     @click.native="saveChange(scope.row)">保存
          </el-button>
          <el-button type="text" size="small" v-if="scope.row.index != selectedIndex" @click.stop="true"
                     @click.native="rowChange(scope.row)">编辑
          </el-button>
          <el-button type="text" size="small" @click.stop="true" @click.native="copyDetail(scope.row)">复制</el-button>
          <el-button type="text" size="small" @click.stop="true" @click.native="deleteDetail(scope.row)">删除</el-button>
          <el-button type="text" size="small" v-if="scope.row.bindRlFk==null" @click.native.stop="bindRl(scope.row)">
            绑定产品
          </el-button>
          <el-button type="text" size="small" v-if="scope.row.supId==null"
                     @click.native.stop="handleUnitClick(scope.row)"></el-button>
        </template>
      </el-table-column>
    </el-table>

    <el-dialog
        title="业务详情-术式套包录入"
        :visible.sync="selectWarlockBagVisible"
        :close-on-click-modal="false"
        :close-on-press-escape="false"
        width="85%"
        v-if="selectWarlockBagVisible"
        :append-to-body='true'
    >
      <selectWarlockBag
          :closeDialog="closeDialog"
          :data="thisData"
          :type="2"
      ></selectWarlockBag>
    </el-dialog>

    <el-dialog
        title="业务详情-物资录入"
        :visible.sync="selectProductVisible"
        :close-on-click-modal="false"
        :close-on-press-escape="false"
        width="85%"
        v-if="selectProductVisible"
        :append-to-body='true'
    >
      <stockOrderNewSelectProduct
          :closeDialog="closeDialog"
          :data="thisData"
      ></stockOrderNewSelectProduct>
    </el-dialog>
    <el-dialog
        title="库存物资录入"
        :visible.sync="selectInvProductVisible"
        :close-on-click-modal="false"
        :close-on-press-escape="false"
        width="85%"
        v-if="selectInvProductVisible"
        :append-to-body='true'
    >
      <dialogInvProduct
          :closeDialog="closeDialogC2"
          :invQueryData="invQueryData"
          :orderQuery="thisData"
          :type="2"
      ></dialogInvProduct>
    </el-dialog>


    <!--    绑定产品-->
    <el-dialog
        title="绑定产品"
        :visible.sync="selectRlVisible"
        width="80%"
        :close-on-click-modal="false"
        :close-on-press-escape="false"
        v-if="selectRlVisible"
        append-to-body
    >
      <selectRlDialog
          :curRow="curRow"
          :type="bizType"
          v-on:selectBindRl="selectBindRl"
          v-on:closeBindDialog="closeBindDialog"
      ></selectRlDialog>
    </el-dialog>


    <!--    绑定供应商-->
    <el-dialog
        title="绑定供应商"
        :visible.sync="dialogTableVisible"
        :close-on-click-modal="false"
        :close-on-press-escape="false"
        v-if="dialogTableVisible"
        width="80%"
        append-to-body
    >
      <DialogSelectUnit
          :codeId="curRow"
          :type="bizType"
          v-on:selectSupUnit="selectSupUnit"
          v-on:closeBindDialog="closeBindDialog"
      ></DialogSelectUnit>
    </el-dialog>


  </div>
</template>

<script>
import stockOrderNewSelectProduct from "./DialogSelectProduct";
import dialogInvProduct from "./DialogSelectInvProduct";
import {addBizProduct, getDetailBizs, updateBizProduct, delBizProduct} from "@/api/inout/orderDetailCode";
import {updateBizBind} from "@/api/inout/order";
import selectRlDialog from "@/views/inout/DialogSelectRl";
import DialogSelectUnit from "@/views/inout/DialogSelectUnit";
import selectWarlockBag from "@/views/basic/destiny/warlockBagModel";

export default {
  name: "IoCreateOrderBizDetail",
  props: {
    idQuery: {
      type: Object,
      required: true,
    },
    refreshPanel: {
      type: Function,
      required: true,
    },
    refreshOrder: {
      type: Function,
      required: true,
    },
    viewType: {
      type: Object,
      required: true,
    },
    curBustype: {
      type: Object,
      required: true,
    },

  },
  data() {
    return {
      bizType: 1,
      loading: false,
      query: {
        orderId: null,
        code: "",
        corpOrderId: "",
      },
      detailList: [],
      total: 0,
      iCount: 0,
      selectProductVisible: false,
      selectInvProductVisible: false,
      selectWarlockBagVisible: false,
      thisData: {},
      selectedIndex: null,
      invQueryData: {
        invCode: null,
      },
      selectRlVisible: false,
      dialogTableVisible: false,
      curRow: null,
    };
  },
  components: {
    selectRlDialog, DialogSelectUnit,
    stockOrderNewSelectProduct,
    dialogInvProduct, selectWarlockBag
  },
  methods: {
    getOrderDetails() {
      this.loading = true;
      this.query.orderId = this.idQuery.billNo;
      getDetailBizs(this.query) //查找该单号下的所有条码
          .then((response) => {
            this.detailList = response.data.list || [];
            this.total = response.data.total || 0;
            this.loading = false;
          })
          .catch(() => {
            this.loading = false;
            this.detailList = [];
            this.total = 0;
          });
    },


    rowChange(val) {
      this.currentRow = val;
      if (this.currentRow.batchNo == '')
        this.currentRow.batchNo = null;
      this.selectedIndex = val.index;
    },

    closeDialog(rData) {
      this.selectProductVisible = false;
      this.selectInvProductVisible = false;
      this.selectWarlockBagVisible = false;
      this.idQuery = rData;
      this.getOrderDetails();
    },

    closeDialogC2(rData) {
      this.idQuery = rData;
      this.selectInvProductVisible = false;
      this.getOrderDetails();
    },

    rowStyle({row, rowIndex}) {
      let rowBackground = {};
      if (!this.$isNotBlank(row.supId) || !this.$isNotBlank(row.bindRlFk)) {
        rowBackground.color = '#f60303';
        return rowBackground;
      }

      if (this.viewType == 1)
        return null;

      if (!row.checkSuccess) {
        rowBackground.color = '#f60303';
      }
      return rowBackground;
    },

    tableRowClassName({row, rowIndex}) {
      row.index = rowIndex;
    },

    selectProductFunction() {
      this.thisData = this.idQuery;
      if (this.$isBlank(this.idQuery.action)) {
        this.$message.error("单据类型不能为空！")
        return;
      }
      if (this.$isBlank(this.idQuery.invCode)) {
        this.$message.error("当前仓库不能为空！");
        return;
      }

      if (this.$isBlank(this.idQuery.fromCorp) && this.$isBlank(this.idQuery.fromInvCode)) {
        this.$message.error("往来信息不能为空！");
        return;
      }
      if (this.curBustype.corpType == 3) {//内部科室
        this.invQueryData.invCode = this.idQuery.invCode;
        this.selectInvProductVisible = true;
        console.log('idQuery',this.idQuery)

      } else if (this.curBustype.corpType == 2) { //供应商信息
        this.selectProductVisible = true;
      } else if (this.curBustype.corpType === 1) {//客户信息
        this.invQueryData.invCode = this.idQuery.invCode;
        this.selectInvProductVisible = true;
      } else if (this.curBustype.corpType = 4) {
        this.selectProductVisible = true;
      }

    },

    selectWarlockBagFunction() {
      this.thisData = this.idQuery;
      if (this.$isBlank(this.idQuery.action)) {
        this.$message.error("单据类型不能为空！")
        return;
      }
      if (this.$isBlank(this.idQuery.invCode)) {
        this.$message.error("当前仓库不能为空！");
        return;
      }

      if (this.$isBlank(this.idQuery.fromCorp) && this.$isBlank(this.idQuery.fromInvCode)) {
        this.$message.error("往来信息不能为空！");
        return;
      }
      if (this.curBustype.corpType == 3) {//内部科室
        this.invQueryData.invCode = this.idQuery.invCode;
        this.selectWarlockBagVisible = true;
      } else if (this.curBustype.corpType == 2) { //供应商信息
        this.selectWarlockBagVisible = true;
      } else if (this.curBustype.corpType === 1) {//客户信息
        this.invQueryData.invCode = this.idQuery.invCode;
        this.selectWarlockBagVisible = true;
      } else if (this.curBustype.corpType = 4) {
        this.selectWarlockBagVisible = true;
      }

    },

    saveChange(row) {
      if (row.batchNo == '') {
        row.batchNo = null;
      }
      updateBizProduct(row)
          .then((response) => {
            this.loading = false;
            if (response.code === 20000) {
              this.$message.success("保存成功！");
              this.selectedIndex = null;
              this.refreshPanel();

            } else {
              this.$message.error(response.message);
            }
          })
          .catch(() => {
            this.loading = false;
            this.dataList = [];
            this.pageTotal = 0;
          });
    },

    copyDetail(row) {
      let data = {
        relId: row.bindRlFk,
        supId: row.supId,
        zczbhhzbapzbh: row.certCode,
        orderEntity: this.idQuery,
      }
      this.loading = true;
      addBizProduct(data)
          .then((response) => {
            this.loading = false;
            if (response.code === 20000) {
              this.getOrderDetails();
            } else {
              this.$message.error(response.message);
            }
          })
          .catch(() => {
            this.loading = false;
            this.dataList = [];
            this.pageTotal = 0;
          });
    },

    deleteDetail(row) {
      let data = {
        id: row.id,
      }
      this.loading = true;
      delBizProduct(data)
          .then((response) => {
            this.loading = false;
            if (response.code === 20000) {
              this.getOrderDetails();
            } else {
              this.$message.error(response.message);
            }
          })
          .catch(() => {
            this.loading = false;
            this.dataList = [];
            this.pageTotal = 0;
          });
    },
    bindRl(val) {
      this.curRow = val;
      this.selectRlVisible = true;
    },

    handleUnitClick(row) {
      this.curRow = row;
      this.dialogTableVisible = true;
    },

    selectBindRl(row) {
      let query = {
        id: this.curRow.id,
        bindRlFk: row.id,
      };
      updateBizBind(query).then((response) => {
            if (response.code == 20000) {
              this.$message.success("绑定成功");
              this.getOrderDetails();
            } else
              this.$message.error(response.message);
          }
      ).catch(() => {

      });
    },

    selectSupUnit(row) {
      let query = {
        id: this.curRow.id,
        supId: row.erpId,
      };
      updateBizBind(query).then((response) => {
        if (response.code == 20000) {
          this.$message.success("绑定成功");
          this.getOrderDetails();
        } else {
          this.$message.error(response.message);
        }
      }).catch(() => {
      });
    }
    ,


    closeBindDialog() {
      this.selectRlVisible = false;
      this.dialogTableVisible = false;
      this.refreshPanel();
    }
    ,
  }
  ,
  filters: {}
  ,

  watch: {
    'idQuery.billNo':
        {
          handler() {
            this.refreshOrder(this.idQuery);
          }
          ,
        }
  }
  ,

  mounted() {
    document.body.ondrop = function (event) {
      event.preventDefault();
      event.stopPropagation();
    };
  }
  ,
  created() {
    if (this.idQuery.billNo != null)
      this.getOrderDetails();
  }
  ,
}
;
</script>
<style scoped>
.el-table_fixed, el-table__fixed-right {
  height: 80% !important;
}

.el-table__fixed-body-wrapper {
  height: 80% !important;
}


.ao-text {
  width: 100%;
  font-size: 13px;
  font-family: "Microsoft YaHei";
  float: right;
  text-align: right;
  margin-top: 10px;
}

/**
解决el-input输入框 type=number时，输入中文光标上移问题
 */
.el-input__inner {
  line-height: 1px !important;
}

</style>