// 高级检索
<template>
  <div>
    <DialogEdit @onSaved="onSave"
                @close="close"
                :autoClose="autoClose"
                :autoSave="false"
                :title="$t('retrievalIndex.advancedSearch')"
                :visible.sync="dialogVisible"
                width="1200px"
                center
                :labelPosition="labelPosition"
                :form="form"
                editModel="C"
                ref="dialogForm"
                :saveLabel="saveLabel"
                :appendToBody= "appendToBody">
      <div class="titleLine">{{$t('retrievalIndex.advancedSearch')}}<span class="line"></span></div>
      <el-row>
        <el-col :span="12">
          <el-form-item :label="$t('retrievalIndex.keyWordRetrieval')" label-width="90px">
            <el-tooltip effect="dark"
                        :content="$t('retrievalIndex.keyWordInfo')"
                        placement="top">
              <el-input v-model="form.keyWords"
                        style="width:100%"
                        :placeholder="$t('retrievalIndex.keyWord')"
                        clearable size="medium"></el-input>
            </el-tooltip>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('retrievalIndex.fileName')" label-width="90px">
            <el-input v-model="form.fileNames"  style="width:100%" :placeholder="$t('common.pleaseInput')" clearable size="medium"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('retrievalIndex.problemPoint')" label-width="90px">
            <el-input v-model="form.problemPoints"  style="width:100%" :placeholder="$t('common.pleaseInput')" clearable size="medium"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="$t('retrievalIndex.solution')" label-width="90px">
            <el-input v-model="form.solutions"  style="width:100%" :placeholder="$t('common.pleaseInput')" clearable size="medium"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <div class="retrievalCheck">
        <!-- 产品类型 -->
        <el-form-item :label="$t('retrievalIndex.productType')" label-width="90px">
          <el-checkbox class="checkAll" :indeterminate="isIndeterminateOne" v-model="form.checkAllOne" @change="handleCheckAllOne">{{$t('retrievalIndex.checkALL')}}</el-checkbox>
          <el-checkbox-group v-model="form.businessTypes" @change="handleCheckedOne">
            <el-checkbox v-for="(item, index) in businessTypesArr" :label="item.dictId" :key="item.dictId + index">{{item.dictName}}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <!-- 素材来源 -->
        <el-form-item :label="$t('retrievalIndex.materialSource')" label-width="90px">
          <el-checkbox class="checkAll" :indeterminate="isIndeterminateTwo" v-model="form.checkAllTwo" @change="handleCheckAllTwo">{{$t('retrievalIndex.checkALL')}}</el-checkbox>
          <el-checkbox-group v-model="form.relatedSources" @change="handleCheckedTwo">
            <el-checkbox v-for="(item, index)  in relatedSourcesArr" :label="item.dictId" :key="item.dictId + index">{{item.dictName}}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <!-- 适用产品 -->
        <el-form-item :label="$t('retrievalIndex.applicableProject')" label-width="90px">
          <el-checkbox class="checkAll" :indeterminate="isIndeterminateThree" v-model="form.checkAllThree" @change="handleCheckAllThree">{{$t('retrievalIndex.checkALL')}}</el-checkbox>
          <el-checkbox-group v-model="form.applicableProjectIds" @change="handleCheckedThree">
            <el-checkbox v-for="(item, index)  in applicableProjectsArr" :label="item.applicableProjectId" :key="item.applicableProjectId + index">{{item.applicableProject}}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
        <!-- 适用律所 -->
        <el-form-item :label="$t('retrievalIndex.correspondingLaw')" label-width="90px">
          <el-checkbox class="checkAll" :indeterminate="isIndeterminateFour" v-model="form.checkAllFour" @change="handleCheckAllFour">{{$t('retrievalIndex.checkALL')}}</el-checkbox>
          <el-checkbox-group v-model="form.correspondingLawFirmsIds" @change="handleCheckedFour">
            <el-checkbox v-for="(item, index)  in correspondingLawsArr" :label="item.correspondingLawFirmsId" :key="item.correspondingLawFirmsId + index">{{item.correspondingLawFirms}}</el-checkbox>
          </el-checkbox-group>
        </el-form-item>
      </div>
    </DialogEdit>
  </div>
</template>

<script>
import { DialogEdit, authButton } from 'newepoch-components'
import knowledgeBaseApi from '@/api/assetaudit/knowledgeBaseApi'
let oldBusinessTypes = []
let oldrelatedSources = []
let oldApplicableProjects = []
let oldCorrespondingLaws = []
export default {
  name: 'advancedSearch',
  components: {
    DialogEdit,
    authButton
  },
  props: {
    visible: { // 隐藏显示弹窗
      type: [Boolean],
      required: true,
      default: function () {
        return false
      }
    },
    parameter: { // 分页参数
      type: Object,
      default () {
        return {
          pageIndex: 1,
          pageSize: 10
        }
      }
    },
    flag: {
      type: String,
      default: function () {
        return '01'
      }
    },
    clickPosition: { // 高级检索是点击按钮还是分页
      type: String,
      default: function () {
        return 'btn'
      }
    }
  },
  data () {
    return {
      autoClose: true, // 是否开启闭窗触发
      appendToBody: true,
      saveLabel: this.$i18n.messages[this.$i18n.locale].common.assign,
      labelPosition: 'right',
      form: {
        keyWords: '',
        fileNames: '',
        problemPoints: '',
        solutions: '',
        businessTypes: [],
        relatedSources: [],
        applicableProjectIds: [],
        correspondingLawFirmsIds: [],
        pageIndex: 1,
        pageSize: 10,
        checkAllOne: true,
        checkAllTwo: true,
        checkAllThree: true,
        checkAllFour: true
      },
      formLabelWidth: '90px',
      // 产品类型
      isIndeterminateOne: false,
      businessTypesArr: oldBusinessTypes,
      // 素材来源
      isIndeterminateTwo: false,
      relatedSourcesArr: oldrelatedSources,
      // 适用产品
      isIndeterminateThree: false,
      applicableProjectsArr: oldApplicableProjects,
      // 对应律所
      isIndeterminateFour: false,
      correspondingLawsArr: oldCorrespondingLaws
    }
  },
  watch: {
    // 监听输入，过滤非法字符
    'form.keyWords': {
      handler (val) {
        // val = val.replace(/[^\u4e00-\u9fa5a-zA-Z0-9\w]/g, '')
        this.form.keyWords = val
      }
    },
    'form.fileNames': {
      handler (val) {
        // val = val.replace(/[^\u4e00-\u9fa5a-zA-Z0-9\w]/g, '')
        this.form.fileNames = val
      }
    },
    'form.problemPoints': {
      handler (val) {
        // val = val.replace(/[^\u4e00-\u9fa5a-zA-Z0-9\w]/g, '')
        this.form.problemPoints = val
      }
    },
    'form.solutions': {
      handler (val) {
        // val = val.replace(/[^\u4e00-\u9fa5a-zA-Z0-9\w]/g, '')
        this.form.solutions = val
      }
    },
    visible (val) {
      if (val) {
        this.getRelatedSources()
        this.getBusinessTypes()
        this.getApplicableProject()
        this.getCorrespondingLaw()
      }
    },
    'parameter.pageIndex': function (val) {
      if (this.clickPosition === 'page') {
        this.onSave(this.form)
      }
    },
    'parameter.pageSize': function (val) {
      if (this.clickPosition === 'page') {
        this.onSave(this.form)
      }
    }
  },
  methods: {
    // 关闭窗口前触发
    close () {
      this.resDestroy()
      this.$refs.dialogForm.dialogVisible = false
    },
    // 产品类型 全选和单选
    handleCheckAllOne (val) {
      let dictIdArr = oldBusinessTypes.map(item => item.dictId)
      this.form.businessTypes = val ? dictIdArr : []
      this.isIndeterminateOne = false
    },
    // 素材来源 全选和单选
    handleCheckAllTwo (val) {
      let dictIdArr = oldrelatedSources.map(item => item.dictId)
      this.form.relatedSources = val ? dictIdArr : []
      this.isIndeterminateTwo = false
    },
    // 适用产品 全选和单选
    handleCheckAllThree (val) {
      let dictIdArr = oldApplicableProjects.map(item => item.applicableProjectId)
      this.form.applicableProjectIds = val ? dictIdArr : []
      this.isIndeterminateThree = false
    },
    // 适用律所 全选和单选
    handleCheckAllFour (val) {
      let dictIdArr = oldCorrespondingLaws.map(item => item.correspondingLawFirmsId)
      this.form.correspondingLawFirmsIds = val ? dictIdArr : []
      this.isIndeterminateFour = false
    },
    handleCheckedOne (value) {
      let checkedCount = value.length
      this.form.checkAllOne = checkedCount === this.businessTypesArr.length
      this.isIndeterminateOne = checkedCount > 0 && checkedCount < this.businessTypesArr.length
    },
    handleCheckedTwo (value) {
      let checkedCount = value.length
      this.form.checkAllTwo = checkedCount === this.relatedSourcesArr.length
      this.isIndeterminateTwo = checkedCount > 0 && checkedCount < this.relatedSourcesArr.length
    },

    handleCheckedThree (value) {
      let checkedCount = value.length
      this.form.checkAllThree = checkedCount === this.applicableProjectsArr.length
      this.isIndeterminateThree = checkedCount > 0 && checkedCount < this.applicableProjectsArr.length
    },

    handleCheckedFour (value) {
      let checkedCount = value.length
      this.form.checkAllFour = checkedCount === this.correspondingLawsArr.length
      this.isIndeterminateFour = checkedCount > 0 && checkedCount < this.correspondingLawsArr.length
    },
    // 确定保存函数
    onSave (form) {
      this.form.pageIndex = this.clickPosition === 'btn' ? 1 : this.parameter.pageIndex
      this.form.pageSize = this.parameter.pageSize
      this.$emit('onLoading')
      if (this.flag === '01') {
        this.$emit('advancedUpData', form) // 保存提交值
        form.keyWords = form.keyWords.trim() // 关键词、文件名称、问题点、解决方式添加trim()
        form.fileNames = form.fileNames.trim()
        form.solutions = form.solutions.trim()
        form.problemPoints = form.problemPoints.trim()
        this.$LoadingShow()
        knowledgeBaseApi.knowledgeBaseList.advancedSearch(form).then(res => {
          this.$LoadingClose()
          this.$emit('advSearchData', res)
          this.resDestroy()
          this.dialogVisible = false
        })
      } else {
        this.$emit('advSearchData', this.form)
        this.resDestroy()
        this.dialogVisible = false
      }
    },
    // 产品类型拉数据
    getBusinessTypes () {
      // this.$store.dispatch('GetDictionary', { sys: null, dictTypeCode: 'BUSINESS_TYPE' }).then(res => { // 原代码（使用时取消注销）
      this.$store.dispatch('GetDictionary', { sys: null, dictTypeCode: 'ZD0087' }).then(res => { // 临时使用修改字典值代码
        this.businessTypesArr = res.map(item => {
          return {
            dictName: item.dictName,
            dictId: item.dictId
          }
        })
        this.form.businessTypes = res.map(val => val.dictId)
        oldBusinessTypes = JSON.parse(JSON.stringify(this.businessTypesArr))
      })
    },
    // 素材来源拉数据
    getRelatedSources () {
      this.$store.dispatch('GetDictionary', { sys: null, dictTypeCode: 'MATERIAL_SOURCE' }).then(res => {
        this.relatedSourcesArr = res.map(item => {
          return {
            dictName: item.dictName,
            dictId: item.dictId
          }
        })
        this.form.relatedSources = res.map(val => val.dictId)
        oldrelatedSources = JSON.parse(JSON.stringify(this.relatedSourcesArr))
      })
    },
    // 适用产品拉数据
    getApplicableProject () {
      knowledgeBaseApi.knowledgeBaseList.getApplicableProjects().then(res => {
        this.applicableProjectsArr = res.data
        this.form.applicableProjectIds = res.data.map(val => val.applicableProjectId)
        oldApplicableProjects = JSON.parse(JSON.stringify(this.applicableProjectsArr))
      })
    },
    // 对应律所拉数据
    getCorrespondingLaw () {
      knowledgeBaseApi.knowledgeBaseList.getCorrespondingLawFirmss().then(res => {
        this.correspondingLawsArr = res.data
        this.form.correspondingLawFirmsIds = res.data.map(val => val.correspondingLawFirmsId)
        oldCorrespondingLaws = JSON.parse(JSON.stringify(this.correspondingLawsArr))
      })
    },
    // 清空数据
    resDestroy () {
      this.form.checkAllOne = true
      this.form.checkAllTwo = true
      this.form.checkAllThree = true
      this.form.checkAllFour = true
      this.form.keyWords = ''
      this.form.fileNames = ''
      this.form.problemPoints = ''
      this.form.solutions = ''
      // this.form.businessTypes = []
      // this.form.relatedSources = []
      // this.form.applicableProjectIds = []
      // this.form.correspondingLawFirmsIds = []
    }
  },
  computed: {
    // api接口
    api () {
      return knowledgeBaseApi.knowledgeBaseList
    },
    dialogVisible: {
      get: function () {
        return this.visible
      },
      set: function (value) {
        this.$emit('update:visible', value)
      }
    }
  }
}
</script>