form.vue 6.69 KB
<template>
  <el-dialog :close-on-click-modal="false" :title="isAdd?'新建招商方案':'编辑招商方案'" width="800px" top="5vh" :visible.sync="visible">
    <el-form ref="form" class="dialog-form" :model="form" :rules="rules" size="small" label-width="120px">
      <el-form-item label="创建者" prop="name">
        <el-input v-model="form.name" />
      </el-form-item>
      <el-form-item label="联系电话" prop="phone">
        <el-input v-model="form.phone" />
      </el-form-item>
    <!-- <el-form-item label="活动内容" prop="huodongnr">
        <el-input v-model="form.huodongnr"
      </el-form-item> -->
      <el-form-item label="方案名称" prop="huodongmc">
        <el-input v-model="form.huodongmc" />
      </el-form-item>
      <!-- <el-form-item label="活动场所" prop="huodongcs">
        <el-input v-model="form.huodongcs" />
      </el-form-item> -->
      <el-form-item label="计划招商时间" prop="onlineTime">
      <el-date-picker
             v-model="form.onlineTime"
            type="datetime"
             value-format="yyyy-MM-dd HH:mm:ss"
            placeholder="选择日期时间">
          </el-date-picker>

      </el-form-item>
<el-form-item label="提交时间" prop="tjTime">
  <el-date-picker
          v-model="form.tjTime"
         type="datetime"
          value-format="yyyy-MM-dd HH:mm:ss"
        placeholder="选择日期时间">
      </el-date-picker>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button  @click="doCancel" size="mini" style="color: #000;border: 1px solid #DCDFE6;background-color:#fff;">取消</el-button>
      <el-button  @click="doSubmit" size="mini" style="background-color: #3F9B6A;color: #fff">确认</el-button>
    </div>
  </el-dialog>
</template>

<script>
import LinkConfig from '@/components/adCoverConfig/linkConfig'
import { uploadUrl,token } from '@/utils/request'
import axios from 'axios'

import {
  add,
  edit
} from '../../../api/faglgl'
import {
  getCoupons
} from '@/api/public'
export default {
  name: 'AdForm',
  components: { LinkConfig },
  data () {
    return {
      visible: false,
      action: uploadUrl,
      myHeaders: {
        'Authorization-admin': token
      },
      form: {
        popupImg: '',
        name: '',
        closeImg: '',
        customerType: 1,
        triggerCondition: 1,
        huodongmc:'',
        jumpContent: '',
        jumpType: 0,
        status: 1,
        weight: 0,
        tjTime:0,
        onlineTime:0
      },
      rules: {
        // name: [
        //   { required: true, message: '发起人不能为空', trigger: 'blur' }
        // ],

        // phone: [
        //   { required: true, message: '联系电话不能为空', trigger: 'blur' }
        // ],
        // huodongcs: [
        //   { required: true, message: '活动场所不能为空', trigger: 'blur' }
        // ],
        // huodongmc: [
        //   { required: true, message: '活动名称不能为空', trigger: 'blur' }
        // ],
        // huodongnr: [
        //   { required: true, message: '活动内容不能为空', trigger: 'blur' }
        // ],
        // onlineTime: [
        //   { required: true, message: '计划招商时间不能为空', trigger: 'change' }
        // ],
        // jumpType: [
        //   { required: true, message: '跳转类型不能为空', trigger: 'change' }
        // ],
        // popupImg: [
        //   { required: true, message: '弹窗图片不能为空', trigger: 'none' }
        // ],
        // closeImg: [
        //   { required: true, message: '关闭按钮不能为空', trigger: 'none' }
        // ],
        // jumpContent: [
        //   { required: true, message: '链接配置不能为空', trigger: 'none' }
        // ],
        // triggerCondition: [
        //   { required: true, message: '触发条件不能为空', trigger: 'change' }
        // ],
        // applyGroup: [
        //   { required: true, message: '针对会员不能为空', trigger: 'change' }
        // ],
        // weight: [
        //   { required: true, message: '权重不能为空', trigger: 'blur' }
        // ]
      },
      isAdd: false,
      jumpContent: {},
      id:0
    }
  },
  methods: {
    // 图片上传回调
    handleAvatarSuccess (response, key) {
      const { url } = response.data
      this.form[key] = url
      console.log(this.form, 'urls')
      this.$forceUpdate()
    },
    // 打开弹出窗
    show (row) {

    console.log(row)
      this.isAdd = !row
      this.visible = true

      if (this.isAdd) {

        // this.form = {
        //   popupImg: '',
        //   name: '',
        //   closeImg: '',
        //   applyGroup: 1,
        //   triggerCondition: 1,
        //   jumpContent: '',
        //   jumpType: 0,
        //   status: 1,
        //   weight: 0,
        //   tjTime:0
        // }
        // this.jumpContent = {}
        // this.onlineTime = []
        this.$nextTick(function () {
          this.$refs.form.clearValidate();
        })
      } else {

  this.id = row.id
       this.form = {
         name: row.createUser,
         phone:  row.contactInformation,
         huodongmc:row.schemeName,
        onlineTime:row.investmentTime,
         tjTime:row.createTime
       }
      }
    },
    // 跳转类型切换
    jumpTypeChange () {
      this.jumpContent = {}
    },
    // 取消
    doCancel () {
      this.visible = false
    },
    // 提交
  async doSubmit () {
      if(this.isAdd){
      //   this.form={
      //   popupImg: '',
      //   name: '',
      //   closeImg: '',
      //   customerType: 1,
      //   triggerCondition: 1,
      //   huodongmc:'',
      //   jumpContent: '',
      //   jumpType: 0,
      //   status: 1,
      //   weight: 0,
      //   tjTime:0,
      //   onlineTime:0
      // }
         let res = await add({createUser: this.form.name, contactInformation:this.form.phone,schemeName:this.form.huodongmc,investmentTime:this.form.onlineTime,createTime:this.form.tjTime})
         console.log(res)
        this.visible = false
         this.isAdd = !this.isAdd
      }else{
         let res = await edit({id:this.id,createUser: this.form.name,contactInformation:this.form.phone,schemeName:this.form.huodongmc,investmentTime:this.form.onlineTime,createTime:this.form.tjTime})

       this.visible = false
      }
 this.$emit('childMessage', true);
    },
    // 获取优惠券信息
    getCoupons(ids) {
      var _this = this
      const params = {
        page: 1,
        pageSize: 999,
        ids
      }
      getCoupons(params).then(res => {
        console.log(this.form,res.data,'form')
        this.jumpContent.items = res.data.list
      })
    },
  }
}
</script>

<style scoped>
.radio-link-type .el-radio{
  padding: 5px 0;
}
.tips{
  font-size: 12px;
  color: #8c8c8c;
}
</style>