提交 9d6680ad authored 作者: fit2cloud-chenyw's avatar fit2cloud-chenyw

feat: 插件管理v0.01

上级 0bda4eb0
import request from '@/utils/request'
const pathMap = {
queryPath: '/api/plugin/pluginGrid/'
}
export function pluginLists(page, size, data) {
return request({
url: pathMap.queryPath + page + '/' + size,
method: 'post',
data,
loading: true
})
}
<template>
<component
:is="mode"
v-bind="$attrs"
v-on="$listeners"
/>
</template>
<script>
import Axios from 'axios'
export default {
name: 'AsyncComponent',
inheritAttrs: true,
props: {
// 父组件提供请求地址
url: {
type: String,
default: ''
}
},
data() {
return {
resData: '',
mode: ''
}
},
watch: {
url: {
immediate: true,
async handler(val, oldVal) {
if (!this.url) return
// Cache 缓存 根据 url 参数
if (!window.SyncComponentCache) {
window.SyncComponentCache = {}
}
let res
if (!window.SyncComponentCache[this.url]) {
window.SyncComponentCache[this.url] = Axios.get(this.url)
res = await window.SyncComponentCache[this.url]
} else {
res = await window.SyncComponentCache[this.url]
}
const Fn = Function
this.mode = new Fn(`return ${res.data}`)()
}
}
},
methods: {
}
}
</script>
<template>
<layout-content v-loading="$store.getters.loadingMap[$store.getters.currentPath]">
<complex-table
:data="data"
:columns="columns"
:search-config="searchConfig"
:pagination-config="paginationConfig"
@search="search"
>
<template #toolbar>
<!-- <el-button @click="create">{{ $t('plugin.local_install') }}</el-button> -->
<el-upload
:action="baseUrl+'api/plugin/upload'"
:multiple="false"
:show-file-list="false"
:file-list="fileList"
accept=".zip"
:before-upload="beforeUpload"
:on-success="uploadSuccess"
:on-error="uploadFail"
name="file"
:headers="headers"
>
<el-button size="mini" type="primary" :disabled="uploading">
<span v-if="!uploading" style="font-size: 12px;">{{ $t('plugin.local_install') }}</span>
<span v-if="uploading" style="font-size: 12px;"><i class="el-icon-loading" /> {{ $t('dataset.uploading') }}</span>
</el-button>
</el-upload>
</template>
<el-table-column prop="name" :label="$t('plugin.name')" />
<el-table-column prop="free" :label="$t('plugin.free')" />
<el-table-column prop="cost" :label="$t('plugin.cost')" />
<el-table-column :show-overflow-tooltip="true" prop="descript" :label="$t('plugin.descript')" />
<el-table-column prop="version" :label="$t('plugin.version')" />
<el-table-column prop="creator" :label="$t('plugin.creator')" />
<el-table-column prop="installTime" :label="$t('plugin.install_time')">
<template v-slot:default="scope">
<span>{{ scope.row.installTime | timestampFormatDate }}</span>
</template>
</el-table-column>
<fu-table-operations :buttons="buttons" label="操作" fix />
</complex-table>
</layout-content>
</template>
<script>
import LayoutContent from '@/components/business/LayoutContent'
import ComplexTable from '@/components/business/complex-table'
import { checkPermission } from '@/utils/permission'
import { formatCondition } from '@/utils/index'
import { pluginLists } from '@/api/system/plugin'
import { getToken } from '@/utils/auth'
export default {
components: { ComplexTable, LayoutContent },
data() {
return {
header: '',
columns: [],
buttons: [
{
label: this.$t('commons.delete'), icon: 'el-icon-delete', type: 'danger', click: this.del,
show: checkPermission(['user:del'])
}
],
searchConfig: {
useQuickSearch: false,
quickPlaceholder: '按名称搜索',
components: [
{ field: 'name', label: '名称', component: 'FuComplexInput' }
// {
// field: 'u.enabled',
// label: '状态',
// component: 'FuComplexSelect',
// options: [
// { label: '启用', value: '1' },
// { label: '禁用', value: '0' }
// ],
// multiple: false
// }
]
},
paginationConfig: {
currentPage: 1,
pageSize: 10,
total: 0
},
data: [],
uploading: false,
baseUrl: process.env.VUE_APP_BASE_API,
fileList: [],
headers: { Authorization: getToken() }
}
},
mounted() {
this.search()
},
methods: {
search(condition) {
const temp = formatCondition(condition)
const param = temp || {}
const { currentPage, pageSize } = this.paginationConfig
pluginLists(currentPage, pageSize, param).then(response => {
this.data = response.data.listObject
this.paginationConfig.total = response.data.itemCount
})
},
beforeUpload(file) {
this.uploading = true
},
uploadFail(response, file, fileList) {
this.uploading = false
},
uploadSuccess(response, file, fileList) {
console.log(response)
console.log(file)
console.log(fileList)
// this.path = response.data.path
// this.fields = response.data.fields
// this.data = response.data.data
// const datas = this.data
// this.$refs.plxTable.reloadData(datas)
// if (file.name.lastIndexOf('.') > 0) {
// this.name = file.name.substring(0, file.name.lastIndexOf('.'))
// }
// this.fileList = fileList
this.uploading = false
},
del(row) {
this.$confirm(this.$t('user.delete_confirm'), '', {
confirmButtonText: this.$t('commons.confirm'),
cancelButtonText: this.$t('commons.cancel'),
type: 'warning'
}).then(() => {
// delUser(encodeURIComponent(row.userId)).then(res => {
// this.$success(this.$t('commons.delete_success'))
// this.search()
// })
}).catch(() => {
this.$info(this.$t('commons.delete_cancel'))
})
}
}
}
</script>
<style scoped>
</style>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论