tjshop/shop/static/manager/src.b/components/page/faq/EditFAQ.vue

<template>
  <el-form ref="form" :model="form" label-width="120px">
    <el-form-item label="问题">
      <el-input v-model="form.question" size="mini"></el-input>
    </el-form-item>
    <el-form-item label="答案">
      <el-input type="textarea" v-model="form.answer" :rows="3" size="mini"></el-input>
    </el-form-item>
    <el-form-item label="标签状态">
      <el-switch v-model="form.status" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="save" size="mini">保存</el-button>
      <el-button @click="goBack" size="mini">取消</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
export default {
  data() {
    return {
      form: {
        id: 0,
        question: "",
        answer: "",
        status: true
      }
    };
  },
  methods: {
    save: function() {
      var param = {
        id: this.form.id,
        question: this.form.question,
        answer: this.form.answer,
        status: this.form.status ? 1 : 0
      };
      var that = this;
      this.$http.saveFaq(param, this).then(res => {
        if (res.code === 0) {
          this.$message({
            message: "操作成功",
            type: "success",
            duration: 1000,
            onClose: function() {
              that.goBack();
            }
          });
        }
      });
    },
    goBack: function() {
      this.$router.back();
    }
  },
  mounted: function() {
    var id = this.$route.query.id;
    this.form.id = id;
    if (id === 0) {
      return;
    }

    this.$http.geFaq({ id: id }, this).then(res => {
      if (res.code === 0) {
        this.form.question = res.obj.question;
        this.form.answer = res.obj.answer;
        this.form.status = res.obj.status === 1;
      }
    });
  }
};
</script>
<style scoped>
.el-form-item {
  margin-bottom: 0px;
}
</style>