<template>
  <div id="containt">
    <x-tabs ref="xTabs" v-model="activeName" class="tab-box">
      <el-tab-pane :label="$t1('常规')" name="first">
        <editView
          v-if="showEdit"
          visible-key="showEdit"
          :_dataId.sync="dataId"
          :currentFormType="currentFormType"
          :parent-target="_self"
          @reload="$reloadHandle"
          :otherFlag="otherFlag"
        ></editView>
      </el-tab-pane>
      <el-tab-pane :label="$t1('列表')" name="second">
        <div class="tree-box fl">
          <div class="tit">
            <b>{{ $t1("表单分类") }}</b>
          </div>
          <div class="tree-btns" style="margin-top: 10px"></div>
          <el-tree
            v-if="showTree"
            :props="defaultProps"
            :load="loadNode"
            node-key="id"
            ref="tree"
            highlight-current
            lazy
            :expand-on-click-node="false"
            @node-click="handleNodeClick"
            class="tree-list"
            icon-class="el-icon-arrow-down"
          ></el-tree>
        </div>
        <label id="labBtn">
          <div class="icon">
            <i class="el-icon-more"></i>
            <i class="el-icon-more"></i>
          </div>
        </label>
        <div class="main-right fr" style="padding-left: 6px">
          <div class="grid-height">
            <vxe-grid
              ref="table-m1"
              v-bind="vxeOption"
              @resizable-change="$vxeTableUtil.onColumnWitchChange"
              @custom="$vxeTableUtil.customHandle"
            >
              <template #form>
                <tableForm
                  :formData.sync="formData"
                  @searchEvent="searchEvent"
                  @resetEvent="resetEvent"
                >
                  <template #buttonLeft>
                    <vxe-button
                      status="primary"
                      class="button-sty"
                      icon="el-icon-plus"
                      @click="openEditDialog"
                      v-if="isDev && currentFormType.addAuth === 1"
                      >{{ $t1("新增") }}
                    </vxe-button>
                    <vxe-button
                      status="success"
                      class="button-sty"
                      icon="el-icon-download"
                      @click="jsonImport"
                      >{{ $t1("导入发布") }}
                    </vxe-button>
                    <vxe-button
                      status="success"
                      class="button-sty"
                      icon="el-icon-upload2"
                      @click="jsonExport"
                      v-if="isDev && currentFormType.exportAuth === 1"
                      >{{ $t1("导出发布") }}
                    </vxe-button>
                    <projectTagAddButton
                      :option="addProjectTagOption"
                      v-if="isDev && (currentFormType.editAuth === 1 || otherFlag)"
                    ></projectTagAddButton>
                    <projectTagDeleteButton
                      :option="deleteProjectTagOption"
                      v-if="isDev && (currentFormType.editAuth === 1 || otherFlag)"
                    ></projectTagDeleteButton>
                    <base-table-export
                      v-if="userFlag === 6"
                      :option="{ title: $t1('数据表导出'), targetRef: 'table-m1' }"
                      :parent-target="_self"
                    />
                  </template>
                  <template #buttonRight>
                    <vxe-button
                      icon="el-icon-brush"
                      class="button-sty"
                      @click="resetEvent"
                      type="text"
                      status="primary"
                      plain
                      >{{ $t1("重置") }}
                    </vxe-button>
                    <vxe-button
                      status="warning"
                      icon="el-icon-search"
                      class="button-sty"
                      @click="searchEvent"
                    >
                      {{ $t1("搜索") }}
                    </vxe-button>
                  </template>
                  <template #menuKindName>
                    <vxe-form-item :title="$t1('表单分类') + ':'" field="tag">
                      <template v-slot>
                        <el-input v-model="currentMenuKindName" disabled></el-input>
                      </template>
                    </vxe-form-item>
                  </template>
                  <template #tag>
                    <vxe-form-item :title="$t1('项目标签') + ':'" field="tag">
                      <template v-slot>
                        <el-input
                          class="search-input"
                          max="200"
                          :value="getTabNames()"
                          @clear="checkTags = []"
                          v-el-readonly
                          clearable
                        >
                          <i
                            slot="suffix"
                            class="el-input__icon el-icon-search"
                            @click="openProjectTagDialog3"
                          ></i>
                        </el-input>
                      </template>
                    </vxe-form-item>
                  </template>
                </tableForm>
              </template>
              <template #tag="{ row }">
                <projectTagView
                  v-model="row.szTaMbTagDTOs"
                  :readonly="true"
                ></projectTagView>
              </template>
              <template #operation="{ row }">
                <a href="javascript:void(0);" class="a-link" @click="openEditDialog(row)">
                  <el-tooltip
                    :enterable="false"
                    effect="dark"
                    :content="$t1('查看')"
                    placement="top"
                    popper-class="tooltip-skin"
                  >
                    <i class="el-icon-edit" />
                  </el-tooltip>
                </a>
                <formVersionButton
                  objType="SzTaMb"
                  :objCode="row.taCode"
                  @reverCallback="searchEvent"
                ></formVersionButton>
              </template>
            </vxe-grid>
          </div>
        </div>
      </el-tab-pane>
      <template #editTab="{ tab, index, reloadTabContent }">
        <el-tab-pane
          :key="tab.data.id"
          :label="tab.data.taCh"
          :name="tab.data.id + ''"
          :closable="true"
        >
          <editView
            v-if="tab.showContent"
            :_dataId="tab.dataId"
            :currentFormType="currentFormType"
            :parent-target="_self"
            @reload="reloadTabContent"
            :otherFlag="otherFlag"
          ></editView>
        </el-tab-pane>
      </template>
    </x-tabs>

    <MenuKindDialog
      v-if="showMenuKindDialog"
      :visiable.sync="showMenuKindDialog"
      @confirm="confirmInsertMenuKind"
      :param="{ taType: 0, moveButton: true }"
      :checkRowIds="szTaMbIds"
      :multi="false"
    />
    <projectTagDialog
      v-if="showProjectTagDialog3"
      :visiable.sync="showProjectTagDialog3"
      @confirm="confirmProjectTagDialog3"
      :rows="checkTags"
      :multi="true"
    ></projectTagDialog>
  </div>
</template>

<script>
import mixin from "./mixins/list";

export default {
  name: "table_model:list",
  mixins: [mixin],
};
</script>
