param.vue 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990
  1. <template>
  2. <basic-container>
  3. <avue-crud v-bind="bindVal"
  4. v-on="onEvent"
  5. v-model="form"
  6. :permission="permissionList"
  7. :page.sync="page">
  8. <template slot="menuLeft">
  9. <el-button type="danger"
  10. size="small"
  11. icon="el-icon-delete"
  12. v-if="permission.param_delete"
  13. plain
  14. @click="handleDelete">删 除
  15. </el-button>
  16. </template>
  17. <template slot="paramValueForm">
  18. <el-input placeholder="请输入内容" v-model="form.paramValue" class="input-with-select">
  19. <el-button slot="append" icon="el-icon-upload" @click="excelBox = true"></el-button>
  20. </el-input>
  21. </template>
  22. </avue-crud>
  23. <el-dialog
  24. title="附件上传"
  25. append-to-body
  26. :visible.sync="excelBox"
  27. width="555px"
  28. :close-on-click-modal="false"
  29. v-dialog-drag
  30. >
  31. <el-upload
  32. class="upload-demo"
  33. drag
  34. style="text-align: center"
  35. ref="upload"
  36. :action="action"
  37. :headers="headers"
  38. :on-success="onSuccess"
  39. :show-file-list="false"
  40. multiple
  41. >
  42. <i class="el-icon-upload"></i>
  43. <div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
  44. <div class="el-upload__tip" slot="tip">
  45. 如上传文件过大,请耐心等待上传成功
  46. </div>
  47. </el-upload>
  48. </el-dialog>
  49. </basic-container>
  50. </template>
  51. <script>
  52. import {getToken} from "@/util/auth";
  53. export default window.$crudCommon({
  54. data() {
  55. return {
  56. excelBox:false,
  57. action: "/api/blade-resource/oss/endpoint/put-file",
  58. headers: { "Blade-Auth": "Bearer " + getToken() },
  59. }
  60. },
  61. computed: {
  62. permissionList() {
  63. return {
  64. addBtn: this.vaildData(this.permission.param_add, false),
  65. viewBtn: this.vaildData(this.permission.param_view, false),
  66. delBtn: this.vaildData(this.permission.param_delete, false),
  67. editBtn: this.vaildData(this.permission.param_edit, false)
  68. };
  69. },
  70. },
  71. methods: {
  72. //修改上传成功
  73. onSuccess(response) {
  74. console.log(response)
  75. this.form.paramValue = response.data.link;
  76. this.excelBox = false;
  77. this.$message.success("上传成功!");
  78. }
  79. }
  80. }, {
  81. //模块路径
  82. name: 'system/param',
  83. })
  84. </script>
  85. <style>
  86. </style>