<template>
  <el-dialog :title="(modelType == 'add' ? '添加' : '编辑') + '热词'" width="800px" :visible.sync="dialogVisible">
    <el-form :model="form" :rules="rules" ref="TrendingTermListForm" label-width="100px">
      <el-form-item prop="title" label="热词标题:">
        <el-input placeholder="请输入热词标题" v-model="form.title"></el-input>
      </el-form-item>
    </el-form>

    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取消</el-button>
      <el-button type="primary" :loading="comfirmLoading" @click="handleConfirm">确定</el-button>
    </span>
  </el-dialog>
</template>

<script>
import { addHotWord, editHotWord } from "@/api/trendingWordsList";
export default {
  name: "TrendingTermListFormModal",
  props: {
  },
  data() {
    return {
      form: {
        title: ''
      },
      modelType: 'add',
      dialogVisible: false,
      comfirmLoading: false,
      editId: '',
      platformName: '',
      rules: {
        title: [
          { required: true, message: "请输入热词标题", trigger: "blur" }
        ],
        platformName: [
          { required: true, message: "请输入平台名称", trigger: "blur" }
        ]
      }
    };
  },
  computed: {
  },
  watch: {
    dialogVisible(val) {
      if (!val) {
        this.form = {
          title: ''
        }
        this.modelType =  'add';
        this.comfirmLoading = false;
        this.editId = '';
        this.platformName = '';
      }
    }
  },
  methods: {
    show(rows, type) {
      this.dialogVisible = true;
      this.comfirmLoading = false;
      this.modelType = type;
      if (type == 'edit') {
        this.editId = rows.id;
        this.platformName = rows.platformName;
      }
      this.$nextTick(() => {
        this.form = type == 'edit' ? {
          title: rows.title
        } : {
          title: ''
        }
        this.$refs.TrendingTermListForm.resetFields()
      })
    },
    handleConfirm() {
      this.$refs.TrendingTermListForm.validate(valid => {
        if (valid) {
          this.comfirmLoading = true;
          const params = this.form;
          if (this.modelType == 'add') {
            addHotWord(params).then(res =>{
              this.dialogVisible = false;
              if(res.code == 200){
                this.$message.success(res.msg || "操作成功");
                this.$emit("confirm");
              }
            }).finally(()=>{
              this.comfirmLoading = false;
            })
          } else {
            params.id = this.editId;
            params.platformName = this.platformName;
            editHotWord(params).then(res =>{
              this.dialogVisible = false;
              if(res.code == 200){
                this.$message.success(res.msg || "操作成功");
                this.$emit("confirm");
              }
            }).finally(()=>{
              this.comfirmLoading = false;
            })
          }
          
        } else {
          return false;
        }
      });
    }
  }
};
</script>
<style lang="scss">
</style>


