Source/UBCS-WEB/src/components/FormTemplate/index.vue

@@ -14,9 +14,8 @@
      :visible="visible"
      :type="type"
      :rowOid="rowOid"
      v-if="dialogVisible"
      :templateOid="templateOid"
      ref="FormTempalte"
      @getFormTemplateEnd="getFormTemplate"
      @getFormData="getFormData"
    ></FormTempalte>

@@ -30,11 +29,14 @@
    >
      <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
        <el-tab-pane label="码值申请" name="codeApply" v-if="showCodeApply">
          <CodeApply
            ref="CodeApply"
          <FormTempalte
            v-bind="$attrs"
            @getCodeRuleOid="getCodeRuleOid"
          ></CodeApply>
            :type="type"
            :selfColumnType="selfColumnType"
            :selfColumnConfig="selfColumnConfig"
            ref="CodeApply"
            @getFormData="getFormData"
          ></FormTempalte>
        </el-tab-pane>
        <el-tab-pane
          label="相似项查询"
@@ -46,7 +48,9 @@
            ref="resembleQueryRef"
            :hasResemble="this.hasResemble"
            :column="this.resembleTableColumn"
            :codeClassifyOid="codeClassifyOid"
            :form="this.form"
            :templateOid="templateOid"
          ></ResembleQuery>
        </el-tab-pane>
      </el-tabs>
@@ -67,12 +71,12 @@
</template>

<script>
import { getCodeRule, getFormTemplate } from "@/api/formTemplate.js";
import FormTempalte from "./FormTempalte";
import ResembleQuery from "./ResembleQuery";
import CodeApply from "./CodeApply";
export default {
  name: "FormTemplateDialog",
  components: { ResembleQuery, FormTempalte, CodeApply },
  components: { ResembleQuery, FormTempalte },
  props: {
    visible: {
      type: Boolean,
@@ -90,7 +94,15 @@
      type: String,
      default: "80%",
    },
    rowOid: ''
    rowOid: "",
    codeClassifyOid: {
      type: String,
      default: "",
    },
    templateOid: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
@@ -100,7 +112,39 @@
      resembleTableColumn: [],
      secVOList: [],
      form: {},
      activeName: "",
      activeName: "codeApply",
      showCodeApply: true,
      showResembleQuery: true,
      selfColumnType: {
        codefixedsec: "combox",
        codeclassifysec: "refer",
        codevariablesec: "text",
        coderefersec: "refer",
      },
      selfColumnConfig: {
        function: {
          required: this.isRequired,
          dicData: this.getOptionList,
          type: this.getType,
        },
        exchange: {
          text: "name",
          field: "oid",
          prop: "oid",
          showField: "name",
          parentClassifySecOid: "parentClassifySecOid",
          label: "name",
          maxlength: "codeSecLength",
          data: "fixedValueVOList",
        },
        directVoluation: {
          search: true,
          props: {
            label: "id",
            value: "id",
          },
        },
      },
    };
  },
  created() {},
@@ -113,65 +157,139 @@
        this.$emit("update:visible", val);
      },
    },
    showCodeApply() {
      // 测试数据展示
      // if (this.type === "add") {
      //   if (this.hasResemble && this.secVOList.length === 0) {
      //     return false;
      //   }
      // } else {
      //   return false;
      // }
      return true;
    },
    showResembleQuery() {
      return this.hasResemble;
    },
  },
  methods: {
    openDialog() {
      this.$nextTick(() => {
        this.$refs.FormTempalte.init();
        this.$refs.CodeApply.getCodeRule();
      });
      this.getFormTemplate();
      if (this.type === 'add') {
        this.getCodeRule();
      }
    },
    close() {
      this.dialogVisible = false;
    },
    getCodeRuleOid(data) {
      this.secVOList = data.secVOList;
    // 接口获取表单数据
    getFormTemplate() {
      getFormTemplate({
        templateOid: this.templateOid,
        codeClassifyOid: this.codeClassifyOid,
      })
        .then((res) => {
          if (res.status === 200) {
            this.hasResemble =
              res.data.resembleTableVO &&
              res.data.resembleTableVO.cols &&
              res.data.resembleTableVO.cols.length > 0;
            this.resembleTableColumn = res.data.resembleTableVO.cols || [];
            if (this.hasResemble) {
              this.activeName = 'resembleQuery'
              this.showResembleQuery = true
            }
            this.$refs.FormTempalte.templateRender(res.data.formDefineVO.items);
          }
        })
        .catch((err) => {
          this.loading = false;
          console.log(err);
        });
    },
    getFormTemplate(data) {
      this.hasResemble =
        data.resembleTableVO &&
        data.resembleTableVO.cols &&
        data.resembleTableVO.cols.length > 0;
      this.resembleTableColumn = data.resembleTableVO.cols || [];
      this.activeName =
        (this.showCodeApply && "codeApply") ||
        (this.showResembleQuery && "resembleQuery");
    // 获取码值申请数据
    getCodeRule() {
      getCodeRule({ codeClassifyOid: this.codeClassifyOid }).then((res) => {
        if (res.data && res.data.code === 200) {
          const typeList = [
            "codefixedsec",
            "codeclassifysec",
            "codevariablesec",
            "coderefersec",
          ];
          this.secVOList = (res.data.data.secVOList || []).filter((item) =>
            typeList.includes(item)
          );
          this.$nextTick(() => {
            if (this.secVOList.length > 0 && this.type === 'add') {
              this.showCodeApply = true
              this.activeName = 'codeApply'
              this.$refs.CodeApply.templateRender(this.secVOList);
            } else {
              this.showCodeApply = false
            }
          });
        }
      });
    },
    getFormData(form) {
      this.form = form;
    },
    resembleQuerySubmit() {
      this.activeName = "resembleQuery";
      this.$refs.resembleQueryRef.resembleQuery(this.form);
    },
    handleClick() {
      if (this.activeName === 'resembleQuery') {
        this.resembleQuerySubmit()
      if (this.activeName === "resembleQuery") {
        this.resembleQuerySubmit();
      }
    },
    async submit() {
      // 进行表单校验
      const formValidate = await this.$refs.FormTempalte.validate();
      if (!formValidate) return;
      let codeValidate = true;
      // 进行码值申请校验
      if (this.showCodeApply) {
        codeValidate = await this.$refs.CodeApply.validate();
        codeValidate = await this.$refs.codeApply.validate();
        if (!codeValidate) return;
      }
      this.$emit("submit", {
        form: this.form,
        flag: formValidate && codeValidate,
      });
      // 进行相似项查询
      const resembleQueryList = await this.$refs.resembleQueryRef.resembleQuery(
        this.form
      );
      if (resembleQueryList.length === 0) {
        this.$emit("submit", this.form);
      } else {
        this.$confirm(
          `该物料已有${resembleQueryList.length}条相似数据，是否继续保存？`,
          "需要您确认",
          {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          }
        )
          .then(() => {
            this.$emit("submit", this.form);
          })
          .catch(() => {});
      }
    },
    getType(item) {
      return this.selfColumnType[item.sectype];
    },
    isRequired(item) {
      return item.nullableFlag != "true";
    },
    getOptionList(item) {
      if (
        Array.isArray(item.fixedValueVOList) &&
        item.fixedValueVOList.length > 0
      ) {
        const configAttr = {
          key: "id",
          value: "id",
        };
        const optionList = item.fixedValueVOList.map((item) => {
          for (const key in configAttr) {
            if (Object.hasOwnProperty.call(configAttr, key)) {
              const element = configAttr[key];
              item[key] = item[element];
            }
          }
          return item;
        });
        return optionList;
      } else {
        return [];
      }
    },
  },
};