提交 ef37dad0 authored 作者: wangyizheng's avatar wangyizheng

新增案例列表

上级 06793a48
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -75,7 +75,7 @@
"axios": "^0.20.0",
"core-js": "^3.6.5",
"cross-env": "^7.0.2",
"element-ui": "^2.13.2",
"element-ui": "^2.15.0",
"jquery": "^3.5.1",
"js-cookie": "^2.2.1",
"lodash": "^4.17.20",
......@@ -83,6 +83,7 @@
"vue-i18n": "^8.22.0",
"vue-loader": "^15.9.3",
"vue-meta-info": "^0.1.7",
"vue-pdf": "^4.2.0",
"vue-router": "^3.4.6",
"vue-template-compiler": "^2.6.12",
"vuex": "^3.5.1"
......
import httpRequest from '@/utils/axios'
// 分类列表
export function case2s(params = {}) {
return httpRequest.get('/api/opera/v2/training/cases', { params })
}
src/assets/favicon.ico

16.6 KB | W: | H:

src/assets/favicon.ico

2.0 KB | W: | H:

src/assets/favicon.ico
src/assets/favicon.ico
src/assets/favicon.ico
src/assets/favicon.ico
  • 2-up
  • Swipe
  • Onion skin
......@@ -27,11 +27,16 @@ export default {
defaultMenus: [
{
title: '分类管理',
icon: 'el-icon-s-management',
icon: '',
path: '/tranning/categories'
},
{
title: '案例背景编辑',
title: '案例管理',
icon: '',
path: '/tranning/cases'
},
{
title: '案例背景编辑[一期]',
icon: '',
path: '/yhfq/albj'
// children: [
......@@ -40,8 +45,8 @@ export default {
// // { title: '用户群分析', path: '/yhfq/yhqfx' }
// ]
},
{ title: '用户群特征编辑', icon: '', path: '/characteristicsEditor' },
{ title: '用户触达编辑', icon: '', path: '/triggerEditor' }
{ title: '用户群特征编辑[一期]', icon: '', path: '/characteristicsEditor' },
{ title: '用户触达编辑[一期]', icon: '', path: '/triggerEditor' }
]
}
},
......
......@@ -30,6 +30,7 @@ export default {
.app-main {
flex: 1;
overflow: hidden;
}
}
</style>
<template>
<div>
<div>
<el-card class="box-card">
<el-breadcrumb separator-class="el-icon-arrow-right">
<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<el-breadcrumb-item>案例管理</el-breadcrumb-item>
</el-breadcrumb>
</el-card>
</div>
<div>
<el-card class="box-card"></el-card>
</div>
<div>
<el-card class="box-card">
<el-table
:data="tableData"
border
stripe
size="mini"
style="width: 100%">
<el-table-column
fixed
prop="name"
label="案例名称">
</el-table-column>
<el-table-column label="案例分类">
<template slot-scope="scope">
<div slot="reference" class="name-wrapper" v-if="scope.row.categories">
<el-tag type="" effect="plain" size="mini" v-for="(category, index) in scope.row.categories" :key="index">
{{ category.name }}
</el-tag>
</div>
</template>
</el-table-column>
<el-table-column label="风险等级">
<template slot-scope="scope">
<el-tag type="" effect="dark" size="mini">
{{ getLevel(scope.row.level) }}
</el-tag>
</template>
</el-table-column>
<el-table-column label="pdf附件" width="100px">
<template slot-scope="scope">
<el-button size="mini" round @click="preViewPdf(scope.row.accessory)">预览pdf</el-button>
</template>
</el-table-column>
<el-table-column label="背景图" width="130px">
<template slot-scope="scope">
<div slot="reference" class="name-wrapper">
<div class="demo-image__preview">
<el-image
style="width: 100px; height: 100px;"
fit="scale-down"
:src="scope.row.url"
:preview-src-list="[scope.row.url]">
</el-image>
</div>
</div>
</template>
</el-table-column>
<el-table-column label="产品概况" width="120px">
<template slot-scope="scope">
<el-button size="mini" round v-if="scope.row.production_detail" @click="preViewProduction(scope.row.production_detail)">点击查看</el-button>
</template>
</el-table-column>
<el-table-column label="基金投资与净值表现" width="150px">
<template slot-scope="scope">
<el-button size="mini" round v-if="scope.row.fund_detail" @click="preViewFund(scope.row.fund_detail)">点击查看</el-button>
</template>
</el-table-column>
<el-table-column label="投资本基金涉及的费用" width="150px">
<template slot-scope="scope">
<el-button size="mini" round v-if="scope.row.invest_detail" @click="preViewInvest(scope.row.invest_detail)">点击查看</el-button>
</template>
</el-table-column>
<el-table-column label="创建时间">
<template slot-scope="scope">
<i class="el-icon-time"></i>
<span style="margin-left: 10px">{{ scope.row.created_at }}</span>
</template>
</el-table-column>
<el-table-column label="更新时间">
<template slot-scope="scope">
<i class="el-icon-time"></i>
<span style="margin-left: 10px">{{ scope.row.updated_at }}</span>
</template>
</el-table-column>
<el-table-column
fixed="right"
label="操作"
width="100">
<template slot-scope="scope">
<el-select size="mini" :value="opera" @change="operation" placeholder="请选择">
<el-option :value="{ tag: 'detail', row: scope.row }" label="详情"></el-option>
<el-option :value="{ tag: 'edit', row: scope.row }" label="编辑"></el-option>
<el-option :value="{ tag: 'delete', row: scope.row }" label="删除"></el-option>
</el-select>
</template>
</el-table-column>
</el-table>
<div class="block">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[10, 20, 30, 50, 100]"
:page-size="limit"
layout="total, sizes, prev, pager, next, jumper"
:total="totalPage">
</el-pagination>
</div>
</el-card>
</div>
<div>
<el-dialog title="PDF预览" :visible.sync="pdfDialogFormVisible" width="90%" center @close='closeDialog'>
<div style="margin-bottom: 15px; text-align: right">
<el-button type="primary" size="mini" @click.stop="previousPage">
上一页
</el-button>
<el-button type="primary" size="mini" @click.stop="nextPage">
下一页
</el-button>
<span>当前第{{pdfPage}}页 / 共{{pageCount}}页</span>
</div>
<pdf
ref="pdf"
:src="pdfUrl"
:page="pdfPage"
@num-pages="pageCount = $event"
@page-loaded="pdfPage = $event"
style="display: inline-block; width: 100%"
>
</pdf>
</el-dialog>
</div>
<div>
<el-dialog title="产品概况" :visible.sync="productionDialogFormVisible" width="90%" center>
<el-card :body-style="{ padding: '0px' }">
<div style="padding: 14px;" v-for="(production, index) in productionDetail" :key="index">
<div>
<span><strong>产品信息:</strong></span><span>{{ production.name }}</span>
</div>
<div class="bottom clearfix">
<span><strong>关键词配置</strong></span>
<div v-if="production.keywords" v-for="(keyword, i) in production.keywords" :key="i">
<span>关键词:{{ keyword.name }}, 得分:{{ keyword.score}}</span>
<br/>
</div>
</div>
<el-divider v-if="index < productionDetail.length - 1" content-position="right"></el-divider>
</div>
</el-card>
</el-dialog>
</div>
<div>
<el-dialog title="基金投资与净值表现sds" :visible.sync="fundDialogFormVisible" width="90%" center>
<el-card :body-style="{ padding: '0px' }">
<div style="padding: 14px;" v-for="(production, index) in fundDetail" :key="index">
<div>
<span><strong>产品信息:</strong></span><span>{{ production.name }}</span>
</div>
<div class="bottom clearfix">
<span><strong>关键词配置</strong></span>
<div v-if="production.keywords" v-for="(keyword, i) in production.keywords" :key="i">
<span>关键词:{{ keyword.name }}, 得分:{{ keyword.score}}</span>
<br/>
</div>
</div>
<el-divider v-if="index < fundDetail.length - 1" content-position="right"></el-divider>
</div>
</el-card>
</el-dialog>
</div>
<div>
<el-dialog title="投资本基金涉及的费用" :visible.sync="investDialogFormVisible" width="90%" center>
<el-card :body-style="{ padding: '0px' }">
<div style="padding: 14px;" v-for="(production, index) in investDetail" :key="index">
<div>
<span><strong>产品信息:</strong></span><span>{{ production.name }}</span>
</div>
<div class="bottom clearfix">
<span><strong>关键词配置</strong></span>
<div v-if="production.keywords" v-for="(keyword, i) in production.keywords" :key="i">
<span>关键词:{{ keyword.name }}, 得分:{{ keyword.score}}</span>
<br/>
</div>
</div>
<el-divider v-if="index < investDetail.length - 1" content-position="right"></el-divider>
</div>
</el-card>
</el-dialog>
</div>
</div>
</template>
<script>
import * as casesApi from '@/api/cases2'
import pdf from 'vue-pdf'
export default {
name: 'index',
components: {
pdf
},
mounted() {
this.list({ page: this.currentPage, limit: this.limit })
},
data() {
return {
tableData: [],
opera: {},
currentPage: 1,
totalPage: 0,
limit: 10,
levelArr: [
{ level: 1, content: '低风险' },
{ level: 2, content: '中风险' },
{ level: 3, content: '高风险' }
],
pdfDialogFormVisible: false,
pdfUrl: '',
pdfPage: 1,
pageCount: 0,
productionDetail: [],
productionDialogFormVisible: false,
fundDetail: [],
fundDialogFormVisible: false,
investDetail: [],
investDialogFormVisible: false
}
},
methods: {
handleSizeChange(val) {
this.list({ page: this.currentPage, limit: val })
},
handleCurrentChange(val) {
this.list({ page: val, limit: this.limit })
},
list(params = {}) {
casesApi.case2s(params).then(res => {
if (res.code === 0) {
this.tableData = res.data.data
this.currentPage = res.data.current_page
this.totalPage = res.data.total
} else {
this.$message.error(res.message)
return false
}
})
},
getLevel(level) {
var detail = ''
for (var index in this.levelArr) {
console.log(this.levelArr[index])
if (this.levelArr[index].level === level) {
detail = this.levelArr[index].content
break
}
}
return detail
},
operation(opera) {
switch (opera.tag) {
case 'detail':
break
case 'edit':
break
case 'delete':
break
}
},
preViewPdf(url) {
this.pdfDialogFormVisible = true
this.pdfUrl = url
},
// 关闭窗口初始化PDF页码
closeDialog() {
this.pdfPage = 1
},
// PDF改变页数
previousPage() {
var p = this.pdfPage
p = p > 1 ? p - 1 : this.pageCount
this.pdfPage = p
},
nextPage() {
var p = this.pdfPage
p = p < this.pageCount ? p + 1 : 1
this.pdfPage = p
},
// 预览产品概况
preViewProduction(arrStr) {
this.productionDetail = JSON.parse(arrStr)
this.productionDialogFormVisible = true
},
// 预览产品概况
preViewFund(arrStr) {
this.fundDetail = JSON.parse(arrStr)
this.fundDialogFormVisible = true
},
// 预览产品概况
preViewInvest(arrStr) {
this.investDetail = JSON.parse(arrStr)
this.investDialogFormVisible = true
}
}
}
</script>
<style scoped>
</style>
......@@ -267,7 +267,7 @@ export default {
this.list({ page: this.currentPage, limit: val })
},
handleCurrentChange(val) {
this.list({ page: val, limit: this.currentPage })
this.list({ page: val, limit: this.limit })
},
handlePictureCardPreview(file) {
if (!this.mainForm.url) {
......
......@@ -16,7 +16,8 @@ const userGroup = [
{ path: '/yhfq/yhqfx', component: () => import(/* webpackChunkName: "usergroup" */ '@/pages/yhfq/yhqfx') },
/* 版本2:首页 */
{ path: '/tranning', redirect: '/tranning/categories' },
{ path: '/tranning/categories', name: 'category', component: () => import('@/pages/v2/categories/category') }
{ path: '/tranning/categories', name: 'category', component: () => import('@/pages/v2/categories/category') },
{ path: '/tranning/cases', name: 'cases', component: () => import('@/pages/v2/cases/index') }
]
export default [
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论