pixel
5 years ago
10 changed files with 191 additions and 113 deletions
-
5QMPlusServer/controller/api/exa_fileUploadAndDownload.go
-
8QMPlusServer/controller/api/sys_user.go
-
2QMPlusServer/model/sysModel/sys_user.go
-
58QMPlusVuePage/src/components/HelloWorld.vue
-
1QMPlusVuePage/src/store/module/user.js
-
97QMPlusVuePage/src/view/example/excel/excel.vue
-
6QMPlusVuePage/src/view/example/upload/upload.vue
-
10QMPlusVuePage/src/view/login/regist.vue
-
8QMPlusVuePage/src/view/person/person.vue
-
109QMPlusVuePage/src/view/superAdmin/user/user.vue
@ -1,58 +0,0 @@ |
|||||
<template> |
|
||||
<div class="hello"> |
|
||||
<h1>{{ msg }}</h1> |
|
||||
<p> |
|
||||
For a guide and recipes on how to configure / customize this project,<br> |
|
||||
check out the |
|
||||
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>. |
|
||||
</p> |
|
||||
<h3>Installed CLI Plugins</h3> |
|
||||
<ul> |
|
||||
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li> |
|
||||
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li> |
|
||||
</ul> |
|
||||
<h3>Essential Links</h3> |
|
||||
<ul> |
|
||||
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li> |
|
||||
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li> |
|
||||
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li> |
|
||||
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li> |
|
||||
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li> |
|
||||
</ul> |
|
||||
<h3>Ecosystem</h3> |
|
||||
<ul> |
|
||||
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li> |
|
||||
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li> |
|
||||
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li> |
|
||||
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li> |
|
||||
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li> |
|
||||
</ul> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
export default { |
|
||||
name: 'HelloWorld', |
|
||||
props: { |
|
||||
msg: String |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
|
|
||||
<!-- Add "scoped" attribute to limit CSS to this component only --> |
|
||||
<style scoped> |
|
||||
h3 { |
|
||||
margin: 40px 0 0; |
|
||||
} |
|
||||
ul { |
|
||||
list-style-type: none; |
|
||||
padding: 0; |
|
||||
} |
|
||||
li { |
|
||||
display: inline-block; |
|
||||
margin: 0 10px; |
|
||||
} |
|
||||
a { |
|
||||
color: #42b983; |
|
||||
} |
|
||||
</style> |
|
@ -1,48 +1,69 @@ |
|||||
<template> |
<template> |
||||
<div> |
|
||||
<el-upload |
|
||||
class="upload-demo" |
|
||||
:headers="{'x-token':token}" |
|
||||
action="/api/fileUploadAndDownload/upload" |
|
||||
:on-preview="handlePreview" |
|
||||
:on-remove="handleRemove" |
|
||||
:before-remove="beforeRemove" |
|
||||
multiple |
|
||||
:limit="10" |
|
||||
:on-exceed="handleExceed" |
|
||||
:file-list="fileList"> |
|
||||
<el-button size="small" type="primary">点击上传</el-button> |
|
||||
<div slot="tip" class="el-upload__tip">未对文件格式及大小做校验</div> |
|
||||
</el-upload> |
|
||||
</el-upload> |
|
||||
</div> |
|
||||
|
<div> |
||||
|
<el-upload |
||||
|
:action="`${path}/fileUploadAndDownload/upload`" |
||||
|
:before-remove="beforeRemove" |
||||
|
:file-list="fileList" |
||||
|
:headers="{'x-token':token}" |
||||
|
:limit="10" |
||||
|
:on-exceed="handleExceed" |
||||
|
:on-preview="handlePreview" |
||||
|
:on-remove="handleRemove" |
||||
|
class="upload-demo" |
||||
|
multiple |
||||
|
> |
||||
|
<el-button size="small" type="primary">点击上传</el-button> |
||||
|
<div class="el-upload__tip" slot="tip">未对文件格式及大小做校验</div> |
||||
|
</el-upload> |
||||
|
</div> |
||||
</template> |
</template> |
||||
<script> |
<script> |
||||
import { mapGetters } from 'vuex' |
|
||||
|
import { mapGetters } from 'vuex' |
||||
|
const path = process.env.VUE_APP_BASE_API |
||||
export default { |
export default { |
||||
name:'Excel', |
|
||||
data() { |
|
||||
return { |
|
||||
fileList: [{name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}, {name: 'food2.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}] |
|
||||
}; |
|
||||
|
name: 'Excel', |
||||
|
data() { |
||||
|
return { |
||||
|
path: path, |
||||
|
|
||||
}, |
|
||||
computed: { |
|
||||
...mapGetters('user', ['userInfo', 'token']) |
|
||||
}, |
|
||||
methods: { |
|
||||
handleRemove(file, fileList) { |
|
||||
console.log(file, fileList); |
|
||||
}, |
|
||||
handlePreview(file) { |
|
||||
console.log(file); |
|
||||
}, |
|
||||
handleExceed(files, fileList) { |
|
||||
this.$message.warning(`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`); |
|
||||
|
fileList: [ |
||||
|
{ |
||||
|
name: 'food.jpeg', |
||||
|
url: |
||||
|
'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100' |
||||
}, |
}, |
||||
beforeRemove(file, fileList) { |
|
||||
return this.$confirm(`确定移除 ${ file.name }?`); |
|
||||
|
{ |
||||
|
name: 'food2.jpeg', |
||||
|
url: |
||||
|
'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100' |
||||
} |
} |
||||
|
] |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
...mapGetters('user', ['userInfo', 'token']) |
||||
|
}, |
||||
|
methods: { |
||||
|
handleRemove(file, fileList) { |
||||
|
this.$message.warning( |
||||
|
`共有 ${fileList.length} 个文件,移除了${file.name}` |
||||
|
) |
||||
|
}, |
||||
|
handlePreview(file) { |
||||
|
this.$message.warning(`${file.name}选择完成`) |
||||
|
}, |
||||
|
handleExceed(files, fileList) { |
||||
|
this.$message.warning( |
||||
|
`当前限制选择 3 个文件,本次选择了 ${ |
||||
|
files.length |
||||
|
} 个文件,共选择了 ${files.length + fileList.length} 个文件` |
||||
|
) |
||||
|
}, |
||||
|
beforeRemove(file, fileList) { |
||||
|
return this.$confirm( |
||||
|
`共有 ${fileList.length} 个文件,确定移除 ${file.name}?` |
||||
|
) |
||||
} |
} |
||||
|
} |
||||
} |
} |
||||
</script> |
</script> |
Write
Preview
Loading…
Cancel
Save
Reference in new issue