<template>
  <div class="PushMenu">
    <el-input
      placeholder="请输入密码"
      v-model="input"
      style="width: 220px"
      show-password
    ></el-input>
    <br />
    <br />
    <el-date-picker
      v-model="dt"
      value-format="yyyyMMdd"
      type="week"
      format="yyyy 第 WW 周"
      placeholder="选择周"
    >
    </el-date-picker>
    <br />
    <br />
    <el-upload
      class="upload-demo"
      drag
      :data="reqData"
      :action="baseURl + '/menu/upload'"
      :before-upload="beforeUpload"
      :on-success="onSuccess"
      :on-error="onError"
      multiple
    >
      <i class="el-icon-upload"></i>
      <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
      <div class="el-upload__tip" slot="tip">只能上传xlsx/xls文件</div>
    </el-upload>
  </div>
</template>

<script>
// @ is an alias to /src

import config from "../config/index.js";
import sha256 from "sha256";
export default {
  name: "PushMenu",
  data() {
    return {
      dt: "",
      input: "",
      baseURl: config.base.menuURL,
    };
  },
  mounted() {
    let dt = new Date();
    let y = dt.getFullYear(),
      m = dt.getMonth() + 1,
      d = dt.getDate();
    y > 9 ? "" : (y = "0" + y);
    m > 9 ? "" : (m = "0" + m);
    d > 9 ? "" : (d = "0" + d);
    this.dt = [y, m, d].join("");
    document.title = "上传菜单";
    this.input = localStorage.inputName || "";
  },
  computed: {
    reqData() {
      return {
        dt: this.dt,
        password: sha256(this.input),
      };
    },
  },
  methods: {
    beforeUpload(file) {
      if (
        file.type ===
          "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" ||
        file.type === "application/vnd.ms-excel"
      ) {
        return true;
      }
      this.$message.error("所选文件格式错误");
    },
    onSuccess() {
      localStorage.inputName = this.input || "";
    },
    onError(err) {
      let e = err.toString().split(": ")[1] || "{}";
      e = JSON.parse(e);
      this.$message.error(e.message || '请求失败');
    },
  },
  beforeUnmount: function () {
    localStorage.token = "";
  },
  components: {},
};
</script>

<style>
.PushMenu {
  min-height: 100%;
  padding: 5em 5%;
  box-sizing: border-box;
  background-color: #fff;
  text-align: center;
}
</style>
