[北京|结业弟子]JS-李珅颖|2019年09月29日的日报-技能树.IT修真院

发表于： 2019-09-29 22:49:46

1 821

今天完成的事情：

1.今天添加了富文本，但是富文本编辑器出现了乱码，，然后就删掉了，准备换一个，接下来进行了列表的编辑功能添加，发现传值的话，要把值传到下一个页面，然后因为是同级的组件，要传值的话想到的是先把值给父级，再传给另一个子级，后来问了别人是怎么做的，说是用的vuex，准备明天试一下。

<template>
  <div id="edit">
    <p>新增Article</p>
    <div>
      <span class="span">标题名称</span>
      <input type="text" v-model="obj.title" />

      <span class="span">类型</span>
      <el-select v-model="type.value" placeholder="请选择">
        <el-option v-for="item in type" :key="item.value" :label="item.label" :value="item.value"></el-option>
      </el-select>
      <span class="span">跳转链接</span>
      <input type="text" v-model="obj.url" />
      <span class="span">富文本</span>
      <input type="text" v-model="obj.shuo" />
      <div>
        <span class="span">配图</span>
        <el-upload
          action="/api/a/u/img/{module}"
          list-type="picture-card"
          :on-success="handleAvatarSuccess"
          :on-remove="handleRemove"
          :before-remove="beforeRemove"
        >
          <i class="el-icon-plus"></i>
        </el-upload>
      </div>
      <div>
        <input type="button" value="立即上线" @click="addImg(2)" />
        <input type="button" value="存为草稿" @click="addImg(1)" />
        <router-link to="/hom/pass">
          <input type="button" value="取消" />
        </router-link>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "edit",
  props: {
    editID: "number"
  },
  data() {
    return {
      imageUrl: "",
      imgUrl: "",
      obj: {
        title: "",
        status: "",
        img: "this.dialogImageUrl",
        url: ""
      },
      type: [
        {
          value: "all",
          label: "全部"
        },
        {
          value: 0,
          label: "首页banner"
        },
        {
          value: 1,
          label: "找职位banner"
        },
        {
          value: 2,
          label: "找精英banner"
        },
        {
          value: 3,
          label: "行业大图"
        }
      ]
    };
  },
  //错误编辑
  created(editID) {
    this.axios.put(`a/u/article/${editID}`).then(res => {
      console.log(res);
      // this.obj=res.data.data.
    });
  },
  methods: {
    //错误编辑
    // addedit() {
    //   console.log(this.list.id);
    //   console.log(this.list.title);
    //   this.axios({
    //     url: "/a/u/article",
    //     method: "PUT",
    //     params: {
    //       id: this.list.id,
    //       // title:this.list.title,
    //       // status: this.list.status,
    //       // img:this.list.img,
    //       // content:this.list.content,
    //       // url:this.list.url,
    //     }
    //   }).then(res => {
    //     console.log(res);
    //   }).catch(err=>{
    //     console.log(err);
    //   });
    // },

    handleAvatarSuccess(res, file) {
      this.imageUrl = URL.createObjectURL(file.raw);
      this.imgUrl = res.data.url;
    },
    handleRemove(file, fileList) {},
    beforeRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`);
    },
    addImg(num) {
      const r = confirm("确定增加？");
      if (r) {
        this.axios({
          url: "a/u/article",
          method: "post",
          data:
            "title=" +
            this.obj.title +
            "&type=" +
            this.type.value +
            "&status=" +
            num +
            "&img=" +
            this.imgUrl +
            "&url=" +
            this.obj.url
        })
          .then(res => {
            this.$router.push("/hom/pass");
            // console.log(res);
          })
          .catch(err => {
            console.log(err);
          });
      }
    }
  }
};