<template>
  <div v-show="getIsShow()">
    <el-form-item label-width="0">
      <el-divider class="custom-divider-margin-top">请求访问设置</el-divider>
    </el-form-item>
    <el-form-item
      label="启用请求后台脚本"
      v-if="formScriptEnabledTypes.includes(selectedWidget.type)"
    >
      <el-switch
        v-model="optionModel.formScriptEnabled"
        @change="changeFormScriptEnabled"
      ></el-switch>
    </el-form-item>
    <template>
      <!--      <el-form-item label="请求表单编码" v-if="optionModel.formScriptEnabled">
        <el-input v-model="optionModel.httpFormCode" clearable></el-input>
      </el-form-item>-->
      <el-form-item label="表单脚本编码" v-if="optionModel.formScriptEnabled">
        <el-input v-model="optionModel.formScriptCode" clearable></el-input>
      </el-form-item>
      <el-form-item
        label="查询参数"
        v-if="optionModel.formScriptEnabled || optionModel.commonAttributeEnabled"
      >
        <a
          href="javascript:void(0);"
          class="a-link link-oneLind"
          @click="editEventHandler('formScriptParam', ['dataId', 'formCode'])"
        >
          <span>{{ optionModel.formScriptParam }}</span>
          <i class="el-icon-edit"></i>
        </a>
      </el-form-item>
    </template>
    <template v-if="formScriptEnabledTypes.includes(selectedWidget.type)">
      <el-form-item :label="i18nt('启用系统词汇')">
        <el-switch
          v-model="optionModel.commonAttributeEnabled"
          @change="changeCommonAttributeEnabled"
        ></el-switch>
      </el-form-item>
      <el-form-item :label="i18nt('词汇编码')" v-if="optionModel.commonAttributeEnabled">
        <el-input type="text" v-model="optionModel.commonAttributeCode"></el-input>
      </el-form-item>
      <!-- <el-form-item :label="i18nt('显示字段')" v-if="optionModel.formScriptEnabled || optionModel.commonAttributeEnabled">
        <el-input type="text" v-model="optionModel.labelKey" :disabled="optionModel.commonAttributeEnabled"></el-input>
      </el-form-item>
      <el-form-item :label="i18nt('关联字段')" v-if="optionModel.formScriptEnabled || optionModel.commonAttributeEnabled">
        <el-input type="text" v-model="optionModel.valueKey" :disabled="optionModel.commonAttributeEnabled"></el-input>
      </el-form-item> -->
    </template>
    <el-form-item
      label="查询回调"
      v-if="optionModel.formScriptEnabled || optionModel.commonAttributeEnabled"
    >
      <a
        href="javascript:void(0);"
        class="a-link link-oneLind"
        @click="editEventHandler('formScriptSuccess', ['dataId', 'formCode', 'res'])"
      >
        <span>{{ optionModel.formScriptSuccess }}</span>
        <i class="el-icon-edit"></i>
      </a>
    </el-form-item>
  </div>
</template>

<script>
import i18n from "../../../../../components/xform/utils/i18n";
import eventMixin from "../../../../../components/xform/form-designer/setting-panel/property-editor/event-handler/eventMixin";

export default {
  name: "formScriptEnabled-editor",
  mixins: [i18n, eventMixin],
  props: {
    designer: Object,
    selectedWidget: Object,
    optionModel: Object,
  },
  data() {
    return {
      formScriptEnabledTypes: [
        "select",
        "checkbox",
        "radio",
        "census",
        "status",
        "gantt",
      ],
    };
  },
  methods: {
    getIsShow() {
      return this.selectedWidget.type !== "data-table";
    },
    changeFormScriptEnabled(val) {
      if (val) {
        this.optionModel.commonAttributeEnabled = false;
      }
      this.handleLabelAndValueKey();
    },
    changeCommonAttributeEnabled(val) {
      if (val) {
        this.optionModel.formScriptEnabled = false;
      }
      this.handleLabelAndValueKey();
    },
    handleLabelAndValueKey() {
      if (this.optionModel.commonAttributeEnabled) {
        this.optionModel.labelKey = "value";
        this.optionModel.valueKey = "sn";
      } else {
        this.optionModel.labelKey = "label";
        this.optionModel.valueKey = "value";
      }
    },
  },
};
</script>

<style scoped></style>
