<template>
  <el-form :model="viewDataForm" size="small" v-loading="loading">
    <div :style="menuHeight">
      <el-row>
        <el-col>
          <div>
            <el-radio-group
              v-model="viewDataForm.editMode"
              @change="radioChange"
            >
            {{viewDataForm.editMode}}
              <el-radio label="00" size="small">{{$t('view.design')}}</el-radio>
              <el-radio label="01" size="small">{{$t('view.code_dql')}}</el-radio>
              <el-radio label="02" size="small">{{$t('view.code_sql')}}</el-radio>
              <el-radio label="03" size="small">{{$t('view.code_procedure')}}</el-radio>
            </el-radio-group>
          </div>
        </el-col>
      </el-row>
      <div v-show="radioSwitchover.formShow">
        <el-row>
          <el-col>
            <el-divider content-position="left"
              >{{$t('view.relatedFrom')}}:</el-divider
            >
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-select
              v-model="viewDataForm.relatedForm"
              :placeholder="$t('placeholder.select')"
              size="small"
              @change="changeDataSourcesOption"
            >
              <el-option value="" label=""></el-option>
              <el-option
                v-for="item in dataSourcesOptions"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-col>
        </el-row>
      </div>
      <div v-show="radioSwitchover.searchShow">
        <el-row>
          <el-col>
            <el-divider content-position="left"
              >{{$t('view.search_template')}}:</el-divider
            >
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-select
              v-model="viewDataForm.searchFormId"
              :placeholder="$t('placeholder.select')"
              size="small"
              @change="searchSelect"
            >
              <el-option value="" label=""></el-option>
              <el-option
                v-for="item in queryOptions"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-col>
        </el-row>
      </div>
      <div v-show="radioSwitchover.commonShow">
        <el-row>
          <el-col>
            <el-divider content-position="left"
              >{{$t('view.common_filter_fields')}}:</el-divider
            >
          </el-col>
        </el-row>
        <el-row v-if="intValue != '17'">
          <el-form-item>
            <el-button @click="addSearch">{{$t('btns.add')}}</el-button>
          </el-form-item>
          <el-col>
            <el-form-item
              v-for="(queryField, index) in viewDataForm.commonFilterCondition"
              :key="index"
              :rules="{
                required: true,
                message: '请选择查询字段',
                trigger: 'change',
              }"
            >
              <el-select
                v-model="queryField.field"
                :placeholder="$t('placeholder.select')"
                size="small"
                @change="changeSearchField"
              >
                <el-option
                  v-for="item in searchField"
                  :key="item.id"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
              <el-button @click.prevent="delSearch(index)" class="marginL10">{{
                $t('btns.delete')
              }}</el-button>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row v-if="intValue == '17'">
          <span class="green d-font-size">
            {{ $t('view.tip') }}：
            <br />
            1.{{$t('tree_unsupport')}} 
          </span>
        </el-row>
      </div>
      <div v-show="radioSwitchover.queryShow">
        <el-row>
          <el-col>
            <el-divider content-position="left"
              >{{ $t('view.filter_system') }}:</el-divider
            >
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <div class="color-success d-font-size">
              <div>{{ $t('view.tip') }}：</div>
              <div>1.{{ $t('view.selection_mode') }}：</div>
              <div>{{ $t('view.single_choice') }}</div>
              <div>{{ $t('view.multiple_choice') }}</div>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-table :data="viewDataForm.authorityCondition">
            <el-table-column :label="$t('view.op')" min-width="20%">
              <template slot="header">
                <el-button size="small" @click="addSystem">{{
                  $t('btns.add')
                }}</el-button>
              </template>
            </el-table-column>
            <el-table-column min-width="70%" :label="$t('view.filter_field')">
              <template slot-scope="scope">
                <span class="px-2">{{$t('press')}}</span>
                <el-form-item class="d-inline-block">
                  <el-select
                    v-model="scope.row._authFields"
                    :placeholder="$t('placeholder.select')"
                    size="small"
                    class="px-2"
                    @change="selectSystemScreening(scope.row)"
                  >
                    <el-option
                      v-for="item in systemScreeningOptions"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    ></el-option>
                  </el-select>
                </el-form-item>
                <span>{{$t('view.data')}}</span>
              </template>
            </el-table-column>
            <el-table-column min-width="70%" :label="$t('view.scope')">
              <template slot-scope="scope">
                <span class="px-2">{{$t('just')}}</span>
                <el-form-item class="d-inline-block">
                  <el-select
                    v-model="scope.row._authFieldScope"
                    :placeholder="$t('placeholder.select')"
                    size="small"
                    class="px-2"
                  >
                    <el-option
                      v-for="item in scope.row._scopeByFieldOptions"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    ></el-option>
                  </el-select>
                </el-form-item>
                <span>{{$t('can_see')}}</span>
              </template>
            </el-table-column>
            <el-table-column>
              <template slot-scope="scope">
                <el-form-item class="d-inline-block">
                  <el-button
                    size="small"
                    @click="delSystem(scope.$index)"
                    type="danger"
                    >{{ $t('btns.delete') }}</el-button
                  >
                </el-form-item>
              </template>
            </el-table-column>
          </el-table>
        </el-row>
        <el-row>
          <el-col>
            <el-divider content-position="left"
              >{{ $t('view.form_filter') }}:</el-divider
            >
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <div class="color-success d-font-size">
              <div>{{ $t('view.tip') }}：</div>
              <div>1.{{ $t('view.date_compare') }};</div>
              <div>2.{{ $t('view.operator_content') }}</div>
            </div>
          </el-col>
        </el-row>
        <el-row>
          <el-col>
            <el-table :data="viewDataForm.filterCondition">
              <el-table-column :label="$t('view.op')" min-width="10%">
                <template slot="header">
                  <el-button size="small" @click="addFrom">{{
                    $t('btns.add')
                  }}</el-button>
                </template>
              </el-table-column>
              <el-table-column min-width="20%" :label="$t('view.fields')">
                <template slot-scope="scope">
                  <el-select
                    v-model="scope.row.field"
                    :placeholder="$t('placeholder.select')"
                    size="small"
                  >
                    <el-option
                      v-for="(item, index) in formValueOptions"
                      :key="index"
                      :label="item.name"
                      :value="item.id"
                    ></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column min-width="40%" :label="$t('view.operator')">
                <template slot-scope="scope">
                  <div class="d-flex">
                    <el-select
                      v-model="scope.row.operator"
                      :placeholder="$t('placeholder.select')"
                      size="small"
                    >
                      <el-option
                        v-for="item in operator"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      ></el-option>
                    </el-select>
                    <el-select
                      v-model="scope.row.type"
                      :placeholder="$t('placeholder.select')"
                      size="small"
                      class="marginL20"
                    >
                      <el-option
                        v-for="item in type"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      ></el-option>
                    </el-select>
                  </div>
                </template>
              </el-table-column>
              <el-table-column min-width="20%" :label="$t('view.compare')">
                <template slot-scope="scope">
                  <!-- 文本 -->
                  <el-input
                    v-model="scope.row.ipField"
                    size="small"
                    v-if="scope.row.type == '00'"
                    @input="changeFrom(scope.row, scope.$index)"
                    >{{ scope.row.ipField }}</el-input
                  >

                  <!-- 数字 -->
                  <el-input-number
                    v-model="scope.row.numField"
                    :min="0"
                    :max="1000000000"
                    v-if="scope.row.type == '01'"
                    size="small"
                    @change="changeFrom(scope.row, scope.$index)"
                  ></el-input-number>
                  <!-- 日期 -->
                  <el-date-picker
                    v-model="scope.row.daField"
                    type="date"
                    :placeholder="$t('placeholder.select_date')"
                    :picker-options="pickerOptions"
                    v-if="scope.row.type == '02'"
                    size="small"
                    clearable
                    style="width: 160px"
                    value-format="yyyy-MM-dd"
                    format="yyyy-MM-dd"
                    @input="changeFrom(scope.row, scope.$index)"
                  >
                  </el-date-picker>

                  <!-- 查询表单 -->
                  <el-select
                    v-model="scope.row.sfField"
                    :placeholder="$t('placeholder.select')"
                    size="small"
                    v-if="scope.row.type == '03'"
                    @change="changeFrom(scope.row, scope.$index)"
                  >
                    <el-option
                      v-for="item in searchField"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    ></el-option>
                  </el-select>

                  <!-- 系统变量 -->
                  <el-select
                    v-model="scope.row.syField"
                    :placeholder="$t('placeholder.select')"
                    size="small"
                    v-if="scope.row.type == '04'"
                    @change="changeFrom(scope.row, scope.$index)"
                  >
                    <el-option
                      v-for="(item, index) in systemOptions"
                      :key="index"
                      :label="item.name"
                      :value="item.value"
                    ></el-option>
                  </el-select>
                </template>
              </el-table-column>
              <el-table-column min-width="10%">
                <template slot-scope="scope">
                  <el-button
                    size="small"
                    @click="delFrom(scope.$index)"
                    type="danger"
                    >{{ $t('btns.delete') }}</el-button
                  >
                </template>
              </el-table-column>
            </el-table>
          </el-col>
        </el-row>
      </div>
      <div v-if="radioSwitchover.scriptShow">
        <el-row>
          <el-col v-show="viewDataForm.editMode === '01'">
            <el-input
              type="textarea"
              class="width-500"
              :autosize="{ minRows: 5, maxRows: 8 }"
              :placeholder="$t('placeholder.content')"
              v-model="viewDataForm.filterScript"
            ></el-input>
            <i
              class="el-icon-edit-outline"
              @click="showScriptEditor('filterScript')"
            ></i>
          </el-col>
          <el-col v-show="viewDataForm.editMode === '02'">
            <el-input
              type="textarea"
              class="width-500"
              :autosize="{ minRows: 5, maxRows: 8 }"
              :placeholder="$t('placeholder.content')"
              v-model="viewDataForm.sqlFilterScript"
            ></el-input>
            <i
              class="el-icon-edit-outline"
              @click="showScriptEditor('sqlFilterScript')"
            ></i>
          </el-col>
          <el-col v-show="viewDataForm.editMode === '03'">
            <el-input
              type="textarea"
              class="width-500"
              :autosize="{ minRows: 5, maxRows: 8 }"
              :placeholder="$t('placeholder.content')"
              v-model="viewDataForm.procedureFilterScript"
            ></el-input>
            <i
              class="el-icon-edit-outline"
              @click="showScriptEditor('procedureFilterScript')"
            ></i>
          </el-col>
        </el-row>
      </div>

      <!-- 脚本选择器弹窗 -->
      <!-- scriptEditorVisible:弹窗显示   showScritptEditorCode：将文本框的值传给编译器  handleScriptEditor：将编译器的值传给textarea-->
      <ScriptEditorSelect
        v-if="scriptEditorVisible"
        :scriptEditorVisible="scriptEditorVisible"
        :editorCode="showScritptEditorCode"
        @closeScriptEditorDialog="scriptEditorVisible = false"
        @saveScriptEditor="handleScriptEditor"
      />
    </div>
  </el-form>
</template>

<script>
import {
  getModuleViewData,
  getSystemScreeningFields,
  getScopeByField,
  getFormValueStoreFields,
} from '@/service/ViewApi.js'
import { getModuleFormList, getModuleForm } from '@/service/FormApi.js'
import config from '@/assets/json/config.json'
import ScriptEditorSelect from '@/components/Common/scriptEditor'
import { obj2Arr } from '@/utils/utils.js'
export default {
  name: 'ViewData',
  components:{
    ScriptEditorSelect
  },
  data() {
    return {
      menuHeight:
        document.documentElement.clientHeight ||
        document.body.clientHeight - 60 - 32 - 41 - 50 - 20 - 16,
      viewDataForm: {
        editMode: '00', //数据页面的单选
        relatedForm: '', //数据来源表单
        searchFormId: '', //查询模板id

        commonFilterCondition: [], //常用查询字段
        authorityCondition: [], //系统筛选条件
        filterCondition: [], //表单过滤条件

        filterScript: '', //dql编辑器
        sqlFilterScript: '', //过滤脚本(编辑模式为Sql模式)
        procedureFilterScript: '', //过滤脚本(编辑模式为存储过程模式)
      },
      // 视图数据页面
      dataSourcesOptions: [], //数据来源表单数组
      queryOptions: [], //查询模板数组
      searchField: [], //常用查询字段-查询字段
      formValueOptions: [], //表单过滤条件遍历
      systemOptions: config.systemOptions, // 系统变量
      systemScreeningOptions: [], //系统筛选条件遍历
      // scopeByFieldOptions: [], //系统筛选条件作用域遍历
      currentDataSourcesOption: {}, // 当前选中的数据来源表单
      initData: {}, // 初始化的数据
      pickerOptions: {
        shortcuts: [
          {
            text: this.$t('view.today'),
            onClick(picker) {
              picker.$emit('pick', new Date())
            },
          },
          {
            text: this.$t('view.yestoday'),
            onClick(picker) {
              const date = new Date()
              date.setTime(date.getTime() - 3600 * 1000 * 24)
              picker.$emit('pick', date)
            },
          },
          {
            text: this.$t('view.last_week'),
            onClick(picker) {
              const date = new Date()
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
              picker.$emit('pick', date)
            },
          },
        ],
      },

      radioSwitchover: {
        formShow: true, //表单显示
        searchShow: true, //查询显示
        commonShow: true, //常用查询显示
        queryShow: true, //系统筛选显示
        scriptShow: false, //脚本编辑器显示
      },
      operator: config.operator,
      type: config.type, //表单过滤条件-操作符-文本
      loading: false,
      ajaxNum: 0, // 请求的次数

      scriptEditorVisible: false, // 脚本编辑器弹窗
      currentScriptEditor: '', // 当前点击的是哪一个脚本编辑器
    }
  },
  props: {
    intValue: String,
    isEdit: Boolean,
    viewId: String,
    moduleId: String,
  },
  watch: {
    ajaxNum() {
      if (this.ajaxNum > 0) {
        this.loading = true
      } else {
        this.loading = false
      }
    },
  },
  methods: {
    /**
     * 单选框切换
     */
    radioChange(val) {
      let radioSwitchover = {
        ...this.radioSwitchover,
        formShow: true, //表单显示
        searchShow: true, //查询显示
        commonShow: true, //常用查询显示
        queryShow: true, //系统筛选显示
        scriptShow: false, //脚本编辑器显示
      }
      this.radioSwitchover = radioSwitchover
      if (val != '00') {
        this.radioSwitchover.formShow = false
        this.radioSwitchover.queryShow = false
        this.radioSwitchover.scriptShow = true
      }

      // 不保存的情况下视图列是否显示表单和表单字段
      let obj = {
        ...this.$store.state.currentDataSourcesOption,
        ...this.viewDataForm
      }
      this.$store.commit('setCurrentDataSources',obj)
    },

    /**
     *获取到当前数据项传给列的批量新建
     */
    changeDataSourcesOption() {
      this.dataSourcesOptions.some((item) => {
        if (item.id === this.viewDataForm.relatedForm) {
          this.currentDataSourcesOption = item
        }
      })

      // 需要判断要有id再请求
      if (this.viewDataForm.relatedForm != '') {
        this.getFormValueStoreFields() // 重新获取表单过滤条件的数据
      }
    },

    /**
     * 常用查询添加
     */
    addSearch() {
      if (this.viewDataForm.commonFilterCondition.length == 2) {
        this.$message.error(this.$t('view.select_num'))
        return false
      }
      this.viewDataForm.commonFilterCondition.push({
        field: this.searchField.length > 0 ? this.searchField[0].id : '',
        isCommonFilter: 'true',
        paramKey: Date.now(),
      })
    },

    /**
     * 常用查询删除
     */
    delSearch(index) {
      this.viewDataForm.commonFilterCondition.splice(index, 1)
    },

    /**
     * 查询表单字段
     */
    searchSelect(val) {
      if (!val) return false
      getModuleForm(val, {
        onSucess: (response) => {
          if (response.data.errcode == 0) {
            let list = []
            let data = response.data.data
            let arr = data.allFieldNames ? data.allFieldNames : []
            if (arr.length > 0) {
              for (let i = 0; i < arr.length; i++) {
                let value = arr[i]
                let obj = {}
                obj.id = value
                obj.name = value
                list.push(obj)
              }
              this.searchField = list
            } else {
              this.searchField = [
                {
                  id: 0,
                  name: '',
                },
              ]
            }
            //判断当前的常用查询字段是否为0
              if(this.viewDataForm.commonFilterCondition.length!=0){
                //循环当前的查询字段的数组
                this.viewDataForm.commonFilterCondition.forEach((item,index)=>{
                    //flag用来判断当前的字段是否在数组中
                     let flag=true
                    if(this.searchField.length!=0){
                      this.searchField.forEach((item1,index1)=>{
                        if(item1.id==item.field){
                            flag=false
                        }
                      })
                      if(flag){
                        item.field=this.searchField[0].id
                      }
                    }
                })
              }
          }
        },
      })
    },

    /**
     * 常用查询字段值相同
     */
    changeSearchField() {
      if (this.viewDataForm.commonFilterCondition.length == 2) {
        // console.log(this.viewDataForm.commonFilterCondition)
        if (
          this.viewDataForm.commonFilterCondition[0].field ==
          this.viewDataForm.commonFilterCondition[1].field
        ) {
          return this.$message.error(this.$t('msg.same_confition'))
        }
      }
    },

    /**
     * 系统筛选条件添加
     */
    async addSystem() {
      if (!this.viewDataForm.relatedForm)
        return this.$message.warning(this.$t('msg.select_dataform'))

      let response = await getSystemScreeningFields(this.viewDataForm.relatedForm)
      this.viewDataForm.authorityCondition.push({
        _authFields: '',
        _authFieldScope: '',
        _scopeByFieldOptions: obj2Arr(response.data.data)
      })
    },

    /**
     * 系统筛选条件删除
     */
    delSystem(index) {
      this.viewDataForm.authorityCondition.splice(index, 1)
    },
    /**
      系统筛选
     */
    async selectSystemScreening(row) {
      // 清空当前作用域的值
      if (row._authFields) {
        this.ajaxNum++;
        let response = await getScopeByField(row._authFields)
        row._scopeByFieldOptions = obj2Arr(response.data.data)
        // 默认选中第一个值
        row._authFieldScope = row._scopeByFieldOptions[0].id;
        this.ajaxNum--;
      }
    },
    /**
     * 强制更新v-model不生效
     */
    changeFrom(row, index) {
      this.$set(this.viewDataForm.filterCondition, index, row)
    },

    /**
     * 表单过滤条件添加
     */
    addFrom() {
      if (this.viewDataForm.relatedForm == '')
        return this.$message.warning(this.$t('msg.select_dataform'))
      this.viewDataForm.filterCondition.push({
        field:
          this.formValueOptions.length > 0 ? this.formValueOptions[0].id : '',
        operator: 'LIKE',
        type: '00',
        ipField: '',
        numField: 0,
        daField: '',
        sfField: this.searchField.length > 0 ? this.searchField[0].id : '',
        syField:
          this.systemOptions.length > 0 ? this.systemOptions[0].value : '',
      })
    },

    /**
     * 表单过滤条件删除
     */
    delFrom(index) {
      this.viewDataForm.filterCondition.splice(index, 1)
    },

    /**
     * 表单过滤条件数据
     */
    getFormValueStoreFields() {
      this.ajaxNum++
      getFormValueStoreFields(this.viewDataForm.relatedForm, {
        onSucess: (response) => {
          this.ajaxNum--
          if (response.data.errcode == 0) {
            this.formValueOptions = obj2Arr(response.data.data)
            // 判断表单过滤条件的值在这里是否有，如果有就查是否有当前的id，如果没有就重置
            let resetFlag = false
            this.viewDataForm.filterCondition.map((item) => {
              for (let i = 0; i < list.length; i++) {
                if (list[i].id == item.field) {
                  resetFlag = true
                  break
                }
              }
              if (!resetFlag) {
                item.field = ''
              }
            })
          }
        },
      })
    },

    /**
     * 获取作用域的值
     */
    async getScopeByField(row) {
      this.ajaxNum++;
      let response = await getScopeByField(row._authFields);
      this.ajaxNum--;
      row._scopeByFieldOptions = obj2Arr(response.data.data);
    },

    /**
     * 系统筛选条件数据
     */
    async getSystemScreeningFields() {
      this.ajaxNum++
      let response = await getSystemScreeningFields(this.viewDataForm.relatedForm)
      this.ajaxNum--
      this.systemScreeningOptions = obj2Arr(response.data.data)
    },

    /**
     * 数据来源表单
     */
    getModuleFormList() {
      this.ajaxNum++
      let params = {
        moduleId: this.moduleId,
        name: '',
        description: '',
        type: '',
        pageNo: 1,
        linesPerPage: 100000,
      }
      getModuleFormList(params, {
        onSucess: (response) => {
          if (response.data.errcode == 0) {
            let data = response.data.data.datas
            let dataArr = []
            let queryArr = []
            for (let i = 0; i < data.length; i++) {
              if (data[i].type == 1) {
                dataArr.push(data[i])
              } else if (data[i].type == 256) {
                queryArr.push(data[i])
              } else if (data[i].type == 65536) {
                dataArr.push(data[i])
              }
            }
            this.dataSourcesOptions = dataArr // 普通表单和映射表单的数组
            // 查询表单数组[网格视图过滤查询表单]
            if (this.currentDataSourcesOption.openType == 288) {
              this.queryOptions = queryArr.filter((item) => item.type != 256)
            } else {
              this.queryOptions = queryArr
            }

            // 判断是否有 数据来源表单 id
            let relatedFormFlag = false
            this.dataSourcesOptions.some((item) => {
              if (item.id === this.viewDataForm.relatedForm) {
                relatedFormFlag = true
              }
            })
            if (!relatedFormFlag) {
              // 清空数据来源id
              this.viewDataForm.relatedForm = ''
              // 当前选中值的数据来源id
              this.currentDataSourcesOption.relatedForm = ''
            }

            // 判断是否有 查询模板 id
            let searchFormIdFlag = false
            this.queryOptions.some((item) => {
              if (item.id === this.viewDataForm.searchFormId) {
                searchFormIdFlag = true
              }
            })
            if (!searchFormIdFlag) {
              this.viewDataForm.searchFormId = ''
            }

            this.ajaxNum--
          }
        },
      })
    },
    
    /**
     * 显示脚本编辑器弹框
     */
    showScriptEditor(val) {
      this.scriptEditorVisible = true
      this.currentScriptEditor = val
    },

    /**
     * 将脚本编辑器的值写入到textarea中
     */
    handleScriptEditor(val) {
      if (this.currentScriptEditor === 'filterScript') {
        // 视图数据dql
        this.viewDataForm.filterScript = val
      } else if (this.currentScriptEditor === 'sqlFilterScript') {
        // 视图数据sql
        this.viewDataForm.sqlFilterScript = val
      } else if (this.currentScriptEditor === 'procedureFilterScript') {
        // 视图数据代码存储过程
        this.viewDataForm.procedureFilterScript = val
      }
    },

    /**
     * 获取视图的数据
     */
    getViewData() {
      this.ajaxNum++
      getModuleViewData(this.viewId, {
        onSucess: (response) => {
          if (response.data.errcode == 0) {
            this.ajaxNum--

            let data = response.data.data

            this.viewDataForm.relatedForm = data.relatedForm
            this.viewDataForm.editMode = data.editMode // 单选组的值
            this.viewDataForm.searchFormId = data.searchFormId
              ? data.searchFormId
              : '' // 查询表单id
            this.viewDataForm.authorityCondition = data.authorityCondition
              ? eval(data.authorityCondition)
              : [] // 系统筛选条件

            this.viewDataForm.filterCondition = data.filterCondition
              ? eval(data.filterCondition)
              : [] // 表单过滤条件

            this.viewDataForm.commonFilterCondition = data.commonFilterCondition
              ? eval(data.commonFilterCondition)
              : [] // 常用查询字段
            this.viewDataForm.filterScript = data.filterScript
              ? data.filterScript
              : '' // 过滤脚本(编辑模式为Dql模式)
            this.viewDataForm.sqlFilterScript = data.sqlFilterScript
              ? data.sqlFilterScript
              : '' //过滤脚本(编辑模式为Sql模式)
            this.viewDataForm.procedureFilterScript = data.procedureFilterScript
              ? data.procedureFilterScript
              : '' //过滤脚本(编辑模式为存储过程模式)

            this.currentDataSourcesOption = data // 当前的数据【传给列的批量创建】

            //表单过滤条件数据处理【添加后不能修改值】
            if (this.viewDataForm.filterCondition.length > 0) {
              this.viewDataForm.filterCondition.map((item) => {
                item.ipField = ''
                item.numField = 0
                item.daField = ''
                item.sfField = ''
                item.syField = ''
                console.log(this.viewDataForm.filterCondition)
                switch (item.type) {
                  case '00':
                    item.ipField = item.match
                    break
                  case '01':
                    item.numField = Number(item.match)
                    break
                  case '02':
                    item.daField = item.match
                    break
                  case '03':
                    item.sfField = item.match
                    break
                  case '04':
                    item.syField = item.match
                    break
                  default:
                    break
                }
              })
            }

            if (this.viewDataForm.relatedForm) {
              this.getSystemScreeningFields() // 系统筛选条件数据
              this.getFormValueStoreFields() // 表单过滤条件数据
            }
            
            if (this.viewDataForm.searchFormId) {
              this.searchSelect(this.viewDataForm.searchFormId) // 常用查询字段
            }
            // 作用域
            if (this.viewDataForm.authorityCondition.length > 0) {
              this.viewDataForm.authorityCondition.forEach(async (item) =>{
                this.ajaxNum++
                let response = await getScopeByField(item._authFields)
                item._scopeByFieldOptions = obj2Arr(response.data.data)
                this.ajaxNum--
                this.$set(item, 'authorityCondition', item)
              })
            }

            // 单选框组的内容显示
            this.radioChange(this.viewDataForm.editMode)
          }
        },
      })
    },
    save() {
      let dataflag = false
      if (
        !this.viewDataForm.relatedForm &&
        this.viewDataForm.editMode == '00'
      ) {
        this.$message.warning(this.$t('msg.jump_select_dataform'))
        dataflag = true
      }

      switch (this.viewDataForm.editMode) {
        case '00':
          if (this.viewDataForm.commonFilterCondition.length > 0) {
            this.viewDataForm.commonFilterCondition.forEach((item) => {
              if (item.field === '') dataflag = true
            })
            if (dataflag) {
              this.$message.error(this.$t('msg.condition_empty'))
              return false;
            }
            if (
              this.viewDataForm.commonFilterCondition.length > 1 &&
              this.viewDataForm.commonFilterCondition[0].field ==
                this.viewDataForm.commonFilterCondition[1].field
            ) {
              this.$message.error(this.$t('msg.same_confition'))
              return false;
            }
          }

          // 一键生成视图转换后filterCondition为undefined的问题
          if (this.viewDataForm.filterCondition == undefined) {
            this.viewDataForm.filterCondition = []
          }

          if (
            this.viewDataForm.filterCondition &&
            this.viewDataForm.filterCondition.length > 0
          ) {
            this.viewDataForm.filterCondition.map((item) => {
              if (item.field == '') {
                dataflag = true;
              } else {
                switch (item.type) {
                  case '00':
                    item.match = item.ipField
                    break
                  case '01':
                    item.match = item.numField + ''
                    break
                  case '02':
                    item.match = item.daField
                    break
                  case '03':
                    item.match = item.sfField
                    break
                  case '04':
                    item.match = item.syField
                    break
                  default:
                    item.match = ''
                    break
                }
              }
            })
            if(dataflag){
              this.$message.error(this.$t('msg.config'));
              return false;
            }
          }
      }

      // 网格视图下不支持查询表单
      if(this.$store.state.currentDataSourcesOption.openType == '288' && this.viewDataForm.searchFormId){
        this.$message.warning(this.$t('msg.unsupport_form'))
        return false;
      }

      if (dataflag) {
        return false
      } else {
        let tempAuthority = []
        // 将系统筛选条件删除其中的数组
        this.viewDataForm.authorityCondition.map(item => tempAuthority.push({
          _authFields: item._authFields,
          _authFieldScope: item._authFieldScope
        }))

        return {
          ...this.viewDataForm,
          authorityCondition: JSON.stringify(tempAuthority), // 系统筛选条件
          filterCondition: JSON.stringify(this.viewDataForm.filterCondition), // 表单过滤条件
          commonFilterCondition: JSON.stringify(this.viewDataForm.commonFilterCondition), // 表单查询字段
        }
      }
    },
  },
  mounted() {
    this.getModuleFormList() // 数据来源表单
    if (this.isEdit) {
      this.getViewData()
    }
  },
  computed:{
    /**
     * textarea 传给 脚本编辑器的值
     */
    showScritptEditorCode() {
      let code
      if (this.currentScriptEditor === 'filterScript') {
        // 视图数据dql
        code = this.viewDataForm.filterScript
      } else if (this.currentScriptEditor === 'sqlFilterScript') {
        // 视图数据sql
        code = this.viewDataForm.sqlFilterScript
      } else if (this.currentScriptEditor === 'procedureFilterScript') {
        // 视图数据代码存储过程
        code = this.viewDataForm.procedureFilterScript
      }
      return code
    },
  }
}
</script>
<style lang='less' scoped>
</style>