Skip to content

X
x-training-admin
提交 cd9acc06 authored 作者: wangyizheng's avatar wangyizheng
浏览文件
操作

案例列表|添加案例

上级 559e0dd9
隐藏空白字符变更
内嵌 并排
正在显示 包含 279 行增加 和 111 行删除
src/api/cases2.js
浏览文件 @ cd9acc06
......@@ -18,7 +18,7 @@ export function createCase2(data) {
var headers = {
'Content-Type': 'application/json'
}
return httpRequest.post('/api/opera/v2/training/cases', data, { headers })
return httpRequest.post('/api/opera/v2/training/case', data, { headers })
}
// 案例详情
......
src/pages/v2/cases/index.vue
浏览文件 @ cd9acc06
......@@ -41,7 +41,7 @@
<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">
<el-tag type="" effect="plain" size="mini" v-for="(category, categoryIndex) in scope.row.categories" :key="categoryIndex">
{{ category.name }}
</el-tag>
</div>
......@@ -151,7 +151,7 @@
<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 style="padding: 14px;" v-for="(production, productionIndex) in productionDetail" :key="productionIndex">
<div>
<span><strong>产品信息：</strong></span><span>{{ production.name }}</span>
</div>
......@@ -162,7 +162,7 @@
<br/>
</div>
</div>
<el-divider v-if="index < productionDetail.length - 1" content-position="right"></el-divider>
<el-divider v-if="productionIndex < productionDetail.length - 1" content-position="right"></el-divider>
</div>
</el-card>
</el-dialog>
......@@ -206,92 +206,144 @@
</el-dialog>
</div>
<div>
<el-drawer
title="创建案例"
:visible.sync="drawer"
:direction="direction"
:before-close="handleClose"
ref="drawer"
size="50%">
<div class="demo-drawer__content">
<el-form :model="addForm" size="mini">
<el-form-item label="案例名称" :label-width="formLabelWidth">
<el-input v-model="addForm.name" autocomplete="off"></el-input>
</el-form-item>
<el-form-item label="案例等级" :label-width="formLabelWidth">
<el-select v-model="addForm.level" placeholder="请选择案例等级">
<el-option label="低风险" value="1"></el-option>
<el-option label="中风险" value="2"></el-option>
<el-option label="高风险" value="3"></el-option>
</el-select>
</el-form-item>
<el-form-item label="案例分类" :label-width="formLabelWidth">
<el-cascader
v-model="addForm.category_id"
:options="options"
:show-all-levels="false"
filterable
:before-filter="searchCategory"
:props="{value: 'id', label: 'name', emitPath: false}"
placeholder="试试搜索：分类">
</el-cascader>
</el-form-item>
<el-form-item label="产品说明书（pdf附件）" :label-width="formLabelWidth">
<el-upload
class="upload-pdf"
action="/api/opera/v1/file/upload"
:on-preview="handlePreview"
:on-remove="handleRemove"
:limit="1"
:on-exceed="handleExceed">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">只能上传pdf文件</div>
</el-upload>
</el-form-item>
<el-form-item label="图片" :label-width="formLabelWidth">
<el-upload
action="/api/opera/v1/file/upload"
list-type="picture-card"
:limit="1"
:multiple="false"
:data="{ type: 'image' }"
:on-preview="createPictureCardPreview">
<i class="el-icon-plus"></i>
</el-upload>
<el-dialog :visible.sync="visible" append-to-body>
<img width="100%" :src="addForm.url" alt="">
<el-input :v-model="addForm.url" :value="addForm.url"></el-input>
</el-dialog>
</el-form-item>
<el-form-item>
<el-divider content-position="left">产品概况配置</el-divider>
</el-form-item>
<div v-for="(item, index) in addForm.production_detail" :key="index">
<div style="margin-left: 5%">
<i class="el-icon-circle-plus-outline" @click="addNames('production_detail', index)">添加</i>
<i class="el-icon-remove-outline" @click="removeNames('production_detail', index)">删除</i>
</div>
<el-form-item style="margin-left: 5%; margin-top: 2%" label-width="formLabelWidth" label="二级标题">
<el-input v-model="item.name" placeholder="请输入内容" style="width: 50%"></el-input>
</el-form-item>
<div v-for="(keywrod, index1) in item.keywords" :key="index1" style="margin-top: 2%">
<el-form-item style="margin-left: -1%" label="关键词" :label-width="formLabelWidth">
<el-input v-model="keywrod.name" placeholder="请输入关键词" style="width: 50%"></el-input>
<el-input v-model="keywrod.score" placeholder="请输入得分" style="width: 20%"></el-input>
<i class="el-icon-circle-plus-outline" @click="addKeyword('production_detail', index1)"></i>
<i class="el-icon-remove-outline" @click="removeKeyword('production_detail', index1)"></i>
<el-scrollbar style="height: 80%">
<el-drawer
title="创建案例"
:visible.sync="drawer"
:direction="direction"
:append-to-body="true"
:withHeader="true"
:before-close="handleClose"
ref="drawer"
size="50%">
<div class="demo-drawer__content">
<el-form :model="addForm" size="mini">
<el-form-item label="案例名称" :label-width="formLabelWidth">
<el-input v-model="addForm.name" autocomplete="off"></el-input>
</el-form-item>
</div>
<el-form-item label="案例等级" :label-width="formLabelWidth">
<el-select v-model="addForm.level" placeholder="请选择案例等级">
<el-option label="低风险" value="1"></el-option>
<el-option label="中风险" value="2"></el-option>
<el-option label="高风险" value="3"></el-option>
</el-select>
</el-form-item>
<el-form-item label="案例分类" :label-width="formLabelWidth">
<el-cascader
v-model="addForm.category_id"
:options="options"
:show-all-levels="false"
filterable
:before-filter="searchCategory"
:props="{value: 'id', label: 'name', emitPath: false}"
placeholder="试试搜索：分类">
</el-cascader>
</el-form-item>
<el-form-item label="产品说明书（pdf附件）" :label-width="formLabelWidth">
<el-upload
class="upload-pdf"
action="/api/opera/v1/file/upload"
:on-preview="handlePreview"
:on-remove="handleRemove"
:on-success="uploadSuccess"
:limit="1"
:on-exceed="handleExceed">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">只能上传pdf文件</div>
</el-upload>
</el-form-item>
<el-form-item label="图片" :label-width="formLabelWidth">
<el-upload
action="/api/opera/v1/file/upload"
list-type="picture-card"
:limit="1"
:on-success="uploadUrlSuccess"
:multiple="false"
:data="{ type: 'image' }"
:on-preview="createPictureCardPreview">
<i class="el-icon-plus"></i>
</el-upload>
<el-dialog :visible.sync="visible" append-to-body>
<img width="100%" :src="addForm.url" alt="">
<el-input :v-model="addForm.url" :value="addForm.url"></el-input>
</el-dialog>
</el-form-item>
<el-form-item>
<el-divider content-position="left">产品概况配置</el-divider>
</el-form-item>
<div v-for="(item, index) in addForm.production_detail" :key="'production-'+index">
<div style="margin-left: 5%">
<i class="el-icon-circle-plus-outline" @click="addNames('production_detail', index)">添加</i>
<i class="el-icon-remove-outline" @click="removeNames('production_detail', index)">删除</i>
</div>
<el-form-item style="margin-left: 5%; margin-top: 2%" label-width="formLabelWidth" label="二级标题">
<el-input v-model="item.name" placeholder="请输入内容" style="width: 50%"></el-input>
</el-form-item>
<div v-for="(keywrod, index1) in item.keywords" :key="'production-'+index1" style="margin-top: 2%">
<el-form-item style="margin-left: 2%" label="关键词" :label-width="formLabelWidth">
<el-input v-model="keywrod.name" placeholder="请输入关键词" style="width: 50%"></el-input>
<span>关键词得分：</span>
<el-input v-model="keywrod.score" placeholder="得分" style="width: 20%"></el-input>
<i class="el-icon-circle-plus-outline" @click="addKeywords('production_detail', index)"></i>
<i class="el-icon-remove-outline" @click="removeKeywords('production_detail', index, index1)"></i>
</el-form-item>
</div>
</div>
<el-form-item>
<el-divider content-position="left">案例基金与净值表现配置</el-divider>
</el-form-item>
<div v-for="(fundItem, fundIndex) in addForm.fund_detail" :key="'fund-'+fundIndex">
<div style="margin-left: 5%">
<i class="el-icon-circle-plus-outline" @click="addNames('fund_detail', fundIndex)">添加</i>
<i class="el-icon-remove-outline" @click="removeNames('fund_detail', fundIndex)">删除</i>
</div>
<el-form-item style="margin-left: 5%; margin-top: 2%" label-width="formLabelWidth" label="二级标题">
<el-input v-model="fundItem.name" placeholder="请输入内容" style="width: 50%"></el-input>
</el-form-item>
<div v-for="(fundKeywrod, fundIndex1) in fundItem.keywords" :key="'fund-'+fundIndex1" style="margin-top: 2%">
<el-form-item style="margin-left: 2%" label="关键词" :label-width="formLabelWidth">
<el-input v-model="fundKeywrod.name" placeholder="请输入关键词" style="width: 50%"></el-input>
<span>关键词得分：</span>
<el-input v-model="fundKeywrod.score" placeholder="得分" style="width: 20%"></el-input>
<i class="el-icon-circle-plus-outline" @click="addKeywords('fund_detail', fundIndex)"></i>
<i class="el-icon-remove-outline" @click="removeKeywords('fund_detail', fundIndex, fundIndex1)"></i>
</el-form-item>
</div>
</div>
<el-form-item>
<el-divider content-position="left">案例投资本基金净值表现配置</el-divider>
</el-form-item>
<div v-for="(investItem, investIndex) in addForm.invest_detail" :key="'invest-'+investIndex">
<div style="margin-left: 5%">
<i class="el-icon-circle-plus-outline" @click="addNames('invest_detail', investIndex)">添加</i>
<i class="el-icon-remove-outline" @click="removeNames('invest_detail', investIndex)">删除</i>
</div>
<el-form-item style="margin-left: 5%; margin-top: 2%" label-width="formLabelWidth" label="二级标题">
<el-input v-model="investItem.name" placeholder="请输入内容" style="width: 50%"></el-input>
</el-form-item>
<div v-for="(investKeyword, investIndex1) in investItem.keywords" :key="'invest-'+investIndex1" style="margin-top: 2%">
<el-form-item style="margin-left: 2%" label="关键词" :label-width="formLabelWidth">
<el-input v-model="investKeyword.name" placeholder="请输入关键词" style="width: 50%"></el-input>
<span>关键词得分：</span>
<el-input v-model="investKeyword.score" placeholder="得分" style="width: 20%"></el-input>
<i class="el-icon-circle-plus-outline" @click="addKeywords('invest_detail', investIndex)"></i>
<i class="el-icon-remove-outline" @click="removeKeywords('invest_detail', investIndex, investIndex1)"></i>
</el-form-item>
</div>
</div>
<el-form-item>
<el-divider content-position="left"></el-divider>
</el-form-item>
<el-form-item>
<div class="demo-drawer__footer" style="margin-left: 60%">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="$refs.drawer.closeDrawer()" :loading="loading">{{ loading ? '提交中 ...' : '确 定' }}</el-button>
</div>
</el-form-item>
</el-form>
</div>
<el-form-item>
<div class="demo-drawer__footer" style="margin-left: 60%">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="$refs.drawer.closeDrawer()" :loading="loading">{{ loading ? '提交中 ...' : '确 定' }}</el-button>
</div>
</el-form-item>
</el-form>
</div>
</el-drawer>
</el-drawer>
</el-scrollbar>
</div>
</div>
</template>
......@@ -301,7 +353,7 @@ import * as casesApi from '@/api/cases2'
import pdf from 'vue-pdf'
import * as categoryApi from '@/api/categories'
export default {
name: 'index',
name: 'cases-index',
components: {
pdf
},
......@@ -346,7 +398,7 @@ export default {
keywords: [
{
name: '',
score: ''
score: '0'
}
]
}
......@@ -357,7 +409,7 @@ export default {
keywords: [
{
name: '',
score: ''
score: 0
}
]
}
......@@ -368,7 +420,7 @@ export default {
keywords: [
{
name: '',
score: ''
score: 0
}
]
}
......@@ -378,18 +430,7 @@ export default {
formLabelWidth: '100px',
loading: false,
options: [],
visible: false,
production_detail: [
{
name: '',
keyword: [
{
name: '',
score: ''
}
]
}
]
visible: false
}
},
methods: {
......@@ -489,6 +530,48 @@ export default {
this.drawer = false
clearTimeout(this.timer)
},
initAddForm() {
this.addForm = {
name: '',
level: '',
category_id: 0,
accessory: '',
url: '',
production_detail: [
{
name: '',
keywords: [
{
name: '',
score: '0'
}
]
}
],
fund_detail: [
{
name: '',
keywords: [
{
name: '',
score: 0
}
]
}
],
invest_detail: [
{
name: '',
keywords: [
{
name: '',
score: 0
}
]
}
]
}
},
handleClose(done) {
if (this.loading) {
return
......@@ -496,8 +579,16 @@ export default {
this.$confirm('确定要提交表单吗？')
.then(_ => {
this.loading = true
console.log(this.addForm)
// 提交表单
casesApi.createCase2(this.addForm).then(res => {
if (res.code === 0 && res.message === 'SUCCESS') {
this.list({ page: this.currentPage, limit: this.limit })
this.initAddForm()
this.$message.success('添加案例成功')
} else {
this.$message.warning(res.message)
}
})
this.timer = setTimeout(() => {
done()
// 动画关闭需要一定的时间
......@@ -557,8 +648,8 @@ export default {
})
},
handlePreview(file) {
if (!this.mainForm.url) {
this.mainForm.url = file.url
if (!this.addForm.accessory) {
this.addForm.accessory = file.url
}
this.visible = true
},
......@@ -569,7 +660,18 @@ export default {
if (response.code === 0) {
var data = response.data
var imageInfo = data[0]
this.addForm.accessory = imageInfo.accessory
this.addForm.accessory = imageInfo.url
this.visible = false
} else {
console.log('文件上传失败')
this.$message.error('文件上传失败')
}
},
uploadUrlSuccess(response, file, fileList) {
if (response.code === 0) {
var data = response.data
var imageInfo = data[0]
this.addForm.url = imageInfo.url
this.visible = false
} else {
console.log('文件上传失败')
......@@ -584,11 +686,77 @@ export default {
this.addForm.url = file.url
}
this.visible = true
},
addNames(detailName, index) {
switch (detailName) {
case 'production_detail':
this.addForm.production_detail.push({ name: '', keywords: [{ name: '', score: 0 }] })
break
case 'fund_detail':
this.addForm.fund_detail.push({ name: '', keywords: [{ name: '', score: 0 }] })
break
case 'invest_detail':
this.addForm.invest_detail.push({ name: '', keywords: [{ name: '', score: 0 }] })
break
}
},
removeNames (detailName, index) {
switch (detailName) {
case 'production_detail':
if (this.addForm.production_detail.length > 1) {
this.addForm.production_detail.splice(index, 1)
}
break
case 'fund_detail':
if (this.addForm.fund_detail.length > 1) {
this.addForm.fund_detail.splice(index, 1)
}
break
case 'invest_detail':
if (this.addForm.invest_detail.length > 1) {
this.addForm.invest_detail.splice(index, 1)
}
break
}
},
addKeywords(detailName, index) {
switch (detailName) {
case 'production_detail':
this.addForm.production_detail[index].keywords.push({ name: '', score: 0 })
break
case 'fund_detail':
this.addForm.fund_detail[index].keywords.push({ name: '', score: 0 })
break
case 'invest_detail':
this.addForm.invest_detail[index].keywords.push({ name: '', score: 0 })
break
}
},
removeKeywords (detailName, index, index1) {
switch (detailName) {
case 'production_detail':
if (this.addForm.production_detail[index].keywords.length > 1) {
this.addForm.production_detail[index].keywords.splice(index1, 1)
}
break
case 'fund_detail':
if (this.addForm.fund_detail[index].keywords.length > 1) {
this.addForm.fund_detail[index].keywords.splice(index1, 1)
}
break
case 'invest_detail':
if (this.addForm.invest_detail[index].keywords.length > 1) {
this.addForm.invest_detail[index].keywords.splice(index1, 1)
}
break
}
}
}
}
</script>
<style scoped>
<style>
.el-drawer {
overflow: auto;
}
</style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论