<template>
  <el-container class="manage-setting">
    <el-form ref="form" label-width="80px" style="width: 100%; height: 100%">
      <div class="manage-setting__header">
        <ht-form-item
          label="操作列配置"
          prop="tableOPerate"
          label-width="106px"
        >
          <ht-input
            v-model="tableConfigure.operateWidth"
            placeholder="请输入宽度"
            class="set-width-input"
            :maxlength="50"
          ></ht-input>
        </ht-form-item>
        <ht-form-item label-width="0">
          <ht-select
            placeholder="请选择对齐方式"
            :options="[
              {key: 'left', value: '居左'},
              {key: 'center', value: '居中'},
              {key: 'right', value: '居右'}
            ]"
            :props="{key: 'key', value: 'value'}"
            v-model="tableConfigure.opterateAlign"
          />
        </ht-form-item>
      </div>
      <el-button
        icon="el-icon-plus"
        size="small"
        type="primary"
        style="margin-bottom: 17px; height: 32px"
        @click="addManageBtns"
      >添加</el-button
      >
      <el-table
        ref="manageSettingTable"
        border
        class="dt-manage__table"
        :data="manageFields"
        tooltip-effect="dark"
        :height="tableHeight"
        :header-cell-style="rowClass"
      >
        <el-table-column width="50" label="序号" type="index" fixed="left" />
        <el-table-column prop="name" label="类型" width="140" fixed="left">
          <template scope="scope">
            <el-select
              @change="handleManageChange(scope.row)"
              filterable
              v-model="scope.row.name"
            >
              <el-option
                v-for="btn in defaultBtnOptions"
                :key="btn.key"
                :label="btn.value"
                :value="btn.key"
                :disabled="btn.disabled"
              ></el-option>
            </el-select>
          </template>
        </el-table-column>
        <el-table-column prop="desc" label="名称" width="280" fixed="left">
          <template scope="scope">
            <div class="editi18_input">
              <el-input
                :maxlength="20"
                show-word-limit
                clearable
                v-model="scope.row.desc"
                placeholder="请输入按钮名称"
              >
              </el-input>
              <el-button
                icon="icon-guojihua"
                @click="editI18nMessage(scope.row)"
              ></el-button>
            </div>
          </template>
        </el-table-column>
        <el-table-column
          label="权限"
          :render-header="mrightRenderHeader"
          width="230"
        >
          <el-table-column prop="right" width="130">
            <template scope="scope">
              <span v-if="rightToDesc(scope.row.right).length < 40">{{
                  rightToDesc(scope.row.right)
                }}</span>
              <el-tooltip
                v-else
                class="item"
                effect="dark"
                :content="rightToDesc(scope.row.right)"
                placement="top-end"
              >
                <span class="auth-setting">{{
                    rightToDesc(scope.row.right)
                  }}</span>
              </el-tooltip>
            </template>
          </el-table-column>
          <el-table-column prop="right" width="80">
            <template scope="scope">
              <el-button
                size="small"
                style="float: right"
                @click="setFieldRightDialog(scope.row)"
                icon="el-icon-edit"
              ></el-button>
            </template>
          </el-table-column>
          <!-- <template scope="scope">
            <span v-if="rightToDesc(scope.row.right).length < 40">{{
              rightToDesc(scope.row.right)
            }}</span>
            <el-tooltip
              v-else
              class="item"
              effect="dark"
              :content="rightToDesc(scope.row.right)"
              placement="top-end"
            >
              <span class="auth-setting">{{
                rightToDesc(scope.row.right)
              }}</span>
            </el-tooltip>

            <span style="float: right">
              <el-button
                size="small"
                @click="setFieldRightDialog(scope.row)"
                icon="el-icon-edit"
              ></el-button>
            </span>
          </template> -->
        </el-table-column>

        <el-table-column label="设置" width="510">
          <template slot-scope="scope">
            <el-button
              :plain="scope.row.mpDisplay === btnType.notShow"
              class="mobile-btn"
              :class="{
                'is-active__btn': scope.row.mpDisplay === btnType.isShow
              }"
              :disabled="isDisabled(scope.row)"
              v-show="
                scope.row.mpDisplay
                  ? (scope.row.mpDisplay = scope.row.mpDisplay)
                  : initMpDisplay(scope.row)
              "
              @click="btnChange(scope.row)"
            >移动端</el-button
            >

            <el-tooltip
              content="用来控制按钮显示隐藏 返回 true 显示 返回false 隐藏"
              placement="top"
            >
              <el-button
                :disabled="isDisabledBtn(scope.row)"
                @click="setBeforeScript(scope.row, scope.$index)"
              >
                前置JS
              </el-button>
            </el-tooltip>

            <el-tooltip
              content="用来控制按钮是否提交 返回 true 提交 返回false 不提交"
              placement="top"
            >
              <el-button
                :disabled="isDisabledBtn(scope.row)"
                @click="setAfterScript(scope.row, scope.$index)"
              >
                后置JS
              </el-button>
            </el-tooltip>
            <el-button
              :disabled="disabledSetBtn(scope.row)"
              icon="el-icon-edit"
              @click="handleClick(scope.row, scope.$index)"
            >
              设置
            </el-button>
            <el-button
              v-if="scope.row.name == 'batchUpdate'"
              @click="updateSetting(scope.row, scope.$index)"
            >
              关联
            </el-button>
            <span
              class="sub-init-btn"
              :class="{active: scope.row.initSubData}"
              v-if="scope.row.name == 'add'"
              @click="scope.row.initSubData = !scope.row.initSubData"
              plain
            >
              子表数据初始化
            </span>
          </template>
        </el-table-column>
        <el-table-column label="操作" width="240">
          <template scope="scope">
            <el-button
              @click="sort(scope.$index, 'down')"
              size="small"
              icon="el-icon-arrow-down"
              plain
            ></el-button>
            <el-button
              @click="sort(scope.$index, 'up')"
              size="small"
              icon="el-icon-arrow-up"
              plain
            ></el-button>
            <el-button
              @click="remove(scope.$index)"
              type="danger"
              size="small"
              icon="el-icon-delete"
              plain
            ></el-button>
            <!--  因为新增数据按钮暂时是只支持添加一个，所以先把新增数据按钮的复制功能去掉 -->
            <el-button
              v-if="
                ['js', 'url', 'switch', 'batchUpdate','addFlow','addData','searchData','batchSave'].includes(scope.row.name)
              "
              @click="copy(scope.$index)"
              type="primary"
              size="small"
              icon="el-icon-document-copy"
              plain
            ></el-button>
          </template>
        </el-table-column>
        <el-table-column label="位置" width="200">
          <template scope="scope">
            <el-checkbox
              v-if="showPostion(scope.row)"
              v-model="scope.row.topPosition"
              label="顶部按钮"
              @change="handlePositionChange(scope.row, 'topPosition')"
            ></el-checkbox>
            <el-checkbox
              v-if="showPostionline(scope.row)"
              v-model="scope.row.linePosition"
              label="列按钮"
              @change="handlePositionChange(scope.row, 'linePosition')"
            ></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column label="显示" min-width="700">
          <template scope="scope">
            <div class="btnshow-set">
              <el-popover
                placement="top"
                trigger="hover"
                popper-class="button-popover"
                content="该功能仅对顶部按钮生效"
              >
                <ht-select
                  v-model="scope.row.theme"
                  slot="reference"
                  popper-class="button-theme-style"
                  style="width: 80px; margin-right: 10px"
                  placeholder="按钮主题"
                  :options="[
                    {key: 'default', value: '默认'},
                    {key: 'primary', value: '主要'},
                    {key: 'success', value: '成功'},
                    {key: 'info', value: '提示'},
                    {key: 'warning', value: '警告'},
                    {key: 'danger', value: '危险'}
                  ]"
                  :clearable="false"
                />
              </el-popover>
              <div
                v-if="
                  isAddOrEditOrDetail(scope.row) ||
                    scope.row.name === 'url' ||
                    scope.row.name === 'js'
                "
              >
                <ht-select
                  v-model="scope.row.openType"
                  style="width: 130px; margin-right: 10px"
                  :options="
                    ['approval', 'taskDetail'].includes(scope.row.name)
                      ? [
                          {key: 'old', value: '当前页面打开'},
                          {key: 'new', value: '新窗口打开'}
                        ]
                      : [
                          {key: 'old', value: '当前页面打开'},
                          {key: 'new', value: '新窗口打开'},
                          {key: 'dialog', value: '弹窗打开'}
                        ]
                  "
                  :clearable="false"
                />
                <template v-if="scope.row.openType === 'dialog'">
                  <ht-input
                    style="width: 80px"
                    v-model="scope.row.dialogHeight"
                    placeholder="高度"
                  ></ht-input>
                  <span class="btnshow-set__separate">：</span>
                  <ht-input
                    style="width: 80px"
                    v-model="scope.row.dialogWidth"
                    placeholder="宽度"
                  ></ht-input>
                </template>
                <el-radio-group
                  v-if="scope.row.name === 'add'"
                  size="small"
                  v-model="scope.row.quitAfterSaving"
                >
                  <el-tooltip
                    class="item"
                    effect="dark"
                    content="保存后立即退出"
                    placement="top"
                  >
                    <el-radio-button label="true">立即退出</el-radio-button>
                  </el-tooltip>
                  <el-tooltip
                    class="item"
                    effect="dark"
                    content="保存后继续添加"
                    placement="top"
                  >
                    <el-radio-button label="false">继续添加</el-radio-button>
                  </el-tooltip>
                </el-radio-group>
                <el-radio-group
                  v-if="scope.row.name === 'edit'"
                  size="small"
                  v-model="scope.row.quitAfterSaving"
                >
                  <el-tooltip
                    class="item"
                    effect="dark"
                    content="保存后立即退出"
                    placement="top"
                  >
                    <el-radio-button label="true">立即退出</el-radio-button>
                  </el-tooltip>
                  <el-tooltip
                    class="item"
                    effect="dark"
                    content="保存后继续编辑"
                    placement="top"
                  >
                    <el-radio-button label="false">继续编辑</el-radio-button>
                  </el-tooltip>
                </el-radio-group>
              </div>
            </div>
          </template>
        </el-table-column>
      </el-table>
    </el-form>
    <!-- 选择对话框  -->
    <eip-auth-dialog
      ref="eipAuthDialog"
      name="eipAuthDialog"
      @onConfirm="authDialogOnConfirm"
      append-to-body
    />
    <el-dialog
      :title="dialogTitle"
      :visible.sync="dialogVisible"
      width="50%"
      appendToBody
      :close-on-click-modal="false"
      destory-on-close
      top="8vh"
    >
      <table
        class="form-table"
        cellspacing="0"
        cellpadding="0"
        border="0"
        v-if="dialogTitle === '设置Url地址'"
        max-height="100"
      >
        <tbody>
        <tr>
          <td>URL地址</td>
          <td>
            <el-input
              v-model="url"
              placeholder="URL地址"
              clearable
            ></el-input>
          </td>
        </tr>
        <tr>
          <td>追加参数</td>
          <td>
            <table
              class="form-table"
              cellspacing="0"
              cellpadding="0"
              border="0"
            >
              <tbody>
              <tr class="linkageTable-tr">
                <td width="120px">参数名</td>
                <td width="120px">取值列</td>
                <td width="120px">
                  操作
                  <el-button
                    size="small"
                    icon="el-icon-plus"
                    @click="urlParamsAdd()"
                  ></el-button>
                </td>
              </tr>
              <tr
                class="linkageTable-tr"
                v-for="(uparam, index) in urlParams"
                :key="index"
              >
                <td>
                  <ht-input
                    size="mini"
                    type="text"
                    v-model="uparam.name"
                    :maxlength="50"
                    show-word-limit
                    :validate="{
                          required: true,
                          regex: {
                            exp: '^[a-zA-Z][a-zA-Z0-9_]*$',
                            message:
                              '参数名以字母开头，且只能包含字母、数字和下划线'
                          }
                        }"
                  />
                </td>
                <td>
                  <el-select
                    value-key="name"
                    v-model="uparam.field"
                    clearable
                    filterable
                  >
                    <el-option-group
                      v-for="group in formVariables"
                      :key="group.name"
                      :label="group.desc"
                    >
                      <el-option
                        v-for="item in group.fields"
                        :key="item.name"
                        :label="item.desc"
                        :value="item.name"
                      >
                            <span style="float: left">{{
                                item.desc + '(' + item.name + ')'
                              }}</span>
                      </el-option>
                    </el-option-group>
                  </el-select>
                </td>
                <td>
                  <el-button
                    icon="el-icon-delete"
                    @click="urlParamsRemove(uparam)"
                  ></el-button>
                </td>
              </tr>
              </tbody>
            </table>
          </td>
        </tr>
        </tbody>
      </table>
      <table
        class="form-table"
        cellspacing="0"
        cellpadding="0"
        border="0"
        v-if="dialogTitle === '设置组件地址'"
        max-height="100"
      >
        <tbody>
        <tr>
          <td>
            组件地址<br/>
            <span style="color: #7a59159e">插槽组件默认根路径为”components/tableSlot“， 为了避免混乱请先以模块名称新建文件夹， 然后以字段名称命名（如”test/Test.vue“【产品表/产品标题插槽组件】【vue文件大写开头】）- 案例：TestTest</span>
          </td>
        </tr>
        <tr>
          <td>
            <el-input
              v-model="url"
              placeholder="组件地址"
              clearable
            ></el-input>
          </td>
        </tr>
        </tbody>
      </table>
      <el-form
        v-form
        data-vv-scope="TokenApiForm"
        v-if="dialogTitle === '设置Url地址'"
      >
        <el-divider>配置认证接口</el-divider>
        <el-row>
          <el-col :span="12">
            <ht-form-item label="追加token">
              <el-switch
                v-model="tokenEnabled"
                active-color="#13ce66"
                inactive-color="#ff4949"
              >
              </el-switch>
            </ht-form-item>
          </el-col>
          <el-col :span="12">
            <ht-form-item label="获取模式" v-if="tokenEnabled">
              <ht-radio
                v-model="tokenType"
                validate="required"
                :options="tokenTypeOptions"
              ></ht-radio>
            </ht-form-item>
          </el-col>
        </el-row>

        <div v-if="tokenEnabled && tokenType === 1">
          <el-row>
            <el-col :span="12">
              <ht-form-item label="票据KEY">
                <ht-input
                  v-model="tokenKey"
                  validate="regex:^[a-zA-Z][a-zA-Z0-9_]*$,只能输入字母、数字、下划线，且以字母开头"
                  :maxlength="50"
                  show-word-limit
                  placeholder="如  token"
                />
              </ht-form-item>
            </el-col>
            <el-col :span="12">
              <ht-form-item label="票据VALUE">
                <el-button type="primary" plain @click="showBizAuthDialog"
                >配置认证接口
                </el-button>
              </ht-form-item>
            </el-col>
          </el-row>
        </div>
      </el-form>
      <div v-if="dialogTitle === '设置开关值'" align="center" width="500px">
        <table width="80%">
          <tr>
            <td>绑定值</td>
            <td>
              <el-select
                :key="refreshTime"
                :multiple="false"
                style="margin-right: 15px"
                v-if="currentRow.name == 'switch'"
                v-model="currentRow.bind"
              >
                <el-option
                  v-for="item in mainSettingFields"
                  :key="item.name"
                  :label="item.desc"
                  :value="
                    curTemplateBoDef.boEnt.isExternal
                      ? item.oldTableField
                      : item.name
                  "
                ></el-option>
              </el-select>
            </td>
          </tr>
          <tr>
            <td>开状态下值</td>
            <td>
              <el-input
                v-model="switchOn"
                clearable
                maxlength="200"
                show-word-limit
                placeholder="开时置值"
              ></el-input>
            </td>
          </tr>
          <tr>
            <td>开状态下显示</td>
            <td>
              <el-input
                v-model="switchOnLabel"
                clearable
                maxlength="10"
                show-word-limit
                placeholder="开时显示值"
              ></el-input>
            </td>
          </tr>
          <tr>
            <td>关状态下值</td>
            <td>
              <el-input
                v-model="switchOff"
                clearable
                maxlength="200"
                show-word-limit
                placeholder="关时置值"
                style="margin-top: 20px"
              ></el-input>
            </td>
          </tr>
          <tr>
            <td>关状态下显示</td>
            <td>
              <el-input
                clearable
                maxlength="10"
                show-word-limit
                v-model="switchOffLabel"
                placeholder="关时显示值"
              ></el-input>
            </td>
          </tr>
          <tr>
            <td>默认状态</td>
            <td>
              <el-select
                v-model="switchDefaultTrue"
                placeholder="默认状态"
                style="padding-top: 20px"
                width="100%"
              >
                <el-option
                  v-for="item in switchOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
                >
                </el-option>
              </el-select>
            </td>
          </tr>
        </table>
      </div>
      <div v-if="dialogTitle === '设置二维码'">
        <el-select
          :key="refreshTime"
          :multiple="currentRow.name === 'produceQRCode'"
          style="margin-right: 15px"
          v-if="currentRow.name === 'produceQRCode'"
          v-model="currentRow.display"
          placeholder="请选择映射字段"
        >
          <el-option
            v-for="item in displayField"
            :key="item.name"
            :label="item.desc"
            :value="JSON.stringify(item)"
          ></el-option>
        </el-select>
      </div>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false" size="medium"
        >取 消</el-button
        >
        <el-button type="primary" @click="dialogOnconfirm()">确 定</el-button>
      </span>
    </el-dialog>

    <!-- 选择校验jar包 -->
    <ImportJarSelector
      ref="importJarSelector"
      name="importJarSelector"
      @on-confirm="jarSelectorOnConfirm"
      append-to-body
    />

    <!-- 权限设置 -->
    <flow-form-auth ref="flowFormAuth" />
    <!-- 新建流程设置 -->
    <flow-form-add ref="flowFormAdd" @saveFlowForm="handleFlowFormAdd" />

    <el-dialog
      title="设置需要执行的js"
      :visible="dialogMethodVisible"
      v-if="dialogMethodVisible"
      append-to-body
      class="urgent-text"
      :close-on-click-modal="false"
      :destroy-on-close="true"
      @close="dialogMethodVisible = false"
    >
      <div style="margin-top: 15px; margin-bottom: 25px">
        <code>
          <code>
            <span style="color: red; margin-left: 15px"
            >javascript脚本,在点将js按钮时触发，参数：_req用来请求后台的
              ,row当前列的数据,_this数据列表this对象</span
            >
            <br />
            <span style="color: red; margin-left: 15px">
              使用http请求后台接口地址的方法 this.$http.get(url).then(res => {
              })
            </span>
            <br />
            <span style="color: red; margin-left: 15px"
            >使用_req请求后台接口地址的方法 _req(url, data, options).then(res
              => { })</span
            >
            <br />
            <span style="color: red; margin-left: 15px"
            >跳转url可以使用通用方法 _this.commonOpenUrl(url)</span
            >
          </code>
        </code>
      </div>
      <div style="margin-bottom: 10px">
        表单变量:
        <el-select
          value-key="name"
          v-model="diyScript"
          clearable
          @change="diyScriptChange"
        >
          <el-option-group
            v-for="group in formVariables"
            :key="group.name"
            :label="group.desc"
          >
            <el-option
              v-for="item in group.fields"
              :key="item.name"
              :label="item.desc"
              :value="item.name"
            >
              <span style="float: left">{{
                  item.desc + '(' + item.name + ')'
                }}</span>
            </el-option>
          </el-option-group>
        </el-select>
      </div>
      <div style="margin-bottom: 10px;" v-if="topPosition">
        是否需要校验有无勾选数据:
        <el-radio-group v-model="needValidateSelect">
          <el-radio :label="true">需要</el-radio>
          <el-radio :label="false">不需要</el-radio>
        </el-radio-group>
      </div>
      <div style="width: 100%; height: 100%">
        <codemirror
          ref="scriptText"
          v-model="dialogRuleData"
          :options="cmOptions"
          style="width: 99%; height: 100%"
          name="jsCode"
        ></codemirror>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogMethodVisible = false">取 消</el-button>
        <el-button type="primary" @click="methodOk()">确 定</el-button>
      </div>
    </el-dialog>
    <!-- 数据更新添加弹窗 -->
    <el-dialog
      :close-on-click-modal="false"
      :destroy-on-close="true"
      :visible.sync="batchUpdateVisible"
      append-to-body
      width="70%"
      title="设置"
      class="batchUpdate"
    >
      <el-form
        label-width="80px"
        style="width: 100%"
        v-form
        data-vv-scope="batchUpdateForm"
      >
        <el-button
          icon="el-icon-plus"
          size="small"
          type="primary"
          style="margin-bottom: 10px"
          @click="addBatchUpdategData"
        >添加
        </el-button>
        <el-table border :max-height="tabHeight" :data="batchUpdateData">
          <el-table-column width="242" label="字段名">
            <template scope="scope">
              <ht-select
                clearable
                placeholder="请选择"
                :filterable="true"
                v-model="scope.row.name"
                :validate="{required: true}"
                :options="updateFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </template>
          </el-table-column>
          <el-table-column width="242" label="值来源">
            <template scope="scope">
              <ht-select
                clearable
                placeholder="请选择"
                v-model="scope.row.valueType"
                :validate="{required: true}"
                :options="[
                  {key: 0, value: '固定值'},
                  {key: 1, value: '用户录入'},
                  {key: 2, value: '公式脚本'}
                ]"
                @change="
                  batchUpdateSelectChange(scope.row.valueType, scope.$index)
                "
              ></ht-select>
            </template>
          </el-table-column>
          <el-table-column label="设置值">
            <template scope="scope">
              <template v-if="scope.row.valueType == 0">
                <ht-input
                  v-model="scope.row.defaultValue"
                  :validate="{required: true}"
                  style="width: 100%"
                >
                </ht-input>
              </template>
              <template v-else-if="scope.row.valueType == 1">
                <div style="display: flex; align-items: center">
                  <ht-select
                    clearable
                    :filterable="true"
                    placeholder="请选择"
                    v-model="scope.row.outValueType"
                    :validate="{required: true}"
                    :options="outvalueTypeList"
                    @change="resetOutConfig(scope.row, scope.$index)"
                  >
                  </ht-select>
                  <el-button
                    v-if="
                      scope.row.outValueType &&
                        scope.row.outValueType != 'input' &&
                        scope.row.outValueType != 'data' &&
                        scope.row.outValueType != 'number'
                    "
                    size="small"
                    icon="el-icon-edit"
                    style="margin-left: 8px; margin-top: 0"
                    @click="setOutValue(scope.row, scope.$index)"
                  >设置</el-button
                  >
                </div>
              </template>
              <template v-else-if="scope.row.valueType == 2">
                <el-button
                  size="small"
                  icon="el-icon-edit"
                  @click="setOutValue2(scope.row, scope.$index)"
                >设置</el-button
                >
              </template>
            </template>
          </el-table-column>
          <el-table-column label="执行顺序" width="140px">
            <template scope="scope">
              <template v-if="scope.row.valueType == 2">
                <ht-input
                  v-model="scope.row.sort"
                  type="number"
                  :step="1"
                  :min="0"
                  placeholder="排序"
                  style="width: 100px;"
                />
              </template>
              <template v-else>
                -
              </template>
            </template>
          </el-table-column>
          <el-table-column label="是否必填" width="110px">
            <template scope="scope">
              <el-checkbox
                v-model="scope.row.isRequired"
                v-if="scope.row.valueType == 1"
              >是否必填</el-checkbox
              >
              <span v-else>-</span>
            </template>
          </el-table-column>
          <el-table-column label="操作" width="70px">
            <template scope="scope">
              <el-button
                @click="batchUpdateData.remove(scope.row)"
                type="text"
                size="small"
              >删除</el-button
              >
            </template>
          </el-table-column>
        </el-table>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="batchUpdateVisible = false">取 消</el-button>
        <el-button type="primary" @click="batchUpdateOk">确 定</el-button>
      </div>
    </el-dialog>

    <!-- 批量新增-设置 -->
    <el-dialog
      :close-on-click-modal="false"
      :destroy-on-close="true"
      :visible.sync="batchSaveVisible"
      title="批量新增"
      append-to-body
    >
      <el-form
        label-width="110px"
        style="width: 100%"
        v-form
        data-vv-scope="batchSaveForm"
      >
        <ht-form-item>
          <template slot="label">
            <el-tooltip content="所选择的自定义查询作为选项时的绑定">
              <i class="property-tip icon-question" />
            </el-tooltip>
            <span>选择对话框</span>
          </template>
          <div class="select-dialog-line">
            <ht-select
              filterable
              @change="batchSaveSelectChange"
              v-model="batchSaveForm.custDialog.alias"
              :options="customDialogs.filter(item=>item.style===0)"
              :props="{key: 'alias', value: 'name'}"
            />
            <el-button
              style="margin-left: 8px;"
              icon="el-icon-refresh"
              @click="
                batchSaveSelectChange(batchSaveForm.custDialog.alias, true)
              "
            ></el-button>
          </div>

          <div class="batchSaveTable">
            <el-table
              style="width:100%"
              border
              :max-height="400"
              :data="batchSaveForm.custDialog.mappingConf"
            >
              <el-table-column label="返回结果字段" prop="comment">
              </el-table-column>
              <el-table-column label="绑定显示的属性">
                <template scope="scope">
                  <ht-select
                    clearable
                    v-model="scope.row.target"
                    :options="saveBatchFieldsData"
                    :props="{key: 'name', value: 'desc'}"
                  >
                    <template slot-scope="{options}">
                      <el-option
                        v-for="item in options"
                        :key="item.id"
                        :label="item.desc"
                        :value="item.name"
                        :disabled="item.disabled"
                      ></el-option>
                    </template>
                  </ht-select>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </ht-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="batchSaveVisible = false">取 消</el-button>
        <el-button type="primary" @click="batchSaveOk()">确 定</el-button>
      </div>
    </el-dialog>

    <!-- 数据更新-批量关联设置 -->
    <el-dialog
      :close-on-click-modal="false"
      :destroy-on-close="true"
      :visible.sync="batchUpdateSettingVisible"
      v-if="batchUpdateSettingVisible"
      title="批量关联"
      width="70%"
      append-to-body
    >
      <div class="remark">
        当前下拉框的值发生变化时触发关联查询，可以添加多个关联查询（不能重复）。
        注意：当关联查询使用参数绑定时，通过参数查询的数据为空时，则不执行返回值为空时赋值策略.
      </div>
      <el-button
        class="btn-padding"
        icon="el-icon-plus"
        style="margin-bottom: 5px"
        type="primary"
        @click="
          batchUpdateSettingForm.globalQueryJson.push({
            entType: 'main',
            desc: '',
            conditionfield: [],
            resultfield: []
          })
        "
      >添加关联查询</el-button
      >

      <div style="width: 100%; height: 550px; overflow: auto">
        <el-card
          class="box-card batch-update-setting"
          v-for="(condition,
          indexCondition) in batchUpdateSettingForm.globalQueryJson"
          :key="indexCondition"
        >
          <div slot="header" class="clearfix">
            <div style="display: inline-block">
              <span
                style="
                  width: 90px;
                  display: inline-block;
                  text-align: right;
                  padding: 15px;
                "
              >关联查询:</span
              >
              <ht-select
                filterable
                @change="
                  batchUpdateSettingChange(condition.alias, indexCondition)
                "
                v-model="condition.alias"
                :options="localCustomQuerys"
                :props="{key: 'alias', value: 'name'}"
                style="width: 343px; padding-left: 15px"
              />
              <el-button
                style="margin-left: 8px;"
                icon="el-icon-refresh"
                @click="
                  batchUpdateSettingChange(
                    condition.alias,
                    indexCondition,
                    'refresh'
                  )
                "
              ></el-button>
            </div>
            <el-button
              type="text"
              style="margin-left: 10px; float: right"
              @click="batchUpdateSettingForm.globalQueryJson.remove(condition)"
            >删除</el-button
            >
          </div>
          <el-tabs type="border-card" class="toggle-button" style="margin: 0px">
            <el-tab-pane label="参数绑定">
              <table
                class="form-table choiceType-table"
                cellspacing="0"
                cellpadding="0"
                border="0"
              >
                <tbody>
                <tr
                  v-for="(bind, indexBind) in condition.conditionfield"
                  :key="indexBind"
                >
                  <th width="120px">{{ bind.comment }}:</th>
                  <td>
                    <div class="config-wrap">
                      <ht-select
                        clearable
                        v-model="bind.fieldPath"
                        :options="updateFields"
                        width="343px"
                        :props="{key: 'name', value: 'desc'}"
                      >
                        <template slot-scope="{options}">
                          <el-option
                            v-for="item in options"
                            :key="item.id"
                            :label="item.desc"
                            :value="
                                (item.tableName + item.oldTableField)
                                  .toLowerCase()
                                  .replaceAll('_', '')
                              "
                          ></el-option>
                        </template>
                      </ht-select>
                    </div>
                  </td>
                  <th width="150px">
                    <el-tooltip
                      class="item"
                      effect="dark"
                      content="参数为空时不返回数据；设置绑定值之后，参数为空时以绑定值作为参数传入"
                      placement="top"
                    >
                      <i class="el-icon-question"></i>
                    </el-tooltip>
                    为空时绑定值:
                  </th>
                  <td>
                    <ht-input
                      v-model="bind.emptyValue"
                      placeholder="请输入"
                      width="343px"
                    ></ht-input>
                  </td>
                </tr>
                </tbody>
              </table>
            </el-tab-pane>
            <el-tab-pane label="设置返回值">
              <table
                class="form-table choiceType-table"
                cellspacing="0"
                cellpadding="0"
                border="0"
              >
                <tbody>
                <tr
                  v-for="(bind, indexBind) in condition.resultfield"
                  :key="indexBind"
                >
                  <th width="120px">{{ bind.comment }}:</th>
                  <td>
                    <ht-select
                      clearable
                      v-model="bind.fieldPath"
                      :options="updateFields"
                      :props="{key: 'name', value: 'desc'}"
                    >
                      <template slot-scope="{options}">
                        <el-option
                          v-for="item in options"
                          :key="item.id"
                          :label="item.desc"
                          :value="
                              (item.tableName + item.oldTableField)
                                .toLowerCase()
                                .replaceAll('_', '')
                            "
                        ></el-option>
                      </template>
                    </ht-select>
                  </td>
                  <th width="150px">
                    <el-tooltip
                      class="item"
                      effect="dark"
                      content="返回值为空时，可赋值到该表单字段"
                      placement="top"
                    >
                      <i class="el-icon-question"></i>
                    </el-tooltip>
                    为空时赋值:
                  </th>
                  <td>
                    <ht-input
                      v-model="bind.emptyResultValue"
                      placeholder="请输入"
                    ></ht-input>
                  </td>
                </tr>
                </tbody>
              </table>
            </el-tab-pane>
          </el-tabs>
        </el-card>
      </div>

      <div slot="footer" class="dialog-footer">
        <el-button @click="batchUpdateSettingVisible = false">取 消</el-button>
        <el-button type="primary" @click="batchUpdateSettingSaveOk()"
        >确 定</el-button
        >
      </div>
    </el-dialog>

    <el-dialog
      :close-on-click-modal="false"
      :visible.sync="exportUpdateVisible"
      v-if="exportUpdateVisible"
      title="导出规则设置"
      append-to-body
      class="export-dialog"
      top="8vh"
    >
      <div>
        <div style="padding: 0 0 10px 10px; display: inline-block">
          <span>导出行数限制</span>&nbsp;
          <el-tooltip
            class="item"
            effect="dark"
            content="导出数据含子孙表时，请减少导出数量和排序字段，以免导出失败"
            placement="top-end"
          >
            <el-input-number
              style="width: 120px; margin-right: 10px"
              size="small"
              controls-position="right"
              v-model="currentRow.limit"
              :min="1"
              :max="200000"
              :step="10"
            ></el-input-number>
          </el-tooltip>
          <el-tooltip
            class="item"
            effect="dark"
            content="下载默认模板"
            placement="top-end"
          >
            <el-button
              size="small"
              icon="el-icon-download"
              @click="downloadTemplate('export')"
            ></el-button>
          </el-tooltip>
          <el-upload
            class="upload-demo"
            style="display: inline-block; margin-left: 10px"
            :action="actionUrl"
            :on-remove="handleRemoveExport"
            :file-list="currentRow.exportTemplate"
            :headers="header"
            :on-success="exportTempUploadSuccess"
            :before-upload="beforeExportUpload"
            ref="fileUp"
            :limit="2"
            accept=".xlsx"
          >
            <el-tooltip
              class="item"
              effect="dark"
              content="上传自定义导出模板，第一行可自定义内容描述，第二行为表头(不可修改)，从第三行开始写入数据"
              placement="top-end"
            >
              <el-button size="small" icon="el-icon-upload"></el-button>
            </el-tooltip>
          </el-upload>
          <el-switch
            v-if="exportSubFields && exportSubFields.length > 0"
            style="margin-left: 10px"
            v-model="currentRow.exportSub"
            active-color="#13ce66"
            inactive-color="#ff4949"
            active-value="1"
            inactive-value="2"
            active-text=""
            inactive-text="导出子表"
          >
          </el-switch>

          <el-switch
            v-if="currentRow.exportSub == 1"
            style="margin-left: 10px"
            v-model="currentRow.exportType"
            active-color="#13ce66"
            inactive-color="#ff4949"
            active-value="1"
            inactive-value="2"
            active-text="联合导出"
            inactive-text="分表导出"
          >
          </el-switch>
          <span style="margin-left: 10px"
          ><br />注：导出模版之前请先保存配置；选择导出子表时，子表数据量太大会导致导出失败</span
          >
          <span style="margin-left: 10px"
          ><br />使用联合导出时，当子表或孙表与关联表中的表有重复时，请注意列名是否重复，如果重复则会导出失败</span
          >
        </div>
        <el-table
          ref="displaySettingTable"
          border
          max-height="100%"
          :data="exportSettingFields"
          tooltip-effect="dark"
          @row-dblclick="fillToDisplay"
        >
          <el-table-column
            prop="name"
            label="列名"
            class="is-required"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            prop="desc"
            label="注释"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            prop="type"
            label="类型"
            width="80"
          ></el-table-column>

          <el-table-column label="是否导出" width="80">
            <template slot-scope="scope">
              <el-button
                @click="setRowValueByName(scope.row, 'isExport')"
                :type="scope.row.isExport != 1 ? 'info' : 'success'"
              >{{ scope.row.isExport != 1 ? '否' : '是' }}</el-button
              >
            </template>
          </el-table-column>

          <el-table-column label="导出排序" width="80">
            <template slot-scope="scope">
              <el-button
                v-if="scope.row.isExport == 1"
                @click="setRowValueByName(scope.row, 'defaultSort')"
                :type="scope.row.defaultSort != 1 ? 'info' : 'success'"
              >{{ scope.row.defaultSort != 1 ? '否' : '是' }}</el-button
              >
            </template>
          </el-table-column>
          <el-table-column label="排序方向" width="110">
            <template slot-scope="scope">
              <ht-select
                :options="[{key: 'asc'}, {key: 'desc'}]"
                :props="{key: 'key', value: 'key'}"
                v-model="scope.row.sortSeq"
                clearable
                style="width: 86px"
                v-if="scope.row.defaultSort == 1 && scope.row.isExport == 1"
              />
            </template>
          </el-table-column>
        </el-table>
        <div
          v-if="
            exportSubFields &&
              exportSubFields.length > 0 &&
              currentRow.exportSub == 1
          "
        >
          <div style="margin: 15px; font-size: 10px; font-weight: bold">
            子表字段
          </div>
          <el-tabs type="card">
            <el-tab-pane
              v-for="(sub, index) in exportSubFields"
              :key="index"
              :label="sub.desc"
            >
              <el-table border :data="sub.attributeList" tooltip-effect="dark">
                <el-table-column
                  prop="name"
                  label="列名"
                  class="is-required"
                  show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                  prop="desc"
                  label="注释"
                  show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                  prop="type"
                  label="类型"
                  width="80"
                ></el-table-column>

                <el-table-column label="是否导出" width="80">
                  <template slot-scope="scope">
                    <el-button
                      @click="setRowValueByName(scope.row, 'isExport')"
                      :type="scope.row.isExport != 1 ? 'info' : 'success'"
                    >{{ scope.row.isExport != 1 ? '否' : '是' }}</el-button
                    >
                  </template>
                </el-table-column>

                <el-table-column label="导出排序" width="100">
                  <template slot-scope="scope">
                    <el-button
                      v-if="scope.row.isExport == 1"
                      @click="setRowValueByName(scope.row, 'defaultSort')"
                      :type="scope.row.defaultSort != 1 ? 'info' : 'success'"
                    >{{ scope.row.defaultSort != 1 ? '否' : '是' }}</el-button
                    >
                  </template>
                </el-table-column>
                <el-table-column label="排序方向" width="110">
                  <template slot-scope="scope">
                    <ht-select
                      :options="[{key: 'asc'}, {key: 'desc'}]"
                      :props="{key: 'key', value: 'key'}"
                      v-model="scope.row.sortSeq"
                      clearable
                      v-if="
                        scope.row.defaultSort == 1 && scope.row.isExport == 1
                      "
                    />
                  </template>
                </el-table-column>
              </el-table>
              <div
                v-if="sub.childEnts && sub.childEnts.length > 0"
                style="margin: 15px; font-size: 10px; font-weight: bold"
              >
                孙表字段
              </div>
              <el-tabs type="card">
                <el-tab-pane
                  v-for="(sun, sunindex) in sub.childEnts"
                  :key="sunindex"
                  :label="sun.desc"
                >
                  <el-table
                    border
                    :data="sun.attributeList"
                    tooltip-effect="dark"
                  >
                    <el-table-column
                      prop="name"
                      label="列名"
                      class="is-required"
                      show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                      prop="desc"
                      label="注释"
                      show-overflow-tooltip
                    ></el-table-column>
                    <el-table-column
                      prop="type"
                      label="类型"
                      width="80"
                    ></el-table-column>

                    <el-table-column label="是否导出" width="80">
                      <template slot-scope="scope">
                        <el-button
                          @click="setRowValueByName(scope.row, 'isExport')"
                          :type="scope.row.isExport != 1 ? 'info' : 'success'"
                        >
                          {{ scope.row.isExport != 1 ? '否' : '是' }}
                        </el-button>
                      </template>
                    </el-table-column>

                    <el-table-column label="导出排序" width="100">
                      <template slot-scope="scope">
                        <el-button
                          v-if="scope.row.isExport == 1"
                          @click="setRowValueByName(scope.row, 'defaultSort')"
                          :type="
                            scope.row.defaultSort != 1 ? 'info' : 'success'
                          "
                        >
                          {{ scope.row.defaultSort != 1 ? '否' : '是' }}
                        </el-button>
                      </template>
                    </el-table-column>
                    <el-table-column label="排序方向" width="110">
                      <template slot-scope="scope">
                        <ht-select
                          :options="[{key: 'asc'}, {key: 'desc'}]"
                          :props="{key: 'key', value: 'key'}"
                          v-model="scope.row.sortSeq"
                          clearable
                          v-if="
                            scope.row.defaultSort == 1 &&
                              scope.row.isExport == 1
                          "
                        />
                      </template>
                    </el-table-column>
                  </el-table>
                </el-tab-pane>
              </el-tabs>
            </el-tab-pane>
          </el-tabs>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="exportUpdateVisible = false">取 消</el-button>
        <el-button type="primary" @click="exportOk">确 定</el-button>
      </div>
    </el-dialog>

    <el-dialog
      :close-on-click-modal="false"
      :close-on-press-escape="false"
      :show-close="false"
      :visible.sync="importUpdateVisible"
      v-if="importUpdateVisible"
      title="导入规则设置"
      append-to-body
      class="export-dialog"
      top="8vh"
    >
      <div @click="handleImportClick(currentRow)">
        <el-form
          :model="currentRow"
          :inline="false"
          :rules="rules"
          ref="importSetting"
        >
          <el-form-item label="导入类型" label-width="130px" prop="importType">
            <el-radio-group v-model="currentRow.importType">
              <el-radio label="main">仅导入主表</el-radio>
              <el-radio label="sub" :disabled="!importSubFields.length > 0"
              >导入主表与子表</el-radio
              >
              <el-radio label="sun" :disabled="!importSunFields.length > 0"
              >导入主表子表与孙表</el-radio
              >
            </el-radio-group>
          </el-form-item>
          <!-- <ht-form-item label="导入模板" label-width="130px">
              <el-upload
                class="upload-demo"
                style="display: inline-block; margin-left: 10px"
                :action="actionUrl"
                :on-remove="handleRemove"
                :file-list="currentRow.importTemplate"
                :headers="header"
                :on-success="success"
                :before-upload="beforeUpload"
                ref="fileUp"
                :limit="2"
                accept=".xls,.xlsx"
              >
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="上传自定义模板，第一行可自定义内容描述，第二行为表头(不可修改)，从第三行开始解析数据"
                  placement="top-end"
                >
                  <el-button size="small" icon="el-icon-upload"></el-button>
                </el-tooltip>
              </el-upload>
            </ht-form-item>
            <ht-form-item label="数据规则" label-width="130px">
              <ht-radio
                v-model="currentRow.importDataRule"
                :options="[
                  {key: '0', value: '插入新数据'},
                  {key: '1', value: '删除原数据'},
                ]"
              />
            </ht-form-item> -->
          <!-- <ht-form-item label="主键" label-width="130px">
              <ht-select
                v-model="currentRow.importPk"
                :options="selectData"
                :props="{key: 'name', value: 'name'}"
                :validate="{required: true}"
              />
            </ht-form-item> -->
          <el-form-item
            v-if="
              currentRow.importType == 'sub' || currentRow.importType == 'sun'
            "
            label="选择子表"
            label-width="130px"
            prop="importSub"
          >
            <el-select
              v-model="currentRow.importSub"
              placeholder="请选择"
              :multiple="true"
              value-key="name"
              style="width: 80%"
              @remove-tag="deleteTag"
            >
              <el-option
                v-for="item in importSubFields"
                :key="item.name"
                :label="item.desc"
                :value="item"
                :disabled="isSubExist(item)"
                @click.native="createSun()"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item
            v-if="currentRow.importType == 'sun'"
            label="选择孙表"
            label-width="130px"
            prop="importSun"
          >
            <el-select
              v-model="currentRow.importSun"
              placeholder="请选择"
              :multiple="true"
              value-key="name"
              style="width: 80%"
            >
              <el-option
                v-for="item in importSunFields"
                :key="item.name"
                :label="item.desc"
                :value="item"
              >
              </el-option>
            </el-select>
          </el-form-item>
          <!-- <ht-form-item
              v-if="currentRow.importDataRule == '0'"
              label="更新规则"
              label-width="130px"
            >
              <ht-radio
                v-model="currentRow.updateDataRule"
                :options="[
                  {key: '0', value: '覆盖更新'},
                  {key: '1', value: '重复跳过'},
                ]"
              />
            </ht-form-item> -->
          <!-- <ht-form-item label="导入行数限制" label-width="130px">
              <el-input-number
                style="width: 120px; margin-right: 10px"
                size="small"
                controls-position="right"
                v-model="currentRow.limit"
                :min="1"
                :max="20000"
                :step="10"
              ></el-input-number>
            </ht-form-item>
            <ht-form-item label="校验Jar包" label-width="130px">
              <el-tag
                style="height: 32px; line-height: 28px"
                v-if="currentRow.jarId"
                size="medium"
                closable
                :disable-transitions="false"
                @close="
                  currentRow.jarId = ''
                  currentRow.jarDesc = ''
                "
                >{{ currentRow.jarDesc }}
              </el-tag>
              <el-button
                size="small"
                icon="el-icon-search"
                @click="selectJar()"
              ></el-button>

              <el-tooltip
                class="item"
                effect="dark"
                content="下载默认模板"
                placement="top-end"
              >
                <el-button
                  size="small"
                  icon="el-icon-download"
                  @click="downloadTemplate()"
                ></el-button>
              </el-tooltip>
              <el-upload
                class="upload-demo"
                style="display: inline-block; margin-left: 10px"
                :action="actionUrl"
                :on-remove="handleRemove"
                :file-list="currentRow.importTemplate"
                :headers="header"
                :on-success="success"
                :before-upload="beforeUpload"
                ref="fileUp"
                :limit="2"
                accept=".xls,.xlsx"
              >
                <el-tooltip
                  class="item"
                  effect="dark"
                  content="上传自定义模板，第一行可自定义内容描述，第二行为表头(不可修改)，从第三行开始解析数据"
                  placement="top-end"
                >
                  <el-button size="small" icon="el-icon-upload"></el-button>
                </el-tooltip>
              </el-upload>
            </ht-form-item> -->
        </el-form>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button @click="cancelImport">取 消</el-button>
        <el-button type="primary" @click="importOk()">确 定</el-button>
      </div>
    </el-dialog>

    <!-- 获取对话框选项列表-->
    <ht-load-data
      url="/form/customDialog/v1/getAll"
      requestMethod="get"
      context="form"
      ref="htLoadData"
      @after-load-data="afterCustomDialogLoadData"
    ></ht-load-data>
    <ht-load-data
      url="/form/customQuery/v1/list"
      requestMethod="post"
      context="form"
      ref="queryLoadData"
      @after-load-data="afterCustomQueryLoadData"
    ></ht-load-data>
    <el-dialog
      v-if="outValueTypeVisible"
      :visible.sync="outValueTypeVisible"
      :close-on-click-modal="false"
      :destroy-on-close="true"
      append-to-body
    >
      <el-form v-if="outConfig.type == 'select'" label-width="120px">
        <el-form-item label="选项配置">
          <el-radio-group
            v-model="outConfig.choiceType"
            size="small"
            class="btn-radio"
          >
            <el-radio-button label="static">固定选项</el-radio-button>
            <el-radio-button label="dynamic">动态选项</el-radio-button>
          </el-radio-group>
        </el-form-item>
        <template v-if="outConfig.choiceType == 'dynamic'">
          <el-form-item label="选择关联查询">
            <ht-select
              filterable
              @change="setCurrentCustomQuery"
              v-model="outConfig.customQuery.alias"
              :options="customQuerys"
              :props="{key: 'alias', value: 'name'}"
            />
          </el-form-item>
          <el-form-item label="值">
            <ht-select
              clearable
              v-model="outConfig.customQuery.valueBind"
              :options="outConfig.customQuery.resultfield"
              :props="{key: 'field', value: 'comment'}"
            />
          </el-form-item>
          <el-form-item label="标签">
            <ht-select
              clearable
              v-model="outConfig.customQuery.labelBind"
              :options="outConfig.customQuery.resultfield"
              :props="{key: 'field', value: 'comment'}"
            />
          </el-form-item>
        </template>
        <template v-else>
          <el-table style="width: 100%" :data="outConfig.selectData" border>
            <el-table-column label="选项值" width="300px">
              <template slot-scope="scope">
                <ht-input
                  v-model="scope.row.key"
                  style="width: 100%"
                ></ht-input>
              </template>
            </el-table-column>
            <el-table-column label="选项标签">
              <template slot-scope="scope">
                <ht-input
                  v-model="scope.row.value"
                  style="width: 100%"
                ></ht-input>
              </template>
            </el-table-column>
            <el-table-column label="操作" width="100px">
              <template slot="header">
                操作
                <el-button
                  class="btn-padding"
                  icon="el-icon-plus"
                  @click="outConfig.selectData.push({key: '', value: ''})"
                ></el-button>
              </template>
              <template slot-scope="scope">
                <el-button
                  class="btn-padding"
                  style="margin-left: 0px"
                  icon="el-icon-delete"
                  @click="outConfig.selectData.remove(scope.row)"
                ></el-button>
              </template>
            </el-table-column>
          </el-table>
        </template>
      </el-form>

      <el-form v-else-if="outConfig.type == 'dialog'" label-width="120px">
        <ht-form-item label="按钮名称">
          <ht-input v-model="outConfig.dialogConfig.name"></ht-input>
        </ht-form-item>
        <ht-form-item>
          <template slot="label">
            <el-tooltip content="所选择的自定义查询作为选项时的绑定">
              <i class="property-tip icon-question" />
            </el-tooltip>
            <span>选择对话框</span>
          </template>
          <ht-select
            filterable
            @change="changeCustDialog"
            v-model="outConfig.dialogConfig.alias"
            :options="customDialogs"
            :props="{key: 'alias', value: 'name'}"
          />
          <table class="form-table" cellspacing="0" cellpadding="0" border="0">
            <tbody>
            <tr class="linkageTable-tr">
              <td width="200px">返回结果字段</td>
              <td width="250px">绑定显示的属性</td>
              <td>回填模式</td>
            </tr>

            <tr
              class="linkageTable-tr"
              v-for="(field, index) in outConfig.dialogConfig.resultField"
              :key="index"
            >
              <td>{{ field.comment }}</td>
              <td>
                <ht-select
                  clearable
                  v-model="outConfig.parameter[field.comment]"
                  :options="mainSettingFields"
                  :props="{key: 'name', value: 'desc'}"
                >
                  <template slot-scope="{options}">
                    <el-option
                      v-for="item in options"
                      :key="item.id"
                      :label="item.desc"
                      :value="
                          curTemplateBoDef.boEnt.isExternal
                            ? item.oldTableField
                            : item.name
                        "
                    ></el-option>
                  </template>
                </ht-select>
              </td>
              <td>
                <ht-radio
                  v-model="field.fillBackType"
                  @change="$forceUpdate()"
                  :options="[
                    {key: 1, value: '覆盖回填'},
                    {key: 2, value: '有值不覆盖'}
                  ]"
                  style="width:100%"
                  optionLayout="horizontal"
                />
              </td>
            </tr>
            </tbody>
          </table>
        </ht-form-item>
      </el-form>

      <el-form v-else v-form data-vv-scope="form" :model="outConfig">
        <el-form-item>
          <template>
            <el-checkbox v-model="outConfig.isSingle">单选</el-checkbox>
            <el-checkbox
              v-model="outConfig.selectCurrent"
              v-if="outConfig.type == 'user'"
            >当前用户</el-checkbox
            >
            <el-checkbox
              v-model="outConfig.selectCurrent"
              v-else-if="outConfig.type == 'org'"
            >当前组织</el-checkbox
            >
          </template>
        </el-form-item>
        <el-form-item>
          <template slot="label">
            <el-tooltip
              content="选择器的返回值绑定的属性，选择器控件绑定的属性不能作为返回值绑定"
            >
              <i class="property-tip icon-question" />
            </el-tooltip>
            <span>返回值</span>
          </template>
          <br />
          <template v-if="outConfig.type == 'user'">
            <ht-form-item label="用户ID" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.id"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="用户账号" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.account"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="用户姓名" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.fullname"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="用户手机" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.mobile"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="用户邮箱" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.email"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
          </template>
          <template v-else-if="outConfig.type == 'org'">
            <ht-form-item label="组织ID" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.id"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="组织代码" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.code"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="组织名称" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.name"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
          </template>
          <template v-else-if="outConfig.type == 'post'">
            <ht-form-item label="岗位ID" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.id"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="岗位代码" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.code"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="岗位名称" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.name"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
          </template>
          <template v-else-if="outConfig.type == 'job'">
            <ht-form-item label="职务ID" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.id"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="职务代码" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.code"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="职务名称" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.name"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
          </template>
          <template v-else-if="outConfig.type == 'dem'">
            <ht-form-item label="维度ID" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.id"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="维度代码" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.code"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="维度名称" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.demName"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
          </template>
          <template v-else-if="outConfig.type == 'role'">
            <ht-form-item label="角色ID" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.id"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="角色代码" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.code"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
            <ht-form-item label="角色名称" label-width="100px">
              <ht-select
                clearable
                v-model="outConfig.parameter.name"
                :options="mainSettingFields"
                :props="{key: 'name', value: 'desc'}"
              >
                <template slot-scope="{options}">
                  <el-option
                    v-for="item in options"
                    :disabled="item.name == outConfig.bind"
                    :key="item.id"
                    :label="item.desc"
                    :value="
                      curTemplateBoDef.boEnt.isExternal
                        ? item.oldTableField
                        : item.name
                    "
                  ></el-option>
                </template>
              </ht-select>
            </ht-form-item>
          </template>
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="outValueTypeVisible = false">取 消</el-button>
        <el-button type="primary" @click="outValueOk">确 定</el-button>
      </div>
    </el-dialog>

    <!--公式脚本对话框 -->
    <formulas-dialog ref="formulasDialog" @onComFormulas="onComFormulas" />

    <el-dialog
      :title="scriptType == 'before' ? '设置前置JS脚本' : '设置后置JS脚本'"
      v-if="scriptVisible"
      :visible.sync="scriptVisible"
      :close-on-click-modal="false"
      :destroy-on-close="true"
      append-to-body
    >
      <div>
        <p>
          <strong v-if="scriptType == 'before'"
          >备注： 返回 true 显示按钮 返回 false 不显示 <br />
            <span style="color: rgba(255, 0, 0, 0.8)">
              *注意:当控制行内按钮的显示隐藏时，
              可选的参数多一个_row，可以根据_row是否为空来区分顶部和行内按钮的逻辑
            </span>
          </strong>
          <strong v-else>
            备注： 返回 true 执行操作 返回 false 不执行
            <br />
            <span style="color: rgba(255, 0, 0, 0.8)">
              *注意:当控制行内按钮的是否执行时，
              可选的参数多一个_row，可以根据_row是否为空来区分顶部和行内按钮的逻辑
            </span>
          </strong>
        </p>
        <p>只需要填写function内的业务逻辑 内置参数有</p>
        <code>
          <br />// 批量更新数据 _this.batchUpdateDialogData 当前窗口的数据
          function(_req,_this,_rows){ <br />// req 异步请求封装
          可以查看带中的request.js <br />// _this 当前vue实例

          <br />// _rows 当前列表数据 <br />
          // _row 当前行数据
          <p>
            //异步请求的写法 <br />
            let url="${form}/form/dataTemplate/v1/testCheck" <br />
            return new Promise((resolve, reject) => {
            <br />_req.get(url).then(resp => { <br />
            //返回值 <br />resolve(resp.data); <br />
            },error => {-+ <br />
            reject(error); <br />
            }) <br />
            })
          </p>
          }
        </code>
      </div>
      <div>
        <HtMonacoEditor
          ref="mycodeAfter"
          v-model="formulasDiyJs"
          height="240px"
        />
      </div>

      <div slot="footer" class="dialog-footer">
        <el-button @click="scriptVisible = false">取 消</el-button>
        <el-button type="primary" @click="scriptOk">确 定</el-button>
      </div>
    </el-dialog>
    <!-- <el-dialog
        v-if="setCopyConfigVisible"
        :visible.sync="setCopyConfigVisible"
        :close-on-click-modal="false"
        :destroy-on-close="true"
        width="30%"
        append-to-body
      >
      <el-checkbox v-model="copyTop" label="顶部按钮" border></el-checkbox>
      <el-checkbox v-model="copyNow" label="当前列按钮" border></el-checkbox> -->
    <!-- <el-radio-group v-model="copyConfig">
        <el-radio :label="1">顶部按钮</el-radio>
        <el-radio :label="2">当前列按钮</el-radio>
    </el-radio-group> -->
    <!-- <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="copyConfigOk">确 定</el-button>
          <el-button @click="setCopyConfigVisible = false">取 消</el-button>
      </div>
      </el-dialog> -->
    <import-btn-setting-dialog
      :current-row.sync="currentRow"
      ref="importBtnSettingDialog"
      :bo-def="curTemplateBoDef"
      :template-key="dataTemplate.alias"
    ></import-btn-setting-dialog>
    <show-sub-data-btn-setting
      ref="showSubDataBtnSetting"
    ></show-sub-data-btn-setting>
    <i18n-message-edit
      ref="i18nMessageEdit"
      :messageKey="i18nMessageKey"
      @after-save="afterSaveI18n"
    />
    <!-- 配置认证接口对话框 -->
    <biz-auth-dialog @onConfirm="authDialogConfirm" ref="bizAuthDialog" />
  </el-container>
</template>
<script>
import form from '@/api/form.js'
import FormulasDialog from '@/components/form/dataTemplate/FormulasDialog.vue'
const eipAuthDialog = () => import('@/components/dialog/EipAuthDialog.vue')
const ImportJarSelector = () =>
  import('@/components/form/dataTemplate/ImportCheckJarManager.vue')
const flowFormAuth = () => import('@/components/flow/FlowFormAuth.vue')
const flowFormAdd = () => import('@/components/flow/FlowFormAdd.vue')
const ImportBtnSettingDialog = () => import('./ImportBtnSettingDialog.vue')
const ShowSubDataBtnSetting = () => import('./ShowSubDataBtnSetting.vue')
import i18nMessageEdit from '@/components/system/I18nMessageEdit.vue'
const bizAuthDialog = () => import('@/components/dialog/BizAuthDialog.vue')
import {mapState} from 'vuex'
import {Base64} from 'js-base64'
import utils from '@/hotent-ui-util.js'
import deepmerge from 'deepmerge'

const BTN_TYPE = {
  isShow: '1',
  notShow: '2'
}
export default {
  components: {
    bizAuthDialog,
    eipAuthDialog,
    ImportJarSelector,
    flowFormAuth,
    flowFormAdd,
    ImportBtnSettingDialog,
    ShowSubDataBtnSetting,
    i18nMessageEdit,
    FormulasDialog
  },
  name: 'manage-setting',
  props: ['data'],
  data() {
    return {
      tokenKey: '',
      tokenEnabled: false,
      tokenType: 0,
      tokenApi: {},
      tokenTypeOptions: [
        {
          key: 0,
          value: '当前用户'
        },
        {
          key: 1,
          value: '接口获取'
        }
      ],
      rules: {
        importType: [
          {required: true, message: '请选择导入类型', trigger: 'change'}
        ],
        importSub: [{required: true, message: '请选择子表', trigger: 'change'}],
        importSun: [{required: true, message: '请选择孙表', trigger: 'change'}]
      },
      configData: {},
      selectData: [{name: 'account'}, {name: 'userId'}],
      formulasDiyJs: '',
      scriptType: '',
      tableConfigure: {
        operateWidth: '180',
        opterateAlign: 'center'
      },
      cmOptions2: {
        showCursorWhenSelecting: true,
        value: '',
        mode: 'javascript',
        readOnly: false,
        smartIndent: true,
        tabSize: 2,
        theme: 'base16-light',
        lineNumbers: true,
        line: true,
        autofocus: true,
        inputStyle: 'textarea'
      },
      dialogWidth: 1580,
      dialogHeight: 740,
      currentRow: {},
      currentIndex: null,
      btnType: BTN_TYPE,
      copyTop: true,
      copyNow: true,
      copyConfig: 1,
      setCopyConfigVisible: false,
      dialogVisible: false,
      scriptVisible: false,
      dialogModel: {},
      url: {},
      urlParams: [],
      dataTemplate: {},
      manageFields: [],
      permissionMap: {},
      permissionList: [],
      displayExportSettingFields: [],
      exportSettingFields: [],
      customQuerys: [],
      localCustomQuerys: [],
      customDialogs: [],
      displayField: [],
      btnoptions: [],
      defaultBtnOptions: [
        {key: 'add', value: '新增', disabled: false},
        {key: 'edit', value: '编辑', disabled: false},
        {key: 'del', value: '删除', disabled: false},
        {key: 'detail', value: '明细', disabled: false},
        {key: 'record', value: '修改记录', disabled: false},
        {key: 'printDetail', value: '打印明细', disabled: false},
        {
          key: 'sub',
          value: '子表数据',
          disabled: false,
          options: {import: false, export: true}
        },
        {key: 'sun', value: '查看孙表', disabled: false},
        {key: 'export', value: '导出', disabled: false},
        {key: 'js', value: 'js按钮', disabled: false},
        {
          key: 'import',
          value: '导入',
          limit: 1000,
          // importType:'main',
          importTemplate: [],
          jarId: '',
          jarDesc: '',
          disabled: false
        },
        {key: 'print', value: '打印', disabled: false},
        {key: 'url', value: 'URL按钮', disabled: false},
        {key: 'switch', value: '开关', disabled: false},
        {key: 'batchUpdate', value: '更新数据', disabled: false},
        {
          key: 'copy',
          value: '复制',
          disabled: false,
          copyTop: true,
          copyNow: true
        },
        {
          key: 'addFlow',
          value: '新增流程',
          disabled: false
        },
        {
          key: 'addData',
          value: '新增数据',
          disabled: false
        },
        {
          key: 'searchData',
          value: '查询数据',
          disabled: false
        },
        {
          key: 'batchSave',
          value: '批量新增',
          disabled: false
        },
        {key: 'moduleButton', value: '组件按钮', disabled: false},
      ],
      mobileBtnOptions: [
        {
          key: 'produceQRCode',
          value: '生成二维码',
          disabled: false,
          isMoblieBtn: true
        }
      ],
      tableHeight: `${document.documentElement.clientHeight}` - 318,
      tabHeight: `${document.documentElement.clientHeight}` - 280,
      currentAuthRow: null,
      dialogTitle: '',
      switchOn: '',
      switchOff: '',
      switchDefaultTrue: false,
      switchOptions: [
        {
          value: true,
          label: '默认为开'
        },
        {
          value: false,
          label: '默认为关'
        }
      ],
      switchOnLabel: '',
      switchOffLabel: '',
      files: [],
      curSelectIndex: 0,
      diyScript: '',
      index: 0,
      dialogMethodVisible: false,
      dialogRuleData: '',
      displaySettingFields: [],
      cmOptions: {
        value: '',
        mode: 'javascript',
        readOnly: false,
        smartIndent: true,
        tabSize: 1,
        theme: 'base16-light',
        lineNumbers: true,
        line: true,
        lineWiseCopyCut: true,
        showCursorWhenSelecting: true
      },
      outvalueTypeList: [
        {key: 'input', value: '文本框'},
        {key: 'data', value: '日期'},
        {key: 'number', value: '数字'},
        {key: 'select', value: '下拉框'},
        {key: 'dialog', value: '对话框'},
        {key: 'user', value: '用户选择器'},
        {key: 'org', value: '组织选择器'},
        {key: 'post', value: '岗位选择器'},
        {key: 'job', value: '职位选择器'},
        {key: 'dem', value: '维度选择器'},
        {key: 'role', value: '角色选择器'}
      ],
      batchUpdateVisible: false,
      exportUpdateVisible: false,
      importUpdateVisible: false,
      batchUpdateData: [],
      outConfig: {
        choiceType: 'static',
        parameter: {},
        selectData: [],
        customQuery: {alias: '', valueBind: '', labelBind: ''},
        dialogConfig: {name: '请选择'}
      },
      outIndex: '',
      outValueTypeVisible: false,
      filedsObj: {},
      refreshTime: new Date().getTime(),
      boEntList: [],
      curTemplateBoDef: {},
      //子表数组
      importSubFields: [],
      //孙表数组
      importSunFields: [],
      //流程相关按钮
      flowBtns: [
        {
          key: 'startFlow',
          value: '发起流程',
          disabled: false,
          isFlowBtn: true
        },
        {
          key: 'approval',
          value: '任务办理',
          disabled: false,
          isFlowBtn: true
        },
        {
          key: 'taskDetail',
          value: '任务明细',
          disabled: false,
          isFlowBtn: true
        },
        {
          key: 'taskImage',
          value: '流程图',
          disabled: false,
          isFlowBtn: true
        },
        {
          key: 'history',
          value: '审批历史',
          disabled: false,
          isFlowBtn: true
        },
        {
          key: 'revoke',
          value: '撤回',
          disabled: false,
          isFlowBtn: true
        },
        {
          key: 'phyDelete',
          value: '删除草稿',
          disabled: false,
          isFlowBtn: true
        },
        {
          key: 'logicDelete',
          value: '删除流程',
          disabled: false,
          isFlowBtn: true
        },
        {
          key: 'taskToRead',
          value: '传阅',
          disabled: false,
          isFlowBtn: true
        }
      ],
      i18nMessageKey: '',
      needValidateSelect: false,
      topPosition: false,
      batchSaveVisible: false,
      batchUpdateSettingVisible: false,
      batchSaveForm: {
        custDialog: {
          alias: '',
          mappingConf: []
        },
        resultField: []
      },
      batchUpdateSettingForm: {
        globalQueryJson: []
      },
      rightLab: ''
    }
  },
  watch: {
    'data.bpmDataTemplate.subject': function(newVal) {
      //判断是否绑定了流程，绑定了流程功能按钮可以选择发起流程按钮
      if (newVal) {
        this.flowBtns.forEach(item => {
          this.btnoptions.push(item)
          this.defaultBtnOptions.push(item)
        })
      } else {
        this.btnoptions = this.btnoptions.filter(b => !b.isFlowBtn)
        this.defaultBtnOptions = this.btnoptions.filter(b => !b.isFlowBtn)
        this.manageFields = this.manageFields.filter(b => !b.isFlowBtn)
      }
    },
    'data.bpmDataTemplate.mobileFormAlias': function(newVal) {
      //判断是否绑定了手机表单，绑定了有生成二维码的功能按钮可选
      if (newVal) {
        this.mobileBtnOptions.forEach(item => {
          this.btnoptions.push(item)
          this.defaultBtnOptions.push(item)
        })
      } else {
        this.btnoptions = this.btnoptions.filter(b => !b.isMoblieBtn)
        this.defaultBtnOptions = this.btnoptions.filter(b => !b.isMoblieBtn)
      }
    },
    deep: true,
    immediate: true
  },
  computed: mapState({
    header: state => {
      return {Authorization: `Bearer ${state.login.currentUser.token}`}
    },
    actionUrl: function() {
      return window.context.portal + '/system/file/v1/upload'
    },
    //所有字段的选项，包括主键、外键和流程字段
    allFieldOptions(state) {
      return state.form.formListCommonVar
    },
    //主表字段
    mainSettingFields(state) {
      return state.form.formListCommonVar[0].fields.filter(
        item =>
          !['ID_', 'REF_ID_', 'F_form_data_rev_'].includes(
            item.oldTableField
          ) && item.flowField != true
      )
    },
    formVariables(state) {
      return state.form.formListCommonVar.map(item => {
        return {
          ...item,
          fields: item.fields.map(it => {
            const fieldName = it.oldTableField
              ? `${it.tableName}${it.oldTableField}`
              : it.name
            return {
              ...it,
              name: it.oldTableField
                ? fieldName.toLowerCase().replaceAll('_', '')
                : fieldName
            }
          })
        }
      })
    },
    /* 选择了的属性限制重复选择 */
    saveBatchFieldsData() {
      let selectKeys = this.batchSaveForm.custDialog.mappingConf.map(item => {
        return item.target
      })
      this.mainSettingFields.forEach((item, field) => {
        if (selectKeys.includes(item.name)) {
          item.disabled = true
        } else {
          item.disabled = false
        }
      })
      return this.mainSettingFields
    },
    updateFields() {
      return this.mainSettingFields
    }
  }),
  mounted() {
    this.tableConfigure = {operateWidth: '180', opterateAlign: 'center'}
    this.dataTemplate = this.data.bpmDataTemplate

    if (this.dataTemplate.tableConfigure) {
      this.tableConfigure = JSON.parse(this.dataTemplate.tableConfigure)
    }
    if (this.tableConfigure.operateWidth == '') {
      this.tableConfigure.operateWidth = '180'
    }
    if (this.data.displaySettingFields) {
      this.displaySettingFields = this.initDisplaySettingFields()
    }
    if (this.displaySettingFields && this.displaySettingFields.length > 0) {
      let subs = JSON.parse(this.dataTemplate.subField)
      let subName = []
      if (subs && subs.length > 0) {
        subs.forEach(i => {
          i.attributeList.forEach(sub => {
            subName.push(sub.fieldName)
          })
        })
      }
    }
    //判断是否绑定了流程，绑定了流程功能按钮可以选择发起流程按钮
    if (this.data.bpmDataTemplate.subject) {
      this.flowBtns.forEach(item => {
        this.btnoptions.push(item)
        this.defaultBtnOptions.push(item)
      })
    }
    if (this.data.bpmDataTemplate.mobileFormAlias) {
      this.mobileBtnOptions.forEach(item => {
        this.btnoptions.push(item)
        this.defaultBtnOptions.push(item)
      })
    }
    this.manageFields = this.dataTemplate.manageField
      ? JSON.parse(this.dataTemplate.manageField)
      : []
    this.manageFields.forEach(k=>{
      if ((k.name == 'add') && k.initSubData == undefined) {
        this.$set(k, 'initSubData', true)
      }
    })
    this.displayField = []
    if (this.dataTemplate.displayField) {
      this.resetDisplaySettingFields(
        this.displayField,
        JSON.parse(this.dataTemplate.displayField)
      )
    }

    this.permissionMap = this.data.permissionList
    if (this.permissionMap) {
      for (let key in this.permissionMap) {
        this.permissionList.push({type: key, title: this.permissionMap[key]})
      }
      this.displaySettingFields.forEach(item => {
        this.filedsObj[item.name] = item.desc
      })
    }
    const manageFields = JSON.parse(this.dataTemplate.manageField)
    const alreadyAddedFields = new Map()
    if (manageFields) {
      manageFields.forEach(manageField => {
        alreadyAddedFields.set(manageField.name, manageField.name)
        this.defaultBtnOptions.forEach(btn => {
          if (
            manageField.name === btn.key &&
            !(
              btn.key == 'js' ||
              btn.key == 'url' ||
              btn.key == 'switch' ||
              btn.key == 'batchUpdate'||
              btn.key == 'addFlow' ||
              btn.key == 'addData' ||
              btn.key == 'searchData' ||
              btn.key == 'batchSave'
            )
          ) {
            btn.disabled = true
          }
        })
      })
    }
    this.btnoptions = this.defaultBtnOptions.filter(
      btn => !alreadyAddedFields.has(btn.key)
    )
    let me_ = this
    this.$http
      .get(
        '${form}/bo/def/v1/getJsonByAlias?alias=' + this.dataTemplate.boDefAlias
      )
      .then(function(resp) {
        if (resp.data) {
          me_.curTemplateBoDef = resp.data
        }
      })
  },
  methods: {
    //设置表头多列
    rowClass({row, column, rowIndex, columnIndex}) {
      if (rowIndex === 1) {
        return {
          display: 'none'
        }
      }
    },
    //显示 配置认证接口对话框
    showBizAuthDialog() {
      this.$refs.bizAuthDialog.showDialog(this.tokenApi)
    },
    //配置认证接口对话框 确认保存
    authDialogConfirm(tokenApi) {
      this.tokenApi = tokenApi
    },
    resetDisplaySettingFields(displayField, arr) {
      arr.forEach(item => {
        if (item.name) {
          displayField.push(item)
        }
        if (item.children) {
          this.resetDisplaySettingFields(displayField, item.children)
        }
      })
    },
    initDisplaySettingFields() {
      let arr = []
      this.$store.state.form.formListCommonVar.forEach((item, index) => {
        item.fields.forEach(sub => {
          if (!sub.flowField) {
            arr.push(sub)
          }
        })
      })
      return arr
    },
    handlePositionChange(row, position) {
      if (row.name === 'del') return
      if (position === 'topPosition') {
        row.linePosition = false
      }
      if (position === 'linePosition') {
        row.topPosition = false
      }
    },
    showPostion(row) {
      let disableBtn = [
        'add',
        'import',
        'switch',
        'sun',
        'export',
        'print',
        'approval',
        'taskDetail',
        'taskImage',
        'history',
        'revoke',
        'phyDelete',
        'logicDelete',
        'taskToRead',
        'batchSave'
      ]
      if (disableBtn.indexOf(row.name) != -1) {
        return false
      }
      return true
    },
    showPostionline(row) {
      let disableBtn = [
        'add',
        'import',
        'switch',
        'sun',
        'export',
        'print',
        'batchSave'
      ]
      if (disableBtn.indexOf(row.name) != -1) {
        return false
      }
      return true
    },
    setRowValueByName(obj, attrName) {
      if (obj[attrName] == 1) {
        obj[attrName] = 0
      } else {
        obj[attrName] = 1
      }
    },
    scriptOk() {
      this.scriptVisible = false
      let formulasDiyJs = ''
      if (this.formulasDiyJs) {
        formulasDiyJs = Base64.encode(this.formulasDiyJs)
      }
      if (this.scriptType == 'before') {
        this.manageFields[this.index].beforeScriptValue = formulasDiyJs
      } else if (this.scriptType == 'after') {
        this.manageFields[this.index].afterScriptValue = formulasDiyJs
      }
      this.$message.success('脚本编写完成后请记得保存')
    },
    setBeforeScript(row, index) {
      this.index = index
      this.scriptVisible = true
      this.scriptType = 'before'
      this.formulasDiyJs = ''
      if (row.beforeScriptValue) {
        this.formulasDiyJs = Base64.decode(row.beforeScriptValue)
      }
    },
    setAfterScript(row, index) {
      this.index = index
      this.scriptVisible = true
      this.scriptType = 'after'
      this.formulasDiyJs = ''
      if (row.afterScriptValue) {
        this.formulasDiyJs = Base64.decode(row.afterScriptValue)
      }
    },
    isDisabled(row) {
      return (
        [
          'add',
          'edit',
          'detail',
          'del'
          // 'copy',
          // 'approval',
          // 'taskDetail',
          // 'taskImage',
          // 'processRecord',
          // 'revoke',
          // 'phyDelete',
          // 'logicDelete',
          // 'history',
        ].indexOf(row.name) === -1
      )
    },
    isAddOrEditOrDetail(row) {
      return [
        'add',
        'edit',
        'detail',
        'todo',
        'approval',
        'taskDetail'
      ].includes(row.name)
    },
    isDisabledBtn(row) {
      return (
        [
          'add',
          'edit',
          'export',
          'print',
          'url',
          'switch',
          'batchUpdate',
          'del',
          'addFlow',
          'addData',
          'searchData',
          'batchSave'
        ].indexOf(row.name) === -1
      )
    },
    disabledSetBtn(row) {
      return [
        'del',
        'record',
        'printDetail',
        'sun',
        'print',
        'startFlow',
        'copy',
        'approval',
        'taskDetail',
        'history',
        'revoke',
        'phyDelete',
        'logicDelete',
        'taskToRead',
        'taskImage'
      ].includes(row.name)
    },
    btnChange(row) {
      this.$set(row, 'mpDisplay', row.mpDisplay === '1' ? '2' : '1')
    },
    diyScriptChange(myValue) {
      var cm = this.$refs.scriptText.codemirror
      var doc = cm.getDoc()
      var cursor = doc.getCursor() //gets the line number in the cursor position
      var line = doc.getLine(cursor.line) //get the line contents
      var pos = {
        line: cursor.line,
        ch: line.length - 1 //set the character position to the end of the line
      }
      doc.replaceRange(' ' + 'row.' + myValue + ' ', pos) //adds a new line
    },
    setButtonJs(row, index) {
      this.dialogRuleData = ''
      this.diyScript = ''
      this.index = index
      this.topPosition = row.topPosition
      this.needValidateSelect = row.needValidateSelect
      if (row.jsValue) {
        this.dialogRuleData = Base64.decode(row.jsValue)
      }
      this.dialogMethodVisible = true
    },
    methodOk() {
      this.dialogMethodVisible = false
      this.manageFields[this.index].jsValue = Base64.encode(this.dialogRuleData)
      this.manageFields[this.index].needValidateSelect = this.topPosition && this.needValidateSelect
    },
    selectJar() {
      this.$refs.importJarSelector && this.$refs.importJarSelector.show()
    },
    downloadTemplate(type) {
      let method = 'downloadMainTempByFormKey'
      let param = this.dataTemplate.formKey
      if (type == 'export') {
        method = 'downloadDefaultExportTempByFormKey'
        param = this.dataTemplate.id
      }
      form
        .getDownloadTemplate(method, param)
        .then(response => {
          console.log(response)
        })
        .catch(error => {
          this.$message.error('无法下载导出模板，请先保存导出配置和表单数据')
        })
    },
    beforeUpload(file) {
      if (
        this.manageFields[this.curSelectIndex].importTemplate &&
        this.manageFields[this.curSelectIndex].importTemplate.length > 0
      ) {
        if (this.manageFields[this.curSelectIndex].importTemplate.length == 1) {
          return new Promise((resolve, reject) => {
            this.$confirm('已有模板, 是否确认覆盖?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            })
              .then(() => {
                resolve()
              })
              .catch(() => {
                reject()
              })
          })
        } else {
          this.$message.waring('最多只能上传一个模板')
          return false
        }
      } else {
        return true
      }
    },
    beforeExportUpload(file) {
      if (!file.name.endsWith('.xlsx')) {
        this.$message.warning('只能上传.xlsx格式文件')
        return false
      }
      if (
        this.manageFields[this.curSelectIndex].exportTemplate &&
        this.manageFields[this.curSelectIndex].exportTemplate.length > 0
      ) {
        if (this.manageFields[this.curSelectIndex].exportTemplate.length == 1) {
          return new Promise((resolve, reject) => {
            this.$confirm('已有模板, 是否确认覆盖?', '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            })
              .then(() => {
                resolve()
              })
              .catch(() => {
                reject()
              })
          })
        } else {
          this.$message.warning('最多只能上传一个模板')
          return false
        }
      } else {
        return true
      }
    },
    handleImportClick() {
      this.curSelectIndex = this.currentIndex
    },
    handleRemove(file, fileList) {
      if (fileList && fileList.length == 1) {
        return
      }
      let this_ = this
      setTimeout(function() {
        this_.manageFields[this_.curSelectIndex].importTemplate = []
      }, 50)
    },
    handleRemoveExport(file, fileList) {
      if (fileList && fileList.length == 1) {
        return
      }
      let this_ = this
      setTimeout(function() {
        this_.manageFields[this_.curSelectIndex].exportTemplate = []
      }, 50)
    },
    exportTempUploadSuccess(response, file, fileList) {
      this.files = []
      for (let i = 0; i < fileList.length; i++) {
        if (fileList[i].response) {
          let value = fileList[i].response
          let arrarFile = {}
          arrarFile.id = value.fileId
          arrarFile.name = value.fileName
          arrarFile.size = value.size
          this.files.push(arrarFile)
        }
      }
      this.manageFields[this.curSelectIndex].exportTemplate = this.files
    },
    success(response, file, fileList) {
      this.files = []
      for (let i = 0; i < fileList.length; i++) {
        if (fileList[i].response) {
          let value = fileList[i].response
          let arrarFile = {}
          arrarFile.id = value.fileId
          arrarFile.name = value.fileName
          arrarFile.size = value.size
          this.files.push(arrarFile)
        }
      }
      this.manageFields[this.curSelectIndex].importTemplate = this.files
    },
    jarSelectorOnConfirm(d) {
      this.$set(this.manageFields[this.curSelectIndex], 'jarId', d.id)
      this.$set(this.manageFields[this.curSelectIndex], 'jarDesc', d.desc)
    },
    copy(index) {
      let obj = JSON.parse(JSON.stringify(this.manageFields[index]))
      //复制的按钮都需要重新生成按钮id
      this.$set(obj, 'buttonId', utils.uuid())
      this.manageFields.push(obj)
    },
    //保存按钮数据
    saveManageField() {
      //处理开关字段
      if (this.manageFields) {
        this.manageFields.map(item => {
          //生成按钮id
          if (!item.buttonId) {
            this.$set(item, 'buttonId', utils.uuid())
          }
          if (item.name === 'url' && item.urlParams) {
            const urlParamList = JSON.parse(
              Base64.decode(item.urlParams) || '[]'
            )
            const newUrlParamList = urlParamList.map(it => {
              return {
                ...it,
                field: it.field.toLowerCase()
              }
            })
            this.$set(
              item,
              'urlParams',
              Base64.encode(JSON.stringify(newUrlParamList))
            )
          }
        })
        this.dataTemplate.manageField = JSON.stringify(this.manageFields)
      } else {
        this.dataTemplate.manageField = null
      }
      this.dataTemplate.tableConfigure = JSON.stringify(this.tableConfigure)
    },
    validateManageField() {
      //开关按钮校验，开关按钮必须绑定一列，开时值和关时值必填
      let this_ = this
      let fields = this_.manageFields
      let fieldsName = {}
      for (let i = 0; i < fields.length; i++) {
        const field = fields[i]
        if (!field.desc) {
          this_.$message.warning(`请填写功能按钮第${i + 1}列名称！`)
          return false
        }
        if (!field.buttonId) {
          this.$set(field, 'buttonId', utils.uuid())
        }
        //当buttonId不存在时，判断功能按钮中，同类型的按钮是否名字有重复
        // if (!field.buttonId) {
        //   if (fieldsName[field.name] && fieldsName[field.name].includes(field.desc)) {
        //     this_.$message.warning(`功能按钮第${i + 1}个【${field.desc}】，在同类型按钮中，名称已经重复`)
        //     return false
        //   } else {
        //     var list = []
        //     list.push(field.desc)
        //     if (fieldsName[field.name]) {
        //       list = [...fieldsName[field.name], ...list]
        //     }
        //     this.$set(fieldsName, field.name, list)
        //   }
        // }

        if (fields[i].name === 'switch') {
          if (!fields[i].bind) {
            this_.$message.warning('请选择开关的绑定字段')
            return
          }
          if (!fields[i].switchOn || !fields[i].switchOff) {
            this_.$message({
              type: 'warning',
              message: '请完善开关的开时值和关时值'
            })
            return false
          }
          if (!fields[i].desc || !fields[i].name) {
            this_.$message({type: 'warning', message: '请完善开关信息'})
            return false
          }
        } else if (fields[i].name === 'import') {
          // if (!fields[i].importType) {
          //   this_.$message.warning('请配置导入按钮的规则！')
          //   return false
          // }
        } else if (field.name == 'export') {
          if (!field.exportSettingFields) {
            //添加默认导出字段
            field.exportSettingFields = Base64.encode(JSON.stringify(this.getDefaultExportSettingFieldsTemp()))
            console.log(field.exportSettingFields)
          }
        }
        if (fields[i].openType == 'dialog') {
          if (!fields[i].dialogWidth || !fields[i].dialogHeight) {
            this_.$message.warning('请填写对话框宽度和高度')
            return false
          }
          if (isNaN(fields[i].dialogWidth) || isNaN(fields[i].dialogHeight)) {
            this_.$message.warning('对话框高度和宽度只能是数字')
            return false
          }
        } else if (fields[i].name === 'addFlow') {
          if (!fields[i].flowFormData) {
            this_.$message.warning('新增流程按钮未配置流程')
            return false
          }
          const flowObj = JSON.parse(Base64.decode(fields[i].flowFormData))
          if (!flowObj.flow || !flowObj.flow.key) {
            this_.$message.warning('新增流程按钮未配置流程')
            return false
          }
        } else if (field.name === 'addData') {
          if (!field.flowFormData) {
            this_.$message.warning('新增数据按钮未配置数据')
            return false
          }
        } else if (field.name === 'js') {
          if (!field.jsValue) {
            this_.$message.warning(
              `功能按钮第${i + 1}个【${field.desc}】，未配置js脚本`
            )
            return false
          }
        } else if (field.name === 'searchData') {
          const error = this_.$message.warning.bind(
            null,
            '查询数据按钮未配置绑定关系'
          )
          if (!field.flowFormData) {
            error()
            return false
          } else {
            const config = JSON.parse(Base64.decode(field.flowFormData))
            if (!config || !config.report || !config.report.id) {
              error()
              return false
            }
          }
        } else if (field.name === 'batchUpdate') {
          if (!field.relationConfig && !field.batchUpdateData) {
            this.$message.warning(`[${field.desc}]未配置更新内容`)
            return false
          }
        }
      }
      return true
    },
    //显示字段排序
    sort(index, type) {
      if ('up' == type) {
        if (index === 0) {
          this.$message({
            message: '已经是列表中第一位',
            type: 'warning'
          })
        } else {
          let temp = this.manageFields[index - 1]
          this.$set(this.manageFields, index - 1, this.manageFields[index])
          this.$set(this.manageFields, index, temp)
        }
      } else {
        if (index === this.manageFields.length - 1) {
          this.$message({
            message: '已经是列表中最后一位',
            type: 'warning'
          })
        } else {
          let i = this.manageFields[index + 1]
          this.$set(this.manageFields, index + 1, this.manageFields[index])
          this.$set(this.manageFields, index, i)
        }
      }
    },
    //删除显示字段
    remove(index) {
      const manageField = this.manageFields[index]
      const btn = this.defaultBtnOptions.filter(
        btn => manageField.name === btn.key
      )[0]
      this.btnoptions.push(btn)
      this.manageFields.splice(index, 1)
      this.defaultBtnOptions.forEach(button => {
        if (button.key === btn.key) {
          button.disabled = false
          return
        }
      })
    },
    //添加管理按钮
    addManageBtns() {
      const keys1 = ['js', 'url', 'switch', 'batchUpdate']
      const keys2 = [
        'add',
        'sun',
        'import',
        'print',
        'switch',
        'export',
      ]
      const keys3 = [
        'js',
        'url',
        'switch',
        'addData',
        'addFlow',
        'searchData',
        'batchUpdate',
        'batchSave'
      ]
      let manageField = {
        desc: 'js按钮',
        name: 'js',
        type: '1',
        openType: 'old',
        QRCodePattern: false,
        disabled: false,
        dialogWidth: this.dialogWidth,
        dialogHeight: this.dialogHeight,
        right: JSON.stringify([{type: 'everyone'}]),
        theme: 'default',
        initSubData: true,
      }

      if (this.btnoptions.length > 0) {
        const btn = this.btnoptions.shift()
        const {key, value} = btn

        if (keys1.includes(key)) {
          this.btnoptions.unshift(btn)
        }
        this.defaultBtnOptions.forEach(button => {
          if (button.key === key && !keys3.includes(key)) {
            button.disabled = true
          }
        })
        manageField.desc = value
        manageField.name = key
        // 位置有（顶部按钮或列按钮），按钮默认位置为列按钮
        if (!keys2.includes(key)) {
          manageField.linePosition = true
        }
        if (!this.noRights) {
          manageField.right = JSON.stringify([{type: 'everyone'}])
        }
        if (btn.key === 'import') {
          manageField.limit = 1000
          // manageField.importType = 'main'
        }
        if (btn.key === 'add' || btn.key === 'edit') {
          manageField.quitAfterSaving = true
        }
        if (btn.key === 'copy') {
          ;(manageField.copyTop = true), (manageField.copyNow = true)
        }
        if (btn.key == 'produceQRCode') {
          manageField.display = []
        }
        this.manageFields.push(manageField)
      } else {
        this.btnoptions.unshift({
          key: 'js',
          value: 'js按钮',
          disabled: false
        })
        this.btnoptions.shift()
        this.manageFields.push(manageField)
        // this.$message({
        //   type: 'warning',
        //   message: '所有按钮都添加好了, 不能继续再添加!'
        // })
      }
    },
    //处理按钮切换
    handleManageChange(row) {
      //切换按钮类型置空映射字段
      if (row.display) {
        row.display = []
        this.refreshTime = new Date().getTime()
      }
      const keys2 = ['add', 'sun', 'import', 'print', 'switch', 'export']
      for (let i = 0; i < this.defaultBtnOptions.length; i++) {
        let btn = this.defaultBtnOptions[i]
        if (btn.key == row.name) {
          if (btn.limit) {
            this.$set(row, 'limit', btn.limit)
          }
          // if(btn.key == 'import'){
          //   this.$set(row, 'importType', btn.importType)
          // }

          row.desc = btn.value
          if (!keys2.includes(row.name)) {
            row.linePosition = true
            if (row.topPosition) {
              delete row.topPosition
            }
          } else {
            row.linePosition = false
            row.topPosition = true
          }
        }
        btn.disabled = false
      }

      const alreadyAddedFields = new Map()
      this.manageFields.forEach(manageField => {
        alreadyAddedFields.set(manageField.name, manageField.name)
        this.defaultBtnOptions.forEach(btn => {
          if (
            manageField.name === btn.key &&
            !(
              btn.key == 'js' ||
              btn.key == 'url' ||
              btn.key == 'switch' ||
              btn.key == 'batchUpdate'||
              btn.key == 'addFlow' ||
              btn.key == 'addData' ||
              btn.key == 'searchData' ||
              btn.key == 'batchSave'
            )
          ) {
            btn.disabled = true
          }
        })
      })
      this.btnoptions = this.defaultBtnOptions.filter(
        btn => !alreadyAddedFields.has(btn.key)
      )

      //如果按钮类型不是新增、编辑、明细、删除时，移动端显示
      if (this.isDisabled(row)) {
        row.mpDisplay = '2'
      }

      if (row.name === 'import') {
        row.importType = 'main'
      }
      row.flowFormData =null
    },
    //打开设置权限
    setFieldRightDialog(row) {
      let conf = {
        right: JSON.parse(row.right),
        permissionList: this.permissionList
      }
      this.currentAuthRow = row
      this.$refs.eipAuthDialog.showDialog(conf)
    },
    //设置权限
    authDialogOnConfirm(data) {
      if (this.currentAuthRow) {
        this.currentAuthRow.right = JSON.stringify(data)
      }
    },
    //显示权限信息
    rightToDesc(right) {
      if (right) {
        try {
          right = JSON.parse(right)
        } catch (error) {}
      }
      let desc = ''
      let _this = this
      right.forEach(r => {
        if (desc) {
          desc += ' 和 '
        }
        var str = _this.permissionMap[r.type]
        if (r.name) {
          str += ':' + r.name
        } else if (r.id) {
          str += ':' + r.id
        }
        desc += str
      })
      return desc
    },
    //标题统一权限设置
    mrightRenderHeader(h, para) {
      //下拉框选项
      let _this = this
      let rights = [
        {key: 'none', value: '无'},
        {key: 'everyone', value: '所有人'}
      ]
      let rightMap = {none: '无', everyone: '所有人'}
      //下拉框内容包裹在一个div里面
      return h('div', {}, [
        h(
          'span',
          {
            //div里面有一个文字提示：下拉框所属内容
            style: {},
            class: 'level-font-class'
          },
          para.column.label
        ),
        h(
          'el-select',
          {
            //el-select实现下拉框
            size: 'mini',
            style: {
              width: '100px',
              marginLeft: '10px',
              fontWeight: 400
            },
            on: {
              input: value => {
                //随着下拉框的不同，文字框里的内容在边
                _this.rightLab = value
                if (
                  value &&
                  _this.manageFields &&
                  _this.manageFields.length > 0
                ) {
                  _this.manageFields.forEach(field => {
                    if (field.right) {
                      try {
                        field.right = JSON.parse(field.right)
                      } catch (error) {}
                    }
                    if (field.right[0].hasOwnProperty('v')) {
                      field.right[0] = {v: value}
                    } else {
                      field.right[0] = {type: value}
                    }
                    field.right = JSON.stringify(field.right)
                  })
                }
              }
            },
            props: {
              value: _this.rightLab //文字框的内容取决于这个value，如果value不存在，会报错
            }
          },
          [
            //下拉框里面填充选项，通过rights遍历map，为每一个选项赋值。
            rights.map(item => {
              return h('el-option', {
                props: {
                  value: item.key,
                  label: item.value
                }
              })
            })
          ]
        )
      ])
    },
    //URL按钮和开关按钮设置事件
    setButtonValue(option, row) {
      this.currentRow = row
      this.dialogVisible = true
      if (option === 'url' || option=='moduleButton') {
        this.dialogTitle = (option == 'url'?'设置Url地址':'设置组件地址')
        this.url = row.url
        this.urlParams = []
        if (row.urlParams) {
          this.urlParams = JSON.parse(Base64.decode(row.urlParams) || '[]')
        }
        //认证接口
        this.tokenEnabled = row.tokenEnabled ? row.tokenEnabled : false
        this.tokenType = row.tokenType ? row.tokenType : 0
        this.tokenKey = row.tokenKey ? row.tokenKey : ''
        this.tokenApi = {}
        if (row.tokenApi) {
          this.tokenApi = JSON.parse(Base64.decode(row.tokenApi) || '{}')
        }
      } else if (option === 'switch') {
        this.dialogTitle = '设置开关值'
        this.switchOn = row.switchOn
        this.switchOff = row.switchOff
        this.switchOnLabel = row.switchOnLabel
        this.switchOffLabel = row.switchOffLabel
        this.switchDefaultTrue = row.switchDefaultTrue || false
      }
      this.dialogModel = row
    },
    //设置URL按钮和开关后确认
    dialogOnconfirm() {
      let isDislogClose = true
      if (this.dialogTitle === '设置开关值') {
        this.dialogModel.switchOn = this.switchOn
        this.dialogModel.switchOff = this.switchOff
        this.dialogModel.isActive = 'off'
        this.dialogModel.switchDefaultTrue = this.switchDefaultTrue
        this.dialogModel.switchOnLabel = this.switchOnLabel
        this.dialogModel.switchOffLabel = this.switchOffLabel
        if (!this.switchOn || !this.switchOff) {
          this.$message({
            type: 'warning',
            message: '开关需要设置开时值和关时值'
          })
        }
      } else if (this.dialogTitle === '设置Url地址') {
        // const regUrl = /http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/
        // if (!regUrl.test(this.url)) {
        //   isDislogClose = false
        //   this.$message.warning('URL地址输入不合法')
        //   return
        // }
        this.urlParams.forEach(param => {
          if (!param.name || !param.field) {
            isDislogClose = false
            this.$message.warning('请输入参数名、取值列！')
          }
          const reg = /^[a-zA-Z][a-zA-Z0-9_]*$/
          if (param.name && !reg.test(param.name)) {
            isDislogClose = false
            this.$message.warning(
              '参数名以字母开头，且只能包含字母、数字和下划线！'
            )
          }
        })
        if (isDislogClose) {
          this.dialogModel.url = this.url
          this.dialogModel.urlParams = Base64.encode(
            JSON.stringify(this.urlParams)
          )
          this.url = ''
          this.urlParams = []
          this.dialogModel.tokenEnabled = this.tokenEnabled
          this.dialogModel.tokenKey = this.tokenKey
          this.dialogModel.tokenType = this.tokenType
          this.dialogModel.tokenApi = Base64.encode(
            JSON.stringify(this.tokenApi)
          )
          this.tokenEnabled = false
          this.tokenKey = ''
          this.tokenType = 0
          this.tokenApi = {}
        }
      } else if (this.dialogTitle === '设置组件地址') {
        this.dialogModel.url = this.url
      }
      if (isDislogClose) {
        this.dialogVisible = false
      }
    },
    initMpDisplay(row) {
      this.$set(row, 'mpDisplay', '2')
    },
    setAuth(row) {
      let param = {
        formKey: this.dataTemplate.formKey,
        dataKey: this.dataTemplate.alias,
        type: row.name === 'add' ? 3 : row.name === 'edit' ? 4 : 5
      }
      this.$refs.flowFormAuth.showDialog(param)
    },
    setAddFlow(row, index) {
      //设置新增流程
      let param = {
        type: 'addFlow',
        dataTemplateName: this.dataTemplate.name || '',
        defId: this.dataTemplate.boDefId,
        formData: row.flowFormData
      }
      this.curSelectIndex = index
      this.$refs.flowFormAdd.showDialog(param)
    },
    setAddData(row, index) {
      //设置新增数据
      let param = {
        type: 'addData',
        dataTemplateName: this.dataTemplate.name || '',
        defId: this.dataTemplate.boDefId,
        formData: row.flowFormData
      }
      this.curSelectIndex = index
      this.$refs.flowFormAdd.showDialog(param)
    },
    setSearchData(row, index) {
      //设置查询数据
      let param = {
        type: 'searchData',
        dataTemplateName: this.dataTemplate.name || '',
        defId: this.dataTemplate.boDefId,
        formData: row.flowFormData
      }
      this.curSelectIndex = index
      this.$refs.flowFormAdd.showDialog(param)
    },
    handleFlowFormAdd(flowFormData) {
      this.$set(
        this.manageFields[this.curSelectIndex],
        'flowFormData',
        Base64.encode(JSON.stringify(flowFormData))
      )
    },
    handleClick(row, index) {
      if (this.isAddOrEditOrDetail(row)) {
        this.setAuth(row)
      } else if (['url','moduleButton', 'switch'].includes(row.name)) {
        this.setButtonValue(row.name, row)
      } else if (row.name === 'js') {
        this.setButtonJs(row, index)
      } else if (row.name === 'batchUpdate') {
        this.setButtonUpdate(row, index)
      } else if (row.name === 'export') {
        this.setExport(row, index)
      } else if (row.name === 'import') {
        this.setImport(row, index)
      } else if (row.name === 'produceQRCode') {
        this.setProduceQRCode(row)
      } else if (row.name === 'addFlow') {
        this.setAddFlow(row, index)
      } else if (row.name === 'addData') {
        this.setAddData(row, index)
      } else if (row.name === 'searchData') {
        this.setSearchData(row, index)
      } else if (row.name == 'sub') {
        this.setSubDialog(row, index)
      } else if (row.name == 'batchSave') {
        //批量新增
        this.setBatchSaveDialog(row, index)
      }
    },
    //批量新增-弹窗确认
    batchSaveOk() {
      const me_ = this
      utils
        .validateForm(this, 'batchSaveForm')
        .then(r => {
          me_.batchSaveVisible = false
          me_.manageFields[me_.index].customDialogjson = Base64.encode(
            JSON.stringify(me_.batchSaveForm)
          )
        })
        .catch(items => {
          this.$message.error(`还有内容未填写。`)
        })
    },
    //批量新增弹窗
    setBatchSaveDialog(row, index) {
      if (row.customDialogjson) {
        this.batchSaveForm = JSON.parse(Base64.decode(row.customDialogjson))
      }else{
        this.batchSaveForm = {
          custDialog: {
            alias: '',
            mappingConf: []
          },
          resultField: []
        }
      }
      this.batchSaveVisible = true
      this.index = index
    },
    //批量新增弹窗-下拉框选择触发
    batchSaveSelectChange(value) {
      this.$refs.htLoadData.getData()
      const _this = this
      _this.batchSaveForm.custDialog.conditions = []
      _this.batchSaveForm.custDialog.custQueryJson = []
      _this.batchSaveForm.custDialog.selectNum = ''
      let obj = this.customDialogs.find(item => item.alias == value)
      if (obj) {
        this.batchSaveForm.custDialog.selectNum = obj.selectNum
        let treeData
        if (obj.style === 2) {
          let combineConfig = JSON.parse(obj.combinationRule)
          let listDialog = this.customDialogs.find(
            item => item.alias == combineConfig.rightDialog
          )
          treeData = JSON.parse(listDialog.resultfield)
          this.batchSaveForm.custDialog.type = 'combiDialog'
        }
        if (obj.listDialog && obj.listDialog.resultfield) {
          treeData = eval('(' + obj.listDialog.resultfield + ')')
          this.batchSaveForm.custDialog.type = 'combiDialog'
        }
        if (obj.resultfield && obj.resultfield !== '[]') {
          treeData = eval('(' + obj.resultfield + ')')
          this.batchSaveForm.custDialog.type = 'custDialog'
        }
        let mappingConfTemp = []
        if (treeData) {
          treeData.forEach(item => {
            //刷新时判断字段映射是否已存在 ，如存在则跳过
            const oneExist = this.batchSaveForm.custDialog.mappingConf.find(
              m => m.from == item.field
            )
            if (oneExist) {
              mappingConfTemp.push(oneExist)
              return
            }
            mappingConfTemp.push({
              from: item.field,
              comment: item.comment,
              target: []
            })
          })
          this.batchSaveForm.resultField = treeData
        } else {
          this.batchSaveForm.resultField = []
        }
        this.batchSaveForm.custDialog.mappingConf = mappingConfTemp
      } else {
        _this.batchSaveForm.custDialog.conditions = []
        _this.batchSaveForm.custDialog.mappingConf = []
        _this.batchSaveForm.custDialog.custQueryJson = []
        _this.batchSaveForm.custDialog.selectNum = ''
        _this.batchSaveForm.resultField = []
      }
    },
    setSubDialog(row, index) {
      this.$refs.showSubDataBtnSetting.showDialog(row, 'options')
    },

    //更新数据-关联弹窗展示
    updateSetting(row, index) {
      if (row.relationConfig) {
        this.batchUpdateSettingForm = JSON.parse(
          Base64.decode(row.relationConfig)
        )
      }else{
        this.batchUpdateSettingForm= {
          globalQueryJson: []
        }
      }
      this.batchUpdateSettingVisible = true
      this.index = index
    },
    //更新数据-关联弹窗-关联类型变更
    /*   async batchUpdateSettingChange(value, idx, type) {
      const _this = this
      let obj = this.customQuerys.find(item => item.alias == value)
      if (obj) {
        _this.batchUpdateSettingForm.globalQueryJson[idx].name = obj.name
        _this.batchUpdateSettingForm.globalQueryJson[idx].alias = obj.alias
        if (obj.conditionfield) {
          _this.batchUpdateSettingForm.globalQueryJson[
            idx
          ].conditionfield = JSON.parse(obj.conditionfield)
        }
        if (obj.resultfield) {
          _this.batchUpdateSettingForm.globalQueryJson[
            idx
          ].resultfield = JSON.parse(obj.resultfield)
        }
      }
    }, */
    async batchUpdateSettingChange(alias, index, type = '') {
      if (!alias || !this.customQuerys || !this.customQuerys.length) {
        return
      }

      if (type === 'refresh') {
        if (this.$refs.queryLoadData) {
          await this.$refs.queryLoadData.getData()
        }
      }
      const _this = this
      const cloneCustomQueryList = _.cloneDeep(_this.customQuerys)
      cloneCustomQueryList.forEach(item => {
        //判断选择的关联查询是否存在
        if (alias == item.alias) {
          if (typeof item.conditionfield == 'string') {
            const conditionField = JSON.parse(item.conditionfield) || [] //parseToJson(item.customQuery.conditionfield);
            const newConditionField = conditionField.map(it => {
              return {
                ...it,
                emptyValue: '无'
              }
            })
            item.conditionfield = newConditionField
            item.resultfield = JSON.parse(item.resultfield) // parseToJson(item.customQuery.resultfield);
            item.conditionfield.forEach(res => {
              _this.$set(res, 'fieldPath', '') //关联查询条件字段绑定的表单参数路径
            })
            item.resultfield.forEach(res => {
              _this.$set(res, 'fieldPath', '') //关联查询返回字段绑定的表单参数路径
            })
          }
          // 刷新最新配置
          if (type === 'refresh') {
            item.conditionfield.forEach((k, i) => {
              let oldItem = this.batchUpdateSettingForm.globalQueryJson[
                index
                ].conditionfield.find(sub => {
                return sub.field === k.field
              })
              if (oldItem) {
                item.conditionfield[i] = oldItem
              }
            })
            item.resultfield.forEach((k, i) => {
              let oldItem = this.batchUpdateSettingForm.globalQueryJson[
                index
                ].resultfield.find(sub => {
                return sub.field === k.field
              })
              if (oldItem) {
                item.resultfield[i] = oldItem
              }
            })
            this.batchUpdateSettingForm.globalQueryJson[index].conditionfield =
              item.conditionfield
            this.batchUpdateSettingForm.globalQueryJson[index].resultfield =
              item.resultfield
            this.batchUpdateSettingForm.globalQueryJson[index].name = item.name
            this.$message.info('更新配置成功！点击保存表单后生效。')
            return
          }
          //把当前对象克隆一份到控件属性配置
          _this.batchUpdateSettingForm.globalQueryJson = _this.batchUpdateSettingForm.globalQueryJson.map(
            (it, idx) => {
              const newObj = idx === index ? item : {}
              return {
                ...it,
                ...newObj
              }
            }
          )
          // 删除多余属性
          _this.slimCustomQuery(
            _this.batchUpdateSettingForm.globalQueryJson[index]
          )
        }
      })
    },
    // 当字段与关联查询绑定后，将关联查询中多余的属性删除
    slimCustomQuery(customQuery) {
      if (customQuery && customQuery.constructor == Object) {
        // 删除多余的属性
        delete customQuery['id']
        delete customQuery['createTime']
        delete customQuery['pkVal']
        delete customQuery['objName']
        delete customQuery['needPage']
        delete customQuery['pageSize']
        delete customQuery['dsalias']
        delete customQuery['dataParam']
        delete customQuery['sortfield']
        delete customQuery['diySql']
        delete customQuery['isTable']
        delete customQuery['sqlBuildType']
        delete customQuery['url']
        delete customQuery['header']
        delete customQuery['requestType']
        delete customQuery['pageKey']
        delete customQuery['pageSizeKey']
        delete customQuery['totalKey']
        delete customQuery['listKey']
      }
    },
    //更新数据-关联弹窗保存
    batchUpdateSettingSaveOk() {
      if (
        this.batchUpdateSettingForm.globalQueryJson &&
        this.batchUpdateSettingForm.globalQueryJson.length === 0
      ) {
        delete this.manageFields[this.index].relationConfig
      } else {
        this.manageFields[this.index].relationConfig = Base64.encode(
          JSON.stringify(this.batchUpdateSettingForm)
        )
      }

      this.batchUpdateSettingVisible = false
    },
    batchUpdateOk() {
      this.$root.$validator.validateAll('batchUpdateForm').then(result => {
        if (result) {
          this.batchUpdateVisible = false
          if (this.batchUpdateData.length === 0) {
            delete this.manageFields[this.index].batchUpdateData
            delete this.manageFields[this.index].filedsObj
          } else {
            this.manageFields[this.index].batchUpdateData = Base64.encode(
              JSON.stringify(this.batchUpdateData)
            )
            this.manageFields[this.index].filedsObj = Base64.encode(
              JSON.stringify(this.filedsObj)
            )
          }
        } else {
          this.loading = false
          this.$message.error('有必填的内容未填写。')
        }
      })
    },

    fillToDisplay(row, event, column) {
      let isIn = this.isInDisplayFields(row.name)
      if (!isIn) {
        let fileds = {name: row.name, desc: row.desc, type: row.type}
        this.exportSettingFields.push(fileds)
      }
    },
    isInDisplayFields(name) {
      let isIn = false
      if (this.exportSettingFields && this.exportSettingFields.length > 0) {
        this.exportSettingFields.forEach(obj => {
          if (obj.name == name) {
            isIn = true
            return
          }
        })
      }
      return isIn
    },
    allFillToDisplay() {
      let selectrows = this.$refs.displaySettingTable.store.states.selection
      if (!selectrows || selectrows.length < 1) {
        this.$message({
          message: '请在左侧列表中选择要显示的字段',
          type: 'warning'
        })
      }
      selectrows.forEach(obj => {
        if (!this.isInDisplayFields(obj.name)) {
          let fileds = {name: obj.name, desc: obj.desc, type: obj.type}
          this.exportSettingFields.push(fileds)
        }
      })
    },
    removeExport(index) {
      this.exportSettingFields.splice(index, 1)
    },
    setExport(row, index) {
      row.limit = row.limit || 10000
      row.exportTemplate = row.exportTemplate || []
      this.currentRow = row
      this.curSelectIndex = index
      this.exportSettingFields = []
      if (row.exportSettingFields) {
        this.exportSettingFields = JSON.parse(
          Base64.decode(row.exportSettingFields)
        )
      } else {
        let exportSettingFieldsTemp = this.getDefaultExportSettingFieldsTemp()
        this.exportSettingFields = exportSettingFieldsTemp
      }

      if (row.exportSubFields) {
        this.exportSubFields = JSON.parse(Base64.decode(row.exportSubFields))
      } else if (this.dataTemplate.subField) {
        this.exportSubFields = []
        let subFields = JSON.parse(this.dataTemplate.subField)
        let me_ = this
        subFields &&
        subFields.forEach(sub => {
          if (sub.dsName == me_.curTemplateBoDef.boEnt.dsName) {
            let tempSubFileds = []
            let subFiledPath = sub.tableName + '.'
            if (!sub.isExternal) {
              subFiledPath += sub.fieldPrefix
            }
            sub.attributeList.forEach(item => {
              tempSubFileds.push({
                name: item.name,
                path: subFiledPath + item.name,
                desc: item.desc,
                type: item.dataType,
                defaultSort: '0',
                isExport: '1',
                sortSeq: 'asc'
              })
            })
            sub.attributeList = tempSubFileds
            if (sub.childEnts) {
              sub.childEnts.forEach(sun => {
                if (sun.dsName == me_.curTemplateBoDef.boEnt.dsName) {
                  let tempSunFileds = []
                  let sunFiledPath = sun.tableName + '.'
                  if (!sun.isExternal) {
                    sunFiledPath += sun.fieldPrefix
                  }
                  sun.attributeList.forEach(item => {
                    tempSunFileds.push({
                      name: item.name,
                      path: sunFiledPath + item.name,
                      desc: item.desc,
                      type: item.dataType,
                      defaultSort: '0',
                      isExport: '1',
                      sortSeq: 'asc'
                    })
                  })
                  sun.attributeList = tempSunFileds
                }
              })
            }
          }
        })
        this.exportSubFields = subFields
      }
      this.index = index
      this.exportUpdateVisible = true
    },
    getDefaultExportSettingFieldsTemp(){
      let exportSettingFieldsTemp = []
      if (this.data.displaySettingFields) {
        let displayField = this.initDisplaySettingFields()
        let mainFiledPath = 't.'
        if (!this.curTemplateBoDef.boEnt.isExternal) {
          mainFiledPath += this.curTemplateBoDef.boEnt.fieldPrefix
        }
        displayField.forEach(item => {
          let findObj = exportSettingFieldsTemp.find(
            row => item.name == row.name
          )
          if (
            findObj == undefined &&
            item.flowField === false &&
            item.name != this.curTemplateBoDef.boEnt.fk &&
            item.name != this.curTemplateBoDef.boEnt.pkKey
          ) {
            let displayId = item.oldTableField
              ? (`${item.tableName}${item.oldTableField}`).toLowerCase().replaceAll('_', '')
              : item.name
            exportSettingFieldsTemp.push({
              name: item.name,
              oldTableField: item.oldTableField,
              tableName: item.tableName,
              path: mainFiledPath + item.name,
              desc: item.desc,
              type: item.type,
              defaultSort: '0',
              isExport: '1',
              sortSeq: 'asc',
              displayId: displayId
            })
          }
        })
      }
      return exportSettingFieldsTemp
    },
    importOk() {
      const this_ = this
      this_.$refs['importSetting'].validate(result => {
        if (result) {
          let importList = []
          let importMain = {}
          //构造主表
          if (!this.curTemplateBoDef || !this.curTemplateBoDef.boEnt) {
            this.$message.error('获取主表字段信息失败，请刷新重试！')
            this.importUpdateVisible = false
            return
          } else {
            importMain = {
              id: this.curTemplateBoDef.boEnt.id,
              name: this.curTemplateBoDef.boEnt.name,
              desc: this.curTemplateBoDef.boEnt.desc,
              type: 'main',
              parentDesc: '0'
            }
          }
          if (this.currentRow.importType == 'sun') {
            importList.push(importMain)
            this.currentRow.importBoList = importList.concat(
              this.currentRow.importSub,
              this.currentRow.importSun
            )
          } else if (this.currentRow.importType == 'sub') {
            importList.push(importMain)
            this.currentRow.importBoList = importList.concat(
              this.currentRow.importSub
            )
            this.$delete(this.currentRow, 'importSun')
          } else if (this.currentRow.importType == 'main') {
            importList.push(importMain)
            this.currentRow.importBoList = importList
            this.$delete(this.currentRow, 'importSub')
            this.$delete(this.currentRow, 'importSun')
          } else {
            this.$message.error('发生错误，请刷新重试！')
            this.importUpdateVisible = false
            return
          }
          this.importUpdateVisible = false
        } else {
          this_.$message.error('请将表单必填项补充完整后再提交！')
        }
      })
    },
    cancelImport() {
      //  this.$refs["importSetting"].validate((result) => {
      //   if (!result) {
      //如果点击取消了，并且表单验证不通过，要还原之前的导入设置
      let desc = this.currentRow.desc
      let resetIndex = this.currentIndex
      let oldManageField = JSON.parse(this.dataTemplate.manageField)
      for (let index = 0; index < oldManageField.length; index++) {
        const element = oldManageField[index]
        if (element.desc == desc) {
          //有可能在操作的过程中上移、下移了按钮，导致下标和初始不一样，所以要根据当前下标来替换
          this.$set(this.manageFields, resetIndex, element)
          break
        }
      }
      // }
      this.importUpdateVisible = false
      //  });
    },
    deleteTag(item) {
      let desc = item.desc
      if (this.importSunFields.length > 0) {
        let oldSunFields = _.cloneDeep(this.importSunFields)
        this.importSunFields = oldSunFields.filter(e => {
          return e.parentDesc != desc
        })
      }
      if (this.currentRow.importSub) {
        let oldImportSun = _.cloneDeep(this.currentRow.importSun)
        this.currentRow.importSun = oldImportSun.filter(e => {
          return e.parentDesc != desc
        })
      }
      this.$forceUpdate()
    },
    isSubExist(sub) {
      let subList = this.currentRow.importSub
      if (subList && subList.length > 0) {
        for (let index = 0; index < subList.length; index++) {
          const element = subList[index]
          if (element.id == sub.id) {
            return true
          }
        }
      }
    },
    setImport(row, index) {
      this.makeSubFields()
      this.currentRow = row
      this.currentIndex = index
      this.createSun()
      this.$refs['importBtnSettingDialog'].showDialog(row)
    },
    makeSubFields() {
      if (this.dataTemplate.subField && this.curTemplateBoDef.boEnt) {
        this.importSubFields = []
        let parentDesc = this.curTemplateBoDef.boEnt.desc
        let subFields = JSON.parse(this.dataTemplate.subField)
        subFields &&
        subFields.forEach(sub => {
          this.importSubFields.push({
            id: sub.id,
            name: sub.name,
            desc: sub.desc,
            type: 'sub',
            parentDesc: parentDesc
          })
        })
      }
    },
    createSun() {
      let row = this.currentRow
      //孙表数组
      this.importSunFields = []
      //构建孙表数据，根据当前选择的子表来构建
      if (row.importSub && row.importSub.length > 0) {
        row.importSub.forEach(e => {
          this.makeSunFields(e.id)
        })
      }
    },
    makeSunFields(id) {
      if (this.dataTemplate.subField) {
        //子表数组
        let subFields = JSON.parse(this.dataTemplate.subField)
        subFields.forEach(sub => {
          if (sub.id == id) {
            //只取部分字段
            sub.childEnts.forEach(sun => {
              this.importSunFields.push({
                id: sun.id,
                name: sun.name,
                desc: sun.desc,
                type: 'sun',
                parentDesc: sub.desc
              })
            })
          }
        })
      }
    },
    setProduceQRCode(row, index) {
      this.dialogTitle = '设置二维码'
      this.currentRow = row
      this.dialogVisible = true
    },
    exportOk() {
      let sortFiledCount = 0
      if (this.exportSettingFields) {
        this.exportSettingFields.forEach(f => {
          if (f.defaultSort == 1 && f.isExport == 1) {
            sortFiledCount += 1
          }
        })
      }

      if (
        this.manageFields[this.index].exportSub == 1 &&
        this.exportSubFields
      ) {
        this.exportSubFields.forEach(sub => {
          if (sub.defaultSort == 1 && sub.isExport == 1) {
            sortFiledCount += 1
          }
          sub.attributeList.forEach(f => {
            if (f.defaultSort == 1 && f.isExport == 1) {
              sortFiledCount += 1
            }
          })
          sub.childEnts.forEach(sun => {
            sun.attributeList.forEach(f => {
              if (f.defaultSort == 1 && f.isExport == 1) {
                sortFiledCount += 1
              }
            })
          })
        })
      }
      if (sortFiledCount > 3) {
        this.$message({
          message: '为了导出时查询的速度，最多只能配置3个排序字段',
          type: 'warning'
        })
        return
      }
      if (this.exportSettingFields) {
        this.manageFields[this.index].exportSettingFields = Base64.encode(
          JSON.stringify(this.exportSettingFields)
        )
      } else {
        this.manageFields[this.index].exportSettingFields = ''
      }
      if (this.exportSubFields) {
        this.manageFields[this.index].exportSubFields = Base64.encode(
          JSON.stringify(this.exportSubFields)
        )
      } else {
        this.manageFields[this.index].exportSubFields = ''
      }
      this.exportUpdateVisible = false
    },
    setButtonUpdate(row, index) {
      this.$set(this, 'batchUpdateData', this.$options.data().batchUpdateData)
      if (row.batchUpdateData) {
        this.batchUpdateData = JSON.parse(Base64.decode(row.batchUpdateData))
      }
      this.batchUpdateVisible = true
      this.index = index
    },
    resetOutConfig(row, index) {
      if (
        row.outValueType &&
        row.outValueType != 'input' &&
        row.outValueType != 'data' &&
        row.outValueType != 'number'
      ) {
        this.outConfig = {
          type: row.outValueType,
          choiceType: 'static',
          parameter: {},
          selectData: [],
          customQuery: {alias: '', valueBind: '', labelBind: ''},
          dialogConfig: {name: '请选择'}
        }
        row.outConfig = JSON.stringify(this.outConfig)
      }
    },
    setOutValue(row, index) {
      Object.assign(this.$data.outConfig, this.$options.data().outConfig)
      this.outIndex = index
      this.outConfig.type = row.outValueType
      this.outConfig.bind = row.name
      if (row.outConfig) {
        this.outConfig = JSON.parse(row.outConfig)
        if (!this.outConfig.customQuery) {
          this.outConfig.customQuery = {valueBind: '', labelBind: ''}
        }
      }
      this.outValueTypeVisible = true
    },
    batchUpdateSelectChange(type, idx) {
      if (type == 2) {
        //公式脚本
        this.$set(this.batchUpdateData[idx], 'defaultValue', '')
        this.$set(this.batchUpdateData[idx], 'outValueType', '')
      } else if (type == 1) {
        //用户录入
        this.$set(this.batchUpdateData[idx], 'defaultValue', '')
        this.$set(this.batchUpdateData[idx], 'computeConfig', '')
      } else {
        this.$set(this.batchUpdateData[idx], 'outValueType', '')
        this.$set(this.batchUpdateData[idx], 'computeConfig', '')
      }
    },
    //更新弹窗-设置-设置公式脚本
    setOutValue2(row, index) {
      let obj = {}
      this.updateFields.forEach(item => {
        if (item.name == row.name || item.oldTableField == row.name) {
          obj = item
        }
        item.path = this.data.data.alias
      })
      let boDefData = {
        name: this.data.data.alias,
        comment: this.data.data.name,
        desc: this.data.data.name,
        children: this.updateFields
      }
      let field = {
        tableName: this.data.data.alias,
        boDefAlias: this.data.data.boDefAlias,
        desc: obj.desc,
        name: row.name,
        options: {
          formulasDiyJs: row.computeConfig ? row.computeConfig : ''
        }
      }
      this.$refs.formulasDialog.handleOpen(boDefData, field, index)
    },
    //更新弹窗-设置-设置公式脚本-弹窗确认数据
    onComFormulas(value, idx, dataPath) {
      this.batchUpdateData[idx].computeConfig = value
      this.batchUpdateData[idx].dataPath = dataPath
    },
    outValueOk() {
      //按照元件返回属性定义结构，排除不在返回属性范围的
      if (
        this.outConfig.dialogConfig.resultField &&
        this.outConfig.dialogConfig.resultField instanceof Array &&
        this.outConfig.dialogConfig.resultField.length > 0
      ) {
        let paramters = {}
        this.outConfig.dialogConfig.resultField.forEach(item => {
          paramters[item.field] = this.outConfig.parameter[item.field]
            ? this.outConfig.parameter[item.field]
            : ''
        })
        this.outConfig.parameter = paramters
      }
      this.batchUpdateData[this.outIndex].outConfig = JSON.stringify(
        this.outConfig
      )
      this.outValueTypeVisible = false
    },
    //数据弹窗添加
    addBatchUpdategData() {
      this.batchUpdateData.push({sort: 0})
    },
    batchUpdateDataChange(row, column, event) {
      this.$nextTick(() => {
        console.log(this.batchUpdateData)
        this.$refs.batchUpdateTable.doLayout()
        this.batchUpdateTableKey++
        console.log(this.batchUpdateTableKey)
      })
    },
    afterCustomQueryLoadData(data) {
      this.customQuerys = data.rows
      this.localCustomQuerys = data.rows.filter(item => {
        return item.dsalias == 'LOCAL'
      })
    },
    afterCustomDialogLoadData(data) {
      this.customDialogs = data
    },
    changeCustDialog(value) {
      const _this = this
      _this.outConfig.dialogConfig.conditions = []
      this.outConfig.dialogConfig.mappingConf = []
      this.outConfig.dialogConfig.custQueryJson = []
      this.outConfig.dialogConfig.selectNum = ''
      let obj = this.customDialogs.find(item => item.alias == value)
      if (obj) {
        this.outConfig.dialogConfig.selectNum = obj.selectNum
        let treeData
        if (obj.style === 2) {
          let combineConfig = JSON.parse(obj.combinationRule)
          let listDialog = this.customDialogs.find(
            item => item.alias == combineConfig.rightDialog
          )
          treeData = JSON.parse(listDialog.resultfield)
          this.outConfig.dialogConfig.type = 'combiDialog'
        }
        if (obj.listDialog && obj.listDialog.resultfield) {
          treeData = eval('(' + obj.listDialog.resultfield + ')')
          this.outConfig.dialogConfig.type = 'combiDialog'
        }
        if (obj.resultfield && obj.resultfield !== '[]') {
          treeData = eval('(' + obj.resultfield + ')')
          this.outConfig.dialogConfig.type = 'custDialog'
        }
        for (let q = 0, f; (f = treeData[q++]); ) {
          f.field = f.comment
        }
        this.outConfig.dialogConfig.resultField = treeData
        let conditionList = eval('(' + obj.conditionfield + ')')
        let conditions = []
        //只处理类型等于1的对话框参数（defaultType：1：用户输入，2：固定值 ，3：参数传入）
        if (conditionList && conditionList.length > 0) {
          for (let j = 0, c; (c = conditionList[j++]); ) {
            if (c.defaultType == '3') {
              let has = false
              if (!has) conditions.push(c)
            }
          }
        }
        this.outConfig.dialogConfig.conditions = conditions
      }
      this.outConfig.dialogConfig.resultField.forEach(item=>{
        if(item.hasOwnProperty("fillBackType") && item.fillBackType){
          item.fillBackType = item.fillBackType
        }else{
          item.fillBackType = 1
          this.$set(item,'fillBackType',1)
        }
      })
    },
    setCurrentCustomQuery() {
      const _this = this
      _this.outConfig.customQuery.labelBind = ''
      _this.outConfig.customQuery.valueBind = ''
      _this.customQuerys.forEach(item => {
        if (_this.outConfig.customQuery.alias == item.alias) {
          if (typeof item.conditionfield == 'string') {
            item.conditionfield = JSON.parse(item.conditionfield) //parseToJson(item.customQuery.conditionfield);
            item.resultfield = JSON.parse(item.resultfield) // parseToJson(item.customQuery.resultfield);
          }
          //把当前对象克隆一份到控件属性配置
          Object.assign(_this.outConfig.customQuery, item)
          _this.slimCustomQuery(_this.outConfig.customQuery)
        }
      })
    },
    slimCustomQuery(customQuery) {
      if (customQuery && customQuery.constructor == Object) {
        // 删除多余的属性
        delete customQuery['id']
        delete customQuery['createTime']
        delete customQuery['pkVal']
        delete customQuery['objName']
        delete customQuery['needPage']
        delete customQuery['pageSize']
        delete customQuery['dsalias']
        delete customQuery['dataParam']
        delete customQuery['sortfield']
        delete customQuery['diySql']
        delete customQuery['isTable']
        delete customQuery['sqlBuildType']
        // delete customQuery["dsType"];
        delete customQuery['url']
        delete customQuery['header']
        delete customQuery['requestType']
        delete customQuery['pageKey']
        delete customQuery['pageSizeKey']
        delete customQuery['totalKey']
        delete customQuery['listKey']
      }
    },
    urlParamsAdd() {
      this.urlParams.push({name: '', field: ''})
    },
    urlParamsRemove(item) {
      this.urlParams.remove(item)
    },
    /**
     * 国际化配置
     */
    editI18nMessage(rowData) {
      //如果存在重复按钮则处理重复key
      if (!rowData.btnKey) {
        rowData.btnKey = this.genBtnKey()
      }

      //定义i18n的key用于国际化
      this.i18nMessageKey = `formTemplate.${this.dataTemplate.alias}.button.${rowData.name}${rowData.btnKey}`
      this.$refs.i18nMessageEdit.handleOpen()
    },
    afterSaveI18n(data) {
      //保存后做一些数据处理
      data.key = data.key.replace('$', '#')
      this.dataTemplate.desc = data.key
      this.dataTemplate.desc_zh = data.desc
    },
    /**
     * 生成btnKey
     */
    genBtnKey() {
      return Date.now() + '_' + Math.ceil(Math.random() * 99999)
    },
    refreshCustDialog() {
      this.$refs.htLoadData.getData()
    }
  }
}
</script>
<style lang="scss" scoped>
::v-deep {
  .el-table {
    th.gutter {
      display: none !important;
    }
    th .cell {
      line-height: 16px !important;
    }
  }
}

.config-wrap {
  display: flex;
  .empty-box {
    padding-left: 16px;
  }
}

.batchUpdate {
  ::v-deep {
    .el-table__cell {
      //vertical-align: top;
    }
    .el-checkbox {
      height: 54px;
      //line-height: 45px;
      line-height: 54px;
    }
    .el-button {
      margin-top: 5px;
    }
    .el-dialog__body {
      padding: 24px;
    }
    .inputs {
      position: relative;

      /*  & > div[class^='el-'] {
        margin: 8px 0 14px 0;
      } */
      .field-tail__wrap {
        text-align: left;
        position: static;
        left: 0px;
        bottom: -3px;
      }
    }
  }
}
// .dt-manage__table >>> .cell {
//   text-align: center;
// }
.el-table >>> .el-radio-group {
  margin-left: 10px;
  margin-right: 10px;
}
.upload-demo >>> .el-upload-list--text {
  display: inline-table;
}
.batchSaveTable {
  margin-top: 10px;
}

// .el-dialog {
//   display: flex;
//   flex-direction: column;
//   margin: 0 !important;
//   position: absolute;
//   top: 50%;
//   left: 50%;
//   transform: translate(-50%, -50%);
//   max-height: calc(100% - 30px);
//   max-width: calc(100% - 30px);
// }
// .el-dialog .el-dialog__body {
//   flex: 1;
//   overflow: auto;
// }
.mobile-btn {
  &:focus {
    border: 1px solid #dcdfe6;
    color: #606266;
  }
}

.is-active__btn {
  border: 1px solid #409eff;
  background: #409eff;
  color: #fff;
  &:focus {
    color: #fff;
  }
}
.btnshow-set {
  display: flex;
}
// .btnshow-set {
//   display: inline;
//   .inputs {
//     margin-top: 10px;
//   }
//   // /deep/.el-radio-group {
//   //   label.el-radio-horizontal {
//   //     margin: 0 10px 0 0;
//   //   }
//   // }
//   &__separate {
//     padding: 4px;
//   }
//   /deep/ .el-input {
//     width: 12%;
//     min-width: 60px;
//   }
//   /deep/ .el-switch {
//     margin: 6px 10px;
//   }
// }
.export-dialog >>> .el-dialog__body {
  max-height: 650px;
  overflow: auto;
}
.manage-setting__header {
  display: flex;
  height: 64px;
  align-items: center;
  background: #f9f9f9;
  margin-bottom: 24px;
  ::v-deep {
    .el-form-item--small.el-form-item {
      margin-bottom: 0;
      .set-width-input {
        margin-right: 24px;
      }
    }
  }
}
/deep/#pane-manageSetting {
  height: 100%;
}
.manage-setting {
  height: 100%;
  // .dt-manage__table {
  //   height: calc(100% - 75px);
  //   /deep/.el-table__body-wrapper {
  //     height: calc(100% - 50px);
  //     overflow-y: auto;
  //   }
  // }
}
.editi18_input {
  display: flex;
  align-items: center;
  justify-content: center;
  .el-button {
    width: 50px;
    padding: 8px 15px;
    border-left: none;
    border-radius: 0 2px 2px 0;
    background-color: #f5f7fa;
    color: #909399;
  }
}
.auth-setting {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3; /*3表示只显示3行*/
  -webkit-box-orient: vertical;
}
.remark {
  background: rgba(255, 174, 68, 0.08);
  color: rgb(255, 174, 68);
  height: 48px;
  line-height: 48px;
  padding-left: 16px;
  font-size: 12px;
  margin-bottom: 24px;
}
.choiceType-table > tbody > tr > th,
.choiceType-table > tbody > tr > td,
.choiceType-table > tfoot > tr > td,
.choiceType-table > thead > tr > th {
  border: none !important;
}
// 先把整体的线去掉
.batch-update-setting {
  margin-bottom: 20px;
  ::v-deep .el-tabs__header {
    border: none !important;
    margin: 0 !important;
    background-color: #fff;
  }
  ::v-deep .el-tabs--border-card {
    border: none !important;
    box-shadow: none;
  }
  ::v-deep .el-tabs__content {
    padding: 20px 0;
  }
  // 再为tabs添加border-bottom
  ::v-deep .el-tabs__nav {
    border-radius: 4px !important;
    border: 4px solid #f6f6f6;
  }
  ::v-deep .el-tabs__item {
    height: 35px;
    line-height: 35px;
  }
  .toggle-button ::v-deep .el-tabs__item {
    background-color: #f6f6f6;
    height: 28px;
    line-height: 28px;
    padding: 0 15px !important;
    font-weight: bold;
  }
  .toggle-button ::v-deep .el-tabs__item.is-active {
    background-color: #fff;
    border-bottom: 1px solid #f6f6f6 !important;
  }
  ::v-deep .common-tools .refresh-btn-icon {
    position: absolute;
    top: 0;
    right: 0;
  }
}
.dialog-footer {
  text-align: right;
}
.select-dialog-line {
  display: flex;
}
.sub-init-btn {
  display: inline-block;
  line-height: 1;
  margin-left: 10px;
  cursor: pointer;
  background: #fff;
  border: 1px solid #dcdfe6;
  border-color: #dcdfe6;
  color: #333;
  text-align: center;
  box-sizing: border-box;
  outline: none;
  font-weight: 500;
  padding: 9px 15px;
  font-size: 14px;
  border-radius: 4px;
  &.active {
    color: $base-color-blue;
    border-color: $base-color-blue;
  }
}
</style>
<style lang="scss">
.el-table__row .inputs .field-tail__wrap {
  .el-form-item__error {
    top: calc(100% - 16px);
    position: static;
  }
}
</style>
