master
xy 2 years ago
parent 023f029cd7
commit 990c7b4ed7

@ -4,7 +4,7 @@
<el-card shadow="never" style="margin-top: 20px;"> <el-card shadow="never" style="margin-top: 20px;">
<template #header> <template #header>
<slot name="header"> <slot name="header">
<vxe-toolbar :export="isHasAuth('export')" :print="isHasAuth('print')" custom ref="toolbar"> <vxe-toolbar ref="toolbar" :export="isHasAuth('export')" :print="isHasAuth('print')" custom>
<template #buttons> <template #buttons>
<el-button <el-button
v-if="isHasAuth('create')" v-if="isHasAuth('create')"
@ -12,8 +12,7 @@
type="primary" type="primary"
size="small" size="small"
@click="isShowAdd = true" @click="isShowAdd = true"
>新增</el-button >新增</el-button>
>
<el-button <el-button
v-if="isHasAuth('search')" v-if="isHasAuth('search')"
icon="el-icon-search" icon="el-icon-search"
@ -21,8 +20,7 @@
plain plain
size="small" size="small"
@click="getList" @click="getList"
>搜索</el-button >搜索</el-button>
>
</template> </template>
</vxe-toolbar> </vxe-toolbar>
</slot> </slot>
@ -47,7 +45,6 @@
] ]
} }
}" }"
@menu-click="contextMenuClickEvent"
:row-config="{ isCurrent: true, isHover: true }" :row-config="{ isCurrent: true, isHover: true }"
:column-config="{ resizable: true }" :column-config="{ resizable: true }"
:export-config="{}" :export-config="{}"
@ -59,14 +56,15 @@
isHover: true, isHover: true,
autoClear: false, autoClear: false,
}" }"
:align="allAlign" :align="allAlign"
:data="tableData" :data="tableData"
@menu-click="contextMenuClickEvent"
> >
<vxe-column type="seq" width="58" align="center" /> <vxe-column type="seq" width="58" align="center" />
<vxe-column field="no" title="退款编号" width="180" align="center" />
<vxe-column field="order.no" title="订单编号" width="180" align="center" />
<vxe-column <vxe-column
align="center" align="center"
@ -76,40 +74,48 @@
:edit-render="{ name: 'VxeSelect', options: [{'value':0,'label':'未退款'},{'value':1,'label':'退款成功'},{'value':2,'label':'退款失败'}], props: { multiple: false }, optionProps: { value: 'value', label: 'label' } }" :edit-render="{ name: 'VxeSelect', options: [{'value':0,'label':'未退款'},{'value':1,'label':'退款成功'},{'value':2,'label':'退款失败'}], props: { multiple: false }, optionProps: { value: 'value', label: 'label' } }"
/> />
<vxe-column field="created_at" title="创建时间" width="180" align="center" />
<vxe-column field="operate" header-align="center" title="操作" min-width="220"> <vxe-column field="operate" header-align="center" title="操作" min-width="220">
<template #default="{ row }"> <template #default="{ row }">
<template v-if="isActiveStatus(row)"> <template v-if="isActiveStatus(row)">
<el-button size="small" type="primary" @click="saveRowEvent(row)" <el-button
>保存</el-button size="small"
> type="primary"
@click="saveRowEvent(row)"
>保存</el-button>
<el-button <el-button
size="small" size="small"
type="primary" type="primary"
plain plain
@click="cancelRowEvent(row)" @click="cancelRowEvent(row)"
>取消</el-button >取消</el-button>
>
</template> </template>
<template v-else> <template v-else>
<el-button v-if="isHasAuth('detail')" size="small" type="primary" plain @click="detail(row)" <el-button
>查看</el-button v-if="isHasAuth('detail')"
> size="small"
<el-button v-if="isHasAuth('edit')" size="small" type="warning" @click="editRowEvent(row)" type="primary"
>编辑</el-button plain
> @click="detail(row)"
>查看</el-button>
<el-button
v-if="isHasAuth('edit')"
size="small"
type="warning"
@click="editRowEvent(row)"
>编辑</el-button>
<el-button <el-button
v-if="isHasAuth('delete')" v-if="isHasAuth('delete')"
size="small" size="small"
type="danger" type="danger"
@click="destroyRowEvent(row)" @click="destroyRowEvent(row)"
>删除</el-button >删除</el-button>
>
</template> </template>
</template> </template>
</vxe-column> </vxe-column>
</vxe-table> </vxe-table>
<el-pagination <el-pagination
style="margin-top: 10px;display: flex;justify-content: flex-end;" style="margin-top: 10px;display: flex;justify-content: flex-end;"
:current-page.sync="select.page" :current-page.sync="select.page"
@ -150,25 +156,25 @@
</template> </template>
<script> <script>
import VxeUI from "vxe-pc-ui"; import VxeUI from 'vxe-pc-ui'
import { authMixin } from "@/mixin/authMixin" import { authMixin } from '@/mixin/authMixin'
import { uploadSize } from "@/settings"; import { uploadSize } from '@/settings'
import { deepCopy } from "@/utils"; import { deepCopy } from '@/utils'
import { destroy, index, save } from "@/api/order-refund/order-refund"; import { destroy, index, save } from '@/api/order-refund/order-refund'
import AddOrderRefund from "./components/AddOrderRefund.vue"; import AddOrderRefund from './components/AddOrderRefund.vue'
import ShowOrderRefund from "./components/ShowOrderRefund.vue"; import ShowOrderRefund from './components/ShowOrderRefund.vue'
import axios from "axios"; import axios from 'axios'
import { getToken } from "@/utils/auth"; import { getToken } from '@/utils/auth'
export default { export default {
name: "OrderRefund", name: 'OrderRefund',
mixins: [authMixin],
components: { components: {
AddOrderRefund, AddOrderRefund,
ShowOrderRefund, ShowOrderRefund
}, },
mixins: [authMixin],
data() { data() {
return { return {
uploadSize, uploadSize,
@ -182,7 +188,7 @@
page: 1, page: 1,
page_size: 20, page_size: 20,
keyword: '', keyword: '',
show_relation: [], show_relation: ['order']
}, },
total: 0, total: 0,
@ -191,23 +197,22 @@
form: { form: {
id: '', id: '',
status: '', status: ''
}, },
validRules: { validRules: {
}, }
}; }
}, },
computed: { computed: {
isActiveStatus() { isActiveStatus() {
return function(row) { return function(row) {
if (this.$refs["table"]) { if (this.$refs['table']) {
return this.$refs["table"].isEditByRow(row); return this.$refs['table'].isEditByRow(row)
}
} }
};
}, },
isHasAuth() { isHasAuth() {
return function(auth) { return function(auth) {
@ -216,8 +221,7 @@
} }
}, },
created() { created() {
this.getList()
this.getList();
}, },
mounted() { mounted() {
this.bindToolbar() this.bindToolbar()
@ -225,15 +229,15 @@
}, },
methods: { methods: {
calcTableHeight() { calcTableHeight() {
let clientHeight = document.documentElement.clientHeight; const clientHeight = document.documentElement.clientHeight
let cardTitle = document.querySelector(".el-card__header")?.getBoundingClientRect()?.height; const cardTitle = document.querySelector('.el-card__header')?.getBoundingClientRect()?.height
let search = document.querySelector(".vxe-toolbar")?.getBoundingClientRect()?.height; const search = document.querySelector('.vxe-toolbar')?.getBoundingClientRect()?.height
let paginationHeight = (document.querySelector(".el-pagination")?.getBoundingClientRect()?.height ?? 0) + 10; //分页的高度 const paginationHeight = (document.querySelector('.el-pagination')?.getBoundingClientRect()?.height ?? 0) + 10 // 分页的高度
let topHeight = 50; //页面 头部 const topHeight = 50 // 页面 头部
let padding = 80; const padding = 80
let margin = 20; const margin = 20
this.tableHeight = this.tableHeight =
clientHeight - cardTitle - search - paginationHeight - topHeight - padding - margin; clientHeight - cardTitle - search - paginationHeight - topHeight - padding - margin
}, },
contextMenuClickEvent({ menu, row, column }) { contextMenuClickEvent({ menu, row, column }) {
switch (menu.code) { switch (menu.code) {
@ -253,19 +257,17 @@
} }
}, },
async detail(row) { async detail(row) {
await this.$refs["ShowOrderRefund"].getDetail(row.id) await this.$refs['ShowOrderRefund'].getDetail(row.id)
this.isShowDetail = true this.isShowDetail = true
}, },
uploadMethod(file) { uploadMethod(file) {
const formData = new FormData() const formData = new FormData()
formData.append('file', file) formData.append('file', file)
window.$_uploading = true window.$_uploading = true
return axios.post(process.env.VUE_APP_UPLOAD_API, formData, { return axios.post(process.env.VUE_APP_UPLOAD_API, formData, {
headers: { headers: {
Authorization: `Bearer ${getToken()}`, Authorization: `Bearer ${getToken()}`
} }
}).then((response) => { }).then((response) => {
window.$_uploading = false window.$_uploading = false
@ -276,7 +278,7 @@
url: response.data.url url: response.data.url
} }
} else { } else {
this.$message.error("上传失败") this.$message.error('上传失败')
} }
}).catch(_ => { }).catch(_ => {
window.$_uploading = false window.$_uploading = false
@ -284,94 +286,94 @@
}, },
bindToolbar() { bindToolbar() {
this.$nextTick(() => { this.$nextTick(() => {
if (this.$refs["table"] && this.$refs["toolbar"]) { if (this.$refs['table'] && this.$refs['toolbar']) {
this.$refs["table"].connect(this.$refs["toolbar"]); this.$refs['table'].connect(this.$refs['toolbar'])
} }
}); })
}, },
editRowEvent(row) { editRowEvent(row) {
if (this.$refs["table"]) { if (this.$refs['table']) {
this.$refs["table"].setEditRow(row); this.$refs['table'].setEditRow(row)
} }
}, },
cancelRowEvent(row) { cancelRowEvent(row) {
if (this.$refs["table"]) { if (this.$refs['table']) {
this.$refs["table"].clearEdit().then(() => { this.$refs['table'].clearEdit().then(() => {
// 还原行数据 // 还原行数据
this.$refs["table"].revertData(row); this.$refs['table'].revertData(row)
}); })
} }
}, },
async getList() { async getList() {
this.loading = true; this.loading = true
try { try {
const res = await index(this.select, false); const res = await index(this.select, false)
this.tableData = res.data; this.tableData = res.data
this.total = res.total; this.total = res.total
this.loading = false; this.loading = false
} catch (err) { } catch (err) {
console.error(err); console.error(err)
this.loading = false; this.loading = false
} }
}, },
async saveRowEvent(row) { async saveRowEvent(row) {
if (window.$_uploading) { if (window.$_uploading) {
this.$message.warning("文件正在上传中") this.$message.warning('文件正在上传中')
return return
} }
try { try {
const errMap = await this.$refs["table"].validate(); const errMap = await this.$refs['table'].validate()
if (errMap) { if (errMap) {
throw new Error(errMap); throw new Error(errMap)
} }
await this.$confirm("确认保存?", "提示", { await this.$confirm('确认保存?', '提示', {
confirmButtonText: "确认", confirmButtonText: '确认',
cancelButtonText: "取消", cancelButtonText: '取消'
}); })
await this.$refs["table"].clearEdit(); await this.$refs['table'].clearEdit()
let form = deepCopy(this.form); const form = deepCopy(this.form)
for (const key in form) { for (const key in form) {
form[key] = row[key]; form[key] = row[key]
} }
this.loading = true; this.loading = true
await save(form, false); await save(form, false)
await this.getList(); await this.getList()
this.loading = false; this.loading = false
} catch (err) { } catch (err) {
this.loading = false; this.loading = false
} }
}, },
async destroyRowEvent(row) { async destroyRowEvent(row) {
try { try {
await this.$confirm("确认删除?", "提示", { await this.$confirm('确认删除?', '提示', {
confirmButtonText: "确认", confirmButtonText: '确认',
cancelButtonText: "取消", cancelButtonText: '取消'
}); })
this.loading = true; this.loading = true
if (row.id) { if (row.id) {
await destroy({ await destroy({
id: row.id, id: row.id
},false); }, false)
await this.getList(); await this.getList()
} else { } else {
console.log(row); console.log(row)
this.tableData.splice( this.tableData.splice(
this.tableData.findIndex((i) => i._X_ROW_KEY === row._X_ROW_KEY), this.tableData.findIndex((i) => i._X_ROW_KEY === row._X_ROW_KEY),
1 1
); )
} }
this.loading = false; this.loading = false
} catch (err) { } catch (err) {
this.loading = false; this.loading = false
}
} }
},
}, }
}; }
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">

Loading…
Cancel
Save