createLog.vue

<template>
  <div class="app-container">
    <el-card>
      <div slot="header" class="card-title">{{$t('报表跟进')}}</div>
    <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
      <el-form-item :label="$t('报价单号')" prop="number" style="width: 46%;display: inline-block;">
        <label>{{form.number}}</label>
<!--        <el-input :value="form.number" disabled :placeholder="$t('请输入报价单号')" /> -->
      </el-form-item>
      <el-form-item :label="$t('跟进类型')" prop="type" style="width: 46%;display: inline-block;margin-left:8%">
        <el-radio v-model="form.type" label="2">{{$t('商务洽谈')}}</el-radio>
      </el-form-item>
      <el-form-item :label="$t('跟进时间')" prop="followUpTime" style="width: 46%;display: inline-block">
        <el-date-picker clearable v-model="form.followUpTime" value-format="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss" type="datetime" :placeholder="$t('选择跟进时间')" />
      </el-form-item>
      <el-form-item :label="$t('客户经理')" prop="followUpSalesmanId" style="width: 46%;display: inline-block;;margin-left:8%">
       <el-select v-model="form.followUpSalesmanId" :placeholder="$t('请选择跟进业务员')" clearable>
        <el-option v-for="item in creatorData"
                        :key="item.id" :label="item.nickname" :value="item.id"/>
        </el-select>
      </el-form-item>
      <el-form-item :label="$t('联系人')" prop="contacts" style="width: 46%;display: inline-block">
       <el-select v-model="form.contacts" :placeholder="$t('请选择联系人')" clearable>
          <el-option v-for="item in contactsData" :key="item.id" :label="item.name" :value="item.id"/>
          </el-select>
      </el-form-item>
      <el-form-item :label="$t('跟进方式')" prop="followUpMethod" style="width: 46%;display: inline-block;margin-left:8%">
        <dict-selector
          :type="DICT_TYPE.CUSTOMER_FOLLOW_METHOD"
          :placeholder="$t('请选择跟进方式')"
          v-model="form.followUpMethod"
          form-type="select"
          :clearable="true"
        />
      </el-form-item>
      <el-form-item :label="$t('客户反馈')" prop="customerFeedback">
        <el-input type="textarea" :rows="3" v-model="form.customerFeedback" :placeholder="$t('请输入客户反馈')" />
      </el-form-item>
      <el-form-item :label="$t('处理结果')" prop="processingResults">
        <el-input type="textarea" :rows="3" v-model="form.processingResults" :placeholder="$t('请输入处理结果')" />
      </el-form-item>
    </el-form>


    </el-card>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitForm">{{$t('确定')}}</el-button>
    </div>
  </div>
</template>

<script>
  import { createOfferLog } from "@/api/ecw/offerLog"
  import { userList } from "@/api/system/user"
  import { getCustomerContactsListByCustomer } from "@/api/ecw/customerContacts"
  import {DICT_TYPE} from  '@/utils/dict'
  import {getOffer} from '@/api/ecw/offer'
  import {getCustomerContactsSelect} from '@/api/ecw/customerContacts'
  export default {
    name: "OfferLog",
    components: {
    },
    data() {
      return {
        // 遮罩层
        loading: true,
        open: false,
        contactsData:[],
        creatorData:[],
        // 表单参数
        form: {
          type:'2',
          offerId:0,
          number:0,
        },
        relationId:0,
        // 表单校验
        rules: {
          type: [{ required: true, message: this.$t("请选择跟进类型"), trigger: "change" }],
          followUpTime: [{ required: true, message: this.$t("跟进时间不能为空"), trigger: "blur" }],
          followUpSalesmanId: [{ required: true, message: this.$t("客户经理不能为空"), trigger: "change" }],
          contacts: [{ required: true, message: this.$t("联系人不能为空"), trigger: "blur" }],
          followUpMethod: [{ required: true, message: this.$t("请选择跟进方式"), trigger: "change" }],
          customerFeedback: [{ required: true, message: this.$t("客户反馈不能为空"), trigger: "blur" }],
          processingResults: [{ required: true, message: this.$t("处理结果不能为空"), trigger: "blur" }],
        },
        list:[]
      };
    },
    created() {
      if(this.$route.query.offerId){
        this.form.offerId = this.$route.query.offerId
        this.getList();
        }
        if(this.$route.query.number){
          this.form.number = this.$route.query.number
        }
        userList('customer service').then(res =>this.creatorData = res.data)
    },
    methods: {
      getList() {
        let that = this
        // 执行查询
        getOffer(that.form.offerId).then(response => {
          that.list = response.data;
          that.getContactsData()
        })
      },
      getContactsData(){
        getCustomerContactsSelect({ids: [this.list.consigneeId, this.list.consignorId].join(',')}).then((res) => {
            if(res.data.list.length>0){
              this.contactsData.push({name:res.data.list[0].contactsName+'('+this.$t('发货人')+')',id:res.data.list[0].customerContactsId})
              this.contactsData.push({name:res.data.list[1].contactsName+'('+this.$t('收货人')+')',id:res.data.list[1].customerContactsId})
            }

        })
        // getCustomerContactsListByCustomer({customerId:this.relationId}).then(response => {
        //   this.contactsData = response.data
        // })
      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (!valid) {
            return;
          }
          // 添加的提交
          this.form.type = parseInt(this.form.type)
          this.form.followUpMethod = parseInt(this.form.followUpMethod)
          createOfferLog(this.form).then(response => {
            this.$modal.msgSuccess(this.$t("新增成功"));
            this.$store.dispatch('tagsView/delCurrentView')
          });
        });
      },
    }
  };
</script>

<style scoped>
  .dialog-footer{
    padding: 40px;
  }
</style>