Skip to content

O
office-web
Commit 3720c9e1 by 无尘
Options

feat: 增加企业应用我的顾客

parent 90c9345e
Showing with 1293 additions and 72 deletions
changelog.md
## [1.0.9](http://115.159.76.241/office/office-web/compare/v1.0.8...v1.0.9) (2019-02-21)
## [1.0.9](http://115.159.76.241/office/office-web/compare/v1.0.8...v1.0.9) (2019-02-22)
### Bug Fixes
* 修复编辑员工信息显示 bug ([90c9345](http://115.159.76.241/office/office-web/commits/90c9345))
* 修改员工信息提示 ([acb832d](http://115.159.76.241/office/office-web/commits/acb832d))
* 修改档案设置 ([7e4f100](http://115.159.76.241/office/office-web/commits/7e4f100))
* 修改编辑员工信息 bug ([ccb26ec](http://115.159.76.241/office/office-web/commits/ccb26ec))
......
package.json
......@@ -9,6 +9,7 @@
"start": "npm run dev",
"build": "node build/build.js",
"format": "onchange 'test/**/*.js' 'src/**/*.js' 'src/**/*.vue' -- prettier --write {{changed}}",
"formater": "onchange \"test/**/*.js\" \"src/**/*.js\" \"src/**/*.vue\" -- prettier --write {{changed}}",
"version": "conventional-changelog -p angular -i changelog.md -s -r 0 && git add changelog.md"
},
"dependencies": {
......
src/components/app/app-detail.vue 0 → 100644
<!--
我的顾客应用：
<app-detail ></app-detail>
-->
<template>
<div class="app-detail-wrap">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="会员搜索设置" name="first">
<div class="app-detail-pane border-box p-60">
<el-checkbox v-model="myCustomData.searchSwitch">会员搜索设置</el-checkbox>
<div class="m-t-46">
<el-button type="primary" @click="submit">保存</el-button>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="在线沟通设置" name="second">
<div class="app-detail-pane border-box p-60">
<el-checkbox v-model="myCustomData.onlineChat">在线沟通设置</el-checkbox>
<div class="m-t-46">
<el-button type="primary" @click="submit">保存</el-button>
</div>
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import showMsg from '@/common/js/showmsg';
import errMsg from '@/common/js/error';
import { _debounce } from '@/common/js/public';
import { postRequest } from '@/api/api';
export default {
name: 'app-detail',
props: {
brandId: {
type: String,
default() {
return '';
}
}
},
data() {
return {
projectName: '', // 当前项目名
activeName: 'first',
myCustomData: {
searchSwith: false,
onlineChat: false
}
};
},
beforeMount() {
let that = this;
let host = window.location.origin;
if (host.indexOf('localhost') != '-1') {
that.baseUrl = 'http://www.gicdev.com';
} else {
that.baseUrl = host;
}
},
methods: {
handleClick(tab, event) {
console.log(tab, event);
},
/**
* 保存
*/
submit: _debounce(function(formName) {
const that = this;
that.seData();
}, 500),
/**
* 保存-API
*/
seData(data, type) {
const that = this;
let para = {
type: type, // 1: 店员, 2: 店长
brandId: data.brandId
};
postRequest('/haoban-manage-web/brand/saveStoreAuth', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
showMsg.showmsg('保存成功', 'success');
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 获取数据-API
*/
getData(type) {
const that = this;
let para = {
type: type
};
postRequest('/haoban-manage-web/brand/saveStoreAuth', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
watch: {
brandId: function(newData, oldData) {
const that = this;
that.getData();
}
},
mounted() {
const that = this;
that.getData();
},
components: {}
};
</script>
<style lang="less" scoped>
.w-500 {
width: 500px;
}
.color-1890ff {
color: #1890ff;
}
.app-detail-wrap {
.el-tabs {
background: #fff;
/deep/ .el-tabs__nav-wrap {
height: 54px;
line-height: 54px;
&::after {
height: 1px;
}
.el-tabs__nav-scroll {
padding-left: 20px;
}
}
.el-tab-pane {
padding: 1px;
}
}
}
</style>
src/router/index.js
......@@ -143,7 +143,20 @@ export const constantRouterMap = [
// 企业应用
path: '/enterpriseApp',
name: '企业应用',
component: _import('enterpriseApp', 'index')
redirect: 'appcenter',
component: _import('enterpriseApp', 'index'),
children: [
{
path: '/appcenter',
name: '企业应用中心',
component: _import('enterpriseApp', 'appcenter')
},
{
path: '/mycustomer',
name: '我的顾客',
component: _import('enterpriseApp', 'mycustomer')
},
]
},
{
// 审核中心
......
src/views/enterpriseApp/appcenter.vue 0 → 100644
<template>
<div class="apps-wrap common-set-wrap">
<nav-crumb :navpath="navpath"> </nav-crumb>
<div class="right-content">
<div class="right-box" :style="{ 'min-height': $store.state.bgHeight }">
<div class="apps-content">
<div class="apps-content-title">基础应用</div>
<div class="apps-content-body m-t-24">
<ul class="flex flex-row flex-wrap">
<li v-for="(item, index) in appList" :key="index" class="flex flex-align-center border-box flex" @click.self="toAppDetail(item)">
<span class="square-item flex flex-align-center flex-pack-center" :style="{ background: item.iconBgColor }"><i :class="['iconfont', item.icon]"></i></span>
<span class="color-303133 font-16 p-l-8">{{ item.name }}</span>
<div class="cell-arrow-down">
<el-dropdown class="app-cell-dropdown" trigger="hover">
<span class="el-dropdown-link"><i class="el-icon-more el-icon--right color-909399"></i> </span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item class="p-0"><span @click.stop="showPeople(item)">可见人群</span></el-dropdown-item>
<el-dropdown-item class="p-0">
<span @click.stop="changeSwitch(item)">{{ !!item.switch ? '停用' : '启用' }}</span>
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
<!-- 公共组件 -->
<visiableDialog :appName="appName" :showDialog="showDialog" @hideDialog="hideDialog"></visiableDialog>
</div>
</template>
<script>
import navCrumb from '@/components/nav/nav.vue';
import visiableDialog from '@/components/app/visiable-dialog.vue';
import errMsg from '@/common/js/error';
import { getRequest } from '@/api/api';
export default {
name: 'apps',
data() {
return {
tableH: window.screen.availHeight - 464 - 126 + 'px',
// 面包屑参数
navpath: [
{
name: '首页',
path: '/index'
},
{
name: '企业应用',
path: ''
}
],
appList: [
{
id: '1',
icon: 'icon-tianjiachengyuan',
iconBgColor: '#16BA8A',
name: '员工档案',
switch: true
},
{
id: '1',
icon: 'icon-tianjiachengyuan',
iconBgColor: '#16BA8A',
name: '员工档案',
switch: true
},
{
id: '1',
icon: 'icon-tianjiachengyuan',
iconBgColor: '#16BA8A',
name: '员工档案',
switch: true
},
{
id: '1',
icon: 'icon-tianjiachengyuan',
iconBgColor: '#16BA8A',
name: '员工档案',
switch: true
}
],
// 可见人群弹窗
appName: '',
showDialog: false
};
},
computed: {},
methods: {
/**
* 可见人群
*/
showPeople(item) {
const that = this;
that.appName = item.name;
that.showDialog = true;
},
/**
* 隐藏可见人群弹窗
*/
hideDialog() {
const that = this;
that.appName = '';
that.showDialog = false;
},
/**
* 开启/停用
*/
changeSwitch(item) {
let that = this;
if (item.switch) {
that
.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
item.switch = false;
})
.catch(() => {});
}
},
toAppDetail(item) {
let that = this;
that.$router.push(`/mycustomer?appId=${item.id}`);
},
/**
* 获取列表数据
*/
getAppList(val) {
const that = this;
let para = {
auditingType: ''
};
getRequest('/haoban-manage-web/', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
if (!!resData.result && !!resData.result.list) {
errMsg.errorMsg(resData);
}
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
mounted() {
this.getAppList();
},
components: {
navCrumb,
visiableDialog
}
};
</script>
<style type="text/scss" lang="scss" scoped>
.bg-82C5FF {
background: #82c5ff;
}
.color-508CEE {
color: #508cee;
}
.color-FF585C {
color: #ff585c;
}
.line-h-18 {
line-height: 18px;
}
.tooltip-text {
width: 100%;
white-space: pre-wrap;
word-break: break-all;
}
.right-content {
/*width: 100%;*/
padding: 24px;
min-height: calc(100% - 240px);
.right-box {
background: #fff;
min-height: 500px;
padding: 24px;
.apps-content-body {
li {
position: relative;
width: 235px;
height: 70px;
padding-left: 24px;
background: #fff;
border: 1px solid #dcdfe6;
border-radius: 6px;
margin-right: 6.666666%;
margin-bottom: 24px;
cursor: pointer;
.square-item {
width: 40px;
height: 40px;
border-radius: 8px;
i {
font-size: 24px;
color: #fff;
}
}
.cell-arrow-down {
position: absolute;
top: 10px;
right: 10px;
}
.app-cell-dropdown {
.el-dropdown-menu__item {
padding: 0;
}
}
}
}
}
}
</style>
src/views/enterpriseApp/index.vue
......@@ -2,7 +2,18 @@
<div class="enterprise-wrap">
<!-- 公共头部菜单插件 -->
<vue-office-header :projectName="projectName" @collapseTag="collapseTag" @toRouterView="toRouterView"></vue-office-header>
<div class="enterprise-wrap__body"></div>
<div class="enterprise-wrap__body">
<div id="content" class="content">
<div class="content-body" :style="{ height: contentHeight }">
<transition name="fade" mode="out-in">
<!-- 缓存已经填好内容的页面 -->
<!-- <keep-alive include="editGroupGrade"> -->
<router-view></router-view>
<!-- </keep-alive > -->
</transition>
</div>
</div>
</div>
</div>
</template>
<script>
......@@ -11,7 +22,8 @@ export default {
data() {
return {
projectName: 'haoban-manage-web', // 当前项目名
collapseFlag: false // 折叠参数
collapseFlag: false, // 折叠参数
contentHeight: window.screen.availHeight + 'px'
};
},
computed: {},
......@@ -36,8 +48,23 @@ export default {
that.collapseFlag = val;
}
},
/* eslint-disable */
mounted() {}
mounted() {
const that = this;
that.contentHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 64 + 'px';
}
};
</script>
<style lang="less" scoped></style>
<style lang="less" scoped>
.enterprise-wrap {
background: #f0f2f5;
.enterprise-wrap__body {
.content {
padding-top: 64px;
min-width: 1400px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
}
}
</style>
src/views/enterpriseApp/mycustomer.vue 0 → 100644
<template>
<div class="my-customer-wrap common-set-wrap">
<nav-crumb :navpath="navpath"> </nav-crumb>
<div class="right-content">
<div class="my-customer-top">
<div class="my-customer-name">
<span class="app-icon "><i :class="['iconfont', 'icon-tuanduichengyuan']"></i></span><span class="p-l-8">我的顾客</span>
</div>
<el-button class="border-radius-18 my-customer-return" @click="returnBack">返回</el-button>
<div class="my-customer-brand">
<el-select v-model="activeBrand" placeholder="请选择">
<el-option v-for="item in brandListData" :key="item.brandId" :label="item.brandName" :value="item.brandId"> </el-option>
</el-select>
</div>
</div>
<div class="right-box" :style="{ 'min-height': $store.state.bgHeight }">
<div class="apps-content flex" :style="{ height: $store.state.bgHeight }">
<div class="apps-content-left w-157">
<!-- <div class="apps-content-left__title border-box color-606266 font-14"></div> -->
<ul class="tab-left-list">
<template v-for="(item, index) in tabListData">
<li :class="['tab-left-list-cell color-303133 font-14 border-box p-l-14', item.tabId == activeTab ? 'active-tab' : '']" :key="index" @click="selectTab(item)"><i :class="['p-r-10 color-303133 iconfont', item.icon]"></i>{{ item.tabName }}</li>
<ul class="child-tab-left-list" :key="'childitem' + index">
<template v-for="(childitem, childIndex) in item.children">
<li :class="['tab-left-list-cell color-303133 font-14 border-box', childitem.tabId == activeTab ? 'active-tab' : '']" :key="childIndex" @click="selectTab(childitem)">{{ childitem.tabName }}</li>
<ul class="third-tab-left-list" :key="'thirditem' + childIndex">
<template v-for="(thirditem, thirdIndex) in childitem.children">
<li :class="['tab-left-list-cell color-303133 font-14 border-box', thirditem.tabId == activeTab ? 'active-tab' : '']" :key="thirdIndex" @click="selectTab(thirditem)">{{ thirditem.tabName }}</li>
</template>
</ul>
</template>
</ul>
</template>
</ul>
</div>
<div class="apps-content-right">
<app-detail></app-detail>
</div>
</div>
</div>
</div>
<vue-gic-footer></vue-gic-footer>
<!-- 公共组件 -->
</div>
</template>
<script>
import navCrumb from '@/components/nav/nav.vue';
import appDetail from '@/components/APP/app-detail.vue';
import errMsg from '@/common/js/error';
import { getRequest } from '@/api/api';
export default {
name: 'reviewed',
data() {
return {
tableH: window.screen.availHeight - 464 - 126 + 'px',
// 面包屑参数
navpath: [
{
name: '首页',
path: '/index'
},
{
name: '企业应用',
path: ''
}
],
appList: [
{
id: '1',
icon: 'icon-tianjiachengyuan',
iconBgColor: '#16BA8A',
name: '员工档案',
switch: true
}
],
activeTab: '1',
tabListData: [
{
tabId: '1',
tabName: '会员搜索设置',
icon: 'icon-jifeizhongxin'
},
{
tabId: '2',
tabName: '在线沟通设置',
icon: 'icon-shouji'
}
],
activeBrand: '1',
brandListData: [
{
brandId: '1',
brandName: '商户 Aaaaaaaa'
},
{
brandId: '2',
brandName: '商户 A'
}
]
};
},
computed: {},
methods: {
/**
* 返回
*/
returnBack() {
let that = this;
that.$router.push('appcenter');
},
/**
* 可见人群
*/
showPeople(id) {
const that = this;
that.getTableList();
},
/**
* 开启/停用
*/
changeSwitch(item) {
console.log(item);
item.switch = !!item.switch ? false : true;
},
/**
* 获取列表数据
*/
getAppList(val) {
const that = this;
let para = {
auditingType: ''
};
getRequest('/haoban-manage-web/', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
if (!!resData.result && !!resData.result.list) {
errMsg.errorMsg(resData);
}
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 选择商户
*/
selectTab(item) {
let that = this;
that.activeTab = item.tabId;
}
},
mounted() {
this.getAppList();
document.documentElement.style.backgroundColor = '#f0f2f5';
},
destroyed() {
document.documentElement.style.backgroundColor = '#fff';
},
components: {
navCrumb,
appDetail
}
};
</script>
<style type="text/scss" lang="scss" scoped>
.bg-82C5FF {
background: #82c5ff;
}
.color-508CEE {
color: #508cee;
}
.color-FF585C {
color: #ff585c;
}
.line-h-18 {
line-height: 18px;
}
.tooltip-text {
width: 100%;
white-space: pre-wrap;
word-break: break-all;
}
.right-content {
/*width: 100%;*/
padding: 24px;
min-height: calc(100% - 240px);
.my-customer-top {
position: relative;
height: 43px;
line-height: 43px;
.my-customer-return {
position: absolute;
left: 0px;
bottom: 10px;
width: 78px;
height: 32px;
border-radius: 18px;
}
.my-customer-brand {
position: absolute;
right: 0;
bottom: 18px;
width: 93px;
height: 32px;
}
.my-customer-name {
width: 200px;
margin: 0 auto;
i {
font-size: 14px;
color: #fff;
}
span {
font-size: 16px;
color: #000;
}
.app-icon {
display: inline-block;
width: 22px;
height: 22px;
line-height: 22px;
text-align: center;
border-radius: 4px;
background: -webkit-linear-gradient(left, #7ab6fb, #508bfe);
background: -moz-linear-gradient(left, #7ab6fb, #508bfe);
background: linear-gradient(left, #7ab6fb, #508bfe);
}
}
}
.right-box {
// background: #fff;
min-height: 500px;
padding: 0px;
.apps-content {
.apps-content-left {
height: 100%;
background: #fff;
overflow-x: hidden;
overflow-y: auto;
.apps-content-left__title {
height: 55px;
line-height: 55px;
padding: 0 0 0 18px;
}
.tab-left-list-cell {
position: relative;
text-align: left;
margin-top: 15px;
height: 30px;
line-height: 30px;
white-space: nowrap;
overflow: hidden;
cursor: pointer;
&:hover {
background: rgba(24, 144, 255, 0.06);
}
&.active-tab {
background: rgba(24, 144, 255, 0.06);
&::before {
content: ' ';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 2px;
background: #1890ff;
z-index: 1;
}
}
.child-tab-left-list {
li {
position: relative;
text-align: left;
height: 30px;
line-height: 30px;
white-space: nowrap;
overflow: hidden;
cursor: pointer;
&:hover {
background: rgba(24, 144, 255, 0.06);
}
&.active-tab {
background: rgba(24, 144, 255, 0.06);
&::before {
content: ' ';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 2px;
background: #1890ff;
z-index: 1;
}
}
}
}
}
}
.apps-content-right {
width: calc(100% - 10px);
margin-left: 10px;
background: #fff;
}
}
}
}
</style>
src/views/setting/addAdmin.vue
......@@ -411,12 +411,6 @@ export default {
};
</script>
<style lang="less" scoped>
.border-box {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
/* display */
.inline-block {
display: inline-block;
......@@ -434,64 +428,6 @@ export default {
vertical-align: middle;
}
/* flex */
.flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.flex-1 {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
}
.flex-column {
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
}
.flex-row {
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
}
.flex-align-center {
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.flex-pack-center {
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.flex-between {
-webkit-justify-content: space-between;
justify-content: space-between;
}
.flex-wrap {
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
-o-flex-wrap: wrap;
flex-wrap: wrap;
}
.right-content {
/*width: 100%;*/
padding: 24px;
......
static/css/public.css
......@@ -266,7 +266,6 @@ body {
width: 100%;
min-height: 100%;
height: 100%;
/*background-color: #ffffff;*/
background-color: #fff;
}
......@@ -341,19 +340,57 @@ input:focus {
box-sizing: border-box;
}
.border-radius-18 {
border-radius: 18px;
}
.t-rt {
text-align: right;
}
.t-ct {
text-align: center;
}
.text-center {
text-align: center;
}
.text-right {
text-align: right;
}
.c-909399 {
color: #909399;
}
.c-303133 {
color: #303133;
}
.color-303133 {
color: #303133;
}
.p-0 {
padding: 0;
}
.p-60 {
padding: 60px;
}
.p-l-8 {
padding-left: 8px;
}
.p-l-14 {
padding-left: 14px;
}
.p-r-10 {
padding-right: 10px;
}
.p-t-35 {
padding-top: 35px;
}
......@@ -386,6 +423,10 @@ input:focus {
margin-top: 22px;
}
.m-t-24 {
margin-top: 24px;
}
.m-t-30 {
margin-top: 30px;
}
......@@ -394,6 +435,10 @@ input:focus {
margin-top: 44px;
}
.m-t-46 {
margin-top: 46px;
}
.m-r-10 {
margin-right: 10px;
}
......@@ -426,6 +471,10 @@ input:focus {
font-size: 12px;
}
.font-13 {
font-size: 13px;
}
.font-14 {
font-size: 14px;
}
......@@ -454,10 +503,96 @@ input:focus {
line-height: 1;
}
.w-80 {
width: 80px;
}
.w-130 {
width: 130px;
}
.w-157 {
width: 157px;
}
.w-250 {
width: 250px;
}
.inline-block {
display: inline-block;
}
/* flex */
.flex {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.flex-1 {
-webkit-box-flex: 1;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
}
.flex-column {
-webkit-flex-direction: column;
-moz-flex-direction: column;
-ms-flex-direction: column;
-o-flex-direction: column;
flex-direction: column;
}
.flex-row {
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
-o-flex-direction: row;
flex-direction: row;
}
.flex-align-center {
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.flex-pack-center {
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.flex-start {
-webkit-justify-content: flex-start;
-moz-justify-content: flex-start;
-ms-justify-content: flex-start;
-o-justify-content: flex-start;
justify-content: flex-start;
}
.flex-wrap {
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
-o-flex-wrap: wrap;
flex-wrap: wrap;
}
.flex-space-between {
-webkit-justify-content: space-between;
-moz-justify-content: space-between;
-ms-justify-content: space-between;
-o-justify-content: space-between;
justify-content: space-between;
}
/* 公共 body 内的 left 和 right */
.common-wrap__left {
width: 260px;
......@@ -735,3 +870,17 @@ input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
.J_show-children .el-checkbox__input {
vertical-align: -2px;
}
.el-dropdown-menu__item.p-0 {
width: 98px;
padding: 0;
text-align: center;
}
.el-dropdown-menu__item.p-0 span {
display: block;
}
.app-dialog .el-dialog__footer {
border: none;
}
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