<!--
  @description: 反馈管理---反馈人---新增/编辑反馈
  @Modifier: zcy/张慢慢
  @routerPath: complaintsSuggestions/complaintsSuggestions-add
  @date: 2021-11-18 15:02
-->
<template>
  <div class="p0-16">
    <section class="title title_border">
      <i class="iconfont icon-fanhui pointer" @click="back()" />
      {{ title }}
    </section>
    <div>
      <el-form ref="formData" :model="formData" :rules="rules" :inline-message="true">
        <p class="page-title">
          反馈信息
        </p>
        <table class="from_table">
          <tr>
            <td>
              <el-form-item label="反馈类型" prop="complaintsType" />
            </td>
            <td>
              <el-form-item>
                <el-radio-group v-model="formData.complaintsType" @change="complaintsTypeChange">
                  <el-radio v-for="(item,index) in complaintsTypeList" :key="index" :label="item.typecode">
                    {{ item.typename }}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
            </td>
            <td>
              <!-- complaintsType 02其他不展示 -->
              <el-form-item v-if="formData.complaintsType === '01' || formData.complaintsType === '00'" :label="formData.complaintsType === '00' ? '采购单编号' : formData.complaintsType === '01' ? '订单编号' : ''" prop="complaintsNo" />
            </td>
            <td>
              <el-form-item v-if="formData.complaintsType === '01' || formData.complaintsType === '00'">
                <gx-input
                  v-model="formData.complaintsNo"
                  show-word-limit
                  gx-maxlength="varchar50"
                  style="width: calc(100% - 156px );"
                  :disabled="true"
                />
                <el-button type="primary" @click="selectPro(formData.complaintsType)">
                  选择
                </el-button>
                <el-button plain @click="formData.complaintsNo = ''">
                  清空
                </el-button>
              </el-form-item>
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="反馈方名称" prop="departName" />
            </td>
            <td>
              <el-form-item>
                <el-input v-model.trim="formData.departName" disabled />
              </el-form-item>
            </td>
            <td>
              <el-form-item label="法定代表人" prop="corporation" />
            </td>
            <td>
              <el-input
                v-model.trim="formData.corporation"
                disabled
              />
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="地址" prop="address" />
            </td>
            <td>
              <el-input
                v-model.trim="formData.address"
                disabled
              />
            </td>
            <td>
              <el-form-item label="法定代表人邮箱" prop="corporateMail" />
            </td>
            <td>
              <el-input
                v-model.trim="formData.corporateMail"
                disabled
              />
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="联系人" prop="replyUserName" />
            </td>
            <td>
              <el-form-item>
                <el-input
                  v-model.trim="formData.replyUserName"
                />
              </el-form-item>
            </td>
            <td>
              <el-form-item label="联系电话" prop="replyPhone" />
            </td>
            <td>
              <el-form-item>
                <gx-input
                  v-model.trim="formData.replyPhone"
                />
              </el-form-item>
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="反馈主要内容" prop="replyContents" />
            </td>
            <td colspan="3">
              <el-form-item>
                <el-input v-model="formData.replyContents" type="textarea" />
              </el-form-item>
            </td>
          </tr>
          <tr>
            <td>
              <el-form-item label="相关证明材料" prop="file" />
            </td>
            <td colspan="3">
              <upload
                ref="upload"
                :on-change="replyFile"
                :data="fileData"
                :auto-delete="true"
                :auto-upload="true"
                :file-size="200"
                title=""
                accept=".pdf"
                tip-text="上传附件格式（.pdf）单个文件不得超过200M"
                file-ref="fileRef"
              />
            </td>
          </tr>
        </table>
      </el-form>
      <div class="but_footer">
        <div class="but_footer-h" />
        <div class="but_footer-but">
          <el-button :loading="confirmLoading" @click="saveForm('formData')">
            保存
          </el-button>
          <el-button :loading="confirmLoading" type="primary" @click="submitForm('formData')">
            提交
          </el-button>
        </div>
      </div>
    </div>
    <!-- 选择采购单、订单弹框 -->
    <dialogAdd :dialog="dialogVisible" :select-val="selectVal" @closeDialog="closeDialog" />
  </div>
</template>

<script>
/* 接口 */
import {
  getComplaintsDepartInfoVo, // 获取当前登陆人企业信息
  addComplaintsSuggestionsInfo, // 新增反馈信息
  queryComplaintsSuggestionsInfo, // 获取反馈信息详情
  updateComplaintsSuggestionsInfo // 修改反馈信息
} from '@/api/procurement/procurementProject'
/* 组件*/
import dialogAdd from './complaintsSuggestions-dialog' // 订单、采购单弹框
import upload from '@comp/common/updownload/upload' // 附件上传组件
/* 公共方法 */
import { characters1_auto, linkerName, phone } from '@/assets/js/validate'
import { randomData, filterDictText } from '@/assets/js/utils' // 常用方法
import { compaintsSuggestionsGroupMixins } from '../mixins/complaintsSuggestionsGroupMixins' // 公共字典
export default {
  name: 'ComplaintsSuggestionAdd',
  components: {
    upload, // 附件上传
    dialogAdd // 订单、采购单弹框
  },
  mixins: [compaintsSuggestionsGroupMixins],
  data() {
    return {
      title: '新增反馈', // 标题名称
      selectVal: '', // 选择的反馈类型
      dialogVisible: false,
      formData: {
        complaintsState: '', // 必填 00未回复(提交) 01已回复 02草稿
        complaintsType: '02', // 必填 00项目；01订单；02其他
        complaintsNo: '', // complaintsType为00项目；01订单时 必有值
        replyTitle: '', // 标题
        replyContents: '', // 反馈主要内容
        replyPhone: '', // 电话
        replyUserName: '', // 联系人
        tenderId: '', // 必填
        orderId: '', // complaintsType 为01则必有
        departName: '',
        corporation: '', // 法人代表
        address: '', // 地址
        corporateMail: '', // 邮箱
        replyId: '',
        file: '' // 相关证明材料
      },
      rules: {
        complaintsType: [{ required: true, validator: characters1_auto }], // 反馈类型
        complaintsNo: [{ required: true, validator: characters1_auto }],
        replyUserName: [{ required: true, validator: linkerName, trigger: 'blur' }], // 联系人
        replyPhone: [{ required: true, validator: phone, trigger: 'blur' }], // 联系电话
        replyContents: [{ required: true, validator: characters1_auto, trigger: 'blur' }],
        file: [{ required: true, message: '请上传', trigger: 'change' }] // 相关证明材料
      },
      confirmLoading: false
    }
  },
  watch: {
    // 'formData.complaintsType'(val) {
    //   // 反馈类型发生改变清空选中值
    //   this.formData.complaintsNo = '' // 编号
    //   this.formData.tenderId = '' // 采购单id
    //   this.formData.orderId = '' // 订单id
    // }
  },
  mounted() {
    this.init()
  },
  methods: {
    filterDictText,
    init() {
      // 判断是编辑还是新增
      if (this.$route.params.id) {
        this.title = '修改反馈'
        // 编辑
        this.getQueryComplaintsSuggestionsInfo(this.$route.params.id) // 获取详情信息
      } else {
        this.title = '新增反馈'
        // 新增
        this.formData.replyId = randomData() // 随机生成id
        this.fileData.bizId = this.formData.replyId // 赋值附件bizid
        this.getComplaintsDepartInfoVo() // 获取当前登陆人企业信息
      }
    },
    // 编辑获取详情数据
    getQueryComplaintsSuggestionsInfo(id) {
      queryComplaintsSuggestionsInfo(id).then(res => {
        this.formData = res.data[0]
        this.fileData.bizId = this.formData.id // 赋值附件bizid
      })
    },
    // 获取当前登陆人企业信息
    getComplaintsDepartInfoVo() {
      // 获取登录角色的企业信息
      getComplaintsDepartInfoVo().then(res => {
        this.formData.departName = res.data.departName // 反馈方名称
        this.formData.corporation = res.data.corporation // 法定代表人
        this.formData.address = res.data.address // 地址
        this.formData.corporateMail = res.data.corporateMail // 法人代表邮箱
      })
    },
    // 返回上一级
    back() {
      this.$router.push('/complaintsSuggestions/complaintsSuggestions-list')
    },
    // 点击选择 打开弹框
    selectPro(val) {
      this.dialogVisible = true
      this.selectVal = val
    },
    // 关闭弹框 并将所选择的值传回来
    closeDialog(val) {
      this.dialogVisible = val.dialog
      this.formData.complaintsNo = val.tenderNo
      // 判断是采购单还是订单 并拿到对应的值
      if (this.formData.complaintsType === '00') {
        this.formData.tenderId = val.tenderId
      } else {
        this.formData.tenderId = val.tenderId
        this.formData.orderId = val.tenderNo
      }
    },
    // 提交/修改
    submitForm(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.$confirm('确认提交?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            confirmButtonClass: 'confirmBtn',
            cancelButtonClass: 'cancelBtn',
            type: 'warning'
          }).then(() => {
            this.formData.complaintsState = '00'
            // 判断是新增还是修改 有id修改
            if (this.$route.params.id) {
              this.updateComplaintsSuggestionsInfo('01')
            } else {
              this.addComplaintsSuggestionsInfo('01')
            }
          })
        }
      })
    },
    // 保存
    saveForm() {
      this.formData.complaintsState = '02' // 保存状态 02代表草稿
      // 判断是新增还是修改 有id修改
      if (this.$route.params.id) {
        this.updateComplaintsSuggestionsInfo('00')
      } else {
        this.addComplaintsSuggestionsInfo('00')
      }
    },
    // 【提出人】保存反馈建议
    addComplaintsSuggestionsInfo(isOperation) {
      this.confirmLoading = true
      this.formData.isOperation = isOperation // 操作类型 00保存 01提交
      // 提交
      addComplaintsSuggestionsInfo(this.formData).then(res => {
        this.confirmLoading = false
        this.$message.success(`操作成功`)
        this.back() // 返回列表
      }).catch(() => {
        this.confirmLoading = false
      })
    },
    // 修改反馈建议
    updateComplaintsSuggestionsInfo(isOperation) {
      this.formData.isOperation = isOperation // 操作类型 00保存 01提交
      this.confirmLoading = true // 按钮加载中
      // 修改接口
      updateComplaintsSuggestionsInfo(this.formData).then(res => {
        this.confirmLoading = false
        this.$message.success(`操作成功`)
        this.back()// 返回列表
      }).catch(() => {
        this.confirmLoading = false
      })
    },
    // 反馈类型发生改变
    complaintsTypeChange() {
      // 反馈类型发生改变清空选中值
      this.formData.complaintsNo = '' // 编号
      this.formData.tenderId = '' // 采购单id
      this.formData.orderId = '' // 订单id
    },
    // 上传
    replyFile(file, fileList) {
      if (fileList.length > 0) {
        this.$set(this.formData, 'file', 'true')// 上传了
      } else {
        this.$set(this.formData, 'file', '')// 未上传
      }
    }
  }

}
</script>

<style scoped>
</style>
