<!--跟进人管理页面-->
<template>
  <div>
    <dialog-edit
      :visible.sync="dialogVisible"
      :autoSave="false"
      :autoClose="false"
      :editModel="editModel"
      :form="{}"
      @onSaved="onSaved"
      :title="$t('coordManageMain.traceManage')">
      <div v-if="editModel==='C'">
        <search-form :componentList="componentList"
                    :formValue.sync="queryParas"
                    @clearParam="clearParam"
                    :isShowFoldBtn="false"
                    @handleFilter="handleFilter"></search-form>
        <data-table :columns="columns"
                    :showPage="true"
                    :api="allTraceApi"
                    loadPage="getDefault"
                    :loadCount.sync="loadCount"
                    :showSelection="true"
                    :sourceData="sourceData"
                    :queryParas="queryParas"
                    @getTableData="getTableData"
                    @selectRowChange="selectRowChange"
                    max-height="450"
                    ref="dataTable">
          <template slot="busyLevel" slot-scope="scope">
            <el-radio-group v-model="scope.data.row.busyLevel">
                <el-radio label="1">{{$t('coordManageMain.free')}}</el-radio>
                <el-radio label="2">{{$t('coordManageMain.normal')}}</el-radio>
                <el-radio label="3">{{$t('coordManageMain.busy')}}</el-radio>
            </el-radio-group>
          </template>
          <template slot="reviewFlag" slot-scope="scope">
            <el-radio-group v-model="scope.data.row.reviewFlag">
              <el-radio label="2">{{$t('common.yes')}}</el-radio>
              <el-radio label="1">{{$t('common.no')}}</el-radio>
            </el-radio-group>
          </template>
          <template slot="sendListFlag" slot-scope="scope">
            <el-radio-group v-model="scope.data.row.sendListFlag">
              <el-radio label="2">{{$t('common.yes')}}</el-radio>
              <el-radio label="1">{{$t('common.no')}}</el-radio>
            </el-radio-group>
          </template>
        </data-table>
      </div>
      <div v-if="editModel==='E'">
        <data-table :api="getTarceInfoApi"
                    :loadCount.sync="loadCount"
                    :columns="columns"
                    :showPage="false"
                    loadList="getDefaultInfo"
                    :queryParas="queryParas"
                    @getTableData="getTableData"
                    @handleFilter="handleFilter"
                    ref="dataTable">
          <template slot="busyLevel" slot-scope="scope">
            <el-radio-group v-model="scope.data.row.busyLevel" @change="change(scope.data.row)">
                <el-radio label="1">{{$t('coordManageMain.free')}}</el-radio>
                <el-radio label="2">{{$t('coordManageMain.normal')}}</el-radio>
                <el-radio label="3">{{$t('coordManageMain.busy')}}</el-radio>
            </el-radio-group>
          </template>
          <template slot="reviewFlag" slot-scope="scope">
            <el-radio-group v-model="scope.data.row.reviewFlag" @change="change(scope.data.row)">
              <el-radio label="2">{{$t('common.yes')}}</el-radio>
              <el-radio label="1">{{$t('common.no')}}</el-radio>
            </el-radio-group>
          </template>
          <template slot="sendListFlag" slot-scope="scope">
            <el-radio-group v-model="scope.data.row.sendListFlag" @change="change(scope.data.row)">
              <el-radio label="2">{{$t('common.yes')}}</el-radio>
              <el-radio label="1">{{$t('common.no')}}</el-radio>
            </el-radio-group>
          </template>
        </data-table>
      </div>
    </dialog-edit>
  </div>
</template>
<script>
import { DialogEdit, searchForm, DataTable, authButton } from 'newepoch-components'
import BasePage from '@/pages/baseEditPage'
import coordManageApi from '@/api/assetoutfeedback/coordManage/coordManageApi'
export default {
  name: 'traceUserSetupSub',
  extends: new BasePage(),
  components: {
    DialogEdit,
    searchForm,
    DataTable,
    authButton
  },
  props: {
    editModel: {
      type: [String],
      default () {
        return 'E'
      }
    },
    form: {
      type: [Object],
      default () {
        return {}
      }
    }
  },
  data () {
    return {
      selectedRows: [], // 选中行
      queryParas: {
        pageIndex: 1,
        pageSize: 10
      },
      loadCount: 0,
      componentList: [
        {
          // 产品
          label: this.$i18n.messages[this.$i18n.locale].coordManageMain.product,
          disabled: true,
          value: 'projectName',
          labelWidth: '130px',
          componentName: 'el-input'
        },
        {
          // 期数
          label: this.$i18n.messages[this.$i18n.locale].coordManageMain.periods,
          disabled: true,
          value: 'periods',
          labelWidth: '130px',
          componentName: 'el-input'
        },
        {
          // 姓名
          label: this.$i18n.messages[this.$i18n.locale].coordManageMain.name,
          disabled: false,
          value: 'nickName',
          labelWidth: '130px',
          maxlength: '13',
          placeholder: this.$i18n.messages[this.$i18n.locale].common.pleaseInput,
          componentName: 'el-input'
        }
      ],
      columns: [
        {
          // 姓名
          prop: 'traceUserName',
          align: 'left',
          width: '100px',
          label: this.$i18n.messages[this.$i18n.locale].coordManageMain.name
        },
        {
          // 闲忙程度
          prop: 'busyLevel',
          align: 'center',
          slot: true,
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].coordManageMain.busyLevel
        },
        {
          // 是否复核
          prop: 'reviewFlag',
          align: 'center',
          slot: true,
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].coordManageMain.reviewFlag
        },
        {
          // 是否发送抽查清单人员
          prop: 'sendListFlag',
          align: 'center',
          slot: true,
          width: '200px',
          label: this.$i18n.messages[this.$i18n.locale].coordManageMain.sendListFlag
        }
      ],
      saveForm: {},
      sourceData: [],
      radioForm: [],
      saveWarning: '至少选择一条数据进行保存'
    }
  },
  mounted () {
    this.queryParas = this.form
    if (this.editModel === 'C') {
      this.$nextTick(() => {
        this.handleFilter()
      })
    } else {
      this.$nextTick(() => {
        this.handleFilter()
      })
    }
  },
  methods: {
    handleFilter () {
      this.loadCount = this.loadCount + 1
    },
    clearParam () {
      this.queryParas.nickName = ''
    },
    selectRowChange (selectedRows) {
      this.selectedRows = selectedRows
    },
    getTableData (data) {
      if (this.editModel === 'E') {
        this.saveForm = data[0]
      } else {
        if (data.length > 0) {
          data.forEach(item => {
            this.$set(item, 'busyLevel', '1')
            this.$set(item, 'reviewFlag', '2')
            this.$set(item, 'sendListFlag', '2')
          })
        }
      }
    },
    change (data) {
      this.saveForm = data
    },
    // 提交保存
    onSaved (val) {
      if (this.editModel === 'C') {
        if (this.selectedRows.length === 0) {
          this.warning(this.saveWarning)
        } else {
          let subForm = {
            projectId: this.form.projectId,
            periods: this.form.periods,
            projectName: this.form.projectName
          }
          subForm = Object.assign(subForm, { traceRelationInfoDTOList: this.selectedRows })
          this.assetpkgmgrFullScreenLoading()
          this.updateTraceApi.defaultSave(subForm).then(res => {
            this.assetpkgmgrFullScreenLoading().close()
            if (res.success) {
              this.success(this.$i18n.messages[this.$i18n.locale].coordManageMain.traceUpdateSuccess)
              this.$emit('traceInfoUpdate', true)
              this.dialogVisible = false
            } else {
              this.error(this.$i18n.messages[this.$i18n.locale].coordManageMain.traceUpdateFail)
              this.$emit('traceInfoUpdate', true)
            }
          }).catch(res => this.assetpkgmgrFullScreenLoading().close())
        }
      } else {
        Object.assign(this.saveForm, this.form)
        this.assetpkgmgrFullScreenLoading()
        this.getTarceInfoApi.putDefaultUpdate(this.saveForm).then(res => {
          this.assetpkgmgrFullScreenLoading().close()
          if (res.success) {
            this.success(this.$i18n.messages[this.$i18n.locale].coordManageMain.traceUpdateSuccess)
            this.$emit('traceInfoUpdate', true)
            this.dialogVisible = false
          } else {
            this.error(this.$i18n.messages[this.$i18n.locale].coordManageMain.traceUpdateFail)
            this.$emit('traceInfoUpdate', true)
          }
        }).catch(res => this.assetpkgmgrFullScreenLoading().close())
      }
    }
  },
  computed: {
    getTarceInfoApi () {
      return coordManageApi.getTraceInfo
    },
    allTraceApi () {
      return coordManageApi.getAllTraceList
    },
    updateTraceApi () {
      return coordManageApi.updateTraceInfo
    }
  }
}
</script>
