<template>
  <basic-container>
    <avue-crud v-bind="bindVal"
               v-on="onEvent"
               v-model="form"
               :permission="permissionList"
               :page.sync="page">
      <template slot="menuLeft">
        <el-button type="danger"
                   size="small"
                   icon="el-icon-delete"
                   v-if="permission.param_delete"
                   plain
                   @click="handleDelete">删 除
        </el-button>
      </template>
      <template slot="paramValueForm">
        <el-input placeholder="请输入内容" v-model="form.paramValue" class="input-with-select">
          <el-button slot="append" icon="el-icon-upload" @click="excelBox = true"></el-button>
        </el-input>
      </template>
    </avue-crud>
    <el-dialog
        title="附件上传"
        append-to-body
        :visible.sync="excelBox"
        width="555px"
        :close-on-click-modal="false"
        v-dialog-drag
    >
      <el-upload
          class="upload-demo"
          drag
          style="text-align: center"
          ref="upload"
          :action="action"
          :headers="headers"
          :on-success="onSuccess"
          :show-file-list="false"
          multiple
      >
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
        <div class="el-upload__tip" slot="tip">
          如上传文件过大，请耐心等待上传成功
        </div>
      </el-upload>
    </el-dialog>
  </basic-container>
</template>

<script>

import {getToken} from "@/util/auth";

export default window.$crudCommon({
  data() {
    return {
      excelBox:false,
      action: "/api/blade-resource/oss/endpoint/put-file",
      headers: { "Blade-Auth": "Bearer " + getToken() },
    }
  },
  computed: {
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission.param_add, false),
        viewBtn: this.vaildData(this.permission.param_view, false),
        delBtn: this.vaildData(this.permission.param_delete, false),
        editBtn: this.vaildData(this.permission.param_edit, false)
      };
    },
  },
  methods: {
    //修改上传成功
    onSuccess(response) {
      console.log(response)
      this.form.paramValue = response.data.link;
      this.excelBox = false;
      this.$message.success("上传成功！");
    }
  }
}, {
  //模块路径
  name: 'system/param',
})
</script>

<style>
</style>
