init
This commit is contained in:
98
mes/qd/src/views/tools/aliPay/config.vue
Normal file
98
mes/qd/src/views/tools/aliPay/config.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<el-form ref="form" :model="form" :rules="rules" style="margin-top: 6px;" size="small" label-width="100px">
|
||||
<el-form-item label="appID" prop="appId">
|
||||
<el-input v-model="form.appId" style="width: 40%" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">应用APPID,收款账号既是APPID对应支付宝账号</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="商家账号" prop="sysServiceProviderId">
|
||||
<el-input v-model="form.sysServiceProviderId" style="width: 40%;" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">商家账号</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="商户私钥" prop="privateKey">
|
||||
<el-input v-model="form.privateKey" type="password" style="width: 40%;" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">商户私钥,你的PKCS8格式RSA2私钥</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="支付宝公钥" prop="publicKey">
|
||||
<el-input v-model="form.publicKey" type="password" style="width: 40%;" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">支付宝公钥</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="回调地址" prop="returnUrl">
|
||||
<el-input v-model="form.returnUrl" style="width: 40%;" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">订单完成后返回的地址</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="异步通知" prop="notifyUrl">
|
||||
<el-input v-model="form.notifyUrl" style="width: 40%;" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">支付结果异步通知地址</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="">
|
||||
<el-button :loading="loading" size="medium" type="primary" @click="doSubmit">保存配置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { get, update } from '@/api/tools/alipay'
|
||||
export default {
|
||||
name: 'Config',
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
form: { appId: '', sysServiceProviderId: '', privateKey: '', publicKey: '', returnUrl: '', notifyUrl: '' },
|
||||
rules: {
|
||||
appId: [
|
||||
{ required: true, message: '请输入appID', trigger: 'blur' }
|
||||
],
|
||||
sysServiceProviderId: [
|
||||
{ required: true, message: '请输入商家账号', trigger: 'blur' }
|
||||
],
|
||||
privateKey: [
|
||||
{ required: true, message: '商户私钥不能为空', trigger: 'blur' }
|
||||
],
|
||||
publicKey: [
|
||||
{ required: true, message: '支付宝公钥不能为空', trigger: 'blur' }
|
||||
],
|
||||
returnUrl: [
|
||||
{ required: true, message: '回调地址不能为空', trigger: 'blur' }
|
||||
],
|
||||
notifyUrl: [
|
||||
{ required: true, message: '回调地址不能为空', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
get().then(res => {
|
||||
this.form = res
|
||||
})
|
||||
},
|
||||
doSubmit() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
update(this.form).then(res => {
|
||||
this.$notify({
|
||||
title: '修改成功',
|
||||
type: 'success',
|
||||
duration: 2500
|
||||
})
|
||||
this.loading = false
|
||||
}).catch(err => {
|
||||
this.loading = false
|
||||
console.log(err.response.data.message)
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
48
mes/qd/src/views/tools/aliPay/index.vue
Normal file
48
mes/qd/src/views/tools/aliPay/index.vue
Normal file
@@ -0,0 +1,48 @@
|
||||
<template>
|
||||
<el-tabs v-model="activeName" style="padding-left: 5px;">
|
||||
<el-tab-pane label="参数配置" name="first">
|
||||
<Config />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="支付测试" name="second">
|
||||
<ToPay />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="使用说明" name="third">
|
||||
<div>
|
||||
<blockquote class="my-blockquote">注意</blockquote>
|
||||
<pre class="my-code">
|
||||
测试所用参数都是沙箱环境,仅供测试使用,申请地址:<a style="color: #00a0e9" href="https://openhome.alipay.com/platform/appDaily.htm?tab=info" target="_blank">支付宝开发平台</a>
|
||||
如需付款测试,请使用
|
||||
账号:uuxesw9745@sandbox.com
|
||||
密码与支付密码:111111</pre>
|
||||
<blockquote class="my-blockquote"> 支付设置</blockquote>
|
||||
<pre class="my-code">
|
||||
// 支付提供两个接口,
|
||||
// PC端与手机端,并且在前端使用代码识别
|
||||
if (/(Android)/i.test(navigator.userAgent)){ // 判断是否为Android手机
|
||||
url = "/aliPay/toPayAsWeb"
|
||||
}else if(/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)){ // 判断是否为苹果手机
|
||||
url = "/aliPay/toPayAsWeb"
|
||||
} else {
|
||||
url = "/aliPay/toPayAsPC"
|
||||
}</pre>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Config from './config'
|
||||
import ToPay from './toPay'
|
||||
export default {
|
||||
name: 'AliPay',
|
||||
components: { Config, ToPay },
|
||||
data() {
|
||||
return {
|
||||
activeName: 'second'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
86
mes/qd/src/views/tools/aliPay/toPay.vue
Normal file
86
mes/qd/src/views/tools/aliPay/toPay.vue
Normal file
@@ -0,0 +1,86 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form ref="form" :model="form" :rules="rules" style="margin-top: 6px;" size="small" label-width="90px">
|
||||
<el-form-item label="商品名称" prop="subject">
|
||||
<el-input v-model="form.subject" style="width: 35%" />
|
||||
</el-form-item>
|
||||
<el-form-item label="商品价格" prop="totalAmount">
|
||||
<el-input v-model="form.totalAmount" style="width: 35%" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">测试允许区间(0,5000]</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品描述" prop="body">
|
||||
<el-input v-model="form.body" style="width: 35%" rows="8" type="textarea" />
|
||||
</el-form-item>
|
||||
<el-form-item label="">
|
||||
<el-button :loading="loading" size="medium" type="primary" @click="doSubmit">去支付</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { toAliPay } from '@/api/tools/alipay'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
url: '',
|
||||
// 新窗口的引用
|
||||
newWin: null,
|
||||
loading: false, form: { subject: '', totalAmount: '', body: '' },
|
||||
rules: {
|
||||
subject: [
|
||||
{ required: true, message: '商品名称不能为空', trigger: 'blur' }
|
||||
],
|
||||
totalAmount: [
|
||||
{ required: true, message: '商品价格不能为空', trigger: 'blur' }
|
||||
],
|
||||
body: [
|
||||
{ required: true, message: '商品描述不能为空', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
url(newVal, oldVal) {
|
||||
if (newVal && this.newWin) {
|
||||
this.newWin.sessionStorage.clear()
|
||||
this.newWin.location.href = newVal
|
||||
// 重定向后把url和newWin重置
|
||||
this.url = ''
|
||||
this.newWin = null
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
doSubmit() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
// 先打开一个空的新窗口,再请求
|
||||
this.newWin = window.open()
|
||||
let url = ''
|
||||
if (/(Android)/i.test(navigator.userAgent)) { // 判断是否为Android手机
|
||||
url = 'aliPay/toPayAsWeb'
|
||||
} else if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { // 判断是否为苹果手机
|
||||
url = 'aliPay/toPayAsWeb'
|
||||
} else {
|
||||
url = 'aliPay/toPayAsPC'
|
||||
}
|
||||
toAliPay(url, this.form).then(res => {
|
||||
this.loading = false
|
||||
this.url = res
|
||||
}).catch(err => {
|
||||
this.loading = false
|
||||
console.log(err.response.data.message)
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
229
mes/qd/src/views/tools/codeGen/codeDetail.vue
Normal file
229
mes/qd/src/views/tools/codeGen/codeDetail.vue
Normal file
@@ -0,0 +1,229 @@
|
||||
<template>
|
||||
<div>
|
||||
<div v-if="query.dictName === ''">
|
||||
<div class="my-code">点击编码查看详情</div>
|
||||
</div>
|
||||
<div v-else>
|
||||
<!--工具栏-->
|
||||
<div class="head-container">
|
||||
<div v-if="crud.props.searchToggle">
|
||||
<!-- 搜索 -->
|
||||
<el-input
|
||||
v-model="query.label"
|
||||
clearable
|
||||
size="small"
|
||||
placeholder="输入编码标签查询"
|
||||
style="width: 200px;"
|
||||
class="filter-item"
|
||||
@keyup.enter.native="toQuery"
|
||||
/>
|
||||
<rrOperation />
|
||||
</div>
|
||||
</div>
|
||||
<!--表单组件-->
|
||||
<el-dialog
|
||||
append-to-body
|
||||
:close-on-click-modal="false"
|
||||
:before-close="crud.cancelCU"
|
||||
:visible="crud.status.cu > 0"
|
||||
:title="crud.status.title"
|
||||
width="500px"
|
||||
>
|
||||
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
|
||||
<el-form-item label="编码类型" prop="type">
|
||||
<el-select v-model="form.type" placeholder="请选择" @change="changeType">
|
||||
<el-option
|
||||
v-for="item in options"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<div v-if="form.type === '01' || form.type === '03'">
|
||||
<el-form-item label="初始值" prop="init_value">
|
||||
<el-input v-model="form.init_value" style="width: 370px;" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div v-if="form.type === '02'">
|
||||
<el-form-item label="格式" prop="format">
|
||||
<el-input v-model="form.format" style="width: 370px;" placeholder="输入日期格式例:yyyyMMdd" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<div v-if="form.type === '03'">
|
||||
<el-form-item label="步长" prop="step">
|
||||
<el-input v-model="form.step" style="width: 370px;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="填充值" prop="fillchar">
|
||||
<el-input v-model="form.fillchar" style="width: 370px;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="长度" prop="length">
|
||||
<el-input v-model="form.length" style="width: 370px;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="最大值" prop="max_value">
|
||||
<el-input v-model="form.max_value" style="width: 370px;" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-form-item label="排序" prop="sort_num">
|
||||
<el-input-number
|
||||
v-model.number="form.sort_num"
|
||||
:min="0"
|
||||
:max="999"
|
||||
controls-position="right"
|
||||
style="width: 370px;"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="text" @click="crud.cancelCU">取消</el-button>
|
||||
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<!--表格渲染-->
|
||||
<el-table
|
||||
ref="table"
|
||||
v-loading="crud.loading"
|
||||
:data="crud.data"
|
||||
highlight-current-row
|
||||
style="width: 100%;"
|
||||
@selection-change="crud.selectionChangeHandler"
|
||||
>
|
||||
<el-table-column label="所属编码">
|
||||
{{ query.dictName }}
|
||||
</el-table-column>
|
||||
<el-table-column prop="type" label="类型" :formatter="typeFormate" />
|
||||
<el-table-column prop="init_value" label="初始值" />
|
||||
<el-table-column prop="current_value" label="当前值" />
|
||||
<el-table-column
|
||||
v-permission="['admin','dict:edit','dict:del']"
|
||||
label="操作"
|
||||
width="130px"
|
||||
align="center"
|
||||
fixed="right"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<udOperation
|
||||
:data="scope.row"
|
||||
:permission="permission"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--分页组件-->
|
||||
<pagination />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import crudCodeDetail from '@/api/tools/codeDetail'
|
||||
import CRUD, { presenter, header, form } from '@crud/crud'
|
||||
import pagination from '@crud/Pagination'
|
||||
import rrOperation from '@crud/RR.operation'
|
||||
import udOperation from '@crud/UD.operation'
|
||||
|
||||
const defaultForm = {
|
||||
id: null,
|
||||
type: '01',
|
||||
init_value: null,
|
||||
format: null,
|
||||
step: null,
|
||||
fillchar: null,
|
||||
length: null,
|
||||
sort_num: 0
|
||||
}
|
||||
|
||||
export default {
|
||||
components: { pagination, rrOperation, udOperation },
|
||||
cruds() {
|
||||
return [
|
||||
CRUD({
|
||||
title: '编码详情', url: 'api/codeDetail', query: { dictName: '' }, sort: ['sort_num,asc'],
|
||||
crudMethod: { ...crudCodeDetail },
|
||||
optShow: {
|
||||
add: true,
|
||||
edit: true,
|
||||
del: true,
|
||||
reset: false
|
||||
},
|
||||
queryOnPresenterCreated: false
|
||||
})
|
||||
]
|
||||
},
|
||||
mixins: [
|
||||
presenter(),
|
||||
header(),
|
||||
form(function() {
|
||||
return Object.assign({ dict: { id: this.dictId }}, defaultForm)
|
||||
})],
|
||||
data() {
|
||||
return {
|
||||
options: [{
|
||||
value: '01',
|
||||
label: '固定'
|
||||
}, {
|
||||
value: '02',
|
||||
label: '日期'
|
||||
}, {
|
||||
value: '03',
|
||||
label: '顺序'
|
||||
}],
|
||||
value: '',
|
||||
dictId: null,
|
||||
rules: {
|
||||
type: [
|
||||
{ required: true, message: '请输入编码标签', trigger: 'blur' }
|
||||
],
|
||||
init_value: [
|
||||
{ required: true, message: '请输入初始值', trigger: 'blur' }
|
||||
],
|
||||
sort_num: [
|
||||
{ required: true, message: '请输入序号', trigger: 'blur', type: 'number' }
|
||||
],
|
||||
format: [
|
||||
{ required: true, message: '请输入日期格式', trigger: 'blur' }
|
||||
],
|
||||
max_value: [
|
||||
{ required: true, message: '请输入最大值', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
permission: {
|
||||
add: ['admin', 'dict:add'],
|
||||
edit: ['admin', 'dict:edit'],
|
||||
del: ['admin', 'dict:del']
|
||||
},
|
||||
typeFormate(row, index) {
|
||||
if (row.type === '01') {
|
||||
return '固定'
|
||||
} else if (row.type === '02') {
|
||||
return '时间'
|
||||
} else if (row.type === '03') {
|
||||
return '顺序'
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
changeType(val) {
|
||||
// 新增的时候,并且类型为顺序类型的时候赋初值操作
|
||||
if (this.crud.status.add === 1) {
|
||||
if (val === '03') {
|
||||
this.form.step = 1
|
||||
this.form.length = '3'
|
||||
this.form.fillchar = '0'
|
||||
} else {
|
||||
this.form.step = null
|
||||
this.form.length = null
|
||||
this.form.fillchar = null
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||||
::v-deep .el-input-number .el-input__inner {
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
143
mes/qd/src/views/tools/codeGen/index.vue
Normal file
143
mes/qd/src/views/tools/codeGen/index.vue
Normal file
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!--表单组件-->
|
||||
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title" width="500px">
|
||||
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
|
||||
<el-form-item label="编码" prop="name">
|
||||
<el-input v-model="form.code" style="width: 370px;" />
|
||||
</el-form-item>
|
||||
<el-form-item label="名称">
|
||||
<el-input v-model="form.name" style="width: 370px;" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="text" @click="crud.cancelCU">取消</el-button>
|
||||
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<!-- 字典列表 -->
|
||||
<el-row :gutter="10">
|
||||
<el-col :xs="24" :sm="24" :md="10" :lg="11" :xl="11" style="margin-bottom: 10px">
|
||||
<el-card class="box-card">
|
||||
<!--工具栏-->
|
||||
<div class="head-container">
|
||||
<div v-if="crud.props.searchToggle">
|
||||
<!-- 搜索 -->
|
||||
<el-input v-model="query.blurry" clearable size="small" placeholder="输入编码或者名称搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
|
||||
<rrOperation />
|
||||
</div>
|
||||
<crudOperation :permission="permission" />
|
||||
</div>
|
||||
<!--表格渲染-->
|
||||
<el-table ref="table" v-loading="crud.loading" :data="crud.data" highlight-current-row style="width: 100%;" @selection-change="crud.selectionChangeHandler" @current-change="handleCurrentChange">
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column :show-overflow-tooltip="true" prop="code" width="80" label="编码" />
|
||||
<el-table-column :show-overflow-tooltip="true" prop="name" width="100" label="名称" />
|
||||
<el-table-column :show-overflow-tooltip="true" prop="demo" width="150" label="测试值" />
|
||||
<el-table-column :show-overflow-tooltip="true" prop="remark" label="备注" />
|
||||
<el-table-column v-permission="['admin','dict:edit','dict:del']" label="操作" width="130px" align="center" fixed="right">
|
||||
<template slot-scope="scope">
|
||||
<udOperation
|
||||
:data="scope.row"
|
||||
:permission="permission"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--分页组件-->
|
||||
<pagination />
|
||||
</el-card>
|
||||
</el-col>
|
||||
<!-- 字典详情列表 -->
|
||||
<el-col :xs="24" :sm="24" :md="14" :lg="13" :xl="13">
|
||||
<el-card class="box-card">
|
||||
<div slot="header" class="clearfix">
|
||||
<span>编码详情</span>
|
||||
<el-button
|
||||
v-if="checkPermission(['admin','genCode:add']) && this.$refs.codeGenDetail && this.$refs.codeGenDetail.query.dictName"
|
||||
class="filter-item"
|
||||
size="mini"
|
||||
style="float: right;padding: 4px 10px"
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
@click="$refs.codeGenDetail && $refs.codeGenDetail.crud.toAdd()"
|
||||
>新增</el-button>
|
||||
</div>
|
||||
<codeGenDetail ref="codeGenDetail" :permission="permission" />
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import checkPermission from '@/utils/permission'
|
||||
import codeGenDetail from './codeDetail'
|
||||
import crudDict from '@/api/system/genCode'
|
||||
|
||||
import CRUD, { presenter, header, form } from '@crud/crud'
|
||||
import crudOperation from '@crud/CRUD.operation'
|
||||
import pagination from '@crud/Pagination'
|
||||
import rrOperation from '@crud/RR.operation'
|
||||
import udOperation from '@crud/UD.operation'
|
||||
|
||||
const defaultForm = { id: null, name: null, description: null, codeGenDetails: [] }
|
||||
|
||||
export default {
|
||||
name: 'Dict',
|
||||
components: { crudOperation, pagination, rrOperation, udOperation, codeGenDetail },
|
||||
cruds() {
|
||||
return [
|
||||
CRUD({ title: '编码', url: 'api/genCode', crudMethod: { ...crudDict }, sort: ['create_time,desc'],
|
||||
optShow: {
|
||||
add: true,
|
||||
edit: true,
|
||||
del: true,
|
||||
download: false
|
||||
}})
|
||||
]
|
||||
},
|
||||
mixins: [presenter(), header(), form(defaultForm)],
|
||||
data() {
|
||||
return {
|
||||
queryTypeOptions: [
|
||||
{ key: 'code', display_name: '编码' },
|
||||
{ key: 'name', display_name: '名称' }
|
||||
],
|
||||
rules: {
|
||||
code: [
|
||||
{ required: true, message: '请输入编码', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
permission: {
|
||||
add: ['admin', 'dict:add'],
|
||||
edit: ['admin', 'dict:edit'],
|
||||
del: ['admin', 'dict:del'],
|
||||
download: [null]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
checkPermission,
|
||||
// 获取数据前设置好接口地址
|
||||
[CRUD.HOOK.beforeRefresh]() {
|
||||
if (this.$refs.codeGenDetail) {
|
||||
this.$refs.codeGenDetail.query.dictName = ''
|
||||
}
|
||||
return true
|
||||
},
|
||||
// 选中字典后,设置字典详情数据
|
||||
handleCurrentChange(val) {
|
||||
if (val) {
|
||||
this.$refs.codeGenDetail.query.dictName = val.code
|
||||
this.$refs.codeGenDetail.query.id = val.id
|
||||
this.$refs.codeGenDetail.dictId = val.id
|
||||
this.$refs.codeGenDetail.crud.toQuery()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
91
mes/qd/src/views/tools/email/config.vue
Normal file
91
mes/qd/src/views/tools/email/config.vue
Normal file
@@ -0,0 +1,91 @@
|
||||
<template>
|
||||
<el-form ref="form" :model="form" :rules="rules" style="margin-top: 6px;" size="small" label-width="100px">
|
||||
<el-form-item label="发件人邮箱" prop="fromUser">
|
||||
<el-input v-model="form.fromUser" style="width: 40%" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">Sender mailbox</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="发件用户名" prop="user">
|
||||
<el-input v-model="form.user" style="width: 40%;" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">Sender usernamex</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱密码" prop="pass">
|
||||
<el-input v-model="form.pass" type="password" style="width: 40%;" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">email Password</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="SMTP地址" prop="host">
|
||||
<el-input v-model="form.host" style="width: 40%;" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">SMTP address</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="SMTP端口" prop="port">
|
||||
<el-input v-model="form.port" style="width: 40%;" />
|
||||
<span style="color: #C0C0C0;margin-left: 10px;">SMTP port</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="">
|
||||
<el-button :loading="loading" size="medium" type="primary" @click="doSubmit">保存配置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { get, update } from '@/api/tools/email'
|
||||
export default {
|
||||
name: 'Config',
|
||||
data() {
|
||||
return {
|
||||
loading: false, form: { id: 1, fromUser: '', user: '', pass: '', host: '', port: '', sslEnable: '' },
|
||||
rules: {
|
||||
fromUser: [
|
||||
{ required: true, message: '请输入发件人邮箱', trigger: 'blur' },
|
||||
{ type: 'email', message: '请输入正确的邮箱地址', trigger: 'blur' }
|
||||
],
|
||||
user: [
|
||||
{ required: true, message: '请输入发件用户名', trigger: 'blur' }
|
||||
],
|
||||
pass: [
|
||||
{ required: true, message: '密码不能为空', trigger: 'blur' }
|
||||
],
|
||||
host: [
|
||||
{ required: true, message: 'SMTP地址不能为空', trigger: 'blur' }
|
||||
],
|
||||
port: [
|
||||
{ required: true, message: 'SMTP端口不能为空', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.init()
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
get().then(res => {
|
||||
this.form = res
|
||||
})
|
||||
},
|
||||
doSubmit() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
update(this.form).then(res => {
|
||||
this.$notify({
|
||||
title: '修改成功',
|
||||
type: 'success',
|
||||
duration: 2500
|
||||
})
|
||||
this.loading = false
|
||||
}).catch(err => {
|
||||
this.loading = false
|
||||
console.log(err.response.data.message)
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
41
mes/qd/src/views/tools/email/index.vue
Normal file
41
mes/qd/src/views/tools/email/index.vue
Normal file
@@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<el-tabs v-model="activeName" style="padding-left: 8px;">
|
||||
<el-tab-pane label="邮箱配置" name="first">
|
||||
<Config />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="发送邮件" name="second">
|
||||
<Send />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="使用说明" name="third">
|
||||
<div>
|
||||
<blockquote class="my-blockquote"> 邮件服务器配置</blockquote>
|
||||
<pre class="my-code">
|
||||
# 邮件服务器的SMTP地址,可选,默认为smtp
|
||||
# 邮件服务器的SMTP端口,可选,默认465或者25
|
||||
# 发件人(必须正确,否则发送失败)
|
||||
# 用户名,默认为发件人邮箱前缀
|
||||
# 密码(注意,某些邮箱需要为SMTP服务单独设置密码,如QQ和163等等)
|
||||
# 是否开启ssl,默认开启</pre>
|
||||
<blockquote class="my-blockquote">更多帮助</blockquote>
|
||||
<pre class="my-code">更多帮助请查看文档:<a style="color:#009688" href="http://hutool.mydoc.io/#text_319499" target="_black">hutool工具包</a></pre>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Config from './config'
|
||||
import Send from './send'
|
||||
export default {
|
||||
name: 'Email',
|
||||
components: { Config, Send },
|
||||
data() {
|
||||
return {
|
||||
activeName: 'second'
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
142
mes/qd/src/views/tools/email/send.vue
Normal file
142
mes/qd/src/views/tools/email/send.vue
Normal file
@@ -0,0 +1,142 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form ref="form" :model="form" :rules="rules" style="margin-top: 6px;" size="small" label-width="100px">
|
||||
<el-form-item label="邮件标题" prop="subject">
|
||||
<el-input v-model="form.subject" style="width: 646px" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
v-for="(domain, index) in tos"
|
||||
:key="domain.key"
|
||||
:label="'收件邮箱' + (index === 0 ? '': index)"
|
||||
>
|
||||
<el-input v-model="domain.value" style="width: 550px" />
|
||||
<el-button icon="el-icon-plus" @click="addDomain" />
|
||||
<el-button style="margin-left:0;" icon="el-icon-minus" @click.prevent="removeDomain(domain)" />
|
||||
</el-form-item>
|
||||
<div ref="editor" class="editor" />
|
||||
<el-button :loading="loading" style="margin-left:1.6%;" size="medium" type="primary" @click="doSubmit">发送邮件</el-button>
|
||||
</el-form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { send } from '@/api/tools/email'
|
||||
import { upload } from '@/utils/upload'
|
||||
import { validEmail } from '@/utils/validate'
|
||||
import { mapGetters } from 'vuex'
|
||||
import E from 'wangeditor'
|
||||
export default {
|
||||
name: 'Index',
|
||||
data() {
|
||||
return {
|
||||
loading: false, form: { subject: '', tos: [], content: '' },
|
||||
tos: [{
|
||||
value: ''
|
||||
}],
|
||||
rules: {
|
||||
subject: [
|
||||
{ required: true, message: '标题不能为空', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'imagesUploadApi'
|
||||
])
|
||||
},
|
||||
mounted() {
|
||||
const _this = this
|
||||
var editor = new E(this.$refs.editor)
|
||||
// 自定义菜单配置
|
||||
editor.customConfig.zIndex = 10
|
||||
// 文件上传
|
||||
editor.customConfig.customUploadImg = function(files, insert) {
|
||||
// files 是 input 中选中的文件列表
|
||||
// insert 是获取图片 url 后,插入到编辑器的方法
|
||||
files.forEach(image => {
|
||||
files.forEach(image => {
|
||||
upload(_this.imagesUploadApi, image).then(data => {
|
||||
insert(data.data.url)
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
editor.customConfig.onchange = (html) => {
|
||||
this.form.content = html
|
||||
}
|
||||
editor.create()
|
||||
},
|
||||
methods: {
|
||||
removeDomain(item) {
|
||||
var index = this.tos.indexOf(item)
|
||||
if (index !== -1 && this.tos.length !== 1) {
|
||||
this.tos.splice(index, 1)
|
||||
} else {
|
||||
this.$message({
|
||||
message: '请至少保留一位联系人',
|
||||
type: 'warning'
|
||||
})
|
||||
}
|
||||
},
|
||||
addDomain() {
|
||||
this.tos.push({
|
||||
stage_code: '',
|
||||
key: Date.now()
|
||||
})
|
||||
},
|
||||
doSubmit() {
|
||||
const _this = this
|
||||
this.$refs['form'].validate((valid) => {
|
||||
this.form.tos = []
|
||||
if (valid) {
|
||||
let sub = false
|
||||
this.tos.forEach(function(data, index) {
|
||||
if (data.value === '') {
|
||||
_this.$message({
|
||||
message: '收件邮箱不能为空',
|
||||
type: 'warning'
|
||||
})
|
||||
sub = true
|
||||
} else if (validEmail(data.value)) {
|
||||
_this.form.tos.push(data.value)
|
||||
} else {
|
||||
_this.$message({
|
||||
message: '收件邮箱格式错误',
|
||||
type: 'warning'
|
||||
})
|
||||
sub = true
|
||||
}
|
||||
})
|
||||
if (sub) { return false }
|
||||
this.loading = true
|
||||
send(this.form).then(res => {
|
||||
this.$notify({
|
||||
title: '发送成功',
|
||||
type: 'success',
|
||||
duration: 2500
|
||||
})
|
||||
this.loading = false
|
||||
}).catch(err => {
|
||||
this.loading = false
|
||||
console.log(err.response.data.message)
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.editor{
|
||||
text-align:left;
|
||||
margin: 20px;
|
||||
width: 730px;
|
||||
}
|
||||
::v-deep .w-e-text-container {
|
||||
height: 360px !important;
|
||||
}
|
||||
</style>
|
||||
36
mes/qd/src/views/tools/storage/index.vue
Normal file
36
mes/qd/src/views/tools/storage/index.vue
Normal file
@@ -0,0 +1,36 @@
|
||||
<template>
|
||||
<el-tabs v-model="activeName" style="padding-left: 8px;" @tab-click="tabClick">
|
||||
<el-tab-pane label="本地存储" name="first">
|
||||
<Local ref="local" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="七牛云存储" name="second">
|
||||
<QiNiu ref="qiNiu" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import QiNiu from './qiniu/index'
|
||||
import Local from './local/index'
|
||||
export default {
|
||||
name: 'Storage',
|
||||
components: { QiNiu, Local },
|
||||
data() {
|
||||
return {
|
||||
activeName: 'first'
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
tabClick(name) {
|
||||
if (this.activeName === 'first') {
|
||||
this.$refs.local.crud.toQuery()
|
||||
} else {
|
||||
this.$refs.qiNiu.crud.toQuery()
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
184
mes/qd/src/views/tools/storage/local/index.vue
Normal file
184
mes/qd/src/views/tools/storage/local/index.vue
Normal file
@@ -0,0 +1,184 @@
|
||||
<template>
|
||||
<div class="app-container" style="padding: 8px;">
|
||||
<!--工具栏-->
|
||||
<div class="head-container">
|
||||
<div v-if="crud.props.searchToggle">
|
||||
<!-- 搜索 -->
|
||||
<el-input v-model="query.blurry" clearable size="small" placeholder="输入内容模糊搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="crud.toQuery" />
|
||||
<date-range-picker v-model="query.createTime" class="date-item" />
|
||||
<rrOperation />
|
||||
</div>
|
||||
<crudOperation :permission="permission">
|
||||
<!-- 新增 -->
|
||||
<el-button
|
||||
slot="left"
|
||||
v-permission="['admin','storage:add']"
|
||||
class="filter-item"
|
||||
size="mini"
|
||||
type="primary"
|
||||
icon="el-icon-upload"
|
||||
@click="crud.toAdd"
|
||||
>上传
|
||||
</el-button>
|
||||
</crudOperation>
|
||||
</div>
|
||||
<!--表单组件-->
|
||||
<el-dialog append-to-body :close-on-click-modal="false" :before-close="crud.cancelCU" :visible.sync="crud.status.cu > 0" :title="crud.status.add ? '文件上传' : '编辑文件'" width="500px">
|
||||
<el-form ref="form" :model="form" size="small" label-width="80px">
|
||||
<el-form-item label="文件名">
|
||||
<el-input v-model="form.name" style="width: 370px;" />
|
||||
</el-form-item>
|
||||
<!-- 上传文件 -->
|
||||
<el-form-item v-if="crud.status.add" label="上传">
|
||||
<el-upload
|
||||
ref="upload"
|
||||
:limit="1"
|
||||
:before-upload="beforeUpload"
|
||||
:auto-upload="false"
|
||||
:headers="headers"
|
||||
:on-success="handleSuccess"
|
||||
:on-error="handleError"
|
||||
:action="fileUploadApi + '?name=' + form.name"
|
||||
>
|
||||
<div class="eladmin-upload"><i class="el-icon-upload" /> 添加文件</div>
|
||||
<div slot="tip" class="el-upload__tip">可上传任意格式文件,且不超过100M</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="text" @click="crud.cancelCU">取消</el-button>
|
||||
<el-button v-if="crud.status.add" :loading="loading" type="primary" @click="upload">确认</el-button>
|
||||
<el-button v-else :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU">确认</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<!--表格渲染-->
|
||||
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column prop="name" label="文件名">
|
||||
<template slot-scope="scope">
|
||||
<el-popover
|
||||
:content="'file/' + scope.row.type + '/' + scope.row.realName"
|
||||
placement="top-start"
|
||||
title="路径"
|
||||
width="200"
|
||||
trigger="hover"
|
||||
>
|
||||
<a
|
||||
slot="reference"
|
||||
:href="baseApi + '/file/' + scope.row.type + '/' + scope.row.realName"
|
||||
class="el-link--primary"
|
||||
style="word-break:keep-all;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color: #1890ff;font-size: 13px;"
|
||||
target="_blank"
|
||||
>
|
||||
{{ scope.row.name }}
|
||||
</a>
|
||||
</el-popover>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="path" label="预览图">
|
||||
<template slot-scope="{row}">
|
||||
<el-image
|
||||
:src=" baseApi + '/file/' + row.type + '/' + row.realName"
|
||||
:preview-src-list="[baseApi + '/file/' + row.type + '/' + row.realName]"
|
||||
fit="contain"
|
||||
lazy
|
||||
class="el-avatar"
|
||||
>
|
||||
<div slot="error">
|
||||
<i class="el-icon-document" />
|
||||
</div>
|
||||
</el-image>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="suffix" label="文件类型" />
|
||||
<el-table-column prop="type" label="类别" />
|
||||
<el-table-column prop="size" label="大小" />
|
||||
<el-table-column prop="operate" label="操作人" />
|
||||
<el-table-column prop="createTime" label="创建日期" />
|
||||
</el-table>
|
||||
<!--分页组件-->
|
||||
<pagination />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import { getToken } from '@/utils/auth'
|
||||
import crudFile from '@/api/tools/localStorage'
|
||||
import CRUD, { presenter, header, form, crud } from '@crud/crud'
|
||||
import rrOperation from '@crud/RR.operation'
|
||||
import crudOperation from '@crud/CRUD.operation'
|
||||
import pagination from '@crud/Pagination'
|
||||
import DateRangePicker from '@/components/DateRangePicker'
|
||||
|
||||
const defaultForm = { id: null, name: '' }
|
||||
export default {
|
||||
components: { pagination, crudOperation, rrOperation, DateRangePicker },
|
||||
cruds() {
|
||||
return CRUD({ title: '文件', url: 'api/localStorage', crudMethod: { ...crudFile }})
|
||||
},
|
||||
mixins: [presenter(), header(), form(defaultForm), crud()],
|
||||
data() {
|
||||
return {
|
||||
delAllLoading: false,
|
||||
loading: false,
|
||||
headers: { 'Authorization': getToken() },
|
||||
permission: {
|
||||
edit: ['admin', 'storage:edit'],
|
||||
del: ['admin', 'storage:del']
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'baseApi',
|
||||
'fileUploadApi'
|
||||
])
|
||||
},
|
||||
created() {
|
||||
this.crud.optShow.add = false
|
||||
},
|
||||
methods: {
|
||||
// 上传文件
|
||||
upload() {
|
||||
this.$refs.upload.submit()
|
||||
},
|
||||
beforeUpload(file) {
|
||||
let isLt2M = true
|
||||
isLt2M = file.size / 1024 / 1024 < 100
|
||||
if (!isLt2M) {
|
||||
this.loading = false
|
||||
this.$message.error('上传文件大小不能超过 100MB!')
|
||||
}
|
||||
this.form.name = file.name
|
||||
return isLt2M
|
||||
},
|
||||
handleSuccess(response, file, fileList) {
|
||||
this.crud.notify('上传成功', CRUD.NOTIFICATION_TYPE.SUCCESS)
|
||||
this.$refs.upload.clearFiles()
|
||||
this.crud.status.add = CRUD.STATUS.NORMAL
|
||||
this.crud.resetForm()
|
||||
this.crud.toQuery()
|
||||
},
|
||||
// 监听上传失败
|
||||
handleError(e, file, fileList) {
|
||||
const msg = JSON.parse(e.message)
|
||||
this.$notify({
|
||||
title: msg.message,
|
||||
type: 'error',
|
||||
duration: 2500
|
||||
})
|
||||
this.loading = false
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
::v-deep .el-image__error, .el-image__placeholder{
|
||||
background: none;
|
||||
}
|
||||
::v-deep .el-image-viewer__wrapper{
|
||||
top: 55px;
|
||||
}
|
||||
</style>
|
||||
98
mes/qd/src/views/tools/storage/qiniu/form.vue
Normal file
98
mes/qd/src/views/tools/storage/qiniu/form.vue
Normal file
@@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" title="七牛云配置" append-to-body width="580px">
|
||||
<el-form ref="form" :model="form" :rules="rules" style="margin-top: 6px;" size="small" label-width="110px">
|
||||
<el-form-item label="Access Key" prop="accessKey">
|
||||
<el-input v-model="form.accessKey" style="width: 95%" placeholder="accessKey,在安全中心,秘钥管理中查看" />
|
||||
</el-form-item>
|
||||
<el-form-item label="Secret Key" prop="secretKey">
|
||||
<el-input v-model="form.secretKey" type="password" style="width: 95%;" placeholder="secretKey,在安全中心,秘钥管理中查看" />
|
||||
</el-form-item>
|
||||
<el-form-item label="空间名称" prop="bucket">
|
||||
<el-input v-model="form.bucket" style="width: 95%;" placeholder="存储空间名称作为唯一的 Bucket 识别符" />
|
||||
</el-form-item>
|
||||
<el-form-item label="外链域名" prop="host">
|
||||
<el-input v-model="form.host" style="width: 95%;" placeholder="外链域名,可自定义,需在七牛云绑定" />
|
||||
</el-form-item>
|
||||
<el-form-item label="存储区域">
|
||||
<el-select v-model="form.zone" placeholder="请选择存储区域">
|
||||
<el-option
|
||||
v-for="item in zones"
|
||||
:key="item"
|
||||
:label="item"
|
||||
:value="item"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="空间类型" prop="type">
|
||||
<el-radio v-model="form.type" label="公开">公开</el-radio>
|
||||
<el-radio v-model="form.type" label="私有">私有</el-radio>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="text" @click="dialog = false">取消</el-button>
|
||||
<el-button :loading="loading" type="primary" @click="doSubmit">确认</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { get, update } from '@/api/tools/qiniu'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
zones: ['华东', '华北', '华南', '北美', '东南亚'], dialog: false,
|
||||
loading: false, form: { accessKey: '', secretKey: '', bucket: '', host: '', zone: '', type: '' },
|
||||
rules: {
|
||||
accessKey: [
|
||||
{ required: true, message: '请输入accessKey', trigger: 'blur' }
|
||||
],
|
||||
secretKey: [
|
||||
{ required: true, message: '请输入secretKey', trigger: 'blur' }
|
||||
],
|
||||
bucket: [
|
||||
{ required: true, message: '请输入空间名称', trigger: 'blur' }
|
||||
],
|
||||
host: [
|
||||
{ required: true, message: '请输入外链域名', trigger: 'blur' }
|
||||
],
|
||||
type: [
|
||||
{ required: true, message: '空间类型不能为空', trigger: 'blur' }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
get().then(res => {
|
||||
this.form = res
|
||||
})
|
||||
},
|
||||
doSubmit() {
|
||||
this.$refs['form'].validate((valid) => {
|
||||
if (valid) {
|
||||
this.loading = true
|
||||
update(this.form).then(res => {
|
||||
this.$notify({
|
||||
title: '修改成功',
|
||||
type: 'success',
|
||||
duration: 2500
|
||||
})
|
||||
this.$parent.crud.toQuery()
|
||||
this.loading = false
|
||||
this.dialog = false
|
||||
}).catch(err => {
|
||||
this.loading = false
|
||||
console.log(err.response.data.message)
|
||||
})
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
193
mes/qd/src/views/tools/storage/qiniu/index.vue
Normal file
193
mes/qd/src/views/tools/storage/qiniu/index.vue
Normal file
@@ -0,0 +1,193 @@
|
||||
<template>
|
||||
<div class="app-container" style="padding: 8px;">
|
||||
<!--表单组件-->
|
||||
<eForm ref="form" />
|
||||
<!-- 工具栏 -->
|
||||
<div class="head-container">
|
||||
<div v-if="crud.props.searchToggle">
|
||||
<!-- 搜索 -->
|
||||
<el-input v-model="query.key" clearable size="small" placeholder="输入文件名称搜索" style="width: 200px;" class="filter-item" @keyup.enter.native="toQuery" />
|
||||
<date-range-picker v-model="query.createTime" class="date-item" />
|
||||
<rrOperation />
|
||||
</div>
|
||||
<crudOperation :permission="permission">
|
||||
<template slot="left">
|
||||
<!-- 上传 -->
|
||||
<el-button class="filter-item" size="mini" type="primary" icon="el-icon-upload" @click="dialog = true">上传</el-button>
|
||||
<!-- 同步 -->
|
||||
<el-button :icon="icon" class="filter-item" size="mini" type="warning" @click="synchronize">同步</el-button>
|
||||
<!-- 配置 -->
|
||||
<el-button
|
||||
class="filter-item"
|
||||
size="mini"
|
||||
type="success"
|
||||
icon="el-icon-s-tools"
|
||||
@click="doConfig"
|
||||
>配置</el-button>
|
||||
</template>
|
||||
</crudOperation>
|
||||
<!-- 文件上传 -->
|
||||
<el-dialog :visible.sync="dialog" :close-on-click-modal="false" append-to-body width="500px" @close="doSubmit">
|
||||
<el-upload
|
||||
:before-remove="handleBeforeRemove"
|
||||
:on-success="handleSuccess"
|
||||
:on-error="handleError"
|
||||
:file-list="fileList"
|
||||
:headers="headers"
|
||||
:action="qiNiuUploadApi"
|
||||
class="upload-demo"
|
||||
multiple
|
||||
>
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
<div slot="tip" style="display: block;" class="el-upload__tip">请勿上传违法文件,且文件不超过15M</div>
|
||||
</el-upload>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="doSubmit">确认</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<!--表格渲染-->
|
||||
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="crud.selectionChangeHandler">
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column prop="name" :show-overflow-tooltip="true" label="文件名">
|
||||
<template slot-scope="scope">
|
||||
<a href="JavaScript:" class="el-link el-link--primary" target="_blank" type="primary" @click="download(scope.row.id)">{{ scope.row.key }}</a>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :show-overflow-tooltip="true" prop="suffix" label="文件类型" @selection-change="crud.selectionChangeHandler" />
|
||||
<el-table-column prop="bucket" label="空间名称" />
|
||||
<el-table-column prop="size" label="文件大小" />
|
||||
<el-table-column prop="type" label="空间类型" />
|
||||
<el-table-column prop="updateTime" label="创建日期">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.updateTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<!--分页组件-->
|
||||
<pagination />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import crudQiNiu from '@/api/tools/qiniu'
|
||||
import { mapGetters } from 'vuex'
|
||||
import { getToken } from '@/utils/auth'
|
||||
import eForm from './form'
|
||||
import CRUD, { presenter, header, crud } from '@crud/crud'
|
||||
import rrOperation from '@crud/RR.operation'
|
||||
import crudOperation from '@crud/CRUD.operation'
|
||||
import pagination from '@crud/Pagination'
|
||||
import DateRangePicker from '@/components/DateRangePicker'
|
||||
|
||||
export default {
|
||||
components: { eForm, pagination, crudOperation, rrOperation, DateRangePicker },
|
||||
cruds() {
|
||||
return CRUD({ title: '七牛云文件', url: 'api/qiNiuContent', crudMethod: { ...crudQiNiu }})
|
||||
},
|
||||
mixins: [presenter(), header(), crud()],
|
||||
data() {
|
||||
return {
|
||||
permission: {
|
||||
del: ['admin', 'storage:del']
|
||||
},
|
||||
title: '文件', dialog: false,
|
||||
icon: 'el-icon-refresh',
|
||||
url: '', headers: { 'Authorization': getToken() },
|
||||
dialogImageUrl: '', dialogVisible: false, fileList: [], files: [], newWin: null
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'qiNiuUploadApi'
|
||||
])
|
||||
},
|
||||
watch: {
|
||||
url(newVal, oldVal) {
|
||||
if (newVal && this.newWin) {
|
||||
this.newWin.sessionStorage.clear()
|
||||
this.newWin.location.href = newVal
|
||||
// 重定向后把url和newWin重置
|
||||
this.url = ''
|
||||
this.newWin = null
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.crud.optShow.add = false
|
||||
this.crud.optShow.edit = false
|
||||
},
|
||||
methods: {
|
||||
// 七牛云配置
|
||||
doConfig() {
|
||||
const _this = this.$refs.form
|
||||
_this.init()
|
||||
_this.dialog = true
|
||||
},
|
||||
handleSuccess(response, file, fileList) {
|
||||
const uid = file.uid
|
||||
const id = response.id
|
||||
this.files.push({ uid, id })
|
||||
},
|
||||
handleBeforeRemove(file, fileList) {
|
||||
for (let i = 0; i < this.files.length; i++) {
|
||||
if (this.files[i].uid === file.uid) {
|
||||
crudQiNiu.del([this.files[i].id]).then(res => {})
|
||||
return true
|
||||
}
|
||||
}
|
||||
},
|
||||
handlePictureCardPreview(file) {
|
||||
this.dialogImageUrl = file.url
|
||||
this.dialogVisible = true
|
||||
},
|
||||
// 刷新列表数据
|
||||
doSubmit() {
|
||||
this.fileList = []
|
||||
this.dialogVisible = false
|
||||
this.dialogImageUrl = ''
|
||||
this.dialog = false
|
||||
this.crud.toQuery()
|
||||
},
|
||||
// 监听上传失败
|
||||
handleError(e, file, fileList) {
|
||||
const msg = JSON.parse(e.message)
|
||||
this.crud.notify(msg.message, CRUD.NOTIFICATION_TYPE.ERROR)
|
||||
},
|
||||
// 下载文件
|
||||
download(id) {
|
||||
this.downloadLoading = true
|
||||
// 先打开一个空的新窗口,再请求
|
||||
this.newWin = window.open()
|
||||
crudQiNiu.download(id).then(res => {
|
||||
this.downloadLoading = false
|
||||
this.url = res.url
|
||||
}).catch(err => {
|
||||
this.downloadLoading = false
|
||||
console.log(err.response.data.message)
|
||||
})
|
||||
},
|
||||
// 同步数据
|
||||
synchronize() {
|
||||
this.icon = 'el-icon-loading'
|
||||
crudQiNiu.sync().then(res => {
|
||||
this.icon = 'el-icon-refresh'
|
||||
this.$message({
|
||||
showClose: true,
|
||||
message: '数据同步成功',
|
||||
type: 'success',
|
||||
duration: 1500
|
||||
})
|
||||
this.crud.toQuery()
|
||||
}).catch(err => {
|
||||
this.icon = 'el-icon-refresh'
|
||||
console.log(err.response.data.message)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
16
mes/qd/src/views/tools/swagger/index.vue
Normal file
16
mes/qd/src/views/tools/swagger/index.vue
Normal file
@@ -0,0 +1,16 @@
|
||||
<template>
|
||||
<elFrame :src="swaggerApi" />
|
||||
</template>
|
||||
<script>
|
||||
import { mapGetters } from 'vuex'
|
||||
import elFrame from '@/components/Iframe/index'
|
||||
export default {
|
||||
name: 'Swagger',
|
||||
components: { elFrame },
|
||||
computed: {
|
||||
...mapGetters([
|
||||
'swaggerApi'
|
||||
])
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user