<template>
  <el-card style="text-align: center;" v-if="isAdmin" @click="this.seeDialog=true">
    点我修改轮播图
  </el-card>
  <el-dialog v-model="seeDialog">
    <div>请慎重上传！上传到服务器后会直接覆盖原有信息！</div>
    <div>
      <el-input v-model="input[0]" placeholder="请输入课程名" style="margin: 10px;left: -10px;"></el-input>
      <el-input v-model="input[1]" placeholder="请输入课程名" style="margin: 10px;left: -10px;"></el-input>
      <el-input v-model="input[2]" placeholder="请输入课程名" style="margin: 10px;left: -10px;"></el-input>
    </div>
    <el-button style="margin: 10px;" size="small" type="success" @click="updatePictures" >上传到服务器</el-button>
  </el-dialog>
</template>

<script>
import {ElMessage} from "element-plus";

export default {
  name: "PhotoChange",
  data() {
    return {
      fileList: [],
      seeDialog: false,
      input: ["","",""],
    };
  },
  computed:{
    isAdmin(){
      return this.$store.state.user.role==="ADMIN";
    },
  },
  methods: {
    handleExceed(files, fileList) {
      ElMessage.error("最多展示3个文件！");
    },
    async updatePictures() {
      const message=await this.$apis.uploadCarouselChart(this.input);
      if (message.data.code===-1){
        ElMessage.error("课程不存在！");
      }else if (message.data.data===true){
        ElMessage.success("上传成功！");
      }else {
        ElMessage.error("上传失败！后端报错");
      }
      this.seeDialog=false;
      this.input=["","",""];
    },
    handleChange(file, fileList) {
      this.fileList = fileList;
    }
  }
};
</script>

<style scoped>

</style>