2024-09-18

src/HManagement/clueManage/m_activity/modules/add.vue

@@ -7,9 +7,50 @@
       size="800px"
       direction="rtl"
       append-to-body
+      @close="onClose"
       :show-close="false">
       <div class="drawer__panel">
-        <customForm ref="form" formname="addForms"></customForm>
+        <el-form :model="form" :rules="rules" ref="form" label-width="100px" size="small">
+          <el-form-item label="活动名称" prop="name">
+            <el-input v-model="form.name" placeholder="请输入活动名称" clearable></el-input>
+          </el-form-item>
+          <el-form-item label="活动类型" prop="type">
+            <el-select v-model="form.type" placeholder="请选择类型" style="width:100%" clearable>
+              <el-option
+                v-for="item in campaigntypeList()"
+                :key="item.index"
+                :label="item.value"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="活动负责人" prop="director">
+            <selectLeader ref="leader" @selectLeader="selectLeader">
+              <el-input @focus="$refs.leader.dialogTableVisible=true" slot="input" type="text" size="small" v-model="form.director" placeholder="请选择活动负责人"></el-input>
+            </selectLeader>
+          </el-form-item>
+          <el-form-item label="地址" prop="address">
+            <el-input v-model="form.address" placeholder="请输入地址"></el-input>
+          </el-form-item>
+          <el-form-item label="开始日期" prop="begdate">
+            <el-date-picker
+              v-model="form.begdate"
+              type="date"
+              value-format="yyyy-MM-dd"
+              placeholder="选择日期"
+              style="width:100%">
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item label="结束日期" prop="enddate">
+            <el-date-picker
+              v-model="form.enddate"
+              type="date"
+              value-format="yyyy-MM-dd"
+              placeholder="选择日期"
+              style="width:100%">
+            </el-date-picker>
+          </el-form-item>
+        </el-form>
       </div>
       <div class="fixed__btn__panel">
         <el-button size="small" @click="drawer = false,$refs.form.resetFields()" class="normal-btn-width">取 消</el-button>
@@ -21,23 +62,85 @@
 
 <script>
 import selectLeader from './selectAgent/index'
-import customForm from '@/components/customForm/customForm'
 export default {
   inject:['campaigntypeList'],
-  components:{customForm},
+  components:{selectLeader},
   data () {
     return {
       drawer:false,
+      form:{
+        "sat_campaignid":0,
+        "name":"",
+        "director":"",
+        "address":"",
+        "type":"",
+        "begdate":"",
+        "enddate": ""
+      },
+      rules:{
+        name:[
+          { required: true, message: '请输入活动名称', trigger: 'blur' },
+        ],
+        type:[
+          { required: true, message: '请选择活动类型', trigger: 'change' }
+        ],
+        begdate: [
+          { required: true, message: '请选择开始日期', trigger: 'change' }
+        ],
+        enddate: [
+          { validator:this.validateEndDate, trigger: 'change' }
+        ],
+      },
+      options:[]
     }
   },
   methods:{
     onShow () {
       this.drawer = true
     },
+    selectLeader (data) {
+      console.log(data);
+      this.form.director = data.name
+    },
+    validateEndDate(rule, value, callback){
+      let start = (new Date(this.form.begdate)).getTime()
+      let end = (new Date(this.form.enddate)).getTime()
+      if (value === '' || !value) {
+        this.form.enddate = ''
+        callback();
+      } else if (end < start) {
+         callback(new Error('结束日期不能小于开始日期'))
+      } else {
+        callback();
+      }
+    },
     add () {
-      this.$refs.form.validateFields(()=>{
-        console.log(1)
-      })
+      this.$refs['form'].validate(async (valid) => {
+        if (!valid) return false
+        const res = await this.$api.requested({
+          "classname":"webmanage.saletool.orderclue.ordercluecampaign",
+          "method": "insertormodify_campaign",
+          "content": this.form
+        })
+        this.tool.showMessage(res,()=>{
+          this.drawer = false
+          this.$refs.form.resetFields()
+          this.$emit('onSuccess')
+          this.$store.dispatch('changeDetailDrawer',true)
+          this.$router.push({path:'/marketing_activityDetails',query:{tabIndex:1,id:res.data.sat_campaignid,rowindex:res.data.rowindex}})
+        })
+      });
+    },
+    onClose () {
+      this.form = {
+        "sat_campaignid":0,
+        "name":"",
+        "director":"",
+        "address":"",
+        "type":"",
+        "begdate":"",
+        "enddate": ""
+      }
     }
   }
 }