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

@@ -16,48 +16,45 @@
      :key="index"
    >
      <template :slot="item.prop + 'Label'" v-for="item in option.column">
        <span>{{ item.label }} </span>
        <el-tooltip
          v-if="item.keyAttr"
          class="item"
          effect="dark"
          content="该属性为关键属性"
          placement="top-start"
        >
          <i class="el-icon-star-on key_attr_icon"></i>
        </el-tooltip>
        <el-tooltip
          v-if="item.tip"
          class="item"
          effect="dark"
          :content="item.tip"
          placement="top-start"
        >
          <i class="el-icon-warning"></i>
        </el-tooltip>
        <span>
          <span>{{ item.label }} </span>
          <el-tooltip
            v-if="item.keyAttr"
            class="item"
            effect="dark"
            content="该属性为关键属性"
            placement="top-start"
          >
            <i class="el-icon-star-on key_attr_icon"></i>
          </el-tooltip>
          <el-tooltip
            v-if="item.tip"
            class="item"
            effect="dark"
            :content="item.tip"
            placement="top-start"
          >
            <i class="el-icon-warning"></i>
          </el-tooltip>
        </span>
      </template>
    </avue-form>
    <div class="avue-dialog__footer">
    <FindLike ref="findLike" v-if="dialogVisible"></FindLike>
    <div class="avue-dialog__footer" v-if="type !== 'detail'">
      <el-button @click="close()">取 消</el-button>
      <el-button @click="close()" type="primary">确 定</el-button>
      <el-button @click="close()" type="primary" :loading="submitBtnLoading">确 定</el-button>
      <el-button @click="findLinkSubmit" type="primary">相似像查询</el-button>
    </div>
    <el-dialog title="测试参照" :visible.sync="visible2" append-to-body>
      <div style="height: 100px;">
        <p>部门数据 {depName: '我是部门名称', depId: '我是部门id'}</p>
      </div>
      <div class="avue-dialog__footer">
        <el-button @click="visible2 = false">取 消</el-button>
        <el-button @click="czSubmit" type="primary">确 定</el-button>
      </div>
    </el-dialog>
  </el-dialog>
</template>

<script>
import { getFormTemplate } from "../../api/common";
import { getFormTemplate, executeCode, findLike } from "@/api/formTemplate";
import { getDictionary } from "../../api/system/dict";
import FindLike from "./FindLike.vue";
export default {
  name: "FormTemplate",
  components: { FindLike },
  props: {
    visible: {
      type: Boolean,
@@ -67,6 +64,18 @@
      type: Array,
      default: () => ["id"],
    },
    templateOid: {
      type: String,
      default: "",
    },
    codeClassifyOid: {
      type: String,
      default: "",
    },
    type: {
      type: String,
      default: 'add'
    }
  },
  data() {
    return {
@@ -90,8 +99,7 @@
        number: "number",
        textarea: "textarea",
        datetime: "datetime",
        date: "date",
        file: "upload",
        date: "date"
      },
      // 假数据
      testItems: [
@@ -537,31 +545,6 @@
          displayExtension: null,
          extendAttrMap: null,
          extendAttrString: null,
          field: "beizhushuoming",
          hidden: false,
          keyAttr: false,
          prefix: "",
          readOnly: false,
          referConfig: null,
          required: false,
          selectLibFlag: "",
          showField: null,
          suffix: "",
          text: "文件功能",
          tooltips: "",
          type: "file",
          unique: false,
          verify: "",
        },
        {
          comboxKey: null,
          customClass: null,
          data: null,
          dateFormate: "",
          defaultValue: "",
          displayExtension: null,
          extendAttrMap: null,
          extendAttrString: null,
          field: "cz",
          hidden: false,
          keyAttr: false,
@@ -579,11 +562,10 @@
          verify: "",
        },
      ],
      visible2: false,
      submitBtnLoading: false
    };
  },
  created() {
  },
  created() {},
  computed: {
    dialogVisible: {
      get() {
@@ -598,10 +580,8 @@
    getFormTemplate() {
      this.loading = true;
      getFormTemplate({
        templateOid: "78B8C7C5-A042-0B96-FE6D-65421451782A",
        codeClassifyOid: "4524E801-6CC6-92E8-1AC3-2AB9604E8F96",
        page: 1,
        limit: 30,
        templateOid: this.templateOid,
        codeClassifyOid: this.codeClassifyOid,
      })
        .then((res) => {
          if (res.status === 200) {
@@ -617,8 +597,7 @@
        });
    },
    templateRender() {
      // const items = this.templateData.formDefineVO.items;
      const items = this.testItems;
      const items = this.templateData.formDefineVO.items;
      let column = [];
      let dictKeys = [];
      items.forEach((item) => {
@@ -626,12 +605,15 @@
        if (item.hide) {
          return;
        }
        // 手机字典key统一异步请求获取
        if (!this.$utilFunc.isEmpty(item.comboxKey)) {
        if (
          item.type === "combox" &&
          item.comboxKey &&
          (!Array.isArray(item.dicData) || item.dicData.length === 0)
        ) {
          dictKeys.push({ dictKey: item.comboxKey, field: item.field });
        }
        // 禁用部分属性
        if (this.disabledProp.includes(item.field)) {
        // 禁用部分属性（外部传值禁用和参照禁用）
        if (this.disabledProp.includes(item.field) || this.$utilFunc.isValuableObj(item.referConfig)) {
          item.readOnly = true;
        }
        // 设置表单校验的规则，文本
@@ -646,10 +628,10 @@
        let columnItem = {
          label: item.text,
          labelslot: true,
          prop: item.referConfig ? item.showField : item.field,
          prop: this.$utilFunc.isValuableObj(item.referConfig) ? (item.showField || item.field) : item.field,
          type: this.columnType[item.type],
          dicData: this.getDataList(item.type, item.data),
          disabled: item.readOnly,
          disabled: this.type === 'detail' ? true : item.readOnly,
          prepend: this.preOrSufFixShow("text", item.prefix),
          append: this.preOrSufFixShow("text", item.suffix),
          prefixIcon: this.preOrSufFixShow("icon", item.prefix),
@@ -660,18 +642,11 @@
          value: item.defaultValue,
          tip: item.tip,
          comboxKey: item.comboxKey,
          change: ({ value, column }) => {
            this.changeFun(value, column, item.displayExtension);
          change: () => {
            this.changeFun(item.displayExtension, item.prop);
          },
          span: item.type === "file" || item.type === "textarea" ? 24 : null,
          click: this.clickFun(item.referConfig),
          // action:
          //   item.type === "file"
          //     ? "/api/ubcs-resource/oss/endpoint/put-file"
          //     : "",
          // propsHttp: {
          //   res: "data",
          //   url: "link",
          // },
          rules: [
            {
              required: item.required,
@@ -696,27 +671,15 @@
      this.index++;
      this.geDictData(dictKeys);
    },
    changeFun(value, column, jsCode) {
      if (typeof jsCode === "string" && jsCode.length > 0) {
        eval(jsCode);
      }
    changeFun(displayExtension, prop) {
      // executeCode({displayExtension, data: this.form}).then(res => {
      //   this.form[prop] = res.data.data
      // })
    },
    clickFun(referConfig) {
      if (referConfig) {
        return () => {
          this.visible2 = true
        }
      if (this.type === 'detail') {
        return
      }
    },
    czSubmit() {
      this.visible2 = false
      this.form = Object.assign(this.form, {
        depName: "我是部门名称",
        depId: "我是部门id",
      });
    },
    close() {
      this.dialogVisible = false;
    },
    // 前后缀
    preOrSufFixShow(type, val) {
@@ -764,11 +727,17 @@
        });
      });
    },
    findLinkSubmit() {
      this.templateData.templateVO.data = this.form
      console.log(this.$refs.findLike, 'this.$refs.findLike');
      this.$refs.findLike.findLinkClick(this.templateData.templateVO)
    }
  },
  watch: {
    visible(newV) {
      if (newV) {
        this.getFormTemplate();
        // this.templateRender()
      }
    },
  },