<template>
  <div style="height: calc(100% - 48px); margin: 24px">
    <el-card class="bo-set__card" shadow="never">
      <div slot="header" class="flex" style="justify-content: space-between">
        <div style="display:flex">
          <ht-select
            size="mini"
            clearable
            v-model="selectedNode"
            :options="nodeOptions"
            :props="{key: 'nodeId', value: 'label'}"
          />
          <el-button
            size="mini"
            style="margin-left: 10px"
            icon="el-icon-plus"
            type="primary"
            @click="editNodeSet('')"
            >添加</el-button
          >
        </div>
        <div
          class="flex top-button"
          style="width: 125px; justify-content: space-between"
        >
          <el-button size="mini" type="primary" @click="save(false)"
            >保存</el-button
          >
          <el-button size="mini" type="primary" plain @click="reset"
            >重置</el-button
          >
        </div>
      </div>
      <el-scrollbar class="scrollbar-fullheight">
        <div v-for="(value, key) in nodeSetMap" :key="key">
          <div class="scrollbar-title">{{ getDesc(key) }}</div>
          <table
            class="form-table bo-set__table"
            cellspacing="0"
            cellpadding="0"
            border="0"
          >
            <tbody>
              <tr>
                <td>
                  <el-table class="bo-set__detail" :data="value" border>
                    <el-table-column
                      type="index"
                      width="60"
                      label="序号"
                      align="center"
                    ></el-table-column>
                    <el-table-column
                      prop="description"
                      label="描述"
                      align="center"
                    />
                    <el-table-column label="操作" width="160" align="center">
                      <template v-slot="{row, $index}">
                        <el-button
                          size="mini"
                          type="text"
                          @click="editNodeSet(key, $index, row)"
                          >编辑</el-button
                        >
                        <el-button
                          type="text"
                          size="mini"
                          @click="deleteSetting(value, $index)"
                        >
                          删除</el-button
                        >
                      </template>
                    </el-table-column>
                  </el-table>
                </td>
              </tr>
            </tbody>
          </table>
        </div>
      </el-scrollbar>
    </el-card>

    <el-dialog
      top="8vh"
      width="60%"
      title="Bo任务节点设置"
      :visible.sync="dialogVisibleSetting"
      append-to-body
      class="urgent-text"
      :close-on-click-modal="false"
    >
      <div style="width: 100%; height: 550px">
        <div style="float: left; width: 25%; height: 95%">
          <ht-tree
            style="
              overflow: auto;
              height: 100%;
              border: 1px solid #ebebeb;
              margin-bottom: 5%;
            "
            :data="treeData"
            :props="defaultProps"
            default-expand-all
            @node-click="handleNodeClick"
            :expand-on-click-node="false"
            class="htTypeTree"
            ref="htTypeTree"
          ></ht-tree>
        </div>
        <div
          style="
            width: calc(75% - 35px);
            float: left;
            margin-left: 32px;
            height: 95%;
            margin-bottom: 5%;
          "
        >
          <table class="form-table" cellspacing="0" cellpadding="0" border="0">
            <tbody>
              <tr style="border: 1px solid #ebebeb">
                <th width="110px" class="is-required table_lable">描述:</th>
                <td>
                  <ht-input
                    v-model="dataDialog.description"
                    placeholder="请输入描述"
                    autocomplete="off"
                    :validate="{required: true}"
                  ></ht-input>
                </td>
              </tr>
            </tbody>
          </table>
          <el-tabs
            v-model="tabType"
            type="border-card"
            style="height: calc(100% - 67px)"
          >
            <el-tab-pane label="显示前" name="beforeShow">
              <el-form v-model="dataDialog" data-vv-scope="settingSave">
                <table
                  class="form-table"
                  cellspacing="0"
                  cellpadding="0"
                  border="0"
                >
                  <tbody>
                    <tr>
                      <th
                        width="100px"
                        style="
                          padding: 24px 0 10px 10px;
                          display: flex;
                          justify-content: center;
                        "
                      >
                        脚本内容:
                      </th>
                      <td>
                        <!-- 常用脚本选择对话框  -->
                        <eip-script-dialog
                          ref="beforeShowDialog"
                          v-model="dataDialog.beforeShow"
                          append-to-body
                        />
                        <el-button
                          class="often-button"
                          @click="showDialog('beforeShowDialog')"
                          >常用脚本
                        </el-button>
                        <!-- 可选变量对话框 -->
                        <FlowVarSelector
                          :defId="defId"
                          @node-click="varTreeConfirm($event, 'beforeShow')"
                        />
                        <br />
                        <br />
                        <ht-input
                          type="textarea"
                          :rows="14"
                          class="ht"
                          v-model="dataDialog.beforeShow"
                          placeholder="请输入脚本内容"
                          autocomplete="off"
                        ></ht-input>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </el-form>
            </el-tab-pane>
            <el-tab-pane label="保存时" name="whenSave">
              <el-form v-model="dataDialog" data-vv-scope="settingSave">
                <table
                  class="form-table"
                  cellspacing="0"
                  cellpadding="0"
                  border="0"
                >
                  <tbody>
                    <tr>
                      <th width="100px">脚本内容:</th>
                      <td>
                        <!-- 常用脚本选择对话框  -->
                        <eip-script-dialog
                          ref="whenSaveDialog"
                          v-model="dataDialog.whenSave"
                          append-to-body
                        />
                        <el-button @click="showDialog('whenSaveDialog')"
                          >常用脚本</el-button
                        >
                        <!-- 可选变量对话框 -->
                        <FlowVarSelector
                          :defId="defId"
                          @node-click="varTreeConfirm($event, 'whenSave')"
                        />
                        <br />
                        <br />
                        <ht-input
                          type="textarea"
                          :rows="14"
                          class="ht"
                          v-model="dataDialog.whenSave"
                          placeholder="请输入脚本内容"
                          autocomplete="off"
                        ></ht-input>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </el-form>
            </el-tab-pane>
            <el-tab-pane label="同意时" name="whenAgree">
              <el-form v-model="dataDialog" data-vv-scope="whenAgree">
                <table
                  class="form-table"
                  cellspacing="0"
                  cellpadding="0"
                  border="0"
                >
                  <tbody>
                    <tr>
                      <th width="100px">脚本内容:</th>
                      <td>
                        <!-- 常用脚本选择对话框  -->
                        <eip-script-dialog
                          ref="whenAgree"
                          v-model="dataDialog.whenAgree"
                          append-to-body
                        />
                        <el-button @click="showDialog('whenAgree')"
                          >常用脚本</el-button
                        >
                        <!-- 可选变量对话框 -->
                        <flow-var-selector
                          :defId="defId"
                          @node-click="varTreeConfirm($event, 'whenAgree')"
                        />
                        <br />
                        <br />
                        <ht-input
                          type="textarea"
                          :rows="14"
                          class="ht"
                          v-model="dataDialog.whenAgree"
                          placeholder="请输入脚本内容"
                          autocomplete="off"
                        ></ht-input>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </el-form>
            </el-tab-pane>
            <el-tab-pane label="驳回时" name="whenReject">
              <el-form v-model="dataDialog" data-vv-scope="whenReject">
                <table
                  class="form-table"
                  cellspacing="0"
                  cellpadding="0"
                  border="0"
                >
                  <tbody>
                    <tr>
                      <th width="100px">脚本内容:</th>
                      <td>
                        <!-- 常用脚本选择对话框  -->
                        <eip-script-dialog
                          ref="whenReject"
                          v-model="dataDialog.whenReject"
                          append-to-body
                        />
                        <el-button @click="showDialog('whenReject')"
                          >常用脚本</el-button
                        >
                        <!-- 可选变量对话框 -->
                        <flow-var-selector
                          :defId="defId"
                          @node-click="varTreeConfirm($event, 'whenReject')"
                        />
                        <br />
                        <br />
                        <ht-input
                          type="textarea"
                          :rows="14"
                          class="ht"
                          v-model="dataDialog.whenReject"
                          placeholder="请输入脚本内容"
                          autocomplete="off"
                        ></ht-input>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </el-form>
            </el-tab-pane>
            <el-tab-pane label="反对时" name="whenOppose">
              <el-form v-model="dataDialog" data-vv-scope="whenOppose">
                <table
                  class="form-table"
                  cellspacing="0"
                  cellpadding="0"
                  border="0"
                >
                  <tbody>
                    <tr>
                      <th width="100px">脚本内容:</th>
                      <td>
                        <!-- 常用脚本选择对话框  -->
                        <eip-script-dialog
                          ref="whenOppose"
                          v-model="dataDialog.whenOppose"
                          append-to-body
                        />
                        <el-button @click="showDialog('whenOppose')"
                          >常用脚本</el-button
                        >
                        <!-- 可选变量对话框 -->
                        <flow-var-selector
                          :defId="defId"
                          @node-click="varTreeConfirm($event, 'whenOppose')"
                        />
                        <br />
                        <br />
                        <ht-input
                          type="textarea"
                          :rows="14"
                          class="ht"
                          v-model="dataDialog.whenOppose"
                          placeholder="请输入脚本内容"
                          autocomplete="off"
                        ></ht-input>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </el-form>
            </el-tab-pane>
            <el-tab-pane label="征询时" name="whenConsult">
              <el-form v-model="dataDialog" data-vv-scope="whenConsult">
                <table
                  class="form-table"
                  cellspacing="0"
                  cellpadding="0"
                  border="0"
                >
                  <tbody>
                    <tr>
                      <th width="100px">脚本内容:</th>
                      <td>
                        <!-- 常用脚本选择对话框  -->
                        <eip-script-dialog
                          ref="whenConsult"
                          v-model="dataDialog.whenConsult"
                          append-to-body
                        />
                        <el-button @click="showDialog('whenConsult')"
                          >常用脚本</el-button
                        >
                        <!-- 可选变量对话框 -->
                        <flow-var-selector
                          :defId="defId"
                          @node-click="varTreeConfirm($event, 'whenConsult')"
                        />
                        <br />
                        <br />
                        <ht-input
                          type="textarea"
                          :rows="14"
                          class="ht"
                          v-model="dataDialog.whenConsult"
                          placeholder="请输入脚本内容"
                          autocomplete="off"
                        ></ht-input>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </el-form>
            </el-tab-pane>
            <el-tab-pane label="流转时" name="whenRoam">
              <el-form v-model="dataDialog" data-vv-scope="whenRoam">
                <table
                  class="form-table"
                  cellspacing="0"
                  cellpadding="0"
                  border="0"
                >
                  <tbody>
                    <tr>
                      <th width="100px">脚本内容:</th>
                      <td>
                        <!-- 常用脚本选择对话框  -->
                        <eip-script-dialog
                          ref="whenRoam"
                          v-model="dataDialog.whenRoam"
                          append-to-body
                        />
                        <el-button @click="showDialog('whenRoam')"
                          >常用脚本</el-button
                        >
                        <!-- 可选变量对话框 -->
                        <flow-var-selector
                          :defId="defId"
                          @node-click="varTreeConfirm($event, 'whenRoam')"
                        />
                        <br />
                        <br />
                        <ht-input
                          type="textarea"
                          :rows="14"
                          class="ht"
                          v-model="dataDialog.whenRoam"
                          placeholder="请输入脚本内容"
                          autocomplete="off"
                        ></ht-input>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </el-form>
            </el-tab-pane>
            <el-tab-pane label="加签时" name="whenAddSign">
              <el-form v-model="dataDialog" data-vv-scope="whenAddSign">
                <table
                  class="form-table"
                  cellspacing="0"
                  cellpadding="0"
                  border="0"
                >
                  <tbody>
                    <tr>
                      <th width="100px">脚本内容:</th>
                      <td>
                        <!-- 常用脚本选择对话框  -->
                        <eip-script-dialog
                          ref="whenAddSign"
                          v-model="dataDialog.whenAddSign"
                          append-to-body
                        />
                        <el-button @click="showDialog('whenAddSign')"
                          >常用脚本</el-button
                        >
                        <!-- 可选变量对话框 -->
                        <flow-var-selector
                          :defId="defId"
                          @node-click="varTreeConfirm($event, 'whenAddSign')"
                        />
                        <br />
                        <br />
                        <ht-input
                          type="textarea"
                          :rows="14"
                          class="ht"
                          v-model="dataDialog.whenAddSign"
                          placeholder="请输入脚本内容"
                          autocomplete="off"
                        ></ht-input>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </el-form>
            </el-tab-pane>
          </el-tabs>
          <br />
          <br />
        </div>
      </div>
      <div slot="footer" class="dialog-footer" style="float: right;">
        <el-button size="mini" @click="close">取消</el-button>
        <el-button type="primary" size="mini" @click="saveDataDialog"
          >保存</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {Message} from 'element-ui'
import req from '@/request.js'
const eipScriptDialog = () => import('@/components/dialog/EipScriptDialog.vue')
const FlowVarSelector = () => import('@/components/flow/FlowVarSelector.vue')
const FlowConditionBuildDialog = () =>
  import('@/components/flow/FlowConditionBuildDialog.vue')
export default {
  name: 'FlowEditBoSetting',
  components: {FlowVarSelector, FlowConditionBuildDialog, eipScriptDialog},
  props: {
    defId: {
      type: String,
      required: true,
    },
  },
  data() {
    return {
      tabType: 'beforeShow',
      treeData: [], //树数据
      defaultProps: {
        children: 'children',
        label: 'desc',
      },
      dialogVisibleSetting: false, //是否显示Bo任务节点设置
      selectedNode: '', //选择的节点
      nodeDefList: [], //可选择的节点
      nodeSetMap: {}, //节点设置的数据
      isClearForm: false, //是否清空已配置的表单
      data: {bodef: {boSaveMode: 'database', boDefs: []}},
      dataDialog: {
        beforeShow: '', //显示前
        whenSave: '', //保存时
        whenAgree: '', //同意时
        whenOppose: '', //反对时
        whenConsult: '', //征询时
        whenRoam: '', //流转时
        whenAddSign: '', //加签时
        whenReject: '', //驳回时
        defKey: '',
        description: '',
      }, //Bo任务节点设置对话框返回的值
      isEdit: false, //是否是点击修改按钮进入的Bo任务节点设置对话框,
      curEditIndex: null,
      curEditNodeId: '',
      typeArray: [
        {
          typeKey: 'beforeShow',
          settingKey: 'showFieldsSetting',
        },
        {
          typeKey: 'whenSave',
          settingKey: 'saveFieldsSetting',
        },
        {
          typeKey: 'whenAgree',
          settingKey: 'agreeFieldsSetting',
        },
        {
          typeKey: 'whenReject',
          settingKey: 'rejectFieldsSetting',
        },
        {
          typeKey: 'whenOppose',
          settingKey: 'opposeFieldsSetting',
        },
        {
          typeKey: 'whenAddSign',
          settingKey: 'addSignFieldsSetting',
        },
        {
          typeKey: 'whenRoam',
          settingKey: 'roamFieldsSetting',
        },
        {
          typeKey: 'whenConsult',
          settingKey: 'consultFieldsSetting',
        },
      ],
    }
  },
  computed: {
    nodeOptions() {
      if (!this.nodeDefList) {
        return []
      }
      return this.nodeDefList.map((node) => {
        node.label = `${node.name}(${node.nodeId})`
        return node
      })
    },
  },
  methods: {
    //Bo任务节点设置对话框确认事件
    saveDataDialog() {
      if (!this.dataDialog.description) {
        this.$message.warning('请输入描述')
        return
      }
      //判断是否是修改
      if (!this.isEdit) {
        //不是修改
        let list = this.nodeSetMap[this.selectedNode]
        if (!list) {
          this.nodeSetMap[this.selectedNode] = []
          list = this.nodeSetMap[this.selectedNode]
        }
        list.push(this.dataDialog)
        this.isEdit = false
      } else {
        this.nodeSetMap[this.curEditNodeId].splice(
          this.curEditIndex,
          1,
          this.dataDialog
        )
      }
      this.dialogVisibleSetting = false
    },
    //监督可选变量的返回值(显示前)
    varTreeBeforeShow(data) {
      this.dataDialog.beforeShow = this.dataDialog.beforeShow + data.pathValue
    },
    //监督可选变量的返回值(保存时)
    varTreeWhenSave(data) {
      this.dataDialog.whenSave = this.dataDialog.whenSave + data.pathValue
    },
    varTreeConfirm(data, field) {
      this.dataDialog[field] += data.pathValue
    },
    //显示常用脚本
    showDialog(action) {
      this.$refs[action].showDialog()
    },
    //树鼠标左击事件(treeNode:当前节点对象，node：可以拿到父节点对象)
    handleNodeClick(treeNode, node, nodeCompent) {
      let def
      let pDef //父定义
      if (!treeNode.nodeType || treeNode.nodeType == 'main') {
        return
      }
      if (treeNode.nodeType == 'field') {
        def = node.parent
      } else {
        def = node
      }
      if (def.data.nodeType == 'sub') {
        pDef = def.parent
      }
      if (!this.dataDialog.description) {
        this.dataDialog.description = treeNode.desc
      }
      let txt = ''
      if (treeNode.nodeType == 'field') {
        //字段
        if (!pDef) {
          //主表字段
          pDef = def
          txt =
            pDef.data.boDefAlias +
            '.get("data").put("' +
            treeNode.name +
            '","");'
        } else {
          //子表字段
          if (this.tabType == 'beforeShow') {
            if (pDef.data.nodeType == 'sub') {
              //孙表
              const rootDef = pDef.parent
              txt += '//设置新增孙表的默认值\n\r'
              txt +=
                rootDef.data.boDefAlias +
                '.get("initDataMap").get("' +
                pDef.data.name +
                '").get("initData").get("' +
                def.data.name +
                '").put("' +
                treeNode.name +
                '","");'
            } else {
              txt += '//设置新增子表的默认值\n\r'
              txt +=
                pDef.data.boDefAlias +
                '.get("initDataMap").get("' +
                def.data.name +
                '").put("' +
                treeNode.name +
                '","");'
            }
          } else {
            if (pDef.data.nodeType == 'sub') {
              //孙表
              const rootDef = pDef.parent
              txt +=
                '//设置已有子表某个字段的值,参数为(子表名，孙表名，孙表字段名，字段值，子表下标，孙表下标)或(子表名，孙表名，孙表字段名，字段值，子表下标)或(子表名，孙表名，孙表字段名，字段值)无下标每条数据都会修改\n\r'
              txt +=
                rootDef.data.boDefAlias +
                '.setSunFiledVal("' +
                pDef.data.name +
                '","' +
                def.data.name +
                '","' +
                treeNode.name +
                '","",0,0);'
            } else {
              txt +=
                '//设置已有子表某个字段的值,参数为(子表名，字段名，字段值，下标)或者(子表名，字段名，字段值)，无下标每条数据都会修改\n\r'
              txt +=
                pDef.data.boDefAlias +
                '.setSubFiledVal("' +
                def.data.name +
                '","' +
                treeNode.name +
                '","",0);'
            }
          }
        }
      } else {
        //子表
        txt =
          'ArrayNode list = ' +
          pDef.data.boDefAlias +
          '.getSubTableData("' +
          def.data.name +
          '");'
      }
      // if (this.tabType == 'beforeShow') {
      //   //如果是显示前
      //   this.dataDialog.beforeShow = this.dataDialog.beforeShow + txt
      // } else if (this.tabType == 'whenSave') {
      //   //如果是保存时
      //   this.dataDialog.whenSave = this.dataDialog.whenSave + txt
      // }
      let array = this.typeArray.filter((item) => item.typeKey === this.tabType)
      if (array.length > 0) {
        this.dataDialog[array[0].typeKey] =
          this.dataDialog[array[0].typeKey] + txt
      }
      this.dataDialog.defKey = pDef.data.boDefAlias
    },
    //根据任务节点ID获取任务节点名称
    getDesc(nodeId) {
      for (let i = 0; i < this.nodeDefList.length; i++) {
        let tmp = this.nodeDefList[i]
        if (tmp.nodeId == nodeId) {
          return tmp.name + '(' + nodeId + ')'
        }
      }
      return nodeId
    },
    //添加
    editNodeSet(editNodeId, index, nodeSet) {
      let passConf = {}
      passConf.node = this.selectedNode
      passConf.ids = ''
      this.data.bodef.boDefs.forEach((item) => {
        if (passConf.ids != '') {
          passConf.ids += ','
        }
        passConf.ids += item.id
      })
      //判断是否从编辑进来的
      if (nodeSet) {
        passConf.data = nodeSet
        for (let i = 0; i < this.nodeDefList.length; i++) {
          let tmp = this.nodeDefList[i]
          if (tmp.nodeId == nodeId) {
            passConf.node = tmp
            break
          }
        }
        this.dataDialog = JSON.parse(JSON.stringify(nodeSet)) //给显示前和保存时的脚本内容赋值
        this.curEditIndex = index
        this.curEditNodeId = editNodeId
        this.isEdit = true
      } else if (!nodeSet) {
        this.isEdit = false
        this.dataDialog = {
          beforeShow: '',
          whenSave: '',
          whenAgree: '',
          whenConsult: '',
          whenOppose: '',
          whenRoam: '',
          whenAddSign: '',
          whenReject: '',
          defKey: '',
          description: '',
        } //初始化显示前和保存时的脚本内容
      }
      if (!passConf.ids) {
        Message.warning('请在流程配置中先绑定表单')
        return
      }
      let nodeId = passConf.node.nodeId
      const this_ = this
      //显示BO数据树
      req
        .post('${form}/bo/def/v1/getBOTree', passConf.ids)
        .then(function (res) {
          this_.treeData = []
          this_.treeData.push(res.data)
          this_.tabType = 'beforeShow'
          this_.dialogVisibleSetting = true
        })
    },
    //保存
    save(isRest) {
      let data = this.data
      //判断是否绑定表单
      if (data.bodef.boDefs.length == 0) {
        Message.warning('请在流程配置中先绑定表单')
        return
      }
      // 拼装提交的数据
      data.bodef.boDefs.forEach((item) => {
        item.key = item.alias
      })
      data.formInitItems = []
      if (this.nodeSetMap.length != 0) {
        for (let key in this.nodeSetMap) {
          let temp = {}
          temp.nodeId = key
          temp.parentDefKey = ''
          this.typeArray.forEach((item) => {
            temp[item.settingKey] = []
          })
          this.nodeSetMap[key].forEach((item) => {
            // 都为空就不保存
            if (
              !item.beforeShow &&
              !item.whenSave &&
              !item.whenAgree &&
              !item.whenOppose &&
              !item.whenAddSign &&
              !item.whenRoam &&
              !item.whenConsult &&
              !item.whenReject
            ) {
              return
            }

            this.typeArray.forEach((data) => {
              let tmp = {}
              tmp.boDefCode = item.defKey
              tmp.description = item.description
              tmp.setting = item[data.typeKey] || ''
              temp[data.settingKey].push(tmp)
            })
          })
          data.formInitItems.push(temp)
        }
      }
      let param = {}
      param.json = JSON.stringify(data)
      param.topDefKey = ''
      param.flowId = this.defId
      param.isClearForm = this.isClearForm

      req.post('${bpmModel}/flow/def/v1/saveSetBos', param).then(function (r) {
        r = r.data
        let opName = '保存'
        if (isRest) {
          opName = '重置'
        }
        if (r.state) {
          Message.success(opName + '成功')
        } else {
          Message.error(opName + '失败')
        }
      })
    },
    //重置
    reset() {
      this.$confirm('此操作将清除所有数据, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          this.nodeSetMap = {}
          this.save(true)
        })
        .catch(() => {})
    },
    //关闭侧边栏
    close() {
      this.dialogVisibleSetting = false
      this.isEdit = false
    },
    //删除
    deleteSetting(list, index) {
      list.splice(index, 1)
    },
  },
  mounted() {
    this.$loading()
    this.$validator = this.$root.$validator
    const this_ = this
    let url =
      '${bpmModel}/flow/def/v1/nodeBos?defId=' + this.defId + '&topDefKey='
    req.get(url).then(function (data) {
      data = data.data
      this_.nodeDefList = data.nodeDefList
      this_.selectedNode = data.nodeDefList[0].nodeId // 默认选一个
      // 初始化json的数据
      if (data.json.bodef.boSaveMode) {
        this_.data.bodef.boSaveMode = data.json.bodef.boSaveMode
      }
      if (data.json.bodef) {
        for (let x = 0; x < data.json.bodef.boDefs.length; x++) {
          let item = data.json.bodef.boDefs[x]
          let temp = {}
          temp.alias = item.key
          temp.name = item.name
          temp.scope = item.scope
          req
            .get('${form}/bo/def/v1/getObject?key=' + item.key)
            .then(function (req) {
              req = req.data
              temp.id = req.id
              this_.data.bodef.boDefs.push(temp)
              //最后一个索引的元素时关系加载框
              if (x == data.json.bodef.boDefs.length - 1) {
                this_.$loading().close()
              }
            })
        }
      }
      if (data.json.formInitItems) {
        data.json.formInitItems.forEach((item) => {
          for (let i = 0; i < item.saveFieldsSetting.length; i++) {
            let temp = {}
            temp.description = item.saveFieldsSetting[i].description
            temp.defKey = item.saveFieldsSetting[i].boDefCode
            this_.typeArray.forEach((typeObj) => {
              if (
                item &&
                item[typeObj.settingKey] &&
                item[typeObj.settingKey].length > 0
              ) {
                temp[typeObj.typeKey] = item[typeObj.settingKey][i].setting
              }
            })
            let list = this_.nodeSetMap[item.nodeId]
            if (!list) {
              this_.nodeSetMap[item.nodeId] = []
              list = this_.nodeSetMap[item.nodeId]
            }
            list.push(temp)
          }
        })
      }
      this_.$loading().close()
    })
  },
}
</script>
<style lang="scss" scoped>
.htTypeTree {
  ::v-deep .el-tree-node__expand-icon {
    color: #333333;
  }
  ::v-deep .el-tree-node__expand-icon.is-leaf {
    color: transparent !important;
  }
}
div >>> .el-dialog__body {
  padding: 10px 20px;
  color: #606266;
  font-size: 14px;
  word-break: break-all;
}
.el-main {
  padding-top: 0px;
}
.urgent-text {
  width: 100%;
}
.ht {
  width: 100%;
  ::v-deep {
    .el-textarea__inner {
      resize: both;
      width: 650px;
      max-width: 760px;
    }
  }
}
::v-deep .el-tabs__content {
  overflow: auto;
  position: relative;
  max-height: 370px;
}

.bo-set__card {
  height: calc(100% - 5px);
  border: none;
}

.bo-set__card /deep/ > div.el-card__header {
  padding: 16px;
  border: none;
}

.bo-set__card /deep/ > div.el-card__body {
  height: calc(100% - 65px);
  padding: 0;
}
.scrollbar-title {
  margin-top: 24px;
  color: #333333;
  font-weight: bold;
}
.bo-set__table th,
.bo-set__card /deep/ > div.el-card__header,
.bo-set__detail /deep/ > .el-table__header-wrapper > table > thead th {
  background: #f9f9f9;
}
.bo-set__table th,
.bo-set__table td {
  padding: 16px 0px !important;

  border: none;
  &:last-child {
    padding-bottom: 0;
  }
}
td {
  border: none !important;
}
.dialog-footer {
  margin-top: -25px;
}
.wrap {
  display: flex;
}
.is-plain {
  background: #fff;
  color: #409eff;
}
.top-button {
  right: 24px;
  top: 9px;
  z-index: 10000000;
  position: fixed;
}
.form-table {
  .table_lable {
    padding: 24px;
    text-align: left;
    border: none;
    color: #888888;
  }
  .ht-form-inputs__inline {
    width: 100%;
  }
  th {
    border: none;
  }
  ::v-deep .ht-textarea {
    border: none;
    .el-textarea__inner {
      background: #f3f3f3;
    }
  }
  .el-tabs__nav {
    .is-active {
      font-weight: bold;
    }
  }
  .often-button {
    margin-right: 16px;
  }
}
</style>
