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

@@ -1,85 +1,103 @@
<template>

  <div></div>

</template>



<script>

import { getCodeRule } from "@/api/formTemplate.js";



export default {

  name: "CodeApply",

  props: {

    codeClassifyOid: {

      type: String,

      default: ''

    }

  },

  data() {

    return {

      secVOList: [],

      formItems: [],

      trendsSpan: 8

    };

  },

  created() {

    this.handleResize();

    this.getCodeRule();

  },

  mounted() {

    
  },

  methods: {

    getCodeRule() {

      getCodeRule({ codeClassifyOid: this.codeClassifyOid }).then((res) => {

        if (res.data && res.data.code === 200) {

          this.defaultValue = res.data.data;

          this.secVOList = res.data.data.secVOList || [];

          this.codeRuleOid = res.data.data.oid;

        }

      });

    },

    handleResize() {

      let windowWidth = document.body.clientWidth;

      this.trendsSpan = 24 / Math.floor(windowWidth / 500);

    },

  },

  watch: {

    secVOList: {

      deep: true,

      handler(newV) {

        this.formItems = [];

        newV.forEach((item) => {

          let itemObj = {};

          let options = [];

          //固定码段

          if (item.sectype == "codefixedsec") {

            options = item.fixedValueVOList.map((item) => {

              item.key = item.id;

              item.value = item.id;

            });

            itemObj = {

              field: item.oid,

              title: item.name,

              required: item.nullableFlag != "true",

              type: "combox",

              data: options,

              search: true,

            };

            //可变码段

          } else if (item.sectype == "codevariablesec") {

            itemObj = {

              field: item.oid,

              title: item.name,

              required: item.nullableFlag != "true",

              type: "text",

            };

          }

          itemObj.span = item.type === "textarea" ? 24 : this.trendsSpan,

          this.formItems.push(itemObj);

        });

      },

    },

  },

};

</script>



<style lang="less" scoped></style>

<template>
  <FormTemplate
    ref="FormTemplate"
    :selfColumnType="selfColumnType"
    :selfColumnConfig="selfColumnConfig"
  ></FormTemplate>
</template>

<script>
export default {
  name: "CodeApply",
  components: { FormTemplate: () => import('./FormTemplate.vue') },
  props: {
  },
  data() {
    return {
      secVOList: [],
      formItems: [],
      trendsSpan: 8,
      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() {
    this.handleResize();
  },
  mounted() {},
  methods: {
    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 [];
      }
    },
    init(columnList) {
      this.$refs.FormTemplate.templateRender(columnList);
    },
    handleResize() {
      let windowWidth = document.body.clientWidth;
      this.trendsSpan = 24 / Math.floor(windowWidth / 500);
    },


    async validate() {
      return await this.$refs.FormTemplate.validate();
    },
  },
  watch: {},
};
</script>

<style lang="less" scoped></style>