<template>
  <div class="fullheight">
    <ht-table
      @load="loadData"
      @row-click="rowClick"
      :data="data"
      :selection="true"
      :pageResult="pageResult"
      quick-search-props="name,alias"
      ref="columnTable"
      :show-export="false"
      :header-cell-class-name="headerCellClassName"
      @selection-change="handleSelectionChange"
    >
      <template v-slot:toolbar>
        <!-- <el-button-group> -->
        <el-button
          size="small"
          @click="handleCommand({command: 'add'})"
          icon="el-icon-plus"
          type="primary"
          >添加</el-button
        >
        <el-button size="small" icon="el-icon-upload2" @click="importColumn"
          >导入</el-button
        >
        <el-button
          size="small"
          icon="el-icon-download"
          @click="exportColumn"
          :disabled="isDisabled"
          >导出</el-button
        >
        <el-button
          size="small"
          icon="el-icon-lock"
          @click="batchAuth"
          :disabled="isDisabled"
          >授权设置</el-button
        >
        <ht-delete-button
          :url="deleteUrl"
          :htTable="$refs.columnTable"
          style="margin-left: 10px"
          :disabled="isDisabled"
          @click.native="handleTenantOperation"
          >删除
        </ht-delete-button>
        <!-- </el-button-group> -->
      </template>
      <template>
        <ht-table-column type="index" width="50" align="center" label="序号" />
        <ht-table-column prop="id" label="主键" :sortable="true" hidden />
        <ht-table-column
          prop="name"
          label="栏目名称"
          :sortable="true"
          :show-overflow-tooltip="true"
        >
          <template v-slot="{row}">
            <el-link
              @click="handleCommand({row: row, command: 'edit'})"
              type="primary"
              title="点击编辑"
            >
              {{ row.name }}</el-link
            >
          </template>
        </ht-table-column>
        <ht-table-column prop="alias" label="别名" :sortable="true" />
        <ht-table-column prop="dataMode" label="数据加载方式">
          <template v-slot="{row}">
            <el-tag
              v-if="row.dataMode == 1"
              type="info"
              >对话框</el-tag
            >
            <el-tag
              v-if="row.dataMode == 3"
              type="primary"
              >RESTful接口</el-tag
            >
            <el-tag
              v-if="row.dataMode == 4"
              type="success"
              >表单列表</el-tag
            >
            <el-tag
              v-if="row.dataMode == 5"
              type="success"
              >关联查询</el-tag
            >
          </template>
        </ht-table-column>
        <ht-table-column
          prop="dataFrom"
          label="方法路径"
          :show-overflow-tooltip="true"
        >
          <template v-slot="{row}">
            <div v-if="row.dataFrom">
              {{ row.dataFrom }}
            </div>
          </template>
        </ht-table-column>
        <ht-table-column
          prop="isPublic"
          label="栏目使用平台"
          :render-header="renderHeaderMethod"
          :filters="[
            {text: '管理端', value: 0},
            {text: '应用端', value: 2},
            {text: '手机端', value: 1},
          ]"
        >
          <template v-slot="{row}">
            <el-tag v-if="row.isPublic == 0" type="info">管理端</el-tag>
            <el-tag v-if="row.isPublic == 1" type="success">手机端</el-tag>
            <el-tag v-if="row.isPublic == 2" type="warning">应用端</el-tag>
          </template>
        </ht-table-column>
        <ht-table-column prop="isInit" label="数据类型">
          <template v-slot="{row}">
            <el-tag v-if="row.isInit == 0" type="warning">私有数据</el-tag>
            <el-tag v-if="row.isInit == 1" type="success">平台公用数据</el-tag>
          </template>
        </ht-table-column>
        <ht-table-column
          prop="colType"
          label="栏目类型"
          :render-header="renderHeaderMethod"
          :filters="filterColTypeList"
        >
          <template v-slot="{row}">
            <span>{{ columnTypeMap[row.colType] || '-' }}</span>
          </template>
        </ht-table-column>
        <ht-table-column width="200" label="操作" align="left">
          <template v-slot="{row}">
            <el-button
              type="text"
              @click="handleCommand({row: row, command: 'preview'})"
              >预览</el-button
            >
            <el-button
              type="text"
              @click="handleCommand({row: row, command: 'auth'})"
              >授权</el-button
            >
          </template>
        </ht-table-column>
      </template>
    </ht-table>

    <el-dialog
      class="form-editor-dialog"
      destroy-on-close
      :visible="previewShow"
      v-if="previewShow"
      :before-close="() => (previewShow = false)"
    >
      <div
        v-if="currentComponents"
        class="box-card"
        :class="{'column-height': baseColumn.colHeight}"
        :style="{'--columnHeight': `${baseColumn.colHeight}px`}"
      >
        <component
          :is="currentComponents"
          :showData="showData"
          :column-title="baseColumn.name"
          :isHidePagination="isHidePagination"
          :showTitle="baseColumn.showTitle"
          :custom-column-height="baseColumn.colHeight"
          :pageSize="baseColumn.refeshTime"
          :combination-model="designColumn.model"
          :more-url="baseColumn.colUrl"
          :filter-type="designColumn.filterType"
          :filter-scope="designColumn.filterScope"
          :appid="baseColumn.appid"
          :customStyle="baseColumn.style"
          :alias="baseColumn.alias"
          :isShowDelete="false"
          :current-user="currentUser"
        ></component>
      </div>
      <el-empty
        v-else
        :image-size="380"
        :image="noDataImg"
        description="暂无实时预览哦~"
      >
      </el-empty>
    </el-dialog>

    <eip-auth-dialog @onConfirm="columnAuthConfirm" ref="columnAuth" />
    <eip-flow-dialog
      ref="eipFlowDialog"
      name="eipFlowDialog"
      @onConfirm="dialogOnConfirm"
      :single="true"
      append-to-body
    >
    </eip-flow-dialog>
    <eip-data-template-dialog
      :appendToBody="true"
      ref="dataTemplateDialog"
      :single="true"
      @onConfirm="onDataTemplate"
    >
    </eip-data-template-dialog>
    <el-dialog
      title="上传文件"
      :visible="uploadDialogVisible"
      :before-close="beforeClose"
      name="uploadDialog"
      width="40%"
      top="30vh"
      custom-class="upload-dialog"
    >
      <el-upload
        :action="uploadUrl"
        :http-request="handleImport"
        accept=".zip"
        :file-list="fileList"
        :limit="1"
        :auto-upload="false"
        :on-exceed="onExceed"
        ref="elUpload"
        class="upload-dialog__content"
      >
        <el-button size="small" icon="el-icon-upload">点击上传</el-button>
        <div slot="tip" class="el-upload__tip">只能上传zip文件</div>
      </el-upload>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="uploadSubmit">上传</el-button>
        <el-button type="default" @click="beforeClose">取消</el-button>
      </span>
    </el-dialog>
    <el-dialog
      title="温馨提示"
      :visible="myDialogVisible"
      :before-close="beforeClose2"
      name="myDialogVisible"
      width="30%"
      custom-class="upload-dialog"
      top="30vh"
    >
      <span>部分栏目已存在，请确认重复项的导入操作！</span>
      <span slot="footer" class="dialog-footer">
        <el-button type="default" @click="beforeClose2">取消</el-button>
        <el-button type="primary" @click="confirmSubmit('jump')"
          >跳过重复项</el-button
        >
        <el-button type="primary" @click="confirmSubmit('cover')"
          >覆盖更新</el-button
        >
      </span>
    </el-dialog>
    <LayoutPreviewDialog ref="previewDialog" />
    <add-column-dialog
      ref="addColumnDialog"
      @after-save="$refs.columnTable.load()"
    ></add-column-dialog>
  </div>
</template>
<script>
import {Message} from 'element-ui'
import req from '@/request.js'
import {mapState} from 'vuex'
import portal from '@/api/portal.js'
import IndexColumnSetparam from '@/components/portal/IndexColumnSetparam.vue'
import EipChartSelector from '@/components/selector/EipChartSelector.vue'
import EipSysTypeSelector from '@/components/selector/EipSysTypeSelector.vue'
import HtColumn from '@/components/common/HtColumn.vue'
const eipAuthDialog = () => import('@/components/dialog/EipAuthDialog.vue')
import CustomDialogDialog from '@/components/dialog/CustomDialogDialog.vue'
import CustomQuerySelectorDialog from '@/components/dialog/CustomQuerySelectorDialog.vue'
const eipFlowDialog = () => import('@/components/dialog/EipFlowDialog.vue')
const AddColumnDialog = () => import('@/views/portal/AddColumnDialog.vue')
let Base64 = require('js-base64').Base64
const EipDataTemplateDialog = () =>
  import('@/components/dialog/EipDataTemplateDialog.vue')
const LayoutPreviewDialog = () =>
  import('@/views/portal/LayoutPreviewDialog.vue')
import {codemirror} from 'vue-codemirror'
import 'codemirror/theme/ambiance.css'
require('codemirror/mode/javascript/javascript')
import tableHeaderFilter from '@/mixins/tableHeaderFilter.js'
import columnMixins from '@/views/portal/components/columnMixins.js'
import {COLUMN_TYPE_LIST} from './const.js'

export default {
  components: {
    IndexColumnSetparam,
    EipChartSelector,
    EipSysTypeSelector,
    HtColumn,
    codemirror,
    eipAuthDialog,
    CustomDialogDialog,
    eipFlowDialog,
    EipDataTemplateDialog,
    CustomQuerySelectorDialog,
    LayoutPreviewDialog,
    AddColumnDialog,
  },
  mixins: [tableHeaderFilter, columnMixins],
  data() {
    return {
      columnOptions: [],
      uploadAddress: '',
      dialogVisible: false,
      previewShow: false,
      myDialogVisible: false,
      column: {},
      data: [],
      pageResult: {
        page: 1,
        pageSize: 50,
        total: 0,
      },
      loadDataUrl: '',
      previewAlias: '',
      currentComponents: '',
      designColumn: {},
      showData: null,
      baseColumn: {},
      noDataImg: require('@/assets/nodata_images/no-data.png'),
      curAuthColumnId: '',
      uploadDialogVisible: false,
      fileList: [],
      uploadUrl: `${window.context.portal}/portal/sysIndexColumn/sysIndexColumn/v1/uplaodColumn`,
      authType: '',
      isDisabled: true,
      selectedList: [],
    }
  },
  watch: {
    selectedList: {
      handler(val) {
        this.isDisabled = val.length < 1 ? true : false
        const filterArr = val.filter((x) => x.isInit == 1)
        if (filterArr && filterArr.length > 0 && this.columnTenantId != -1) {
          this.isDisabled = true
        }
      },
      deep: true,
    },
  },
  mounted() {
    this.$validator = this.$root.$validator
    this.getColumnList()
  },
  computed: {
    ...mapState({
      currentUser: (state) => state.login.currentUser,
    }),
    isHidePagination() {
      return this.baseColumn.needPage == '1' ? false : true
    },
    deleteUrl: function () {
      return (
        window.context.portal +
        '/portal/sysIndexColumn/sysIndexColumn/v1/remove'
      )
    },
    saveUrl: function () {
      return (
        window.context.portal + '/portal/sysIndexColumn/sysIndexColumn/v1/save'
      )
    },
    filterColTypeList() {
      return COLUMN_TYPE_LIST.map((item) => {
        return {
          text: item.name,
          value: item.componentsName,
        }
      })
    },
    columnTypeMap() {
      return COLUMN_TYPE_LIST.reduce((pre, cur) => {
        pre[cur.componentsName] = cur.name
        return pre
      }, {})
    },
  },
  methods: {
    handleSelectionChange(selection) {
      this.selectedList = selection
    },
    confirmSubmit(arg) {
      const this_ = this
      let url =
        window.context.portal +
        '/portal/sysIndexColumn/sysIndexColumn/v1/importData?unZipFilePath=' +
        this.uploadAddress +
        '&status=' +
        arg
      req.post(url).then(function (rep) {
        rep = rep.data
        if (rep && rep.state) {
          Message.success(rep.message)
          this_.$refs.columnTable.load()
        } else {
          Message.error(rep.message || '保存失败')
        }
        this_.myDialogVisible = false
        this_.beforeClose()
      })
    },
    rowClick(row, column, event) {
      this.$refs.columnTable.$refs.htTable.toggleRowSelection(row)
    },
    preview(alias) {
      this.previewAlias = alias
      this.previewShow = true
    },
    showDialog(row) {
      this.dialogVisible = true
      if (row != undefined && row.id != '') {
        this.tempSaveObj = row
        this.loadDataUrl = `/portal/sysIndexColumn/sysIndexColumn/v1/getJson?id=${row.id}`
      } else {
        this.tempSaveObj = {
          ...this.column,
          showTitle: Number(this.column.showTitle),
        }
      }
    },
    loadData(param, cb) {
      portal
        .getIndexColumnPage(param)
        .then((response) => {
          this.data = response.rows
          this.pageResult = {
            page: response.page,
            pageSize: response.pageSize,
            total: response.total,
          }
        })
        .finally(() => cb && cb())
    },
    getColumnList() {
      const params = {
        pageBean: {
          page: 1,
          pageSize: 10e6,
          total: 0,
        },
      }
      portal.getIndexColumnPage(params).then((res) => {
        if (res.rows && res.rows.length > 0) {
          this.columnOptions = res.rows
        }
      })
    },
    beforeClose2() {
      this.myDialogVisible = false
    },
    handleCommand(params) {
      switch (params.command) {
        case 'edit':
          // this.$router.push(`/portal/addColumn?type=edit&id=${params.row.id}`)
          this.$refs.addColumnDialog.open('edit', params.row.id)
          break
        case 'add':
          // this.$router.push('/portal/addColumn?type=add')
          this.$refs.addColumnDialog.open('add')
          break
        case 'preview':
          portal.getColumnById(params.row.id).then(({data}) => {
          if (data.isPublic == 2) {
            window.open(
              window.context.front +
                '/column/preview/' +
                data.alias +
                '?token=' +
                this.currentUser.token,
              // Base64.encode(this.currentUser.account),
              '_blank'
            )
          } else if (data.isPublic == 1) {
            let href = `${window.context.mobile}/previewColumn?alias=${data.alias}&token=${this.currentUser.token}`
            // window.open(
            //   `${window.context.mobile}/previewColumn?alias=${params.row.alias}&token=${this.currentUser.token}`,
            //   '_blank'
            // )
            this.previewMobile(data, data.layoutType, href)
          } else {
            this.previewAlias = data.alias
            let componentData = data
            this.baseColumn = {
              ...componentData,
              showTitle: componentData.showTitle == 1 ? true : false,
            }
            this.designColumn = JSON.parse(componentData.dataParam)
            this.currentComponents = componentData.colType
            if (
              ['processCenter', 'combination', 'processPublicity'].includes(
                this.designColumn.colType
              )
            ) {
              this.showData = this.designColumn.selectType
            }
            if (this.designColumn.colType === 'statisticalChart') {
              let data = []
              data.push({
                dataType: this.designColumn.dataType,
                currentDataType: this.designColumn.currentDataType,
              })
              this.showData = data
            }
            if (
              this.designColumn.colType === 'news' ||
              this.designColumn.colType === 'swipeSlide'
            ) {
              this.showData = this.designColumn.announcementOrPictures
            }
            if (this.designColumn.colType === 'custom') {
              this.designColumn.templateHtml2 = Base64.decode(
                componentData.templateHtml
              )
              this.designColumn.templateJavaScript2 = Base64.decode(
                componentData.templateJavaScript
              )
              this.designColumn.templateStyle2 = Base64.decode(
                componentData.templateStyle
              )
              this.showData = componentData
            }
            if (this.designColumn.colType === 'dataSheets') {
              this.showData = this.designColumn.currentSelectedInfo
            }
            this.previewShow = true
          }
          })
          break
        case 'auth':
          this.columnAuth(params.row)
          break
      }
    },
    columnAuth(row) {
      this.authType = 'single'
      let this_ = this
      this.curAuthColumnId = row.id
      this.$http
        .get(
          '${portal}/sys/authUser/v1/getRightsAndDefaultRightType?id=' +
            row.id +
            '&objType=indexColumn'
        )
        .then(function (resp) {
          if (resp.data) {
            let conf = {
              right: resp.data.right,
              permissionList: resp.data.type,
              autoClose: false,
            }
            this_.$refs.columnAuth.showDialog(conf)
          }
        })
    },
    columnAuthConfirm(data) {
      if (this.authType === 'single') {
        this.authSingle(data)
      } else if (this.authType === 'batch') {
        this.authBatch(data)
      }
    },
    authSingle(data) {
      let param = {
        id: this.curAuthColumnId,
        objType: 'indexColumn',
        ownerNameJson: JSON.stringify(data),
      }
      let this_ = this
      this.$http
        .post('${portal}/sys/authUser/v1/saveRights', param)
        .then(function (resp) {
          if (resp.data) {
            if (resp.data.state) {
              this_.$message.success('授权成功')
              this_.$refs.columnAuth.closeDialog()
            } else {
              this_.$message.error(resp.data.message)
            }
          }
        })
    },
    //批量授权
    authBatch(data) {
      let param = {
        ids: this.$refs.columnTable.$refs.htTable.selection.map(
          (item) => item.id
        ),
        objType: 'indexColumn',
        ownerNameJson: JSON.stringify(data),
      }
      let _this = this
      this.$http
        .post('${portal}/sys/authUser/v1/batchSaveRights', param)
        .then((resp) => {
          _this.showResponse(resp)
        })
    },
    showResponse(resp) {
      if (resp.data) {
        if (resp.data.state) {
          this.$message.success('授权成功')
          this.$refs.columnAuth.closeDialog()
        } else {
          this.$message.error(resp.data.message)
        }
      }
    },
    batchAuth() {
      let {selection} = this.$refs.columnTable.$refs.htTable
      if (!selection || selection.length == 0) {
        this.$message.warning('请选择要授权的栏目')
        return
      }
      this.authType = 'batch'
      let this_ = this
      let id = selection[0].id
      this.$http
        .get(
          '${portal}/sys/authUser/v1/getRightsAndDefaultRightType?id=' +
            id +
            '&objType=indexColumn'
        )
        .then(function (resp) {
          if (resp.data) {
            let conf = {
              right: resp.data.right,
              permissionList: resp.data.type,
              autoClose: false,
            }
            this_.$refs.columnAuth.showDialog(conf)
          }
        })
    },
    removeStyle() {
      document.getElementsByName('columnAlias')[0].style.border = ''
    },
    showFlowDialog() {
      this.$refs.eipFlowDialog.showDialog()
    },
    dialogOnConfirm(data, name) {
      if (name == 'eipFlowDialog') {
        let defKey = ''
        data.forEach((element) => {
          defKey = element.defKey
          this.$set(this.column, 'flowKey', element.defKey)
          this.$set(this.column, 'flowName', element.name)
        })
        if (!defKey) {
          return
        }
        this.$confirm('是否加载流程展示栏目的默认配置？', '确认信息', {
          distinguishCancelAndClose: true,
          confirmButtonText: '确定',
          cancelButtonText: '取消',
        }).then(() => {
          this.$set(
            this.column,
            'dataFrom',
            '${bpmRunTime}/runtime/instance/v1/query'
          )
          this.$set(this.column, 'dataMode', 3)
          let pam =
            '[{"name":"querys","type":"string","mode":"0","value":"[\\n {\\n \\"group\\": \\"advance\\",\\n \\"operation\\": \\"EQUAL\\",\\n \\"property\\": \\"proc_def_key_\\",\\n \\"relation\\": \\"AND\\",\\n \\"value\\": \\"' +
            defKey +
            '\\"\\n },\\n\\t\\t{\\n \\"group\\": \\"advance\\",\\n \\"operation\\": \\"EQUAL\\",\\n \\"property\\": \\"status_\\",\\n \\"relation\\": \\"AND\\",\\n \\"value\\": \\"end\\"\\n }\\n ]"},{"name":"sorter","type":"string","mode":"0","value":"[\\n {\\n \\"direction\\": \\"DESC\\",\\n \\"property\\": \\"create_time_\\"\\n }\\n ]"},{"name":"pageBean","type":"string","mode":"0","value":"{\\n \\"page\\": 1,\\n \\"pageSize\\": 10,\\n \\"total\\": 0\\n}"}]'
          this.$set(this.column, 'dataParam', pam)
          this.$set(this.column, 'requestType', 'POST')
          this.$set(this.column, 'isPublic', '2')
          this.$set(this.column, 'templateHtml2', '<homeInst :data="data"/>')
          this.$set(this.column, 'needPage', 1)
          //设置更多路径
          this.$set(this.column, 'colUrl', '/completeView/' + defKey)
        })
      }
    },
    onDataTemplate(res) {
      if (res.length == 1) {
        let obj = {
          name: res[0].name,
          alias: res[0].alias,
        }
        this.$set(this.column, 'dataFrom', JSON.stringify(obj))
      }
    },
    exportColumn() {
      let selection = this.$refs.columnTable.$refs.htTable.selection
      if (!selection || selection.length == 0) {
        this.$message.warning('请至少选择一条记录')
        return
      }
      let ids = []
      selection.forEach((column) => {
        ids.push(column.id)
      })
      this.$http.request({
        url: `${window.context.portal}/portal/sysIndexColumn/sysIndexColumn/v1/exportColumn`,
        data: ids,
        method: 'post',
        responseType: 'arraybuffer',
      })
    },
    beforeClose() {
      this.uploadDialogVisible = false
      this.fileList.splice(0)
    },
    uploadSubmit() {
      if (this.$refs.elUpload.uploadFiles.length == 0) {
        this.$message.warning('请上传文件')
        return
      }
      this.$refs.elUpload.submit()
    },
    importColumn() {
      this.uploadDialogVisible = true
    },
    handleImport(param) {
      let formData = new FormData()
      formData.append('file', param.file)
      portal.importColumn(formData).then((resp) => {
        if (resp.state) {
          if (resp.message && resp.message == 'confirmUpload') {
            this.uploadAddress = resp.value
            this.myDialogVisible = true
          } else {
            this.$message.success(resp.message)
            this.fileList.splice(0)
            this.uploadDialogVisible = false
            this.$refs.columnTable.load()
          }
        } else {
          this.beforeClose()
        }
      })
    },
    pullWeixinMaterial() {
      this.$http
        .get(
          `${window.context.portal}/portalWeixinMaterial/v1/pullWeixinMaterial`
        )
        .then((resp) => {
          if (resp.data.state) {
            this.$message.success(resp.data.message)
          } else {
            this.$message.error(resp.data.message)
          }
        })
    },
    onExceed() {
      this.$message.warning('只能选择一个zip文件!')
    },
    handleTenantOperation() {
      const filterArr = this.selectedList.filter((x) => x.isInit == 1)
      if (filterArr && filterArr.length > 0 && this.columnTenantId != -1) {
        this.$message.warning('租户不能操作平台共用数据')
      }
    },
    previewMobile(row, layoutType, href) {
      row['layoutType'] = 1
      this.$refs.previewDialog.showDialog(row, layoutType, href)
    },
  },
}
</script>
<style lang="scss" scoped>
::v-deep {
  .cell > .el-table__column-filter-trigger {
    display: none;
  }
}

div[aria-invalid='true'] >>> .el-input__inner,
div[aria-invalid='true'] >>> .el-input__inner:focus {
  border-color: #f56c6c;
}

.el-select .el-input {
  width: 400px;
}

.code /deep/ .CodeMirror {
  font-family: monospace;
  /*height: 100px !important;*/
  color: black;
  direction: ltr;
  resize: both;
}

.preview_column {
  /deep/.container {
    padding-bottom: 5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    .container_icon {
      width: 50px;
      height: 50px;
      border-radius: 50%;
      font-size: 20px;
      color: #fff;
      line-height: 50px;
      text-align: center;
    }

    .icon__blue__bg {
      background: rgba(54, 143, 255, 1);
    }

    .icon__pink__bg {
      background: rgba(255, 120, 110, 1);
    }

    .icon__deep__blue__bg {
      background: rgba(77, 119, 255, 1);
    }

    .icon__yellow__bg {
      background: rgba(255, 155, 89, 1);
    }

    .icon__purple__bg {
      background: rgba(82, 98, 255, 1);
    }

    .icon__green__bg {
      background: rgba(87, 202, 176, 1);
    }

    .container_box {
      text-align: center;

      .container_box_title,
      .container_box_count {
        margin: 6px 0 0 0;
        font-size: 12px;
        font-family: 'Microsoft YaHei';
        font-weight: 500;
        color: rgb(19, 18, 18);
      }
    }
  }
}

/deep/.el-dialog__wrapper {
  overflow: unset !important;
}

/deep/.el-dialog__body {
  padding: 10px 20px;
  color: #606266;
  font-size: 14px;
  word-break: break-all;
  height: calc(100% - 140px);
  overflow-y: auto;
}

/deep/.el-dialog {
  height: 80%;
  min-height: 400px;
}

/deep/.el-dialog__body .selector-table {
  height: 100% !important;
}

/deep/.el-dialog .el-dialog__body .select-tree-div {
  height: calc(100% - 60px);
  min-height: unset;
}

@media (max-height: 960px) {
  /deep/.el-dialog__body .el-container {
    height: 100% !important;
  }
}

.is-fullscreen__dialog {
  /deep/ .el-dialog {
    width: 100% !important;
    height: 100% !important;
    margin-top: 0vh !important;

    .el-dialog__body {
      padding-top: 20px;
    }

    .code .CodeMirror {
      height: 100%;
    }
  }
}

.fullscreen-icon {
  position: absolute;
  right: 0;
  top: -28px;
}

.top-link-icon {
  font-size: 15px;
  font-weight: bold;

  &:hover {
    color: #ff7717;
  }
}

/deep/ .el-dialog.upload-dialog {
  height: unset;

  /deep/ .el-dialog__body {
    height: unset;
  }

  .upload-dialog__content {
    height: 150px;
  }

  min-height: unset;
}

.column-name__wrap {
  display: flex;

  /deep/ .el-checkbox {
    line-height: 32px;
    margin-left: 20px;
  }
}
.column-height {
  height: var(--columnHeight);
  ::v-deep {
    .column-content {
      height: calc(var(--columnHeight) - 104px);
      overflow: auto;
      //隐藏滚动条
      &::-webkit-scrollbar {
        width: 0;
        background-color: transparent;
      }
      /*火狐下隐藏滚动条*/
      scrollbar-width: none;
    }
  }
}
.form-editor-dialog {
  ::v-deep .el-dialog {
    height: 100%;
    min-height: 400px;
  }
}
</style>
