Skip to content

C
chart-web
Commit a0a433b6 authored by looker's avatar looker
Browse files
Options

add store

parent 7aeac2e1
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 911 additions and 69 deletions
config/index.js
View file @ a0a433b6
......@@ -27,7 +27,16 @@ module.exports = {
autoOpenBrowser: true,
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {},
proxyTable: {
// '/**': {
// target: 'http://127.0.0.1:3000', //目标接口域名
// changeOrigin: true, //是否跨域
// }
'/api': {
target: 'http://172.16.22.5:3000/', //目标接口域名
changeOrigin: true, //是否跨域
}
},
// CSS Sourcemaps off by default because relative paths are "buggy"
// with this option, according to the CSS-Loader README
// (https://github.com/webpack/css-loader#sourcemaps)
......
src/App.vue
View file @ a0a433b6
......@@ -14,7 +14,7 @@
<script>
import mycard from './components/mycard/mycard'
import toolbar from '@/page/toolbar'
import toolbar from '@/page/right-panel'
import { mapActions } from 'vuex'
export default {
components: {
......@@ -30,10 +30,8 @@ export default {
<style lang="stylus" scoped>
#app
display: flex
border-radius 50px
margin: 20px auto
width: 1260px
height: 600px
background-color: #fff
.sidebar
width: 60px
......
src/components/message/message.vue
View file @ a0a433b6
......@@ -29,8 +29,7 @@ export default {
'messages'
]),
...mapState([
'user',
'emojis'
'user'
])
},
mounted() {
......@@ -48,7 +47,7 @@ export default {
// 再经过v-html 渲染成真正的图片
replaceFace (con) {
if(con.includes('/:')) {
var emojis=this.emojis;
var emojis=this.user.emojis;
for(var i=0;i<emojis.length;i++){
con = con.replace(emojis[i].reg, '<img src="static/emoji/' + emojis[i].file +'" alt="" style="vertical-align: middle; width: 24px; height: 24px" />');
}
......
src/components/mycard/mycard.vue
View file @ a0a433b6
......@@ -10,14 +10,24 @@
<router-link to="/my" class="icon iconfont icon-collection"></router-link>
</div>
<footer>
<i class="icon iconfont icon-more"></i>
<i class="icon iconfont icon-more" @click="accountFlag=!accountFlag"></i>
</footer>
<div v-if="accountFlag" style="width: 100%;height: 100%;position: fixed;top: 0;right: 0;" @click="accountFlag=!accountFlag"></div>
<div class="tool-panel" v-if="accountFlag">
<div><span class="sdsd">切换账号</span></div>
<div @click="logout"><span class="sdsd">退出登录</span></div>
</div>
</div>
</template>
<script>
import { mapState } from 'vuex'
export default {
data(){
return {
accountFlag:true
}
},
computed: {
...mapState([
'user',
......@@ -26,6 +36,23 @@ export default {
methods: {
clearSearch() {
this.$store.dispatch('search', '')
},
logout(){
this.$confirm('确定要退出ERP系统吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '已退出!'
});
}).catch(() => {
// this.$message({
// type: 'info',
// message: '已取消删'
// });
});
}
}
}
......@@ -67,4 +94,24 @@ export default {
bottom: 20px
width: 100%
text-align: center
.sdsd:hover{
color:#409EFF
}
.tool-panel
position:relative;
bottom:-480px;
height:80px;
width:120px;
right:-60px;
border-radius:5px;
padding-top:10px;
background: #000000;
div
bottom:-550px;
font-size:13px;
text-align:center;
height:30px;
line-height:30px;
cursor: pointer;
color:#fff;
</style>
src/components/text/relate.vue 0 → 100644
View file @ a0a433b6
<!-- 最左边的选择框 -->
<template>
<div class="mycard">
<header>
<img :src="user.img" class="avatar">
</header>
<div class="navbar" @click="clearSearch">
<router-link to="/chat" class="icon iconfont icon-msg" ></router-link>
<router-link to="/friend" class="icon iconfont icon-friend"></router-link>
<router-link to="/my" class="icon iconfont icon-collection"></router-link>
</div>
<footer>
<i class="icon iconfont icon-more" @click="accountFlag=!accountFlag"></i>
</footer>
<div v-if="accountFlag" style="width: 100%;height: 100%;position: fixed;top: 0;right: 0;" @click="accountFlag=!accountFlag"></div>
<div class="tool-panel" v-if="accountFlag">
<div><span class="sdsd">切换账号</span></div>
<div @click="logout"><span class="sdsd">退出登录</span></div>
</div>
</div>
</template>
<script>
import { mapState } from 'vuex'
export default {
data(){
return {
accountFlag:true
}
},
computed: {
...mapState([
'user',
])
},
methods: {
clearSearch() {
this.$store.dispatch('search', '')
},
logout(){
this.$confirm('确定要退出ERP系统吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '已退出!'
});
}).catch(() => {
// this.$message({
// type: 'info',
// message: '已取消删'
// });
});
}
}
}
</script>
<style lang="stylus" scoped>
@import '../../assets/fonts/iconfont.css'
.mycard
position: relative
width: 100%
height: 100%
.avatar
width: 36px
height: 36px
margin: 20px 12px 0 12px
border-radius: 2px
.navbar
width: 100%
text-align: center
.icon
display: inline-block
font-size: 26px
margin-top: 28px
padding: 0 16px
box-sizing: border-box
color: rgb(173,174,175)
opacity: 0.8
cursor: pointer
&.active
color: rgb(0,220,65)
&:hover
opacity: 1;
.icon-msg,.icon-more
font-size: 22px
.icon-msg
padding: 0 19px
footer
position: absolute
bottom: 20px
width: 100%
text-align: center
.sdsd:hover{
color:#409EFF
}
.tool-panel
position:relative;
bottom:-480px;
height:80px;
width:120px;
right:-60px;
border-radius:5px;
padding-top:10px;
background: #000000;
div
bottom:-550px;
font-size:13px;
text-align:center;
height:30px;
line-height:30px;
cursor: pointer;
color:#fff;
</style>
src/components/text/text.vue
View file @ a0a433b6
......@@ -3,6 +3,11 @@
<div class="text">
<div class="emoji">
<i class="icon iconfont icon-look" @click="showEmoji=!showEmoji"></i>
<img class="icon-img" align="absmiddle" src="static/icon-img/folder-open.png" alt="">
<img class="icon-img" align="absmiddle" src="static/icon-img/link.png" alt="">
<img class="icon-img" align="absmiddle" src="static/icon-img/tag.png" alt="">
<img class="icon-img" align="absmiddle" src="static/icon-img/retweet.png" alt="" @click="transfer">
<img class="icon-img" align="absmiddle" src="static/icon-img/poweroff.png" alt="" @click="closeSession">
<transition name="showbox">
<div class="emojiBox" v-show="showEmoji">
<li v-for="(item, index) in emojis">
......@@ -20,6 +25,31 @@
<div class="description">不能发送空白信息</div>
</div>
</transition>
<el-dialog
title="选择转接对象"
:visible.sync="dialogVisible"
width="30%"
:before-close="handleClose">
<div>
<el-select style="width: 100%;" v-model="value7" placeholder="请选择">
<el-option-group
v-for="group in options3"
:key="group.label"
:label="group.label">
<el-option
v-for="item in group.options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-option-group>
</el-select>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
</span>
</el-dialog>
</div>
</template>
......@@ -33,6 +63,33 @@ export default {
frequency: 0,
warn: false,
showEmoji: false,
dialogVisible:false,
options3: [{
label: '售前',
options: [{
value: 'Shanghai',
label: '随机转机'
}, {
value: 'Beijing',
label: '张辅导费'
}]
}, {
label: '售中',
options: [{
value: 'Chengdu',
label: '随机抓捏'
}, {
value: 'Shenzhen',
label: '深圳'
}, {
value: 'Guangzhou',
label: '广州'
}, {
value: 'Dalian',
label: '大连'
}]
}],
value7: ''
};
},
computed: {
......@@ -46,6 +103,58 @@ export default {
},
methods: {
// 按回车发送信息
closeSession(){
this.$confirm('确定要结束对话吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.$message({
type: 'success',
message: '已结束!'
});
}).catch(() => {
// this.$message({
// type: 'info',
// message: '已取消删'
// });
});
},
transfer(){
this.dialogVisible = true
// let transfers = `
// `
// this.$alert(transfers, 'HTML 片段', {
// dangerouslyUseHTMLString: true
// });
// let transfers = `
// <el-collapse v-model="activeNames" @change="handleChange">
// <el-collapse-item title="一致性 Consistency" name="1">
// <el-row>
// <el-col :span="24"><div class="grid-content bg-purple-dark"></div></el-col>
// </el-row>
// </el-collapse-item>
// </el-collapse>
// `
// this.$confirm(transfers, '选择转接对象', {
// dangerouslyUseHTMLString: true,
// confirmButtonText: '确定',
// cancelButtonText: '取消',
// type: 'warning',
// center: true
// }).then(() => {
// this.$message({
// type: 'success',
// message: '删除成功!'
// });
// }).catch(() => {
// this.$message({
// type: 'info',
// message: '已取消删除'
// });
// });
},
onKeyup (e) {
if ( e.keyCode === 13 ) {
this.send()
......@@ -124,6 +233,12 @@ export default {
padding: 0 30px
box-sizing: border-box
color: #7c7c7c
.icon-img
width:20px;
height:20px;
position: relative;
top: 3px;
right: -5px;
.icon-look
cursor: pointer
&:hover
......
src/page/right-panel/baozheng/index.vue
View file @ a0a433b6
......@@ -70,4 +70,5 @@ export default{
width:100%;
height:729px;
overflow-y: auto;
overflow-x: hidden;
</style>
\ No newline at end of file
src/page/right-panel/chenzheng/cus-users/index.vue
View file @ a0a433b6
......@@ -8,6 +8,17 @@
<span v-if="index!=0" style="color: #007dfd">{{ite.value}}</span>
<span v-if="index==0">{{ite.value}}</span>
</div>
<el-card class="box-card" v-for="(itey) in item.dataPanel">
<div slot="header" class="clearfix">
<span>{{itey.title}}</span>
</div>
<div style="margin-bottom:20px; " v-for="(itet,o) in itey.dataItem" :key="o" class="text item">
<div v-for="(it,o) in itet">
<span>{{it.label}}:</span>
<span>{{it.value}}</span>
</div>
</div>
</el-card>
</el-collapse-item>
</el-collapse>
</div>
......@@ -49,23 +60,125 @@ export default{
]
},
{
title:'个人待办事项',
numItem:[
title:'客机统计',
dataPanel:[
{
label:'诊断方案未发送',
value:54
},
{
label:'诊断方案未确认',
value:54
title:'客机：robot1',
dataItem:[
[
{
label:'今日新粉丝咨询量',
value:0
},
{
label:'今日新粉丝收货单量',
value:0
},
{
label:'今日新粉丝转化率',
value:0
},
{
label:'今日新粉丝预收货货值',
value:0
},
],
[
{
label:'今日新粉丝咨询量',
value:0
},
{
label:'今日新粉丝收货单量',
value:0
},
{
label:'今日新粉丝转化率',
value:0
},
{
label:'今日新粉丝预收货货值',
value:0
},
],
[
{
label:'今日新粉丝咨询量',
value:0
},
{
label:'今日新粉丝收货单量',
value:0
},
{
label:'今日新粉丝转化率',
value:0
},
{
label:'今日新粉丝预收货货值',
value:0
},
]
]
},
{
label:'效果方案未发送',
value:54
},
{
label:'效果方案未确认',
value:54
title:'客机：robot2',
dataItem:[
[
{
label:'今日新粉丝咨询量',
value:0
},
{
label:'今日新粉丝收货单量',
value:0
},
{
label:'今日新粉丝转化率',
value:0
},
{
label:'今日新粉丝预收货货值',
value:0
},
],
[
{
label:'今日新粉丝咨询量',
value:0
},
{
label:'今日新粉丝收货单量',
value:0
},
{
label:'今日新粉丝转化率',
value:0
},
{
label:'今日新粉丝预收货货值',
value:0
},
],
[
{
label:'今日新粉丝咨询量',
value:0
},
{
label:'今日新粉丝收货单量',
value:0
},
{
label:'今日新粉丝转化率',
value:0
},
{
label:'今日新粉丝预收货货值',
value:0
},
]
]
}
]
},
......
src/page/right-panel/chenzheng/index.vue
View file @ a0a433b6
<template>
<div class="tabs-body">
<el-tabs type="border-card" v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="顾客" name="first">
<el-tab-pane label="看板" name="second">
<div class="tool-body">
<cuss-service></cuss-service>
<cus-users></cus-users>
</div>
</el-tab-pane>
<el-tab-pane label="看板" name="second">
<el-tab-pane label="顾客" name="first">
<div class="tool-body">
<cus-users></cus-users>
<cuss-service></cuss-service>
</div>
</el-tab-pane>
<el-tab-pane label="话术" name="third">
......
src/page/right-panel/index.vue
View file @ a0a433b6
<template>
<div class="tabs-body">
<el-tabs type="border-card" v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="顾客" name="first">
<div class="tool-body">
<cuss-service></cuss-service>
</div>
</el-tab-pane>
<el-tab-pane label="看板" name="second">
<div class="tool-body">
<cus-users></cus-users>
</div>
</el-tab-pane>
<el-tab-pane label="话术" name="third">
<div class="tool-body">
<takel-script></takel-script>
</div>
</el-tab-pane>
<el-tab-pane label="表情包" name="fourth">
<div class="tool-body">
<doutu-picture></doutu-picture>
</div>
</el-tab-pane>
<el-tab-pane label="对比图" name="fivth">
<div class="tool-body">
<compre-picture></compre-picture>
</div>
</el-tab-pane>
<el-tab-pane label="其他" name="sixth"><div class="tool-body">用户管理</div></el-tab-pane>
</el-tabs>
<div style="margin:50px;" v-if="false">
<el-form :model="ruleForm2" status-icon :rules="rules2" ref="ruleForm2" class="demo-ruleForm">
<el-form-item prop="pass">
<el-input type="password" placeholder="登录名" v-model="ruleForm2.pass" auto-complete="off"></el-input>
</el-form-item>
<el-form-item prop="checkPass">
<el-input type="password" placeholder="密码" v-model="ruleForm2.checkPass" auto-complete="off"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="submitForm('ruleForm2')">登录</el-button>
</el-form-item>
</el-form>
</div>
<baozheng v-if="false"/>
<chenzheng v-if="true"/>
</div>
</template>
<script>
import cussService from './cus-service'
import cusUsers from './cus-users'
import takelScript from './takel-script'
import doutuPicture from './doutu-picture'
import comparisonMap from './comparison-map'
import comprePicture from './compre-picture'
import labelUserList from './label-userList'
import baozheng from './baozheng'
import chenzheng from './chenzheng'
export default{
data(){
return {
activeName:'second',
ruleForm2:{}
}
},
components: {
cussService,
cusUsers,
takelScript,
doutuPicture,
comparisonMap,
comprePicture,
labelUserList
baozheng,
chenzheng,
},
methods: {
handleClick(){
......
src/router/index.js
View file @ a0a433b6
......@@ -4,7 +4,6 @@ import Router from 'vue-router'
Vue.use(Router)
const router = new Router({
// 共三个页面： 聊天页面，好友页面，个人简历分别对应一下路由
routes: [
{
path: '/chat',
......
src/store/getters.js 0 → 100644
View file @ a0a433b6
const getters = {
searchedChatlist (state) {
let sessions = state.user.chatlist.filter(sessions => sessions.user.name.includes(state.user.searchText));
return sessions
},
// 筛选出含有搜索值的好友列表
searchedFriendlist (state) {
let friends = state.user.friendlist.filter(friends => friends.remark.includes(state.user.searchText));
return friends
},
// 通过当前选择是哪个对话匹配相应的对话
selectedChat (state) {
let session = state.user.chatlist.find(session => session.id === state.user.selectId);
return session
},
// 通过当前选择是哪个好友匹配相应的好友
selectedFriend (state) {
let friend = state.user.friendlist.find(friend => friend.id === state.user.selectFriendId);
return friend
},
messages (state) {
let session = state.user.chatlist.find(session => session.id === state.user.selectId);
console.log(session)
return session.messages
}
}
export default getters
\ No newline at end of file
src/store/index.js 0 → 100644
View file @ a0a433b6
import Vue from 'vue'
import Vuex from 'vuex'
import user from './modules/user'
import getters from './getters'
Vue.use(Vuex)
const store = new Vuex.Store({
modules: {
user,
},
getters
})
store.watch(
(state) => state.user.chatlist,
(val) => {
localStorage.setItem('vue-chat', JSON.stringify(val));
},
{
deep: true
}
)
export default store
\ No newline at end of file
src/store/modules/user.js 0 → 100644
View file @ a0a433b6
This diff is collapsed.
src/utils/common.js 0 → 100644
View file @ a0a433b6
import axios from "axios"
import aliOss from "ali-oss"
let Authorization = null
let Common = {}
window.common = Common
// const ajaxUrl = "http://172.16.22.234:19891";
const ajaxUrl = "/api"
// const ajaxUrl = "http://localhost";
Common.ajax = axios.create({
baseURL: ajaxUrl,
timeout: 120000,
headers: {
"Cache-Control": "no-cache,no-store,must-revalidate,max-age=-1,private"
}
})
// Common.wsUrl = "http://172.16.22.234:9093";
Common.wsUrl = "http://imweb.chenzhen.shop"
Common.bag = {
host: "https://baozheng.cc"
// host: "http://172.16.22.3:19893"
// host: "http://172.16.22.234:9093"
}
Common.bag.ajax = axios.create({
baseURL: Common.bag.host,
timeout: 120000,
headers: {
"Cache-Control": "no-cache,no-store,must-revalidate,max-age=-1,private"
}
// withCredentials: true
})
Common.bag.ajax.interceptors.response.use((response) => {
// console.log(response)
return response
}, (error) => {
if (error.response && error.response.status == 401) {
window.vm.bagLogin()
}
return Promise.reject(error)
})
Common.chenzhen = {}
Common.chenzhen.ajax = axios.create({
// baseURL: "http://172.16.22.234:19893",
// baseURL: "http://127.0.0.1:4396",
baseURL: "http://imweb.chenzhen.shop",
timeout: 30000,
headers: {
"Cache-Control": "no-cache,no-store,must-revalidate,max-age=-1,private"
}
})
Common.chenzhen.ajax.interceptors.request.use((body) => {
body.headers.Authorization = localStorage.getItem("chenzhen-token")
return body
}, (error) => {
return Promise.reject(error)
})
Common.chenzhen.ajax.interceptors.response.use((response) => {
if (response.data.code === 800) {
localStorage.clear()
window.vm.chenzhenLogin()
}
return response
}, (error) => {
return Promise.reject(error)
})
Common.chat = {
host: "http://imweb.chenzhen.shop"
}
Common.chat.ajax = axios.create({
baseURL: Common.chat.host,
timeout: 120000,
headers: {
"Cache-Control": "no-cache,no-store,must-revalidate,max-age=-1,private"
}
})
Common.six_day = 6 * 24 * 60 * 60 * 1000
Common.wsClient = null
Common.sendMessage = (message) => {
return new Promise((resolve, reject) => {
if (Common.wsClient == null || Common.wsClient.disconnected) {
reject("No socket connection.")
} else {
// console.log(message)
let options = {
eventType: "messages/create",
message: message
}
Common.wsClient.emit("appevent", options)
resolve()
}
})
}
Common.ossClient = new aliOss({
region: "oss-cn-beijing",
accessKeyId: "LTAImsrYiikk7t3f",
accessKeySecret: "XtgwITVY6Apb7H1hOO3LRZNxE0Onpb",
bucket: "chat-x"
})
Common.ossUrl = "http://chat-x.oss-cn-beijing.aliyuncs.com/"
export default Common
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment