playlet/project/src/components/dataBoard/adqAccount/addPitcher.vue

<template>
  <div v-loading="loading">
    <div class="dialogCon">
      <div class="itemBox">
        <div class="name"><em>*</em>短剧:</div>
        <self-channel title="" width="250px" type='dramaList' :afferent_value='drama_id' @channelDefine="(val)=>{drama_id = val;}"></self-channel>
      </div>
      <div class="itemBox">
        <div class="name"><em>*</em>选择投手:</div>
        <self-channel title="" width="250px" type='pitcher' :afferent_value='user_id' :afferent_params="{user_id:''}" @channelDefine="(val)=>{user_id = val;}"></self-channel>
      </div>
      <div class="itemBox">
        <div class="name"><em>*</em>起止时间:</div>
        <date-picker title="" width="250px" @changeTime="changeTime" :pickerOptions='{}' :afferent_time='time'></date-picker>
      </div>
      <div class="itemBox" style="margin-top:15px" v-if="editPitcher">
        <div class="name"><em>*</em>是否启用:</div>
        <el-switch v-model="enable" active-color="#43B083" inactive-color="#ccc"></el-switch>
      </div>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button size="mini" @click="$emit('returnAddPitcher')">取 消</el-button>
      <el-button size="mini" type="primary" @click="submitEvent">确 定</el-button>
    </div>
  </div>
</template>
<script>
import selfChannel from '@/components/assembly/screen/channel.vue'
import datePicker from '@/components/assembly/screen/datePicker.vue'
export default {
  props: ['gzhData', 'editPitcher'],
  components: {
    selfChannel,
    datePicker
  },
  data () {
    return {
      drama_id: '',
      user_id: '',
      time: [],
      loading: false,
      enable: true
    }
  },
  created () {
    if (this.editPitcher) {
      this.drama_id = this.editPitcher.drama_id ? this.editPitcher.drama_id : '';
      this.user_id = this.editPitcher.user_id ? this.editPitcher.user_id : '';
      this.time = this.editPitcher.start_date && this.editPitcher.end_date ? [this.editPitcher.start_date, this.editPitcher.end_date] : [];
      this.enable = this.editPitcher.enable == 1 ? true : false
    }
  },
  methods: {
    changeTime (time) {//筛选时间变化
      if (!time || time && time.length == 0) {
        this.time = []
      } else {
        this.time = time;
      }
    },
    async submitEvent () {
      if (this.drama_id == '') {
        this.$message({
          message: '请选择短剧',
          type: "warning"
        })
        return
      }
      if (this.user_id == '') {
        this.$message({
          message: '请选择投手',
          type: "warning"
        })
        return
      }
      if (!this.time || this.time == '' || this.time.length == 0) {
        this.$message({
          message: '请选择起止时间',
          type: "warning"
        })
        return
      }
      this.loading = true

      console.log('this.gzhData => ', JSON.parse(JSON.stringify(this.gzhData)))

      let axios_api = this.URL.adqAccount_adqBindPitcher
      let params = {
        drama_id: this.drama_id,
        user_id: this.user_id,
        start_date: this.time[0],
        end_date: this.time[1]
      }
      if (this.editPitcher && this.editPitcher.drama_id) {
        axios_api = this.URL.adqAccount_adqEditPitcher
        params.rela_id = this.editPitcher.rela_id
        params.enable = this.enable ? 1 : 0
      } else {
        params.account_id = this.gzhData.account_id
      }

      try {
        console.log('params => ', JSON.parse(JSON.stringify(params)))
        console.log('axios_api => ', axios_api)
        const { data: res = {} } = await this.$axios.post(this.URL.BASEURL + axios_api, params)
        this.loading = false
        if (res && res.errno == 0) {
          this.$message.success('操作成功')
          this.$emit('returnAddPitcher', 'update')
        } else if (res.errno != 4002) {
          this.$message.warning(res.err)
        }
      } catch (error) {
        console.log('error => ', error)
      } finally {
        this.loading = false
      }
    }
  }
}
</script>
<style lang="scss" scoped>
.dialogCon {
  .itemBox {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
    .name {
      width: 90px;
      flex-wrap: nowrap;
      em {
        color: red;
      }
    }
  }
}
.dialog-footer {
  text-align: center;
  margin-top: 30px;
}
</style>