<template>
<div>
  <el-button type="warning" size="small" @click="btnClick()" v-if="type == 'save'">
    <img src="@/assets/set.png" alt="" style="margin-right:10px">
    保存
  </el-button>
  <el-button type="primary" size="small" @click="dialogVisible=true" v-else>
    <img src="@/assets/add.png" alt="">
    新建素材
  </el-button>
  <el-dialog
    title="新建素材"
    :visible.sync="dialogVisible"
    width="660px"
    :before-close="handleClose">
    <div class="content">
      <img src="@/assets/upload_icon/img.png" alt="" @click="add(1)">
      <img src="@/assets/upload_icon/video.png" alt="" @click="add(2)">
      <img src="@/assets/upload_icon/text-img.png" alt="" @click="add(3)">
    </div>
  </el-dialog>
</div>

</template>

<script>
export default {
  name: 'save',
  data() {
    return {
      dialogVisible:false
    };
  },
  props: {
    type: {
      default() {
        return ''
      }
    }
  },
  computed: {
  },
  watch: {
  },
  methods: {
    /* 新增并编辑素材 */
    async add(type) {
      let classid = '9999' + JSON.parse(window.sessionStorage.getItem("active_account")).userid;
      let res = await this.$api.requested({
        "classname": "webmanage.saletool.sharematerial.sharematerial",
        "method": "insertOrUpdate",
        "content": {
          "title": "",
          "sat_sharematerial_classid": classid,
          "notes": "",
          "tag": [],
          "canfiledownload": 1,
          "content": "",
          "sat_sharematerialid": 0,
          type
        }
      })
      if (res.msg != '成功') return this.$message.error(res.data);
      window.sessionStorage.setItem('newMaterial', JSON.stringify(res.data));
      this.$router.push({
        path: '/upload_archives',
        query: {
          id: res.data.sat_sharematerialid
        }
      });
    },
    btnClick(){
      this.$emit("btnClick")
    },
    handleClose() {
      this.dialogVisible = false
    }
  },
};
</script>

<style scoped>
* {
  box-sizing: border-box;
}
/deep/.el-dialog__body {
  padding: 50px 50px 70px 50px;
}
.el-dialog__body .content {
  display: flex;
  justify-content: space-between;
}
/deep/span {
  display: flex;
  align-items: center;
}
img{
  cursor: pointer;
}
</style>
