cloud-web-corejs 1.1.0-dev.6 → 1.1.0-dev.60

package/src/views/demo/bizTab/bill/detail.vue

@@ -1,436 +0,0 @@
-<template>
-  <div class="detail-wrap">
-    <!--
-      结构约定：wfUtil 默认把「流程信息」面板挂到 .el-form .d-cont，把侧边导航挂到
-      .el-form .slide-wrap，「修改单据」按钮塞进 .el-form .d-header > .fr，
-      所以 el-form 必须包住 baseTabs。
-      :disabled="billDisabled" 一绑，表单里的字段就整片自动禁用，不用逐个绑。
-    -->
-    <el-form ref="editForm" :model="billModel" :disabled="billDisabled">
-      <!-- 这层空 el-form 用来隔断 disabled 注入（element 的 Form 是 provide elForm: this，
-           嵌套一层就把外层 disabled 挡在外面），头部按钮不会被单据只读态带禁 -->
-      <el-form>
-        <div class="d-header clearfix">
-          <div class="fl">
-            <i class="el-icon-info" />
-            {{
-              isAdd
-                ? $t1("新增产品变更申请")
-                : $t1("产品变更申请") + " " + (billModel.sn || "")
-            }}
-          </div>
-          <!-- 翻单、提交流程、重置、保存，显隐与文案都由组件统一处理 -->
-          <biz-bill-actions :detail="_self" />
-        </div>
-      </el-form>
-
-      <baseTabs>
-        <baseTabPane :label="$t1('基本信息')">
-          <template #default>
-            <table class="table-detail">
-              <tbody>
-                <tr>
-                  <th>{{ $t1("变更单号") }}</th>
-                  <td>{{ billModel.sn || $t1("保存后自动生成") }}</td>
-                  <th>{{ $t1("状态") }}</th>
-                  <td>
-                    <div :class="statusInfo.cls">{{ statusInfo.label }}</div>
-                  </td>
-                  <th>{{ $t1("变更类型") }}</th>
-                  <td>
-                    <el-form-item prop="type">
-                      <el-select
-                        v-model="billModel.type"
-                        :placeholder="$t1('请选择')"
-                        clearable
-                      >
-                        <el-option :label="$t1('产品变更')" :value="0" />
-                        <el-option :label="$t1('零件变更')" :value="1" />
-                      </el-select>
-                    </el-form-item>
-                  </td>
-                </tr>
-                <tr>
-                  <th><em class="f-red">*</em>{{ $t1("变更原因") }}</th>
-                  <td colspan="5">
-                    <el-form-item
-                      prop="remark"
-                      :rules="[
-                        {
-                          required: true,
-                          message: $t1('变更原因不能为空'),
-                          trigger: ['blur', 'change'],
-                        },
-                      ]"
-                    >
-                      <el-input
-                        type="textarea"
-                        :rows="1"
-                        v-model="billModel.remark"
-                        clearable
-                      />
-                    </el-form-item>
-                  </td>
-                </tr>
-                <tr v-if="!isAdd">
-                  <th>{{ $t1("创建人") }}</th>
-                  <td>{{ billModel._createBy }}</td>
-                  <th>{{ $t1("创建时间") }}</th>
-                  <td>{{ billModel.create_date }}</td>
-                  <th>{{ $t1("更新时间") }}</th>
-                  <td>{{ billModel.modify_date }}</td>
-                </tr>
-              </tbody>
-            </table>
-          </template>
-        </baseTabPane>
-
-        <baseTabPane :label="$t1('变更明细')">
-          <!-- 子表可增删，新增的单据才存得下去（只读态不放按钮） -->
-          <template #button>
-            <el-button
-              v-if="!billDisabled"
-              class="button-sty"
-              icon="el-icon-plus"
-              @click="showProductDialog = true"
-              >{{ $t1("选择产品") }}</el-button
-            >
-          </template>
-          <template #default>
-            <vxe-grid
-              ref="itemGrid"
-              :data="itemRows"
-              v-bind="itemOption"
-              @resizable-change="$vxeTableUtil.onColumnWitchChange"
-              @custom="$vxeTableUtil.customHandle"
-            ></vxe-grid>
-          </template>
-        </baseTabPane>
-      </baseTabs>
-    </el-form>
-
-    <product-dialog
-      v-if="showProductDialog"
-      :visiable.sync="showProductDialog"
-      multi="true"
-      @confirm="confirmInsertProduct"
-    />
-  </div>
-</template>
-
-<script>
-/**
- * demo B 单据详情：formCode + 通用 bd_api（脚本 getOne / getList / saveUpdate / findItemPage）。
- * 请求写法照 stdxx 的 views/pmd/product/product_change/edit.vue 逐条搬，那边能跑这边就能跑。
- *
- * 混入 bizBillDetailMixin 后，本文件只写四件业务的事：
- *   billOptions / buildLoadRequest / applyBillData / saveBill
- * 保存并提交、提交后关页签、通过自动保存、翻单都由 mixin + 宿主负责。
- *
- * 这里没实现 isBillDirty()：关页签时退回内置判断——只拦「还没存过的新增页签」。
- * 想按实际改动拦，参考 ../simple/detail.vue 的快照对比写法。
- */
-import { bizBillDetailMixin } from "@base/components/bizTab";
-import {
-  requiredHeader,
-  buildRowProp,
-} from "@base/components/bizTab/billTableUtil";
-import BizBillActions from "@base/components/bizTab/BizBillActions.vue";
-import productDialog from "./productDialog.vue";
-import { BILL, STATUS_MAP } from "./billConfig";
-
-export default {
-  name: "demoBizTabBillDetail",
-  components: { BizBillActions, productDialog },
-  mixins: [bizBillDetailMixin],
-  data() {
-    return {
-      billModel: this.getDefaultModel(),
-      itemOption: {},
-      showProductDialog: false,
-    };
-  },
-  computed: {
-    billOptions() {
-      return {
-        prefix: BILL.prefix,
-        formCode: BILL.formCode,
-        taBm: BILL.taBm,
-        wfCode: BILL.wfCode,
-        titleField: BILL.titleField,
-        wfEnabled: true,
-        saveSubmitEnabled: true, // 新增页显示「保存并提交流程」
-        wfStartBindSave: true, // 点「提交流程」先校验并自动保存
-        wfAgreeBindSave: true, // 审批点「通过」自动保存单据
-      };
-    },
-    statusInfo() {
-      return STATUS_MAP[this.billModel.status] || { label: "-", cls: "" };
-    },
-    /**
-     * 子表数据放在 billModel[taBm] 里（和 stdxx 原页面一致），不单独挂一个 data 字段——
-     * 因为单元格里 el-form-item 的 prop 路径必须在 editForm 的 model 下真实可达，
-     * 挂在模型外面的话 element 会 warn「please transfer a valid prop path」且校验不生效。
-     */
-    itemRows() {
-      return this.billModel[BILL.itemTaBm] || [];
-    },
-  },
-  mounted() {
-    this.loadBill();
-    this.initItemTable();
-  },
-  methods: {
-    getDefaultModel() {
-      return {
-        id: null,
-        sn: null,
-        status: 0,
-        type: BILL.type,
-        remark: null,
-        _createBy: null,
-        create_date: null,
-        modify_date: null,
-        // 子表也放模型里，行内 form-item 的 prop 路径才可达（如 pcp_item_change_item.2.xxx）
-        [BILL.itemTaBm]: [],
-      };
-    },
-    setItemRows(rows) {
-      this.$set(this.billModel, BILL.itemTaBm, rows || []);
-    },
-
-    // ===== bizBillDetailMixin 要求实现的业务钩子 =====
-    buildLoadRequest(dataId) {
-      return {
-        url: BILL.prefix + `/bd_api/${BILL.formCode}/getOne`,
-        method: "post",
-        data: {
-          fixeData: {},
-          formCode: BILL.formCode,
-          taBm: BILL.taBm,
-          data: { id: dataId },
-        },
-      };
-    },
-    applyBillData(objx) {
-      if (!objx) {
-        this.billModel = this.getDefaultModel();
-        this.setItemRows([]);
-        return;
-      }
-      // getOne 不回子表，子表走 getList；先保住默认的空数组，别被 objx 覆盖掉
-      this.billModel = Object.assign(this.getDefaultModel(), objx, {
-        [BILL.itemTaBm]: [],
-      });
-      this.loadItems();
-    },
-    saveBill(options) {
-      let opts = options || {};
-      return new Promise((resolve) => {
-        let done = () => this.postSave(opts, resolve);
-        if (opts.confirm === false) {
-          done();
-          return;
-        }
-        this.$baseConfirm(this.$t1("您确定要保存吗？")).then(done, () =>
-          resolve(null)
-        );
-      });
-    },
-    // 数据级校验：子表是 scrollY gt:20 的虚拟滚动，屏外行的行内 form-item 不存在、校验不到，
-    // 所以按数据兜一遍（本单子表只有「变更后描述」可改）
-    validateBillData() {
-      return this.checkRowsRequired({
-        label: this.$t1("变更明细"),
-        rows: this.$refs.itemGrid
-          ? this.$refs.itemGrid.getTableData().fullData
-          : this.itemRows,
-        fields: [
-          { field: "change_itemdesc", label: this.$t1("变更后描述") },
-        ],
-      });
-    },
-    // 覆盖默认判据，叠加单据状态：mixin 默认只看流程（没启动就能改）。
-    // billDisabled（字段自动禁用）和「重置/保存」的显隐都以它为准。
-    canEditBill() {
-      if (this.hasWf) return !!(this.wfInfo && this.wfInfo.toModify);
-      return this.isAdd || this.billModel.status === 0;
-    },
-    // 已审核/审核中的单据不许再提交流程（mixin 默认放开，这里按状态卡住）
-    canStartWf() {
-      return this.billModel.status === 0 || this.billModel.status == null;
-    },
-
-    // ===== 业务内部 =====
-    postSave(opts, resolve) {
-      // 整表提交：data 里带哪几张表，后台就按哪几张表落库。
-      // 主表对象里不能再夹带子表数组和审计字段（照 stdxx 原页面的处理）。
-      let main = { ...this.billModel };
-      delete main._createBy;
-      delete main._modifyBy;
-      delete main[BILL.itemTaBm];
-      let itemRows = this.$refs.itemGrid
-        ? this.$refs.itemGrid.getTableData().fullData
-        : this.itemRows;
-      let data = {};
-      data[BILL.taBm] = main;
-      data[BILL.itemTaBm] = itemRows;
-      this.$http({
-        url: BILL.prefix + `/bd_api/${BILL.formCode}/saveUpdate`,
-        method: "post",
-        data: {
-          fixeData: {},
-          formCode: BILL.formCode,
-          taBm: BILL.taBm,
-          data: data,
-        },
-        isLoading: true,
-        success: (res) => {
-          // 新增返回新单号；更新时后台可能不回 objx，退回当前单号
-          let dataId = res && res.objx ? res.objx : this.dataId;
-          if (opts.successMsg !== false) {
-            this.$message({
-              message: res.content,
-              type: "success",
-              duration: 500,
-            });
-          }
-          resolve(dataId);
-        },
-        fail: () => resolve(null),
-        error: () => resolve(null),
-      });
-    },
-    loadItems() {
-      if (this.isAdd) return;
-      this.$http({
-        url: BILL.prefix + `/bd_api/${BILL.formCode}/getList`,
-        method: "post",
-        data: {
-          fixeData: {},
-          formCode: BILL.formCode,
-          taBm: BILL.itemTaBm,
-          data: { id: this.dataId },
-        },
-        success: (res) => {
-          this.setItemRows((res && res.objx) || []);
-        },
-      });
-    },
-    confirmInsertProduct(rows) {
-      if (!rows || !rows.length) return;
-      let exists = {};
-      this.itemRows.forEach((row) => {
-        exists[row.itemcode] = true;
-      });
-      let adds = [];
-      rows.forEach((row) => {
-        if (exists[row.itemcode]) return;
-        adds.push({
-          id: null,
-          itemcode: row.itemcode,
-          f_ref_itemdesc: row.itemdesc,
-          f_ref_category_name: row.category_name,
-          change_itemdesc: row.itemdesc,
-        });
-      });
-      if (!adds.length) {
-        this.$message.warning(this.$t1("所选产品都已在明细中"));
-        return;
-      }
-      this.setItemRows(this.itemRows.concat(adds));
-    },
-    initItemTable() {
-      let tableOption = {
-        vue: this,
-        tableRef: "itemGrid",
-        tableName: "demo-bizTab-bill-item",
-        columns: [
-          { type: "checkbox", fixed: "left", width: 48, resizable: false },
-          {
-            title: this.$t1("产品分类名称"),
-            field: "f_ref_category_name",
-            width: 200,
-            sortable: false,
-            filterType: false,
-          },
-          {
-            title: this.$t1("产品编码"),
-            field: "itemcode",
-            width: 150,
-            sortable: false,
-            filterType: false,
-          },
-          {
-            title: this.$t1("产品名称"),
-            field: "f_ref_itemdesc",
-            width: 220,
-            sortable: false,
-            filterType: false,
-          },
-          {
-            title: this.$t1("变更后描述"),
-            field: "change_itemdesc",
-            minWidth: 220,
-            sortable: false,
-            filterType: false,
-            slots: {
-              // 表头星号要自己加：element 的 * 是 el-form-item 按 label 渲染的，表格里没有 label
-              header: requiredHeader(this.$t1("变更后描述")),
-              default: ({ row, rowIndex }) => {
-                if (this.billDisabled) return [row.change_itemdesc];
-                // 必须套 el-form-item + 指向 model 的真实 prop 路径，element 才会加 is-error（红框）；
-                // 裸着写 el-input 永远不会标红。show-message 关掉是因为单元格容不下错误文案，
-                // 具体是哪行哪个字段由 validateBillData() 的提示说明。
-                return [
-                  <el-form-item
-                    prop={buildRowProp(BILL.itemTaBm, rowIndex, "change_itemdesc")}
-                    rules={[{ required: true, trigger: ["blur", "change"] }]}
-                    show-message={false}
-                  >
-                    <el-input v-model={row.change_itemdesc} size="small" clearable />
-                  </el-form-item>,
-                ];
-              },
-            },
-          },
-          {
-            width: 47,
-            fixed: "right",
-            title: "",
-            sortable: false,
-            slots: {
-              default: ({ rowIndex }) => {
-                if (this.billDisabled) return [];
-                return [
-                  <a
-                    href="javascript:void(0);"
-                    class="a-link"
-                    onclick={(e) => {
-                      e.stopPropagation();
-                      this.itemRows.splice(rowIndex, 1);
-                    }}
-                  >
-                    <el-tooltip
-                      enterable={false}
-                      effect="dark"
-                      content={this.$t1("删除")}
-                      placement="top"
-                      popper-class="tooltip-skin"
-                    >
-                      <i class="el-icon-delete" />
-                    </el-tooltip>
-                  </a>,
-                ];
-              },
-            },
-          },
-        ],
-      };
-      this.$vxeTableUtil.initVxeTable(tableOption).then((opts) => {
-        this.itemOption = opts;
-      });
-    },
-  },
-};
-</script>