<template>
  <div class="detail-wrap">
    <el-form ref="editForm" :model="formScript" :disabled="readonly">
      <div class="d-header clearfix">
        <div class="fl">
          <i class="el-icon-info" />
          {{ dataId ? $t1("查看表单脚本") : $t1("新增表单脚本") }}
        </div>
        <div class="fr">
          <el-form>
            <formVersionButton
              v-if="!hData && formScript.id && !readonly"
              objType="FormScript"
              :objCode="formScript.scriptCode"
              :relationCode="formScript.formCode"
              @reverCallback="$baseReload()"
            ></formVersionButton>
            <reverButton
              v-if="!!hData"
              objType="FormScript"
              :objCode="formScript.scriptCode"
              :hData="hData"
              @reverCallback="$emit('reverCallback')"
            ></reverButton>
            <el-button
              type="primary"
              plain
              class="button-sty"
              @click="$baseReload()"
              icon="el-icon-refresh-right"
            >
              {{ $t1("重置") }}
            </el-button>
            <el-button
              type="primary"
              class="button-sty"
              icon="el-icon-check"
              @click="saveData"
              v-if="isDev && !readonly"
              >{{ $t1("保存") }}
            </el-button>
          </el-form>
        </div>
      </div>
      <baseTabs>
        <baseTabPane :label="$t1('基本信息')">
          <template #default>
            <table class="table-detail">
              <tbody>
                <tr>
                  <th>
                    <em class="f-red">*</em>
                    {{ $t1("脚本名称") }}
                  </th>
                  <td colspan="3">
                    <el-form-item
                      prop="scriptName"
                      :rules="[{ required: true, trigger: 'blur' }]"
                    >
                      <fieldCompare
                        :isCompare="isCompare"
                        :oldVal="oldFormScript.scriptName"
                        :newVal="formScript.scriptName"
                      >
                        <el-input
                          type="text"
                          autocomplete="off"
                          v-model="formScript.scriptName"
                          clearable
                        />
                      </fieldCompare>
                    </el-form-item>
                  </td>
                  <th>{{ $t1("脚本编码") }}</th>
                  <td colspan="3">
                    <el-form-item
                      prop="scriptCode"
                      :rules="[{ required: true, trigger: 'blur' }]"
                    >
                      <fieldCompare
                        :isCompare="isCompare"
                        :oldVal="oldFormScript.scriptCode"
                        :newVal="formScript.scriptCode"
                      >
                        <el-input
                          type="text"
                          autocomplete="off"
                          v-model="formScript.scriptCode"
                          clearable
                        />
                      </fieldCompare>
                    </el-form-item>
                  </td>
                </tr>
                <tr>
                  <th>{{ $t1("是否启用") }}</th>
                  <td>
                    <el-form-item
                      prop="enabled"
                      :rules="[{ required: false, trigger: 'blur' }]"
                    >
                      <fieldCompare
                        :isCompare="isCompare"
                        :oldVal="oldFormScript.enabled"
                        :newVal="formScript.enabled"
                      >
                        <el-radio-group v-model="formScript.enabled">
                          <el-radio :label="true">{{ $t1("启用") }}</el-radio>
                          <el-radio :label="false">{{ $t1("禁用") }}</el-radio>
                        </el-radio-group>
                      </fieldCompare>
                    </el-form-item>
                  </td>
                  <th>{{ $t1("开启事务") }}</th>
                  <td>
                    <el-form-item>
                      <fieldCompare
                        :isCompare="isCompare"
                        :oldVal="oldFormScript.transactions"
                        :newVal="formScript.transactions"
                      >
                        <el-radio-group v-model="formScript.transactions">
                          <el-radio :label="1">{{ $t1("是") }}</el-radio>
                          <el-radio :label="0">{{ $t1("否") }}</el-radio>
                        </el-radio-group>
                      </fieldCompare>
                    </el-form-item>
                  </td>
                </tr>
                <tr>
                  <th>{{ $t1("脚本说明") }}</th>
                  <td colspan="7">
                    <el-form-item
                      prop="scriptRemark"
                      :rules="[{ required: false, trigger: 'blur' }]"
                    >
                      <fieldCompare
                        :isCompare="isCompare"
                        :oldVal="oldFormScript.scriptRemark"
                        :newVal="formScript.scriptRemark"
                      >
                        <el-input
                          type="textarea"
                          :rows="2"
                          :placeholder="$t1('请输入内容')"
                          size="small"
                          v-model="formScript.scriptRemark"
                          clearable
                        ></el-input>
                      </fieldCompare>
                    </el-form-item>
                  </td>
                </tr>
                <tr>
                  <th>
                    <em class="f-red">*</em>
                    {{ $t1("脚本") }}
                    <!--                <scriptDescriptionButton path="static/readme/ApiRequest.txt"></scriptDescriptionButton>-->
                    <scriptTestButton :script.sync="formScript.script"></scriptTestButton>
                  </th>
                  <td colspan="7">
                    <el-form-item
                      prop="script"
                      :rules="[{ required: true, trigger: 'blur' }]"
                    >
                      <fieldCompare
                        :isCompare="isCompare"
                        :oldVal="oldFormScript.script"
                        :newVal="formScript.script"
                      >
                        <code-editor
                          mode="java"
                          :readonly="!1"
                          v-model="formScript.script"
                          v-if="showCodeEditor"
                        ></code-editor>
                      </fieldCompare>
                    </el-form-item>
                  </td>
                </tr>
                <tr>
                  <th>{{ $t1("版本号") }}</th>
                  <td>{{ formScript.version }}</td>
                  <th>{{ $t1("唯一标识") }}</th>
                  <td colspan="5">{{ formScript.sid }}</td>
                </tr>
                <tr>
                  <th>{{ $t1("创建人") }}</th>
                  <td>{{ formScript.createBy }}</td>
                  <th>{{ $t1("创建时间") }}</th>
                  <td>{{ formScript.createDate }}</td>
                  <th>{{ $t1("更新人") }}</th>
                  <td>{{ formScript.modifyBy }}</td>
                  <th>{{ $t1("更新时间") }}</th>
                  <td>{{ formScript.modifyDate }}</td>
                </tr>
              </tbody>
            </table>
          </template>
        </baseTabPane>
        <baseTabPane :label="$t1('操作日志')">
          <template #default>
            <formOplogTable :parent-target="_self" ref="oplogTable"></formOplogTable>
          </template>
        </baseTabPane>
      </baseTabs>
      <preformDialog
        v-if="showPreformDialog"
        :visiable.sync="showPreformDialog"
        :placeholder="
          formScript.transactions !== 1 ? $t1('注：当前脚本未开启事务') : null
        "
        @confirm="confirmPreformDialog"
      ></preformDialog>
    </el-form>
  </div>
</template>

<script>
import mixin from "./mixins/edit";
import formVersionButton from "@base/views/bd/setting/formVersion/button.vue";
import reverButton from "@base/views/bd/setting/formVersion/reverButton.vue";
import fieldCompare from "@base/views/bd/setting/formVersion/fieldCompare.vue";
export default {
  name: "user_form_scriptEdit",
  mixins: [mixin],
  components: {
    formVersionButton,
    reverButton,
    fieldCompare,
  },
};
</script>
