<template>
  <div class="base-screen-container">
    <div class="form-title_blue">数据源配置(入参)</div>
    <ts-multi-mdl
      :keyId="selectItem?selectItem.id:'dS'"
      :mulitValue="selectItem.dataSourceData"
      :fields="sourceFields"
      width="calc(100% - 15px)"
      style="padding-left:15px"
      @change="onClickField($event,'dataSourceData')"
      :key="'ddds'+selectItem.id"
    ></ts-multi-mdl>
  </div>
</template>

<script>
export default {
  name: 'attrDataSource',
  props: {
    selectItem: {
      type: Object,
      default: () => {
        return {}
      }
    },
    addFieldData: {
      // 需要插入的值，{index:[]}
      type: Object,
      default: () => {
        return {}
      }
    }
  },
  components: {},
  data() {
    return {
      selectItem_: this.selectItem,
      dataSourceDataList: this.$store.state.bi.dataSource
    }
  },
  computed: {
    sourceFields() {
      let arr = [
        {
          name: 'dsType',
          type: 'groupRadio',
          id: 'dsType',
          value: 'dsType',
          width: '100%',
          radioData: [
            { value: '0', text: '自定义服务' },
            { value: '1', text: 'URL' }
          ],
          changed: (item, row, index) => {
            if (item.dsType) {
              for (let r of row) {
                if (
                  r.id == 'dataSourceId' ||
                  r.id == 'dataSourceCol' ||
                  r.id == 'value'
                ) {
                  r.isHide = item.dsType != '0'
                } else if (
                  r.id == 'reqType' ||
                  r.id == 'reqParam' ||
                  r.id == 'reqUrl' ||
                  r.id == 'dataRange' ||
                  r.id == 'area'
                ) {
                  r.isHide = item.dsType == '0'
                }
              }
            }
            return row
          }
        },
        {
          name: 'dataSourceId',
          type: 'select',
          id: 'dataSourceId',
          value: 'dataSourceId',
          width: '100%',
          placeholder: '数据源',
          isGanged: true, // 是否联动  默认false boolean
          gangedId: 'dataSourceCol', // 联动项id
          source: {
            dataType: 'local',
            data: this.dataSourceDataList,
            code: 'id',

            text: 'queryName',
            value: {
              name: '',
              code: ''
            }
          },
          formatter: row => {
            if (row.conditionDefine) {
              let childDatasList = JSON.parse(row.conditionDefine)
              return {
                data: childDatasList
              }
            } else {
              return { data: {} }
            }
          }
        },
        {
          name: 'dataSourceCol',
          type: 'select',
          id: 'dataSourceCol',
          value: 'dataSourceCol',
          width: '100%',
          placeholder: '参数名',
          isGanged: true, // 是否联动  默认false boolean
          gangedId: 'value', // 联动项id
          source: {
            dataType: 'local',
            data: [],
            code: 'name',
            text: 'name',
            value: {
              name: '',
              code: ''
            }
          },
          formatter: row => {
            return {
              value: row
            }
          }
        },
        {
          name: 'reqUrl',
          type: 'textarea',
          id: 'reqUrl',
          value: 'reqUrl',
          width: '100%',
          placeholder: '请求地址',
          isHide: true
        },
        {
          name: 'reqType',
          type: 'select',
          id: 'reqType',
          value: 'reqType',
          width: '50%',
          placeholder: '请求方式',
          isHide: true,
          source: {
            dataType: 'local',
            data: [
              { value: 'get', label: 'get' },
              { value: 'post', label: 'post' }
            ],

            code: 'value',
            text: 'label',
            value: {
              name: '',
              code: ''
            }
          }
        },
        {
          name: 'reqParam',
          type: 'text',
          id: 'reqParam',
          value: 'reqParam',
          width: '50%',
          placeholder: '参数名',
          isHide: true,
          tsPopover: '参数名'
        }
      ]
      for (let index of Object.keys(this.addFieldData)) {
        arr.splice(index, 0, ...this.addFieldData[index])
      }
      // if (this.selectItem_.type == 'screen' && this.selectItem_.state == '8') {
      //   // 院区加日期筛选器
      //   arr.pop() // 删除最后一个参数名
      //   let areaArr = [
      //     {
      //       name: 'dataRange',
      //       type: 'text',
      //       id: 'dataRange',

      //       value: 'dataRange',
      //       width: '100%',
      //       placeholder: '参数名【时间区间】',
      //       isHide: true,
      //       tsPopover: '参数名【时间区间】'
      //     },
      //     {
      //       name: 'area',
      //       type: 'text',
      //       id: 'area',
      //       value: 'area',
      //       width: '100%',
      //       placeholder: '参数名【院区】',
      //       isHide: true,
      //       tsPopover: '参数名【院区】'
      //     }
      //   ]
      //   arr = arr.concat(JSON.parse(JSON.stringify(areaArr)))
      //   let paramArr = {
      //     isGanged: true, // 是否联动  默认false boolean
      //     gangedId: 'value', // 联动项id
      //     source: {
      //       dataType: 'local',
      //       data: [],

      //       code: 'name',
      //       text: 'name',
      //       value: {
      //         name: '',
      //         code: ''
      //       }
      //     }
      //   }
      //   areaArr[0].type = 'select'
      //   areaArr[0].id = 'defined' + areaArr[0].id
      //   let newArr = Object.assign(areaArr[0], paramArr)
      //   delete newArr.isHide
      //   arr.splice(2, 1, newArr)
      //   areaArr[1].type = 'select'
      //   areaArr[1].id = 'defined' + areaArr[1].id
      //   let newArr_ = Object.assign(areaArr[1], paramArr)
      //   delete newArr_.isHide
      //   arr.splice(2, 0, newArr_)
      // }
      return arr
    }
  },
  mounted() {
    // this.selectData = JSON.parse(JSON.stringify(this.$store.state.bi.selectData))
    // if(this.addFieldData&&this.addFieldData.length>0){
    // }
  },
  created() {
    // this.getScreenControlVal()
  },
  methods: {
    onClickField(ev, key) {
      this.$emit('onClickField', ev, key)
    }
  },
  watch: {
    selectItem: {
      handler(val) {
        this.selectItem_ = JSON.parse(JSON.stringify(val))
      },
      deep: true
    },
    '$store.state.bi.dataSource': {
      handler(val) {
        this.dataSourceDataList = [...val]
      },
      deep: true
    }
  }
}
</script>
<style lang="less" scoped>
</style>
