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