fix: fortune type
This commit is contained in:
119
src/components/BatchImageAdd/index.vue
Normal file
119
src/components/BatchImageAdd/index.vue
Normal file
@@ -0,0 +1,119 @@
|
|||||||
|
<template>
|
||||||
|
<el-dialog title="批量添加" :visible.sync="dialogVisible" width="600px" @close="close">
|
||||||
|
<el-form ref="form" label-width="80px">
|
||||||
|
<el-form-item label="图片上传">
|
||||||
|
<el-upload
|
||||||
|
ref="upload"
|
||||||
|
accept="image/*"
|
||||||
|
:action="uploadUrl"
|
||||||
|
:file-list="fileList"
|
||||||
|
:headers="uploadHeaders"
|
||||||
|
list-type="picture-card"
|
||||||
|
:multiple="true"
|
||||||
|
:on-preview="handlePreview"
|
||||||
|
:on-remove="handleRemove"
|
||||||
|
:on-success="handleSuccess"
|
||||||
|
>
|
||||||
|
<i class="el-icon-plus"></i>
|
||||||
|
</el-upload>
|
||||||
|
<el-dialog append-to-body :visible.sync="previewVisible">
|
||||||
|
<img alt="" :src="previewImageUrl" width="100%" />
|
||||||
|
</el-dialog>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="是否启用">
|
||||||
|
<el-switch v-model="isEnabled" active-text="启用" :active-value="true" inactive-text="禁用" :inactive-value="false" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="close">取 消</el-button>
|
||||||
|
<el-button :loading="loading" type="primary" @click="save">确 定</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { getAccessToken } from '@/utils/accessToken'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'BatchImageAdd',
|
||||||
|
props: {
|
||||||
|
doAdd: {
|
||||||
|
type: Function,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
dialogVisible: false,
|
||||||
|
isEnabled: true,
|
||||||
|
loading: false,
|
||||||
|
fileList: [],
|
||||||
|
previewVisible: false,
|
||||||
|
previewImageUrl: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
uploadUrl() {
|
||||||
|
return `${process.env.VUE_APP_API_BASE_URL}/management/api/common/upload`
|
||||||
|
},
|
||||||
|
uploadHeaders() {
|
||||||
|
return {
|
||||||
|
Authorization: getAccessToken() || '',
|
||||||
|
'x-user-id': this.$store.state.user.userId || '',
|
||||||
|
'x-app-id': this.$store.state.user.appId || '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
show() {
|
||||||
|
this.dialogVisible = true
|
||||||
|
this.fileList = []
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.isEnabled = true
|
||||||
|
this.loading = false
|
||||||
|
this.fileList = []
|
||||||
|
this.dialogVisible = false
|
||||||
|
},
|
||||||
|
handleSuccess(response, file, fileList) {
|
||||||
|
if (response.code !== 200) {
|
||||||
|
this.$baseMessage(response.msg || '上传失败', 'error')
|
||||||
|
}
|
||||||
|
this.fileList = fileList
|
||||||
|
},
|
||||||
|
handleRemove(file, fileList) {
|
||||||
|
this.fileList = fileList
|
||||||
|
},
|
||||||
|
handlePreview(file) {
|
||||||
|
this.previewImageUrl = file.url || file.thumbUrl
|
||||||
|
this.previewVisible = true
|
||||||
|
},
|
||||||
|
async save() {
|
||||||
|
const urls = this.fileList
|
||||||
|
.filter((f) => f.status === 'success' && f.response && f.response.code === 200)
|
||||||
|
.map((f) => f.response.data)
|
||||||
|
|
||||||
|
if (urls.length === 0) {
|
||||||
|
this.$baseMessage('请至少上传一张图片', 'warning')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
this.loading = true
|
||||||
|
try {
|
||||||
|
let successCount = 0
|
||||||
|
for (const url of urls) {
|
||||||
|
await this.doAdd({ imageUrl: url, isEnabled: this.isEnabled })
|
||||||
|
successCount++
|
||||||
|
}
|
||||||
|
this.$baseMessage(`成功添加 ${successCount} 条数据`, 'success')
|
||||||
|
this.$emit('fetch-data')
|
||||||
|
this.close()
|
||||||
|
} catch (error) {
|
||||||
|
this.$baseMessage('部分或全部添加失败', 'error')
|
||||||
|
} finally {
|
||||||
|
this.loading = false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
@@ -3,6 +3,7 @@
|
|||||||
<vab-query-form>
|
<vab-query-form>
|
||||||
<vab-query-form-left-panel :span="12">
|
<vab-query-form-left-panel :span="12">
|
||||||
<el-button icon="el-icon-plus" type="primary" @click="handleEdit">添加</el-button>
|
<el-button icon="el-icon-plus" type="primary" @click="handleEdit">添加</el-button>
|
||||||
|
<el-button icon="el-icon-plus" type="primary" @click="handleBatchAdd">批量添加</el-button>
|
||||||
</vab-query-form-left-panel>
|
</vab-query-form-left-panel>
|
||||||
<vab-query-form-right-panel :span="12">
|
<vab-query-form-right-panel :span="12">
|
||||||
<el-form :inline="true" :model="queryForm" @submit.native.prevent>
|
<el-form :inline="true" :model="queryForm" @submit.native.prevent>
|
||||||
@@ -54,16 +55,18 @@
|
|||||||
@size-change="handleSizeChange"
|
@size-change="handleSizeChange"
|
||||||
/>
|
/>
|
||||||
<edit ref="edit" @fetch-data="fetchData" />
|
<edit ref="edit" @fetch-data="fetchData" />
|
||||||
|
<batch-image-add ref="batchAdd" :do-add="doAddBatch" @fetch-data="fetchData" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { doDelete, getList, toggleEnable, doMoveUp, doMoveDown } from '@/api/spring/avatar/decor'
|
import { doDelete, getList, toggleEnable, doMoveUp, doMoveDown } from '@/api/spring/avatar/decor'
|
||||||
import Edit from './components/AppManagementEdit'
|
import Edit from './components/AppManagementEdit'
|
||||||
|
import BatchImageAdd from '@/components/BatchImageAdd'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'AvatarDecor',
|
name: 'AvatarDecor',
|
||||||
components: { Edit },
|
components: { Edit, BatchImageAdd },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
list: null,
|
list: null,
|
||||||
@@ -98,6 +101,15 @@
|
|||||||
this.$refs['edit'].showEdit()
|
this.$refs['edit'].showEdit()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
handleBatchAdd() {
|
||||||
|
this.$refs['batchAdd'].show()
|
||||||
|
},
|
||||||
|
async doAddBatch(fileList) {
|
||||||
|
console.log(11111, fileList)
|
||||||
|
// const { msg } = await this.$refs['batchAdd'].doAdd(fileList)
|
||||||
|
// this.$baseMessage(msg, 'success')
|
||||||
|
// this.fetchData()
|
||||||
|
},
|
||||||
handleDelete(row) {
|
handleDelete(row) {
|
||||||
if (row.id) {
|
if (row.id) {
|
||||||
this.$baseConfirm('你确定要删除当前项吗', null, async () => {
|
this.$baseConfirm('你确定要删除当前项吗', null, async () => {
|
||||||
|
|||||||
@@ -3,6 +3,7 @@
|
|||||||
<vab-query-form>
|
<vab-query-form>
|
||||||
<vab-query-form-left-panel :span="12">
|
<vab-query-form-left-panel :span="12">
|
||||||
<el-button icon="el-icon-plus" type="primary" @click="handleEdit">添加</el-button>
|
<el-button icon="el-icon-plus" type="primary" @click="handleEdit">添加</el-button>
|
||||||
|
<el-button icon="el-icon-plus" type="primary" @click="handleBatchAdd">批量添加</el-button>
|
||||||
</vab-query-form-left-panel>
|
</vab-query-form-left-panel>
|
||||||
<vab-query-form-right-panel :span="12">
|
<vab-query-form-right-panel :span="12">
|
||||||
<el-form :inline="true" :model="queryForm" @submit.native.prevent>
|
<el-form :inline="true" :model="queryForm" @submit.native.prevent>
|
||||||
@@ -54,18 +55,21 @@
|
|||||||
@size-change="handleSizeChange"
|
@size-change="handleSizeChange"
|
||||||
/>
|
/>
|
||||||
<edit ref="edit" @fetch-data="fetchData" />
|
<edit ref="edit" @fetch-data="fetchData" />
|
||||||
|
<batch-image-add ref="batchAdd" :do-add="doAdd" @fetch-data="fetchData" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { doDelete, getList, toggleEnable, doMoveUp, doMoveDown } from '@/api/spring/avatar/frame'
|
import { doDelete, getList, toggleEnable, doMoveUp, doMoveDown, doAdd } from '@/api/spring/avatar/frame'
|
||||||
import Edit from './components/AppManagementEdit'
|
import Edit from './components/AppManagementEdit'
|
||||||
|
import BatchImageAdd from '@/components/BatchImageAdd'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'AvatarFrame',
|
name: 'AvatarFrame',
|
||||||
components: { Edit },
|
components: { Edit, BatchImageAdd },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
doAdd: doAdd,
|
||||||
list: null,
|
list: null,
|
||||||
listLoading: true,
|
listLoading: true,
|
||||||
layout: 'total, sizes, prev, pager, next, jumper',
|
layout: 'total, sizes, prev, pager, next, jumper',
|
||||||
@@ -98,6 +102,9 @@
|
|||||||
this.$refs['edit'].showEdit()
|
this.$refs['edit'].showEdit()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
handleBatchAdd() {
|
||||||
|
this.$refs['batchAdd'].show()
|
||||||
|
},
|
||||||
handleDelete(row) {
|
handleDelete(row) {
|
||||||
if (row.id) {
|
if (row.id) {
|
||||||
this.$baseConfirm('你确定要删除当前项吗', null, async () => {
|
this.$baseConfirm('你确定要删除当前项吗', null, async () => {
|
||||||
|
|||||||
@@ -3,6 +3,7 @@
|
|||||||
<vab-query-form>
|
<vab-query-form>
|
||||||
<vab-query-form-left-panel :span="12">
|
<vab-query-form-left-panel :span="12">
|
||||||
<el-button icon="el-icon-plus" type="primary" @click="handleEdit">添加</el-button>
|
<el-button icon="el-icon-plus" type="primary" @click="handleEdit">添加</el-button>
|
||||||
|
<el-button icon="el-icon-plus" type="primary" @click="handleBatchAdd">批量添加</el-button>
|
||||||
</vab-query-form-left-panel>
|
</vab-query-form-left-panel>
|
||||||
<vab-query-form-right-panel :span="12">
|
<vab-query-form-right-panel :span="12">
|
||||||
<el-form :inline="true" :model="queryForm" @submit.native.prevent>
|
<el-form :inline="true" :model="queryForm" @submit.native.prevent>
|
||||||
@@ -54,18 +55,21 @@
|
|||||||
@size-change="handleSizeChange"
|
@size-change="handleSizeChange"
|
||||||
/>
|
/>
|
||||||
<edit ref="edit" @fetch-data="fetchData" />
|
<edit ref="edit" @fetch-data="fetchData" />
|
||||||
|
<batch-image-add ref="batchAdd" :do-add="doAdd" @fetch-data="fetchData" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { doDelete, getList, toggleEnable, doMoveUp, doMoveDown } from '@/api/spring/avatar'
|
import { doDelete, getList, toggleEnable, doMoveUp, doMoveDown, doAdd } from '@/api/spring/avatar'
|
||||||
import Edit from './components/AppManagementEdit'
|
import Edit from './components/AppManagementEdit'
|
||||||
|
import BatchImageAdd from '@/components/BatchImageAdd'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'SystemAvatar',
|
name: 'SystemAvatar',
|
||||||
components: { Edit },
|
components: { Edit, BatchImageAdd },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
doAdd: doAdd,
|
||||||
list: null,
|
list: null,
|
||||||
listLoading: true,
|
listLoading: true,
|
||||||
layout: 'total, sizes, prev, pager, next, jumper',
|
layout: 'total, sizes, prev, pager, next, jumper',
|
||||||
@@ -98,6 +102,9 @@
|
|||||||
this.$refs['edit'].showEdit()
|
this.$refs['edit'].showEdit()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
handleBatchAdd() {
|
||||||
|
this.$refs['batchAdd'].show()
|
||||||
|
},
|
||||||
handleDelete(row) {
|
handleDelete(row) {
|
||||||
if (row.id) {
|
if (row.id) {
|
||||||
this.$baseConfirm('你确定要删除当前项吗', null, async () => {
|
this.$baseConfirm('你确定要删除当前项吗', null, async () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user