提交 3430f437 authored 作者: 王诒正's avatar 王诒正

案例列表

上级 23435e13
import httpRequest from '@/utils/axios'
// 案例列表
export function caseList(params) {
return httpRequest.get('/api/opera/v1/operations/cases', { params })
}
// 案例详情
export function caseInfo(id, params = {}) {
return httpRequest.get(`/api/opera/v1/operations/${id}/case`, { params })
}
// 添加案例背景
export function caseCreate(data) {
return httpRequest.post('/api/opera/v1/operations/case', data)
}
// 更新案例背景
export function caseUpdate(id, data) {
return httpRequest.put(`/api/opera/v1/operations/${id}/case`, data)
}
// 删除案例背景
export function caseDelete(id, params) {
return httpRequest.delete(`/api/opera/v1/operations/${id}/case`, { params })
}
<template> <template>
<div>11</div> <div></div>
</template> </template>
...@@ -54,7 +54,7 @@ export default { ...@@ -54,7 +54,7 @@ export default {
data() { data() {
return { return {
triggerMode: [ triggerMode: [
{ option: 'A', context: '11' } { option: 'A', context: '' }
], ],
triggerTime: [ triggerTime: [
{ option: 'A', context: '' } { option: 'A', context: '' }
......
<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 :to="{ path: '/yhfq/albj' }">案例背景</el-breadcrumb-item>
<el-breadcrumb-item :to="{ path: '/yhfq/albj/detail' }">案例背景</el-breadcrumb-item>
</el-breadcrumb>
</el-card>
</div>
<div>
<el-card class="box-card" style="float: left; width: 33.5%">
<div slot="header" class="clearfix">
<span style="text-align:center">公司信息</span>
</div>
<div class="text item">
{{ companyDetail }}
</div>
</el-card>
<el-card class="box-card" style="float: left; width: 33.3%">
<div slot="header" class="clearfix">
<span style="text-align:center">产品信息</span>
</div>
<div class="text item">
{{ productDetail }}
</div>
</el-card>
<el-card class="box-card">
<div slot="header" class="clearfix">
<span style="text-align:center">职位信息</span>
</div>
<div class="text item">
{{ positionDetail }}
</div>
</el-card>
</div>
</div>
</template>
<script>
export default {
name: 'detail',
mounted() {
var data = this.$route.params
console.log('dasdasdas', this.$route.params)
this.companyDetail = data.company_detail
this.productDetail = data.product_detail
this.positionDetail = data.position_detail
},
data() {
return {
companyDetail: '',
productDetail: '',
positionDetail: ''
}
}
}
</script>
<style>
</style>
<template> <template>
<app-container title="请选择您要进入的案例背景">
<template>
<div class="list" v-for="item in arr" :key="item.index" @click="clk(item.index)" ref="main" :flag="flag">
<it-em :id="activeIndex == item.index ? 'clk' : ''">
<template v-slot:title>
<div> <div>
<img :src="item.imgsrc" alt="" srcset="" /> <div>
<p>{{ item.title }}</p> <el-card class="box-card">
</div> <el-breadcrumb separator-class="el-icon-arrow-right">
</template> <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
<template v-slot:xm> <el-breadcrumb-item :to="{ path: '/' }">案例背景</el-breadcrumb-item>
<div>姓名</div> </el-breadcrumb>
<div>{{ item.name }}</div> </el-card>
</template>
<template v-slot:gs>
<div>公司</div>
<div>{{ item.gs }}</div>
</template>
<template v-slot:bm>
<div>部门</div>
<div>{{ item.bm }}</div>
</template>
<template v-slot:zw>
<div>职位</div>
<div>{{ item.zw }}</div>
</template>
<template v-slot:cp>
<div>营销产品</div>
<div>{{ item.cp }}</div>
</template>
</it-em>
</div> </div>
</template>
<!-- <it-em>
<template v-slot:title>
<div> <div>
<img src="../../../assets/images/gsxx.png" alt="" srcset=""> <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
<p>案例分析2</p> <el-tab-pane label="初级" name="1">
<div>
<el-card class="box-card">
<el-row>
<el-button size="mini" icon="el-icon-plus" type="success">添加</el-button>
</el-row>
</el-card>
<el-card class="box-card">
<el-table
:data="tableData1"
border
style="width: 100%">
<el-table-column
fixed
prop="created_at"
label="日期">
</el-table-column>
<el-table-column label="图片">
<template slot-scope="scope">
<div class="demo-image__placeholder">
<div class="block">
<el-image fit="scale-down" :src="scope.row.poster_url">
<div slot="placeholder" class="image-slot">
加载中<span class="dot">...</span>
</div>
</el-image>
</div>
</div> </div>
</template> </template>
<template v-slot:xm> </el-table-column>
<div>姓名</div> <el-table-column
<div>立马</div> prop="name"
</template> label="案例名称">
<template v-slot:gs> </el-table-column>
<div>公司</div> <el-table-column
<div>建国保险公司</div> prop="username"
</template> label="姓名">
<template v-slot:bm> </el-table-column>
<div>部门</div> <el-table-column
<div>市场营销部</div> prop="department"
</template> label="部门">
<template v-slot:zw> </el-table-column>
<div>职位</div> <el-table-column
<div>市场营销专员</div> prop="position"
</template> label="职位">
<template v-slot:cp> </el-table-column>
<div>营销产品</div> <el-table-column
<div>建国重疾险</div> prop="product"
</template> label="营销产品">
</it-em> </el-table-column>
<it-em> <el-table-column
<template v-slot:title> fixed="right"
label="操作">
<template slot-scope="scope">
<el-select size="mini" :value="opera" @change="operation" placeholder="请选择">
<el-option :value="{ tag: 'reach', row: scope.row }" label="触达方案"></el-option>
<el-option :value="{ tag: 'group', row: scope.row }" label="用户群"></el-option>
<el-option :value="{ tag: 'detail', 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>
</el-card>
</div>
</el-tab-pane>
<el-tab-pane label="中级" name="2">
<div> <div>
<img src="../../../assets/images/gsxx.png" alt="" srcset=""> <el-card class="box-card">
<p>案例分析3</p> <el-row>
<el-button size="mini" icon="el-icon-plus" type="success">添加</el-button>
</el-row>
</el-card>
<el-card class="box-card">
<el-table
:data="tableData2"
border
style="width: 100%">
<el-table-column
fixed
prop="created_at"
label="日期">
</el-table-column>
<el-table-column label="图片">
<template slot-scope="scope">
<div class="demo-image__placeholder">
<div class="block">
<el-image fit="scale-down" :src="scope.row.poster_url">
<div slot="placeholder" class="image-slot">
加载中<span class="dot">...</span>
</div>
</el-image>
</div> </div>
</template>
<template v-slot:xm>
<div>姓名</div>
<div>立马</div>
</template>
<template v-slot:gs>
<div>公司</div>
<div>建国保险公司</div>
</template>
<template v-slot:bm>
<div>部门</div>
<div>市场营销部</div>
</template>
<template v-slot:zw>
<div>职位</div>
<div>市场营销专员</div>
</template>
<template v-slot:cp>
<div>营销产品</div>
<div>建国重疾险</div>
</template>
</it-em> -->
<template #footer>
<div class="app-container-ft">
<el-button type="primary" size="mini" @click="open()">开始实训</el-button>
<el-button type="primary" size="mini" @click="jump()">查看背景详情</el-button>
</div> </div>
</template> </template>
</app-container> </el-table-column>
</template> <el-table-column
prop="name"
</app-container> label="案例名称">
</el-table-column>
<el-table-column
prop="username"
label="姓名">
</el-table-column>
<el-table-column
prop="department"
label="部门">
</el-table-column>
<el-table-column
prop="position"
label="职位">
</el-table-column>
<el-table-column
prop="product"
label="营销产品">
</el-table-column>
<el-table-column
fixed="right"
label="操作">
<template slot-scope="scope">
<el-select size="mini" :value="opera" @change="operation" placeholder="请选择">
<el-option :value="{ tag: 'reach', row: scope.row }" label="触达方案"></el-option>
<el-option :value="{ tag: 'group', row: scope.row }" label="用户群"></el-option>
<el-option :value="{ tag: 'detail', 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>
</el-card>
</div>
</el-tab-pane>
<el-tab-pane label="高级" name="3">当前功能暂无...</el-tab-pane>
</el-tabs>
</div>
</div>
</template> </template>
<script> <script>
import AppContainer from '@/components/AppContainer' import * as api from '@/api/cases'
import ItEm from './item.vue'
export default { export default {
components: { AppContainer, ItEm }, mounted() {
api.caseList({ level: parseInt(this.activeName) }).then(res => {
console.log(res)
if (res.code === 0) {
this.tableData1 = res.data
}
}).catch(error => {
console.log(error)
})
},
data() { data() {
return { return {
arr: [ activeName: '1',
{ opera: '',
imgsrc: require('../../../assets/images/gsxx.png'), tableData1: [],
title: '案例分析1', tableData2: [],
name: '立马', tableData3: []
gs: '建国保险公司',
bm: '市场营销部',
zw: '市场营销专员',
cp: '建国重疾险',
index: 1
},
{
imgsrc: require('../../../assets/images/gsxx.png'),
title: '案例分析2',
name: '立马',
gs: '建国保险公司',
bm: '市场营销部',
zw: '市场营销专员',
cp: '建国重疾险',
index: 2
},
{
imgsrc: require('../../../assets/images/gsxx.png'),
title: '案例分析3',
name: '立马',
gs: '建国保险公司',
bm: '市场营销部',
zw: '市场营销专员',
cp: '建国重疾险',
index: 3
}
],
activeIndex: -1,
flag: false,
main1: false,
main2: false,
main3: false
} }
}, },
methods: { methods: {
clk(index) { handleClick(tab, event) {
this.activeIndex = index api.caseList({ level: parseInt(this.activeName) }).then(res => {
}, console.log(res)
jump() { if (res.code === 0) {
if (this.activeIndex !== -1) { this.tableData2 = res.data
this.$router.push('/yhfq/alfx')
} }
}).catch(error => {
console.log(error)
})
}, },
open() { operation(opera) {
window.location.href = 'http://eademo-test.ezijing.com/app.html#/InAppList' console.log(opera.row)
switch (opera.tag) {
case 'reach':
break
case 'group':
break
case 'detail':
this.$router.push({
name: 'case-detail',
params: opera.row
})
break
case 'delete':
break
}
} }
} }
} }
</script> </script>
<style scoped lang="scss">
app-container {
overflow: hidden;
// it-em {
// float: left;
// margin-right: 20px;
// }
}
#clk {
box-shadow: 0px 8px 16px 0px rgba(192, 21, 64, 0.4);
border: 1px solid #c01540;
}
</style>
import Layout from '@/components/layout' import Layout from '@/components/layout'
// 用户分 // 用户分
const userGroup = [ const userGroup = [
/* 首页 */ /* 首页 */
{ path: '/yhfq', redirect: '/yhfq/albj' }, { path: '/yhfq', redirect: '/yhfq/albj' },
{ path: '/yhfq/albj', component: () => import(/* webpackChunkName: "usergroup" */ '@/pages/yhfq/albj') }, { path: '/yhfq/albj', component: () => import(/* webpackChunkName: "usergroup" */ '@/pages/yhfq/albj') },
{ path: '/yhfq/albj/detail', name: 'case-detail', component: () => import(/* webpackChunkName: "usergroup" */ '@/pages/yhfq/albj/detail') },
{ path: '/albj', component: () => import(/* webpackChunkName: "usergroup" */ '@/pages/yhfq/albj') }, { path: '/albj', component: () => import(/* webpackChunkName: "usergroup" */ '@/pages/yhfq/albj') },
{ path: '/yhfq/alfx', component: () => import(/* webpackChunkName: "usergroup" */ '@/pages/yhfq/alfx') }, { path: '/yhfq/alfx', component: () => import(/* webpackChunkName: "usergroup" */ '@/pages/yhfq/alfx') },
{ path: '/yhfq/yhqfx', component: () => import(/* webpackChunkName: "usergroup" */ '@/pages/yhfq/yhqfx') } { path: '/yhfq/yhqfx', component: () => import(/* webpackChunkName: "usergroup" */ '@/pages/yhfq/yhqfx') }
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论