11 changed files with 650 additions and 20 deletions
@ -0,0 +1,122 @@ |
|||
<template> |
|||
<div class="main-container"> |
|||
<el-card class="box-card !border-none" shadow="never"> |
|||
<div class="flex justify-between items-center"> |
|||
</div> |
|||
|
|||
<div class="mt-[10px]"> |
|||
<el-table |
|||
:data="customerResourceChangesTable.data" |
|||
size="large" |
|||
v-loading="customerResourceChangesTable.loading" |
|||
> |
|||
<template #empty> |
|||
<span>{{ |
|||
!customerResourceChangesTable.loading ? t('emptyData') : '' |
|||
}}</span> |
|||
</template> |
|||
|
|||
<el-table-column prop="created_at" label="时间" /> |
|||
|
|||
<el-table-column prop="name" label="操作人员" /> |
|||
|
|||
|
|||
<el-table-column prop="type" label="操作类型"> |
|||
<template #default="scope"> |
|||
<div v-html="scope.row.type"></div> |
|||
</template> |
|||
</el-table-column> |
|||
|
|||
<el-table-column prop="values" label="详细信息"> |
|||
<template #default="scope"> |
|||
<div v-html="scope.row.values"></div> |
|||
</template> |
|||
</el-table-column> |
|||
|
|||
|
|||
</el-table> |
|||
<div class="mt-[16px] flex justify-end"> |
|||
<el-pagination |
|||
v-model:current-page="customerResourceChangesTable.page" |
|||
v-model:page-size="customerResourceChangesTable.limit" |
|||
layout="total, sizes, prev, pager, next, jumper" |
|||
:total="customerResourceChangesTable.total" |
|||
@size-change="loadCustomerResourceChangesList()" |
|||
@current-change="loadCustomerResourceChangesList" |
|||
/> |
|||
</div> |
|||
</div> |
|||
|
|||
</el-card> |
|||
</div> |
|||
</template> |
|||
|
|||
<script lang="ts" setup> |
|||
import { reactive, ref, watch } from 'vue' |
|||
import { t } from '@/lang' |
|||
import { useDictionary } from '@/app/api/dict' |
|||
import { |
|||
getLogList, |
|||
} from '@/app/api/customer_resources' |
|||
import { img } from '@/utils/common' |
|||
import { ElMessageBox, FormInstance } from 'element-plus' |
|||
import { useRoute } from 'vue-router' |
|||
const route = useRoute() |
|||
const pageName = route.meta.title |
|||
|
|||
const props = defineProps({ |
|||
value: Number |
|||
}) |
|||
|
|||
|
|||
let customerResourceChangesTable = reactive({ |
|||
page: 1, |
|||
limit: 10, |
|||
total: 0, |
|||
loading: true, |
|||
data: [], |
|||
searchParam: { |
|||
customer_resource_id: props.value, |
|||
}, |
|||
}) |
|||
|
|||
|
|||
/** |
|||
* 获取客户资源表变更记录列表 |
|||
*/ |
|||
const loadCustomerResourceChangesList = (page: number = 1) => { |
|||
customerResourceChangesTable.loading = true |
|||
customerResourceChangesTable.page = page |
|||
|
|||
getLogList({ |
|||
page: customerResourceChangesTable.page, |
|||
limit: customerResourceChangesTable.limit, |
|||
...customerResourceChangesTable.searchParam, |
|||
}) |
|||
.then((res) => { |
|||
customerResourceChangesTable.loading = false |
|||
customerResourceChangesTable.data = res.data.data |
|||
customerResourceChangesTable.total = res.data.total |
|||
}) |
|||
.catch(() => { |
|||
customerResourceChangesTable.loading = false |
|||
}) |
|||
} |
|||
loadCustomerResourceChangesList() |
|||
|
|||
|
|||
|
|||
|
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
/* 多行超出隐藏 */ |
|||
.multi-hidden { |
|||
word-break: break-all; |
|||
text-overflow: ellipsis; |
|||
overflow: hidden; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,118 @@ |
|||
<template> |
|||
<div class="main-container"> |
|||
<el-card class="box-card !border-none" shadow="never"> |
|||
<div class="flex justify-between items-center"> |
|||
</div> |
|||
|
|||
<div class="mt-[10px]"> |
|||
<el-table |
|||
:data="customerResourceChangesTable.data" |
|||
size="large" |
|||
v-loading="customerResourceChangesTable.loading" |
|||
> |
|||
<template #empty> |
|||
<span>{{ |
|||
!customerResourceChangesTable.loading ? t('emptyData') : '' |
|||
}}</span> |
|||
</template> |
|||
|
|||
<el-table-column prop="payment_id" label="订单号" /> |
|||
|
|||
<el-table-column prop="course_name" label="课程名称" /> |
|||
|
|||
|
|||
<el-table-column prop="order_amount" label="金额" /> |
|||
|
|||
<el-table-column prop="order_status" label="状态" /> |
|||
|
|||
<el-table-column prop="created_at" label="下单时间" /> |
|||
|
|||
<el-table-column prop="type" label="支付方式" /> |
|||
|
|||
|
|||
</el-table> |
|||
<div class="mt-[16px] flex justify-end"> |
|||
<el-pagination |
|||
v-model:current-page="customerResourceChangesTable.page" |
|||
v-model:page-size="customerResourceChangesTable.limit" |
|||
layout="total, sizes, prev, pager, next, jumper" |
|||
:total="customerResourceChangesTable.total" |
|||
@size-change="loadCustomerResourceChangesList()" |
|||
@current-change="loadCustomerResourceChangesList" |
|||
/> |
|||
</div> |
|||
</div> |
|||
|
|||
</el-card> |
|||
</div> |
|||
</template> |
|||
|
|||
<script lang="ts" setup> |
|||
import { reactive, ref, watch } from 'vue' |
|||
import { |
|||
getOrderTableList, |
|||
} from '@/app/api/customer_resources' |
|||
import { useRoute } from 'vue-router' |
|||
const route = useRoute() |
|||
|
|||
const props = defineProps({ |
|||
value: Number |
|||
}) |
|||
|
|||
|
|||
let customerResourceChangesTable = reactive({ |
|||
page: 1, |
|||
limit: 10, |
|||
total: 0, |
|||
loading: true, |
|||
data: [], |
|||
searchParam: { |
|||
customer_resource_id: props.value, |
|||
}, |
|||
}) |
|||
|
|||
|
|||
const getProgress = (row) => { |
|||
if (!row.total) return 0; |
|||
return Math.round((row.used / row.total) * 100); |
|||
} |
|||
|
|||
/** |
|||
* 获取客户资源表变更记录列表 |
|||
*/ |
|||
const loadCustomerResourceChangesList = (page: number = 1) => { |
|||
customerResourceChangesTable.loading = true |
|||
customerResourceChangesTable.page = page |
|||
|
|||
getOrderTableList({ |
|||
page: customerResourceChangesTable.page, |
|||
limit: customerResourceChangesTable.limit, |
|||
...customerResourceChangesTable.searchParam, |
|||
}) |
|||
.then((res) => { |
|||
customerResourceChangesTable.loading = false |
|||
customerResourceChangesTable.data = res.data.data |
|||
customerResourceChangesTable.total = res.data.total |
|||
}) |
|||
.catch(() => { |
|||
customerResourceChangesTable.loading = false |
|||
}) |
|||
} |
|||
loadCustomerResourceChangesList() |
|||
|
|||
|
|||
|
|||
|
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
/* 多行超出隐藏 */ |
|||
.multi-hidden { |
|||
word-break: break-all; |
|||
text-overflow: ellipsis; |
|||
overflow: hidden; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,131 @@ |
|||
<template> |
|||
<div class="main-container"> |
|||
<el-card class="box-card !border-none" shadow="never"> |
|||
<div class="flex justify-between items-center"> |
|||
</div> |
|||
|
|||
<div class="mt-[10px]"> |
|||
<el-table |
|||
:data="customerResourceChangesTable.data" |
|||
size="large" |
|||
v-loading="customerResourceChangesTable.loading" |
|||
> |
|||
<template #empty> |
|||
<span>{{ |
|||
!customerResourceChangesTable.loading ? t('emptyData') : '' |
|||
}}</span> |
|||
</template> |
|||
|
|||
<el-table-column prop="course_name" label="课程名称" /> |
|||
|
|||
<el-table-column label="学习进度"> |
|||
<template #default="{ row }"> |
|||
<div style="display: flex; align-items: center; justify-content: space-between;"> |
|||
<el-progress |
|||
:percentage="getProgress(row)" |
|||
:text-inside="true" |
|||
stroke-width="18" |
|||
status="success" |
|||
style="flex: 1; max-width: 80%;" |
|||
/> |
|||
<span style="margin-left: 2px; white-space: nowrap; font-size: 14px; color: #666;"> |
|||
{{ row.used }}/{{ row.total }} |
|||
</span> |
|||
</div> |
|||
</template> |
|||
</el-table-column> |
|||
|
|||
|
|||
<el-table-column prop="status" label="状态" /> |
|||
|
|||
<el-table-column prop="start_date" label="开始时间" /> |
|||
|
|||
|
|||
|
|||
|
|||
</el-table> |
|||
<div class="mt-[16px] flex justify-end"> |
|||
<el-pagination |
|||
v-model:current-page="customerResourceChangesTable.page" |
|||
v-model:page-size="customerResourceChangesTable.limit" |
|||
layout="total, sizes, prev, pager, next, jumper" |
|||
:total="customerResourceChangesTable.total" |
|||
@size-change="loadCustomerResourceChangesList()" |
|||
@current-change="loadCustomerResourceChangesList" |
|||
/> |
|||
</div> |
|||
</div> |
|||
|
|||
</el-card> |
|||
</div> |
|||
</template> |
|||
|
|||
<script lang="ts" setup> |
|||
import { reactive, ref, watch } from 'vue' |
|||
import { |
|||
getStudentCoursesList, |
|||
} from '@/app/api/customer_resources' |
|||
import { useRoute } from 'vue-router' |
|||
const route = useRoute() |
|||
|
|||
const props = defineProps({ |
|||
value: Number |
|||
}) |
|||
|
|||
|
|||
let customerResourceChangesTable = reactive({ |
|||
page: 1, |
|||
limit: 10, |
|||
total: 0, |
|||
loading: true, |
|||
data: [], |
|||
searchParam: { |
|||
customer_resource_id: props.value, |
|||
}, |
|||
}) |
|||
|
|||
|
|||
const getProgress = (row) => { |
|||
if (!row.total) return 0; |
|||
return Math.round((row.used / row.total) * 100); |
|||
} |
|||
|
|||
/** |
|||
* 获取客户资源表变更记录列表 |
|||
*/ |
|||
const loadCustomerResourceChangesList = (page: number = 1) => { |
|||
customerResourceChangesTable.loading = true |
|||
customerResourceChangesTable.page = page |
|||
|
|||
getStudentCoursesList({ |
|||
page: customerResourceChangesTable.page, |
|||
limit: customerResourceChangesTable.limit, |
|||
...customerResourceChangesTable.searchParam, |
|||
}) |
|||
.then((res) => { |
|||
customerResourceChangesTable.loading = false |
|||
customerResourceChangesTable.data = res.data.data |
|||
customerResourceChangesTable.total = res.data.total |
|||
}) |
|||
.catch(() => { |
|||
customerResourceChangesTable.loading = false |
|||
}) |
|||
} |
|||
loadCustomerResourceChangesList() |
|||
|
|||
|
|||
|
|||
|
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
/* 多行超出隐藏 */ |
|||
.multi-hidden { |
|||
word-break: break-all; |
|||
text-overflow: ellipsis; |
|||
overflow: hidden; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
</style> |
|||
Loading…
Reference in new issue