Commit bb1d7737 by fairyly

feat:增加通讯录

parent 4a1f3849
...@@ -28,6 +28,7 @@ ...@@ -28,6 +28,7 @@
"file-saver": "^1.3.8", "file-saver": "^1.3.8",
"html2canvas": "^1.0.0-alpha.12", "html2canvas": "^1.0.0-alpha.12",
"jspdf": "^1.5.3", "jspdf": "^1.5.3",
"localforage": "^1.7.3",
"qrcodejs2": "0.0.2", "qrcodejs2": "0.0.2",
"script-loader": "^0.7.2", "script-loader": "^0.7.2",
"tinymce": "^4.8.3", "tinymce": "^4.8.3",
...@@ -106,4 +107,4 @@ ...@@ -106,4 +107,4 @@
"last 2 versions", "last 2 versions",
"not ie <= 8" "not ie <= 8"
] ]
} }
\ No newline at end of file
src/assets/login/bg.png

189 KB | W: | H:

src/assets/login/bg.png

53.4 KB | W: | H:

src/assets/login/bg.png
src/assets/login/bg.png
src/assets/login/bg.png
src/assets/login/bg.png
  • 2-up
  • Swipe
  • Onion skin
<!--
* @Descripttion : 当前组件信息
* @Author : 无尘
* @Date : 2020-02-13 16:13:59
* @LastEditors : 无尘
* @LastEditTime : 2020-02-15 16:21:48
* @FilePath : \Hapi-demoj:\公司\haoban-3\src\components\company\add-member.vue
-->
<!--
<add-member :memberObj="memberObj" @refreshData="refreshData"></add-member>
import addMember from '@/components/company/add-member.vue';
-->
<template>
<el-dialog width="600px" :title="partForm.staffId ? '成员详情' : '新增成员'" :visible.sync="memberVisible" append-to-body :before-close="handleClose">
<div class="add-title m-b-20 font-14 color-303133 font-w-500">基本信息</div>
<el-form :model="partForm" :rules="rules" ref="form" label-width="100px" class="dialog-form">
<el-form-item label="选择商户" prop="staffName">
<el-input v-model="partForm.enterpriseName" @blur="inputBlur()" @keyup.native="value => toInput(value)">
<el-select v-model="partForm.version" slot="prepend" class="w-92" :disabled="disflag" @change="changeCode">
<el-option v-for="(item, index) in versionList" :label="item.label" :value="item.value" :key="index + 'option'">{{ item.value }}</el-option>
</el-select>
</el-input>
</el-form-item>
<el-form-item label="超级管理员">
{{ partForm.clerkName }}
</el-form-item>
<el-form-item label="超级管理员手机号" prop="sex"> {{ partForm.phoneNumber | formatPhoneNum }} <el-button type="primary" @click="sendCode('form')">点击短信验证</el-button> </el-form-item>
<el-form-item label="短信验证码" prop="code">
<el-input v-model="partForm.code" placeholder="请输入验证码"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel('form')">取消</el-button>
<el-button type="primary" @click="submitForm('form')">确定</el-button>
</div>
</el-dialog>
</template>
<script>
import limitInput from '@/components/limit-input.vue';
import countryMobile from '@/components/common/country-mobile.vue';
import selectDepartment from '@/components/company/select-department.vue';
import { getRequest, postRequest } from '@/api/api';
import errMsg from '@/common/js/error';
import PhoneNumber from 'awesome-phonenumber';
export default {
name: 'add-member',
components: {
limitInput,
countryMobile,
selectDepartment
},
props: {
memberObj: {
type: [Object, Array],
default() {
return {};
}
}
},
data() {
let checkPhone = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入手机号'));
} else {
let pn = new PhoneNumber('+' + this.partForm.nationCode + value);
if (!pn.isValid() || !pn.isMobile()) {
callback(new Error('手机号格式不正确'));
} else {
callback();
}
}
};
return {
versionList: [
{
label: '3.0',
value: '3.0'
},
{
label: '4.0',
value: '4.0'
}
],
memberVisible: true,
partForm: {
version: '',
enterpriseName: '',
nationCode: '86',
phoneNumber: '',
postion: '',
activeFlag: 0,
department: [],
departmentIds: '',
sex: '1',
syncPostionFlag: '1',
extendPostion: ''
},
rules: {
staffName: [
{
required: true,
message: '请输入姓名',
trigger: 'blur'
}
],
phoneNumber: [
{
required: true,
validator: checkPhone,
trigger: 'change'
}
],
department: [
{
type: 'array',
required: true,
message: '请选择部门',
trigger: 'change'
}
]
}
};
},
methods: {
/**
* 改变对外职务
*/
checkGroupIds: function(nodes) {
const that = this;
that.partForm.departmentIds = nodes;
},
/**
* 改变对外职务
*/
changeExtendPostion(e) {
const that = this;
if (e == 1) {
that.partForm.extendPostion = that.partForm.postion;
} else {
that.partForm.extendPostion = '';
}
},
/**
* 关闭弹窗
*/
handleClose(done) {
const that = this;
that.$refs['form'].resetFields();
that.partVisible = false;
done();
},
cancel() {
const that = this;
that.$refs['form'].resetFields();
that.partVisible = false;
},
/**
* 确定保存
*/
submitForm(form) {
const that = this;
that.$refs[form].validate(valid => {
if (valid) {
that.toAddPost();
} else {
return false;
}
});
},
toAddPost() {
const that = this;
let params = {
staffId: that.partForm.staffId,
staffName: that.partForm.staffName,
nickName: that.partForm.nickName,
sex: that.partForm.sex,
nationCode: that.partForm.nationCode,
phoneNumber: that.partForm.phoneNumber,
departmentIds: that.partForm.departmentIds,
postion: that.partForm.postion,
extendPostion: that.partForm.extendPostion,
activeFlag: that.partForm.activeFlag,
syncPostionFlag: that.partForm.syncPostionFlag
};
postRequest(that.partForm.staffId ? '/haoban-web/staff-edit' : '/haoban-web/staff-add', params)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
that.$emit('refreshData');
return false;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 获取数据
*/
getData() {
const that = this;
let params = {
staffId: that.partForm.staffId
};
getRequest('/haoban-web/staff-add', params)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
that.partForm = resData.result;
return false;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
watch: {
memberObj(newData, oldData) {
const that = this;
if (Object.keys(newData).length) {
that.partForm = newData;
}
}
},
mounted() {
const that = this;
if (Object.keys(that.memberObj).length) {
that.partForm = that.memberObj;
}
}
};
</script>
<style lang="less" scoped>
.span-dot {
display: inline-block;
width: 6px;
height: 6px;
margin-right: 5px;
background: rgba(217, 217, 217, 1);
border-radius: 50%;
}
.m-l-30 {
margin-left: 30px;
}
</style>
<!--
* @Descripttion : 当前组件信息
* @Author : 无尘
* @Date : 2020-02-13 16:13:59
* @LastEditors : 无尘
* @LastEditTime : 2020-02-15 16:21:48
* @FilePath : \Hapi-demoj:\公司\haoban-3\src\components\company\add-member.vue
-->
<!--
<add-member :memberObj="memberObj" @refreshData="refreshData"></add-member>
import addMember from '@/components/company/add-member.vue';
-->
<template>
<el-dialog width="600px" :title="partForm.staffId ? '成员详情' : '新增成员'" :visible.sync="memberVisible" append-to-body :before-close="handleClose">
<div class="add-title m-b-20 font-14 color-303133 font-w-500">基本信息</div>
<el-form :model="partForm" :rules="rules" ref="form" label-width="100px" class="dialog-form">
<el-form-item label="姓名" prop="staffName">
<limitInput :inputWidth="357" :inputValue.sync="partForm.staffName" :getByType="char" :holder="'请输入姓名'" :maxLength="12"> </limitInput>
</el-form-item>
<el-form-item label="昵称">
<limitInput :inputWidth="357" :inputValue.sync="partForm.nickName" :getByType="char" :holder="'请输入昵称'" :maxLength="12"> </limitInput>
</el-form-item>
<el-form-item label="性别" prop="sex">
<el-radio v-model="partForm.sex" label="1"></el-radio>
<el-radio v-model="partForm.sex" label="2"></el-radio>
</el-form-item>
<el-form-item label="手机号码" prop="phoneNumber">
<countryMobile :disflag="partForm.staffId ? true : false" :inputWidth="357" :nationCode.sync="partForm.nationcode" :limitClass="'limit-color'" v-model="partForm.phoneNumber" :holder="'请输入手机号码'"> </countryMobile>
</el-form-item>
<el-form-item label="部门" prop="department">
<select-department :selectData="partForm.department" @checkGroupIds="checkGroupIds"> </select-department>
</el-form-item>
<el-form-item label="职务" prop="postion">
<limitInput :inputWidth="357" :inputValue.sync="partForm.postion" :getByType="char" :holder="'请输入职务'" :maxLength="12"> </limitInput>
</el-form-item>
<el-form-item v-if="partForm.staffId" label="激活状态"> <span class="span-dot"></span><span>未激活</span><el-button type="text" class="m-l-30">邀请</el-button> </el-form-item>
<div class="m-b-20 font-14 color-303133 font-w-500">对外信息</div>
<el-form-item label="职务" prop="extendPostion">
<el-radio-group v-model="partForm.syncPostionFlag" @change="changeExtendPostion">
<div style="line-height: 32px;">
<el-radio label="1">同步公司内职务</el-radio>
</div>
<div><el-radio label="2" class="m-r-10">自定义</el-radio><limitInput :inputWidth="285" :inputValue.sync="partForm.extendPostion" :getByType="char" :holder="'请输入职务'" :maxLength="12"> </limitInput></div>
</el-radio-group>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-checkbox v-model="checked" style="margin: -8px 24px 0 0;">通过邮件或短信发送企业邀请</el-checkbox
><!-- <span class="font-14 color-606266">通过邮件或短信发送企业邀请</span> -->
<el-button @click="cancel('form')">取消</el-button>
<el-button v-if="!partForm.staffId" type="primary" @click="submitForm('form')">新建</el-button>
<el-button v-if="partForm.staffId" type="primary" @click="submitForm('form')">保存</el-button>
</div>
</el-dialog>
</template>
<script>
import limitInput from '@/components/limit-input.vue';
import countryMobile from '@/components/common/country-mobile.vue';
import selectDepartment from '@/components/company/select-department.vue';
import { getRequest, postRequest } from '@/api/api';
import errMsg from '@/common/js/error';
import PhoneNumber from 'awesome-phonenumber';
export default {
name: 'add-member',
components: {
limitInput,
countryMobile,
selectDepartment
},
props: {
memberObj: {
type: [Object, Array],
default() {
return {};
}
}
},
data() {
let checkPhone = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入手机号'));
} else {
let pn = new PhoneNumber('+' + this.partForm.nationCode + value);
if (!pn.isValid() || !pn.isMobile()) {
callback(new Error('手机号格式不正确'));
} else {
callback();
}
}
};
return {
memberVisible: true,
partForm: {
staffId: '',
staffName: '',
nickName: '',
nationCode: '86',
phoneNumber: '',
postion: '',
activeFlag: 0,
department: [],
departmentIds: '',
sex: '1',
syncPostionFlag: '1',
extendPostion: ''
},
rules: {
staffName: [
{
required: true,
message: '请输入姓名',
trigger: 'blur'
}
],
phoneNumber: [
{
required: true,
validator: checkPhone,
trigger: 'change'
}
],
department: [
{
type: 'array',
required: true,
message: '请选择部门',
trigger: 'change'
}
]
}
};
},
methods: {
/**
* 改变对外职务
*/
checkGroupIds: function(nodes) {
const that = this;
that.partForm.departmentIds = nodes;
},
/**
* 改变对外职务
*/
changeExtendPostion(e) {
const that = this;
if (e == 1) {
that.partForm.extendPostion = that.partForm.postion;
} else {
that.partForm.extendPostion = '';
}
},
/**
* 关闭弹窗
*/
handleClose(done) {
const that = this;
that.$refs['form'].resetFields();
that.partVisible = false;
done();
},
cancel() {
const that = this;
that.$refs['form'].resetFields();
that.partVisible = false;
},
/**
* 确定保存
*/
submitForm(form) {
const that = this;
that.$refs[form].validate(valid => {
if (valid) {
that.toAddPost();
} else {
return false;
}
});
},
toAddPost() {
const that = this;
let params = {
staffId: that.partForm.staffId,
staffName: that.partForm.staffName,
nickName: that.partForm.nickName,
sex: that.partForm.sex,
nationCode: that.partForm.nationCode,
phoneNumber: that.partForm.phoneNumber,
departmentIds: that.partForm.departmentIds,
postion: that.partForm.postion,
extendPostion: that.partForm.extendPostion,
activeFlag: that.partForm.activeFlag,
syncPostionFlag: that.partForm.syncPostionFlag
};
postRequest(that.partForm.staffId ? '/haoban-web/staff-edit' : '/haoban-web/staff-add', params)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
that.$emit('refreshData');
return false;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 获取数据
*/
getData() {
const that = this;
let params = {
staffId: that.partForm.staffId
};
getRequest('/haoban-web/staff-add', params)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
that.partForm = resData.result;
return false;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
watch: {
memberObj(newData, oldData) {
const that = this;
if (Object.keys(newData).length) {
that.partForm = newData;
}
}
},
mounted() {
const that = this;
if (Object.keys(that.memberObj).length) {
that.partForm = that.memberObj;
}
}
};
</script>
<style lang="less" scoped>
.span-dot {
display: inline-block;
width: 6px;
height: 6px;
margin-right: 5px;
background: rgba(217, 217, 217, 1);
border-radius: 50%;
}
.m-l-30 {
margin-left: 30px;
}
</style>
<!--
* @Descripttion: 当前组件信息
* @version: 1.0.0
* @Author: 无尘
* @Date: 2019-08-14 16:51:07
* @LastEditors : 无尘
* @LastEditTime : 2020-02-14 14:39:12
-->
<!--
<contact-tree :itemData="itemData" v-model="itemData" ></contact-tree>
import contactTree from '/components/company/contact-tree.vue';
-->
<template>
<ul class="m-l-10">
<draggable :list="itemData" class="wx-component" :options="rightOption" @input="emitter" @change="changeData">
<li v-for="(item, index) in itemData" :key="index + 'gic'">
<div class="li-cell cursor-pointer" v-contextmenu:contextmenu @click="toggleExpand(item)">
<span :class="['font-12 color-606266', item.expand ? 'el-icon-caret-bottom' : 'el-icon-caret-right']"></span><span :class="['font-14 p-l-10 p-r-10 iconfont', item.isStore == 1 ? 'icondianpu-kuai' : 'iconqiye-tianchong', item.bindFlag == 1 ? 'color-2f54eb' : 'color-dedfe6']"></span><span class="font-14 color-606266">{{ item.label }}</span>
</div>
<li-row v-if="item.expand" :itemData="item.children" @getSelectData="getSelectData"></li-row
><!-- v-show="!!item.children.length && item.expand" -->
</li>
</draggable>
</ul>
</template>
<script>
import localforage from 'localforage';
import draggable from 'vuedraggable';
// import showMsg from '@/common/js/showmsg';
import { getRequest } from '@/api/api';
import errMsg from '@/common/js/error';
export default {
name: 'li-row',
components: {
draggable
},
props: {
value: {
type: [Object, Array],
default() {
return [];
}
},
itemData: {
type: [Object, Array],
default() {
return [];
}
}
},
data() {
return {
rightOption: {
group: {
name: 'people',
pull: true,
put: true
},
sort: true
}
};
},
computed: {},
methods: {
/**
* 改变数组数据
*/
emitter(value) {
console.log(value);
this.$emit('input', value);
},
changeData(value) {
console.log(value);
},
/**
* 展开或者关闭下级
*/
toggleExpand(item) {
const that = this;
console.log(item);
item.expand = item.expand ? false : true;
/* if (!item.children.length) {
item.expand = true;
} */
if (item.expand) {
localforage.setItem(item.departmentId, item);
} else {
localforage.removeItem(item.departmentId);
}
that.$emit('getSelectData', item);
that.$forceUpdate();
},
/**
* 获取选中部门/门店数据
*/
getSelectData(obj) {
const that = this;
that.selectData = obj;
that.$emit('getSelectData', obj);
},
/**
* 获取下级数据
*/
getChildData(item) {
const that = this;
let para = {
parentId: item.departmentId, //
isStore: item.isStore, //
pageSize: that.pageSize // 一页显示个数
};
getRequest('/haoban-app-member-web/customer/find_message_list', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
if (resData.result.list.length) {
resData.result.list.forEach(ele => {
ele.expand = false;
ele.children = [];
ele.label = ele.departmentName;
item.children.push(ele);
});
}
that.$forceUpdate();
return false;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
}
},
watch: {
value: function(newData, oldData) {
const that = this;
that.trData = JSON.parse(JSON.stringify(newData));
}
},
mounted() {
const that = this;
that.trData = JSON.parse(JSON.stringify(that.value));
}
/* beforeDestroy() {} */
};
</script>
<style lang="less" scoped>
.li-cell {
min-height: 26px;
line-height: 26px;
}
.w-110 {
width: 110px;
}
.w-320 {
width: 320px;
}
.m-t-14 {
margin-top: 14px;
}
.child-row {
padding-left: 10px;
}
</style>
<!--
* @Descripttion : 当前组件信息
* @Author : 无尘
* @Date : 2020-02-13 14:02:22
* @LastEditors : 无尘
* @LastEditTime : 2020-02-15 15:12:46
* @FilePath : haoban-3\src\components\company\depart-list.vue
-->
<!--
<depart-list :departObj="departObj" @resetData="resetData"></depart-list>
import departList from '@/components/company/depart-list.vue';
-->
<template>
<div class="depart-list-body">
<div class="depart-name-wrap">
<div class="depart-name">
<span class="font-16 color-303133 font-w-600">{{ departObj.departmentName }}</span>
<el-popover placement="top" style="min-width: 192px" v-model="nameVisible">
<limitInput :inputWidth="180" :inputValue.sync="departmentName" :holder="'请输入部门名称'" :maxLength="32"> </limitInput>
<div style="text-align: right; margin: 12px 0 0 0">
<el-button size="mini" type="text" @click="cancelMod">取消</el-button>
<el-button type="primary" size="mini" @click="toMod">确定</el-button>
</div>
<span slot="reference"><span class="cursor-pointer iconfont iconchangyongicon- color-909399"></span></span>
</el-popover>
</div>
<div class="depart-id font-12 color-909399">{{ departObj.departmentId }}</div>
</div>
<div class="depart-children-list border-box m-t-18">
<div class="depart-children-title"><span class="iconfont iconbumen color-303133"></span><span class="font-16 color-303133 font-w-600">下级部门</span></div>
<div class="depart-condition-wrap flex flex-space-between m-t-20">
<el-input placeholder="请输入部门名称/ID" v-model="searchInput" class="w-274" @keyup.native="value => toInput(value, searchInput)" clearable @clear="clearInput"></el-input>
<el-button type="primary" @click="addChildPart">新建子部门</el-button>
</div>
<div class="m-t-20">
<el-table class="select-table" ref="multipleTable" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }">
<el-table-column label="部门名称" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.departmentName || '--' }}({{ scope.row.staffCount }})</template>
</el-table-column>
<el-table-column prop="" label="企业微信部门ID" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.wxDepartmentId || '--' }}</template>
</el-table-column>
<el-table-column prop="" label="ERP CODE" show-overflow-tooltip>
<template slot-scope="scope">
<span class="iconfont iconnavigate_next inline-block cursor-pointer" @click="getChildren(scope.row)"></span>
</template>
</el-table-column>
</el-table>
<div class="block common-wrap__page text-right m-t-24" v-if="tableData.length != 0">
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </el-pagination>
</div>
</div>
</div>
<!-- 新增子部门 -->
<el-dialog width="600px" title="新增子部门" :visible.sync="partVisible" append-to-body :before-close="handleClose">
<el-form :model="partForm" :rules="rules" ref="form" label-width="100px" class="dialog-form">
<el-form-item label="部门名称:" prop="departmentName">
<limitInput :inputWidth="440" :inputValue.sync="partForm.departmentName" :holder="'请输入部门名称'" :maxLength="32"> </limitInput>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="cancel('form')">取消</el-button>
<el-button type="primary" @click="submitForm('form')">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { _debounce } from '@/common/js/public';
import { getRequest, postRequest } from '@/api/api';
import errMsg from '@/common/js/error';
import limitInput from '@/components/limit-input.vue';
export default {
name: 'depart-list',
components: {
limitInput
},
props: {
departObj: {
type: Object,
default() {
return {
departmentId: '',
departmentName: '',
wxDepartmentId: '',
parentId: '',
isStore: '',
staffCount: '',
bindFlag: ''
};
}
}
},
data() {
return {
nameVisible: false,
departmentName: '',
searchInput: '',
// 分页参数
currentPage: 1,
pageSize: 10,
total: 0,
tableData: [],
// 新增
partVisible: false,
partForm: {
departmentName: ''
},
rules: {
name: [
{
required: true,
message: '请输入部门名称',
trigger: 'blur'
}
]
}
};
},
methods: {
/**
* 取消
*/
cancelMod() {
const that = this;
that.departmentName = '';
that.nameVisible = false;
},
toMod() {
const that = this;
let obj = JSON.parse(JSON.stringify(that.departObj));
obj.departmentName = that.departmentName;
that.$emit('resetData', obj);
that.nameVisible = false;
},
/**
* 输入
*/
toInput: _debounce(function(e, value) {
const that = this;
that.currentPage = 1;
that.getTableList();
}, 500),
// 搜索清除
clearInput() {
const that = this;
that.currentPage = 1;
that.getTableList();
},
/**
* 获取子部门
*/
getChildren(item) {
const that = this;
that.currentPage = 1;
that.getTableList();
},
handleClose(done) {
const that = this;
that.$refs['form'].resetFields();
that.partVisible = false;
done();
},
cancel() {
const that = this;
that.$refs['form'].resetFields();
that.partVisible = false;
},
/**
* 新建子部门
*/
addChildPart(item) {
const that = this;
that.partVisible = true;
},
/**
* 确定授权
*/
submitForm(form) {
const that = this;
that.$refs[form].validate(valid => {
if (valid) {
that.toAddPost();
} else {
return false;
}
});
},
toAddPost() {
const that = this;
let params = {
parentId: that.departObj.departmentId,
departmentName: that.form.departmentName
};
postRequest('/haoban-web/department-add', params)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
that.currentPage = 1;
that.getTableList();
// 是否需要更新左侧 tree
return false;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
},
/**
* 分页---页码变化
*/
handleSizeChange(val) {
const that = this;
that.pageSize = val;
that.getTableList();
},
/**
* 分页---当前页变化
*/
handleCurrentChange(val) {
const that = this;
that.currentPage = val;
that.getTableList();
},
/**
* 获取列表数据
*/
getTableList(val) {
const that = this;
let para = {
parentId: '',
isStore: '',
keyWord: that.searchInput || '', // 搜索字段
pageNum: that.currentPage, // 当前页
pageSize: that.pageSize // 一页显示个数
};
getRequest('/haoban-web/department-list', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
that.tableData = resData.result.list || [];
that.total = resData.result.total;
return false;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
}
}
};
</script>
<style lang="less" scoped>
.w-274 {
width: 274px;
}
.depart-list-body {
.depart-children-list {
padding: 16px 10px;
background: #f5f7fa;
}
}
</style>
<!--
* @Descripttion: 当前组件信息
* @version: 1.0.0
* @Author: 无尘
* @Date: 2019-08-14 16:51:07
* @LastEditors : 无尘
* @LastEditTime : 2020-01-14 14:44:57
-->
<!--
<org-tree v-if="item.children.length" :itemData="item.children" ></org-tree>
import orgTree from './org-tree.vue';
-->
<template>
<ul class="m-l-10">
<draggable :list="itemData" class="org-component" :options="leftOption" :move="onMove" @start="isDragging = true" @end="itemMoveEnd">
<li v-for="(item, index) in itemData" :key="index + 'gic'">
<div class="li-cell cursor-pointer" @click="toggleExpand(item)">{{ item.label }}</div>
<li-row v-show="!!item.children.length && item.expand" :itemData="item.children"></li-row>
</li>
</draggable>
</ul>
</template>
<script>
import draggable from 'vuedraggable';
export default {
name: 'li-row',
components: {
draggable
},
props: {
itemData: {
type: [Object, Array],
default() {
return [];
}
}
},
data() {
return {
// leftOption
leftOption: {
group: {
name: 'people',
pull: true,
put: false
},
sort: false,
disabled: false
}
};
},
methods: {
/**
* 展开或者关闭下级
*/
toggleExpand(item) {
console.log(item);
item.expand = item.expand ? false : true;
},
/**
* move{relatedContext, draggedContext}
*/
onMove(evt) {
// const that = this;
// 判断中间是否存在父级
const draggedElement = evt.draggedContext.element;
console.log(evt, !draggedElement.fixed);
return !draggedElement.fixed;
},
/**
* move end
*/
itemMoveEnd(evt) {
const that = this;
// 判断中间是否已经添加
console.log(that.itemData);
that.$forceUpdate();
}
},
watch: {
itemData: function(newData, oldData) {
const that = this;
that.trData = JSON.parse(JSON.stringify(newData));
}
},
mounted() {
const that = this;
that.trData = JSON.parse(JSON.stringify(that.itemData));
},
beforeDestroy() {
this.tempArr = [];
}
};
</script>
<style lang="less" scoped>
.li-cell {
line-height: 26px;
}
.w-110 {
width: 110px;
}
.w-320 {
width: 320px;
}
.m-t-14 {
margin-top: 14px;
}
.child-row {
padding-left: 10px;
}
</style>
...@@ -4,42 +4,44 @@ ...@@ -4,42 +4,44 @@
* @Author: 无尘 * @Author: 无尘
* @Date: 2020-02-08 10:27:21 * @Date: 2020-02-08 10:27:21
* @LastEditors : 无尘 * @LastEditors : 无尘
* @LastEditTime : 2020-02-08 17:01:46 * @LastEditTime : 2020-02-15 14:17:17
--> -->
<!-- <!--
添加成员选择部门组件: 添加成员选择部门组件:
<select-department <select-department
:brandId="brandId" :selectData="selectData"
@checkGroupIds="checkGroupIds"> @checkGroupIds="checkGroupIds">
</select-department> </select-department>
import selectDepartment from '@/components/company/select-department.vue';
checkGroupIds: function(nodes) { checkGroupIds: function(nodes) {
const that = this; const that = this;
that.conditionObj.groupIds = nodes; that.conditionObj.groupIds = nodes;
}, },
--> -->
<template> <template>
<el-popover placement="bottom" style="min-width: 232px" v-model="departmentVisible"> <el-popover placement="bottom" style="min-width: 282px" v-model="departmentVisible">
<div class="select-search"> <div class="select-search">
<el-input placeholder="请输入部门名称" v-model="searchSelect" style="width: 100%;" @keyup.native="value => toInput(value, searchSelect)" @clear="clearSearch"> <i slot="prefix" class="el-input__icon el-icon-search"></i> </el-input> <el-input placeholder="请输入内容" v-model="searchSelect" style="width: 100%;" @keyup.native="value => toInput(value, searchSelect)" @clear="clearSearch"> <i slot="prefix" class="el-input__icon el-icon-search"></i> </el-input>
</div> </div>
<div class="select-tree-wrap"> <div class="select-tree-wrap">
<el-tree :data="storeData" node-key="groupId" ref="storeTree" show-checkbox default-expand-all :props="defaultProps" :expand-on-click-node="false" @check="checkStore"> <el-tree :data="storeData" node-key="groupId" ref="storeTree" show-checkbox default-expand-all :props="defaultProps" :expand-on-click-node="false" @check="checkStore">
<span class="custom-tree-node" slot-scope="{ node, data }"> <span class="custom-tree-node" slot-scope="{ node, data }">
<span>{{ node.label }}</span> <span :class="['font-14 p-r-10 iconfont', node.isStore == 1 ? 'icondianpu-kuai' : 'iconqiye-tianchong', node.bindFlag == 1 ? 'color-2f54eb' : 'color-dedfe6']"></span><span class="font-14 color-606266">{{ node.label }}</span>
</span> </span>
</el-tree> </el-tree>
</div> </div>
<div class="flex-column item-cell-select inline-block m-l-10" slot="reference"> <div class="flex-column item-cell-select inline-block " slot="reference">
<div class="depart-item-wrap"> <div class="depart-item-wrap">
<div style="width: 131px;" class="el-select el-select--large depart-item-content"> <div :style="{ width: width }" class="el-select el-select--large depart-item-content">
<span class="font-14 color-c0c4cc p-l-10" style="display: inline-block;line-height: 32px;color: #c0c4cc;" v-if="!storeGroupIds.length">请选择部门</span> <span class="font-14 color-c0c4cc p-l-10" style="display: inline-block;line-height: 32px;color: #c0c4cc;" v-if="!storeGroupIds.length">请选择部门</span>
<div class="el-select__tags" style="max-width: 181px;"> <div class="el-select__tags" style="max-width: 181px;">
<span> <span>
<template v-for="(item, index) in storeGroupIds"> <template v-for="(item, index) in storeGroupIds">
<span class="el-tag el-tag--info el-tag--small" :key="index"> <span class="el-tag el-tag--info el-tag--small" :key="index">
<span class="el-select__tags-text">{{ item.name || item.storeName }}</span> <span class="el-select__tags-text">{{ item.departmentName }}</span>
<!-- <i class="el-tag__close el-icon-close" @click.stop="delDepart(index, storeGroupIds)"></i> --> <i class="el-tag__close el-icon-close" @click.stop="delDepart(index, storeGroupIds)"></i>
</span> </span>
</template> </template>
</span> </span>
...@@ -52,6 +54,7 @@ ...@@ -52,6 +54,7 @@
<script> <script>
import { getRequest } from '@/api/api'; import { getRequest } from '@/api/api';
import errMsg from '@/common/js/error'; import errMsg from '@/common/js/error';
import { _debounce } from '@/common/js/public';
export default { export default {
name: 'store-tree-select', name: 'store-tree-select',
props: { props: {
...@@ -61,10 +64,16 @@ export default { ...@@ -61,10 +64,16 @@ export default {
return ''; return '';
} }
}, },
activeGroupId: { width: {
type: String, type: String,
default() { default() {
return ''; return '357px';
}
},
selectData: {
type: [Object, Array],
default() {
return [];
} }
} }
}, },
...@@ -108,6 +117,14 @@ export default { ...@@ -108,6 +117,14 @@ export default {
}, },
/** /**
* 删除
*/
delDepart(index, obj) {
// const that = this;
obj.splice(index, 1);
},
/**
* 简单数组-->父子数组对象 * 简单数组-->父子数组对象
*/ */
treeData(data) { treeData(data) {
...@@ -130,9 +147,11 @@ export default { ...@@ -130,9 +147,11 @@ export default {
getStoreGroup() { getStoreGroup() {
let that = this; let that = this;
let para = { let para = {
appScene: that.appScene parentId: '',
isStore: '',
keyword: ''
}; };
getRequest('/haoban-manage-web/dept/deptList', para) getRequest('/haoban-web/department-list', para)
.then(res => { .then(res => {
let resData = res.data; let resData = res.data;
if (resData.errorCode == 1) { if (resData.errorCode == 1) {
...@@ -165,10 +184,10 @@ export default { ...@@ -165,10 +184,10 @@ export default {
that.getStoreGroup(); that.getStoreGroup();
} }
}, },
activeGroupId: function(newData, oldData) { selectData: function(newData, oldData) {
let that = this; let that = this;
if (!!newData) { if (!!newData.length) {
that.activeGroup = newData; that.storeGroupIds = newData;
} }
} }
}, },
...@@ -176,7 +195,7 @@ export default { ...@@ -176,7 +195,7 @@ export default {
const that = this; const that = this;
if (!!that.brandId) { if (!!that.brandId) {
that.activeBrand = that.brandId; that.activeBrand = that.brandId;
that.activeGroup = that.activeGroupId; that.storeGroupIds = that.selectData;
that.checkStore(); that.checkStore();
that.getStoreGroup(); that.getStoreGroup();
} }
......
<!--
* @Descripttion: 当前组件信息
* @version: 1.0.0
* @Author: 无尘
* @Date: 2019-08-14 16:51:07
* @LastEditors : 无尘
* @LastEditTime : 2020-02-14 12:33:26
-->
<!--
<wx-tree v-model="itemData" ></wx-tree>
import wxTree from './wx-tree.vue';
-->
<template>
<ul class="m-l-10">
<draggable :list="itemData" class="wx-component" :options="rightOption" @input="emitter" @change="changeData">
<li v-for="(item, index) in itemData" :key="index + 'gic'">
<div class="li-cell cursor-pointer" v-contextmenu:contextmenu @click="toggleExpand(item)">
<span :class="['font-12 color-606266', item.expand ? 'el-icon-caret-bottom' : 'el-icon-caret-right']"></span><span :class="['font-14 p-l-10 p-r-10 iconfont', item.isStore == 1 ? 'icondianpu-kuai' : 'iconqiye-tianchong', item.bindFlag == 1 ? 'color-2f54eb' : 'color-dedfe6']"></span><span class="font-14 color-606266">{{ item.label }}</span>
</div>
<v-contextmenu ref="contextmenu">
<v-contextmenu-item @click="addChild(item)">添加子部门</v-contextmenu-item>
<v-contextmenu-item @click="modChild(item)">修改名称</v-contextmenu-item>
<v-contextmenu-item @click="delChild(item)">删除</v-contextmenu-item>
<v-contextmenu-item>部门ID: {{ item.id }}</v-contextmenu-item>
</v-contextmenu>
<li-row v-if="item.expand" :itemData="item.children"></li-row
><!-- v-show="!!item.children.length && item.expand" -->
</li>
</draggable>
</ul>
</template>
<script>
import draggable from 'vuedraggable';
import showMsg from '@/common/js/showmsg';
export default {
name: 'li-row',
components: {
draggable
},
props: {
value: {
type: [Object, Array],
default() {
return [];
}
},
itemData: {
type: [Object, Array],
default() {
return [];
}
}
},
data() {
return {
rightOption: {
group: {
name: 'people',
pull: true,
put: true
},
sort: true
}
};
},
computed: {},
methods: {
/**
* 改变数组数据
*/
emitter(value) {
console.log(value);
this.$emit('input', value);
},
changeData(value) {
console.log(value);
},
/**
* 展开或者关闭下级
*/
toggleExpand(item) {
const that = this;
console.log(item);
item.expand = item.expand ? false : true;
if (!item.children.length) {
item.expand = true;
}
that.$forceUpdate();
},
/**
* 添加子部门
*/
addChild(item) {
const that = this;
console.log('添加:', item);
item.children.push({
id: 225,
expand: true,
label: '总部225',
children: []
});
that.$forceUpdate();
},
/**
* 修改名称
*/
modChild(item) {
const that = this;
console.log('修改:', item);
item.label = 2222;
that.$forceUpdate();
},
/**
* 删除
*/
delChild(item) {
const that = this;
console.log('删除:', item, that.itemData);
if (!!item.children.length) {
showMsg.showmsg('当前节点下有子节点,不可删除', 'warning');
return false;
}
let key = '';
that.itemData.forEach((ele, index) => {
if (ele.id == item.id) {
key = index;
}
});
that.itemData.splice(key, 1);
that.$forceUpdate();
}
},
watch: {
value: function(newData, oldData) {
const that = this;
that.trData = JSON.parse(JSON.stringify(newData));
}
},
mounted() {
const that = this;
that.trData = JSON.parse(JSON.stringify(that.value));
}
/* beforeDestroy() {} */
};
</script>
<style lang="less" scoped>
.li-cell {
min-height: 26px;
line-height: 26px;
}
.w-110 {
width: 110px;
}
.w-320 {
width: 320px;
}
.m-t-14 {
margin-top: 14px;
}
.child-row {
padding-left: 10px;
}
</style>
...@@ -99,10 +99,23 @@ const timeStampToHms = function(data) { ...@@ -99,10 +99,23 @@ const timeStampToHms = function(data) {
return `${hours}:${minutes}:${seconds}`; return `${hours}:${minutes}:${seconds}`;
}; };
/**
* 手机号格式化
* @param {String} phone
*/
const formatPhoneNum = function(phone) {
if (!phone) {
return '';
}
phone = phone.toString();
return phone.substr(0, 3) + '****' + phone.substr(7, 11);
};
export default { export default {
dateFormat, dateFormat,
formatTimeStamp, formatTimeStamp,
timeStampToYmd, timeStampToYmd,
timeStampToHms, timeStampToHms,
formatTimeYmdHms formatTimeYmdHms,
formatPhoneNum
}; };
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
* @Author: 无尘 * @Author: 无尘
* @Date: 2018-10-10 14:44:45 * @Date: 2018-10-10 14:44:45
* @LastEditors : 无尘 * @LastEditors : 无尘
* @LastEditTime : 2020-02-11 20:38:56 * @LastEditTime : 2020-02-12 11:21:17
*/ */
import Vue from 'vue'; import Vue from 'vue';
import Router from 'vue-router'; import Router from 'vue-router';
...@@ -54,20 +54,10 @@ export const constantRouterMap = [ ...@@ -54,20 +54,10 @@ export const constantRouterMap = [
component: _import('login', 'index') component: _import('login', 'index')
}, },
{ {
path: '/download',
name: '下载',
component: _import('download', 'index')
},
{
path: '/index', path: '/index',
name: 'index', name: 'index',
component: _import('index', 'index') component: _import('index', 'index')
}, },
{
path: '/sign',
name: 'index',
component: _import('sign', 'index')
},
{ {
// 通讯录 // 通讯录
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
* @Author: 无尘 * @Author: 无尘
* @Date: 2019-03-20 14:36:37 * @Date: 2019-03-20 14:36:37
* @LastEditors : 无尘 * @LastEditors : 无尘
* @LastEditTime : 2020-01-14 10:06:35 * @LastEditTime : 2020-02-13 11:21:07
--> -->
<!-- <!--
...@@ -14,41 +14,27 @@ ...@@ -14,41 +14,27 @@
<template> <template>
<div class="app-detail-wrap"> <div class="app-detail-wrap">
<div class="app-detail-pane border-box p-20"> <div class="app-detail-pane border-box p-20">
<div class="condition-wrap font-0"> <div class="condition-wrap flex flex-space-between">
<el-input placeholder="请输入分组名称搜索" v-model="conditionObj.searchInput" class="w-264" style="width: 264px;" prefix-icon="el-icon-search" @keyup.native="value => toInput(value, conditionObj.searchInput)" clearable @clear="clearInput"></el-input> <div>
<el-select class="w-105 m-l-10" v-model="conditionObj.classifyName" placeholder="请选择" @change="changeCondition"> <el-input placeholder="请输入分组名称" v-model="conditionObj.searchInput" class="w-264" style="width: 217px;" prefix-icon="el-icon-search" @keyup.native="value => toInput(value, conditionObj.searchInput)" clearable @clear="clearInput"></el-input>
<el-option label="全部" value=""></el-option> <el-select class="w-168 m-l-10" v-model="conditionObj.classifyName" placeholder="全部分类" @change="changeCondition">
<el-option v-for="item in classifyList" :key="item" :label="item" :value="item"> </el-option> <el-option label="全部分类" value=""></el-option>
</el-select> <el-option v-for="item in classifyList" :key="item" :label="item" :value="item"> </el-option>
<el-select class="m-l-10" v-model="conditionObj.effectiveStatus" placeholder="请选择状态" @change="changeCondition"> </el-select>
<el-option label="全部" value=""></el-option> <el-select class="w-168 m-l-10" v-model="conditionObj.effectiveStatus" placeholder="全部状态" @change="changeCondition">
<el-option label="有效" value="1"></el-option> <el-option label="全部状态" value=""></el-option>
<el-option label="失效" value="0"></el-option> <el-option label="有效" value="1"></el-option>
</el-select> <el-option label="失效" value="0"></el-option>
</div> </el-select>
<div class="condition-tip m-t-20 m-b-20">
<div role="alert" class="el-alert el-alert--info">
<i class="el-alert__icon el-icon-info font-12 color-1890ff"></i>
<div class="el-alert__content"><span class="el-alert__title color-606266 font-14">注:GIC设置分组后,好办会员分组列表次日刷新,每日刷新一次,仅展示GIC中开启【好办展示】的会员分组</span></div>
</div> </div>
</div> <div>
<div class="m-t-20 m-b-20"> <el-checkbox v-model="checked"></el-checkbox>
<div class="switch-wrap m-t-20"> <el-tooltip class="item" effect="dark" content="开启后,GIC中设置的好办端会员分组到期后,好办移动端将不再展示该条分组" placement="top-start"> <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;" class="font-14 color-606266 m-r-20">会员分组到期后不展示</span></el-tooltip>
<div class="flex flex-space-between"> <el-button type="primary" @click="toSync">立即同步</el-button>
<div class="flex flex-align-center"> <span v-if="syncDate" class="font-14 color-606266 p-r-10">最近一次同步时间:{{ syncDate | formatTimeStamp }}</span>
<el-switch v-model="overTimeSeeFlag" active-text="" inactive-text="" @change="saveGroupSet"> </el-switch>
<el-tooltip class="item" effect="dark" content="开启后,GIC中设置的好办端会员分组到期后,好办移动端将不再展示该条分组" placement="top-start">
<span style="cursor: pointer;" class="font-14 color-606266">会员分组到期后不展示<span class="el-icon-info font-12 color-909399"></span> </span
></el-tooltip>
</div>
<div>
<span v-if="syncDate" class="font-14 color-606266 p-r-10">最近一次同步时间:{{ syncDate | formatTimeStamp }}</span
><el-button type="primary" @click="toSync">立即同步</el-button>
</div>
</div>
</div> </div>
</div> </div>
<div> <div class="m-t-20">
<el-table class="select-table" ref="multipleTable" :data="groupListData" tooltip-effect="dark" :style="{ width: '100%' }"> <el-table class="select-table" ref="multipleTable" :data="groupListData" tooltip-effect="dark" :style="{ width: '100%' }">
<el-table-column label="分组名称" width="120" show-overflow-tooltip> <el-table-column label="分组名称" width="120" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.groupName }}</template> <template slot-scope="scope">{{ scope.row.groupName }}</template>
...@@ -74,26 +60,16 @@ ...@@ -74,26 +60,16 @@
<div>{{ scope.row.effectiveDate | timeStampToHms }}</div> <div>{{ scope.row.effectiveDate | timeStampToHms }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column> <!-- <el-table-column>
<template slot="header" slot-scope="scope">
<el-tooltip class="item" effect="dark" content="<前提:开启模板消息开关。仅支持专属导购对<我的顾客-会员分组>中的分组下会员发送模板消息>" placement="right">
<span style="cursor: pointer">模板消息设置<i class="el-icon-info font-12 color-606266"></i></span>
</el-tooltip>
</template>
<template slot-scope="scope">
<el-switch v-model="scope.row.isSendTemplate" active-text="" inactive-text="" @change="toChangeTemp($event, scope.$index, scope.row)"> </el-switch>
</template>
</el-table-column>
<el-table-column>
<template slot="header" slot-scope="scope"> <template slot="header" slot-scope="scope">
<el-tooltip class="item" effect="dark" content="仅可编辑能在好办展示的分组" placement="right"> <el-tooltip class="item" effect="dark" content="仅可编辑能在好办展示的分组" placement="right">
<span style="cursor: pointer">操作<i class="el-icon-info font-12 color-606266"></i></span> <span style="cursor: pointer;padding-bottom: 2px; border-bottom: 1px dashed #2F54EB;">操作</span>
</el-tooltip> </el-tooltip>
</template> </template>
<template slot-scope="scope"> <template slot-scope="scope">
<el-button type="text" size="small" @click="toEditGroup(scope.$index, scope.row)">编辑分组可见范围</el-button> <el-button type="text" size="small" @click="toEditGroup(scope.$index, scope.row)">编辑分组可见范围</el-button>
</template> </template>
</el-table-column> </el-table-column> -->
</el-table> </el-table>
<div class="block common-wrap__page text-right m-t-24" v-if="groupListData.length != 0"> <div class="block common-wrap__page text-right m-t-24" v-if="groupListData.length != 0">
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </el-pagination> <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </el-pagination>
...@@ -147,12 +123,6 @@ export default { ...@@ -147,12 +123,6 @@ export default {
allowGuideMessage: false, allowGuideMessage: false,
allowGuideOnlineChat: false allowGuideOnlineChat: false
}, },
topMenuData: [
{
id: '1',
name: '会员搜索设置'
}
],
activeId: '1', activeId: '1',
overTimeSeeFlag: '', overTimeSeeFlag: '',
// 会员分组设置 // 会员分组设置
...@@ -531,6 +501,10 @@ export default { ...@@ -531,6 +501,10 @@ export default {
width: 500px; width: 500px;
} }
.w-168 {
width: 168px;
}
.w-195 { .w-195 {
width: 195px; width: 195px;
} }
...@@ -558,13 +532,13 @@ export default { ...@@ -558,13 +532,13 @@ export default {
background: #fff; background: #fff;
/deep/ .el-tabs__nav-wrap { /deep/ .el-tabs__nav-wrap {
/* height: 48px; /* height: 48px;
line-height: 48px; */ line-height: 48px; */
&::after { &::after {
height: 1px; height: 1px;
} }
/* .el-tabs__nav-scroll { /* .el-tabs__nav-scroll {
padding-left: 20px; padding-left: 20px;
} */ } */
} }
} }
.condition-tip { .condition-tip {
......
...@@ -3,8 +3,8 @@ ...@@ -3,8 +3,8 @@
* @version: 1.0.0 * @version: 1.0.0
* @Author: 无尘 * @Author: 无尘
* @Date: 2019-03-20 14:36:37 * @Date: 2019-03-20 14:36:37
* @LastEditors: 无尘 * @LastEditors : 无尘
* @LastEditTime: 2019-10-24 15:23:36 * @LastEditTime : 2020-02-15 17:01:02
--> -->
<template> <template>
<div class="contacts-wrap common-set-wrap"> <div class="contacts-wrap common-set-wrap">
...@@ -12,25 +12,24 @@ ...@@ -12,25 +12,24 @@
<div class="right-content"> <div class="right-content">
<div class="right-box" :style="{ 'min-height': bgHeight }"> <div class="right-box" :style="{ 'min-height': bgHeight }">
<div class="apps-content flex" :style="{ 'min-height': bgHeight }"> <div class="apps-content flex" :style="{ 'min-height': bgHeight }">
<div class="apps-content-left"></div> <div class="apps-content-left border-box">
<div class="apps-content-right"> <div class="left-tree-body border-box">
<div class="overstore-tip"></div> <div class="left-tree-search">
<div class="table-condition-search"> <el-input placeholder="请输入内容" v-model="searchInput" class="w-225" @keyup.native="value => toInput(value, searchInput)" clearable @clear="clearInput"></el-input>
<el-input placeholder="请输入门店名称/CODE/ID" v-model="searchInput" class="w-369" @keyup.native="value => toInput(value, searchInput)" clearable @clear="clearInput"></el-input> <span class="iconfont iconzuzhijiagouguanli p-l-10 cursor-pointer" @click="toManage"></span>
</div>
<div class="left-tree p-t-14">
<contact-tree :itemData="wxData" v-model="wxData" @getSelectData="getSelectData"></contact-tree>
</div>
</div> </div>
<el-table class="select-table" ref="multipleTable" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }"> </div>
<el-table-column label="门店名称" show-overflow-tooltip> <div class="apps-content-right">
<template slot-scope="scope">{{ scope.row.name || '--' }}</template> <div class="content-right-body border-box">
</el-table-column> <!-- 查看是否是部门,不是门店 -->
<el-table-column prop="" label="ERP CODE" show-overflow-tooltip> <depart-list v-if="departObj.isStore == 0" :departObj="departObj" @resetData="resetData"></depart-list>
<template slot-scope="scope">{{ scope.row.phoneNumber || '--' }}</template> <depart-member v-if="departObj.isStore == 0" :departObj="departObj"></depart-member>
</el-table-column> <!-- 门店的显示门店成员 -->
<el-table-column prop="" label="企业微信部门ID" show-overflow-tooltip> <store-member v-if="departObj.isStore == 1" :departObj="departObj"></store-member>
<template slot-scope="scope">{{ scope.row.storeName || '--' }}</template>
</el-table-column>
</el-table>
<div class="block common-wrap__page text-right m-t-24" v-if="tableData.length != 0">
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </el-pagination>
</div> </div>
</div> </div>
</div> </div>
...@@ -41,11 +40,22 @@ ...@@ -41,11 +40,22 @@
</template> </template>
<script> <script>
import navCrumb from '@/components/nav/nav.vue'; import navCrumb from '@/components/nav/nav.vue';
import contactTree from '@/components/company/contact-tree.vue';
import departList from '@/components/company/depart-list.vue';
import departMember from '@/components/company/depart-member.vue';
import storeMember from '@/components/company/store-member.vue';
import { getRequest } from '@/api/api'; import { getRequest } from '@/api/api';
import errMsg from '@/common/js/error'; import errMsg from '@/common/js/error';
import { _debounce } from '@/common/js/public'; import { _debounce } from '@/common/js/public';
export default { export default {
name: 'reviewed', name: 'reviewed',
components: {
navCrumb,
contactTree,
departList,
departMember,
storeMember
},
data() { data() {
return { return {
bgHeight: window.screen.availHeight - 380 + 'px', bgHeight: window.screen.availHeight - 380 + 'px',
...@@ -61,6 +71,29 @@ export default { ...@@ -61,6 +71,29 @@ export default {
} }
], ],
searchInput: '', searchInput: '',
wxData: [
{
id: 2,
expand: false,
isStore: 0,
label: '总部2',
bindFlag: 0,
children: [
{
id: 22,
expand: false,
isStore: 1,
label: '总部2',
bindFlag: 1,
children: []
}
]
}
],
selectData: {},
departObj: {
isStore: 1
},
// 分页参数 // 分页参数
currentPage: 1, currentPage: 1,
pageSize: 20, pageSize: 20,
...@@ -71,6 +104,22 @@ export default { ...@@ -71,6 +104,22 @@ export default {
computed: {}, computed: {},
methods: { methods: {
/** /**
* 组织架构管理
*/
toManage() {
const that = this;
that.$router.push('/orgStructSet');
},
/**
* 获取选中部门/门店数据
*/
getSelectData(obj) {
const that = this;
console.log(obj);
// obj.label = '测试';
that.selectData = obj;
},
/**
* 路由跳转 * 路由跳转
*/ */
changeRoute(path) { changeRoute(path) {
...@@ -135,16 +184,7 @@ export default { ...@@ -135,16 +184,7 @@ export default {
}); });
} }
}, },
watch: { watch: {},
activeBrand: function(newData, oldData) {
const that = this;
that.activeBrand = newData;
},
activeGroup: function(newData, oldData) {
const that = this;
that.activeGroup = newData;
}
},
mounted() { mounted() {
let that = this; let that = this;
let iconUrl = that.$route.query.appIcon; let iconUrl = that.$route.query.appIcon;
...@@ -155,13 +195,10 @@ export default { ...@@ -155,13 +195,10 @@ export default {
}, },
destroyed() { destroyed() {
document.documentElement.style.backgroundColor = '#fff'; document.documentElement.style.backgroundColor = '#fff';
},
components: {
navCrumb
} }
}; };
</script> </script>
<style type="text/scss" lang="scss" scoped> <style type="text/less" lang="less" scoped>
.bg-82C5FF { .bg-82C5FF {
background: #82c5ff; background: #82c5ff;
} }
...@@ -174,6 +211,9 @@ export default { ...@@ -174,6 +211,9 @@ export default {
.line-h-18 { .line-h-18 {
line-height: 18px; line-height: 18px;
} }
.w-225 {
width: 225px;
}
.tooltip-text { .tooltip-text {
width: 100%; width: 100%;
white-space: pre-wrap; white-space: pre-wrap;
...@@ -186,93 +226,36 @@ export default { ...@@ -186,93 +226,36 @@ export default {
/*width: 100%;*/ /*width: 100%;*/
padding: 0 20px 20px 20px; padding: 0 20px 20px 20px;
min-height: calc(100% - 160px); min-height: calc(100% - 160px);
.right-box { .right-box {
background: #fff; background: #fff;
min-height: 500px; min-height: 500px;
padding: 0px; padding: 0px;
.apps-content { .apps-content {
.apps-content-left { .apps-content-left {
min-width: 157px; min-width: 293px;
width: 293px;
height: 100%; height: 100%;
background: #fff; background: #fff;
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
.apps-content-left__title { .left-tree-body {
height: 55px; width: 100%;
line-height: 55px; padding: 20px 12px;
padding: 0 0 0 18px; .iconzuzhijiagouguanli {
} display: inline-block;
.tab-left-list-cell { vertical-align: middle;
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);
i {
color: #1890ff;
}
}
&.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;
}
i {
color: #1890ff;
}
}
.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);
i {
color: #1890ff;
}
}
&.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;
}
i {
color: #1890ff;
}
}
}
} }
} }
} }
.apps-content-right { .apps-content-right {
width: calc(100% - 120px); width: calc(100% - 303px);
padding-left: 10px; padding-left: 10px;
background: #f0f2f5; background: #f0f2f5;
.content-right-body {
width: 100%;
padding: 20px;
background: #fff;
}
.daily-set-wrap { .daily-set-wrap {
height: 100%; height: 100%;
background: #fff; background: #fff;
......
...@@ -3,8 +3,8 @@ ...@@ -3,8 +3,8 @@
* @version: 1.0.0 * @version: 1.0.0
* @Author: 无尘 * @Author: 无尘
* @Date: 2019-03-20 14:36:37 * @Date: 2019-03-20 14:36:37
* @LastEditors: 无尘 * @LastEditors : 无尘
* @LastEditTime: 2019-10-24 15:23:36 * @LastEditTime : 2020-02-13 11:08:44
--> -->
<template> <template>
<div class="my-customer-wrap common-set-wrap"> <div class="my-customer-wrap common-set-wrap">
...@@ -13,25 +13,37 @@ ...@@ -13,25 +13,37 @@
<div class="right-box" :style="{ 'min-height': bgHeight }"> <div class="right-box" :style="{ 'min-height': bgHeight }">
<div class="apps-content flex" :style="{ 'min-height': bgHeight }"> <div class="apps-content flex" :style="{ 'min-height': bgHeight }">
<div class="apps-content-right"> <div class="apps-content-right">
<div class="overstore-tip"></div> <div class="overstore-tip">
<div class="table-condition-search"> <div role="alert" class="el-alert el-alert--info flex flex-align-start">
<el-input placeholder="请输入部门名称/CODE/ID" v-model="searchInput" class="w-369" @keyup.native="value => toInput(value, searchInput)" clearable @clear="clearInput"></el-input> <i class="el-alert__icon el-icon-info font-12 color-2f54eb"></i>
<div class="el-alert__content">
<span class="el-alert__title color-606266 font-14">什么是回收站?<br />GIC分组或门店被删除后将被放置到回收站,如果是误删或想再次启用,您可以随时恢复它们。</span>
</div>
</div>
</div> </div>
<el-table class="select-table" ref="multipleTable" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }"> <div class="table-condition-search m-t-20">
<el-table-column label="部门名称" show-overflow-tooltip> <el-input placeholder="请输入部门名称/CODE/ID" v-model="searchInput" class="w-293" @keyup.native="value => toInput(value, searchInput)" clearable @clear="clearInput"></el-input>
<template slot-scope="scope">{{ scope.row.name || '--' }}</template> <el-select class="w-191" v-model="searchType" placeholder="所有部门类型" @change="changeType">
</el-table-column> <el-option v-for="item in options" :key="item.id" :label="item.label" :value="item.id"> </el-option>
<el-table-column prop="" label="ERP CODE" show-overflow-tooltip> </el-select>
<template slot-scope="scope">{{ scope.row.phoneNumber || '--' }}</template> </div>
</el-table-column> <div class="m-t-20">
<el-table-column prop="" label="操作" show-overflow-tooltip> <el-table class="select-table" ref="multipleTable" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }">
<template slot-scope="scope"> <el-table-column label="部门名称" show-overflow-tooltip>
<el-button type="text" size="small" @click="showDetail(scope.$index, scope.row)">恢复</el-button> <template slot-scope="scope">{{ scope.row.departmentName || '--' }}</template>
</template> </el-table-column>
</el-table-column> <el-table-column prop="" label="ERP CODE" show-overflow-tooltip>
</el-table> <template slot-scope="scope">{{ scope.row.storeCode || '--' }}</template>
<div class="block common-wrap__page text-right m-t-24" v-if="tableData.length != 0"> </el-table-column>
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </el-pagination> <el-table-column prop="" label="操作" show-overflow-tooltip>
<template slot-scope="scope">
<el-button type="text" size="small" @click="showDetail(scope.$index, scope.row)">恢复</el-button>
</template>
</el-table-column>
</el-table>
<div class="block common-wrap__page text-right m-t-24" v-if="tableData.length != 0">
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </el-pagination>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -61,7 +73,9 @@ export default { ...@@ -61,7 +73,9 @@ export default {
path: '' path: ''
} }
], ],
options: [],
searchInput: '', searchInput: '',
searchType: '',
// 分页参数 // 分页参数
currentPage: 1, currentPage: 1,
pageSize: 20, pageSize: 20,
...@@ -92,6 +106,14 @@ export default { ...@@ -92,6 +106,14 @@ export default {
that.getTableList(); that.getTableList();
}, },
/** /**
* 选择类型
*/
changeType() {
const that = this;
that.currentPage = 1;
that.getTableList();
},
/**
* 分页---页码变化 * 分页---页码变化
*/ */
handleSizeChange(val) { handleSizeChange(val) {
...@@ -162,7 +184,7 @@ export default { ...@@ -162,7 +184,7 @@ export default {
} }
}; };
</script> </script>
<style type="text/scss" lang="scss" scoped> <style type="text/less" lang="less" scoped>
.bg-82C5FF { .bg-82C5FF {
background: #82c5ff; background: #82c5ff;
} }
...@@ -180,6 +202,25 @@ export default { ...@@ -180,6 +202,25 @@ export default {
white-space: pre-wrap; white-space: pre-wrap;
word-break: break-all; word-break: break-all;
} }
.w-293 {
width: 293px;
}
.w-191 {
width: 191px;
}
.el-alert--info {
background: rgba(240, 245, 255, 1);
border-radius: 2px;
border: 1px solid rgba(133, 165, 255, 1);
-webkit-box-align: flex-start;
-webkit-align-items: flex-start;
-ms-flex-align: flex-start;
align-items: flex-start;
.el-alert__icon {
font-size: 12px;
padding-top: 3px;
}
}
.my-customer-wrap { .my-customer-wrap {
height: 100%; height: 100%;
} }
...@@ -192,87 +233,13 @@ export default { ...@@ -192,87 +233,13 @@ export default {
min-height: 500px; min-height: 500px;
padding: 0px; padding: 0px;
.apps-content { .apps-content {
.apps-content-left { .apps-content-right {
min-width: 157px; width: 100%;
height: 100%; padding: 20px;
background: #fff; background: #fff;
overflow-x: hidden; .overstore-body {
overflow-y: auto; background: #fff;
.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);
i {
color: #1890ff;
}
}
&.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;
}
i {
color: #1890ff;
}
}
.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);
i {
color: #1890ff;
}
}
&.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;
}
i {
color: #1890ff;
}
}
}
}
} }
}
.apps-content-right {
width: calc(100% - 120px);
padding-left: 10px;
background: #f0f2f5;
.daily-set-wrap { .daily-set-wrap {
height: 100%; height: 100%;
background: #fff; background: #fff;
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
* @Author: 无尘 * @Author: 无尘
* @Date: 2018-10-10 14:44:45 * @Date: 2018-10-10 14:44:45
* @LastEditors : 无尘 * @LastEditors : 无尘
* @LastEditTime : 2020-02-11 09:49:22 * @LastEditTime : 2020-02-12 20:40:28
--> -->
<template> <template>
<div id="index"> <div id="index">
...@@ -19,10 +19,10 @@ ...@@ -19,10 +19,10 @@
<li class="border-box" v-for="(item, index) in purchaseApp" :key="index + 'app'"> <li class="border-box" v-for="(item, index) in purchaseApp" :key="index + 'app'">
<div class="app-li-cell border-box flex"> <div class="app-li-cell border-box flex">
<div class="app-cell-left"> <div class="app-cell-left">
<img :src="item.src" alt="img" /> <img :src="item.applicationUrl" alt="img" />
</div> </div>
<div class="app-cell-right"> <div class="app-cell-right">
<div class="app-name font-14 color-303133">{{ item.name }}</div> <div class="app-name font-14 color-303133">{{ item.applicationName }}</div>
<div class="app-info"> <div class="app-info">
<div class="app-version font-12 color-909399">{{ item.versionName }}</div> <div class="app-version font-12 color-909399">{{ item.versionName }}</div>
<div class="app-date font-12 color-909399">{{ item.date | timeStampToYmd }}</div> <div class="app-date font-12 color-909399">{{ item.date | timeStampToYmd }}</div>
...@@ -38,10 +38,10 @@ ...@@ -38,10 +38,10 @@
<li class="border-box" v-for="(item, index) in noPurchaseApp" :key="index + 'appno'"> <li class="border-box" v-for="(item, index) in noPurchaseApp" :key="index + 'appno'">
<div class="app-li-cell border-box flex"> <div class="app-li-cell border-box flex">
<div class="app-cell-left"> <div class="app-cell-left">
<img :src="item.src" alt="img" /> <img :src="item.applicationUrl" alt="img" />
</div> </div>
<div class="app-cell-right"> <div class="app-cell-right">
<div class="app-name font-14 color-303133">{{ item.name }}</div> <div class="app-name font-14 color-303133">{{ item.applicationName }}</div>
<div class="app-info"> <div class="app-info">
<div class="app-describe font-12 color-909399">{{ item.describe }}</div> <div class="app-describe font-12 color-909399">{{ item.describe }}</div>
</div> </div>
...@@ -105,41 +105,9 @@ export default { ...@@ -105,41 +105,9 @@ export default {
// 购买应用 // 购买应用
purchaseApp: [ purchaseApp: [
{ {
id: 1, applicationId: 1,
src: 'https://hope.demogic.com/mobile-haoban-file/images/appicon/workbench/customer_center.png', applicationUrl: 'https://hope.demogic.com/mobile-haoban-file/images/appicon/workbench/customer_center.png',
name: '我的顾客', applicationName: '我的顾客',
versionName: '基础版',
date: new Date().getTime(),
describe: '应用描述应用描述应用描述应用描述应用描述'
},
{
id: 1,
src: 'https://hope.demogic.com/mobile-haoban-file/images/appicon/workbench/customer_center.png',
name: '我的顾客',
versionName: '基础版',
date: new Date().getTime(),
describe: '应用描述应用描述应用描述应用描述应用描述'
},
{
id: 1,
src: 'https://hope.demogic.com/mobile-haoban-file/images/appicon/workbench/customer_center.png',
name: '我的顾客',
versionName: '基础版',
date: new Date().getTime(),
describe: '应用描述应用描述应用描述应用描述应用描述'
},
{
id: 1,
src: 'https://hope.demogic.com/mobile-haoban-file/images/appicon/workbench/customer_center.png',
name: '我的顾客',
versionName: '基础版',
date: new Date().getTime(),
describe: '应用描述应用描述应用描述应用描述应用描述'
},
{
id: 1,
src: 'https://hope.demogic.com/mobile-haoban-file/images/appicon/workbench/customer_center.png',
name: '我的顾客',
versionName: '基础版', versionName: '基础版',
date: new Date().getTime(), date: new Date().getTime(),
describe: '应用描述应用描述应用描述应用描述应用描述' describe: '应用描述应用描述应用描述应用描述应用描述'
...@@ -148,9 +116,9 @@ export default { ...@@ -148,9 +116,9 @@ export default {
// 未购买应用 // 未购买应用
noPurchaseApp: [ noPurchaseApp: [
{ {
id: 1, applicationId: 1,
src: 'https://hope.demogic.com/mobile-haoban-file/images/appicon/workbench/customer_center.png', applicationUrl: 'https://hope.demogic.com/mobile-haoban-file/images/appicon/workbench/customer_center.png',
name: '我的顾客', applicationName: '我的顾客',
describe: '应用描述应用描述应用描述应用描述应用描述' describe: '应用描述应用描述应用描述应用描述应用描述'
} }
], ],
...@@ -183,10 +151,6 @@ export default { ...@@ -183,10 +151,6 @@ export default {
toRouterView(val) { toRouterView(val) {
const that = this; const that = this;
// 模拟检查数据,有两个参数 // 模拟检查数据,有两个参数
/*{
name:,
path:
}*/
that.$router.push({ that.$router.push({
path: val.path path: val.path
}); });
...@@ -201,30 +165,30 @@ export default { ...@@ -201,30 +165,30 @@ export default {
}, },
/** /**
* 自定义弹窗显示事件 * 弹窗提示
*/
showDialogLayer(type) {
const that = this;
that.showCustomDialog = true;
that.customType = type;
type == 'data' ? (that.customTitle = '数据概览') : (that.customTitle = '快捷操作');
},
/**
* 自定义弹框触发事件
*/ */
customHandleConfirm(val) { toAlert() {
const that = this; const that = this;
that.showCustomDialog = false; that
that.customType === 'data' ? that.getDataOverview() : that.getEntryData(); .$confirm('您所在企业尚未订购好办 ,请前往升级版本后继续使用。', '提示', {
confirmButtonText: '立即前往订购',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
window.open('');
});
}, },
toTip() {
toCertify(authType) {
const that = this; const that = this;
if (authType == 1) { that
return; .$confirm('您没有该功能的使用权限,请联系管理员授权后继续使用。', '提示', {
} confirmButtonText: '知道了',
that.changeRoute('/companyCertify'); type: 'warning'
})
.then(() => {
window.open('');
});
}, },
/** /**
...@@ -283,13 +247,12 @@ export default { ...@@ -283,13 +247,12 @@ export default {
/** /**
* 获取数据概览 * 获取数据概览
*/ */
getDataOverview() { getAppData(type) {
const that = this; const that = this;
let para = { let para = {
all: false, type: type // 1已购买2未购买
fetchData: true
}; };
getRequest('/haoban-manage-web/home/find-enterprise-data', para) getRequest('/haoban-web/application-list', para)
.then(res => { .then(res => {
let resData = res.data; let resData = res.data;
if (resData.errorCode == 1) { if (resData.errorCode == 1) {
...@@ -304,35 +267,12 @@ export default { ...@@ -304,35 +267,12 @@ export default {
message: error.message message: error.message
}); });
}); });
},
/**
* 获取入口数据
*/
getEntryData() {
const that = this;
let para = {
all: false
};
getRequest('/haoban-manage-web/home/find-quick-entry', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
that.entryData = resData.result;
return;
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
});
} }
}, },
mounted() { mounted() {
const that = this; const that = this;
/* that.getAppData(1);
that.getAppData(2); */
that.contentHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 204 + 'px'; that.contentHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 204 + 'px';
}, },
components: { components: {
......
...@@ -4,31 +4,29 @@ ...@@ -4,31 +4,29 @@
* @Author: 无尘 * @Author: 无尘
* @Date: 2018-10-10 14:44:45 * @Date: 2018-10-10 14:44:45
* @LastEditors : 无尘 * @LastEditors : 无尘
* @LastEditTime : 2020-02-12 10:56:35 * @LastEditTime : 2020-02-13 10:17:55
--> -->
<template> <template>
<div class="login-wrap"> <div class="login-wrap">
<!-- <header>
<div class="login-wrap-header">
<img class="login-wrap-inline" src="../../assets/logo.png" alt="logo" />
<span class="login-wrap-inline">好办管理后台</span>
</div>
</header> -->
<section> <section>
<div class="login-body-top"> <div class="login-body-top">
<div class="login-body-head"> <div class="login-body-head">
<div class="login-body-head_inner"> <div class="login-body-head_inner border-box flex">
<img class="login-body-logo" src="../../assets/logo.png" alt="logo" /> <img class="login-body-logo" src="../../assets/logo.png" alt="logo" />
<span class="login-body-title">好办管理后台</span> <span class="login-body-title p-l-7">好办管理后台</span>
</div> </div>
</div> </div>
<div class="login-body-qrcode"> <div class="login-body-qrcode">
<div class="login-qrcode-inner"> <div class="login-qrcode-inner border-box">
<div class="qrcode-title"></div> <div class="qrcode-title font-18 color-303133 m-b-20">企业微信扫码登录</div>
<div id="qrcode" title=""></div> <div id="qrcode" title=""></div>
<div class="qrcode-refresh"><el-button class="font-12" type="text" @click="refreshCode">刷新 <span class="color-2f54eb iconfont iconshuaxin"><span></el-button></div> <div class="qrcode-refresh m-t-20">
<el-button class="font-12" type="text" @click="refreshCode">刷新 <span class="color-2f54eb iconfont iconshuaxin"></span></el-button>
</div>
</div> </div>
</div> </div>
<div class="bg-dot"></div>
<div class="bg-dot-center"></div>
</div> </div>
<div class="login-body-bottom"></div> <div class="login-body-bottom"></div>
</section> </section>
...@@ -38,14 +36,10 @@ ...@@ -38,14 +36,10 @@
</div> </div>
</template> </template>
<script> <script>
import { import { _debounce } from '@/common/js/public';
_debounce
} from '@/common/js/public';
import QRCode from 'qrcodejs2'; import QRCode from 'qrcodejs2';
import errMsg from '@/common/js/error'; import errMsg from '@/common/js/error';
import { import { postRequest } from '@/api/api';
postRequest
} from '@/api/api';
export default { export default {
name: 'login', name: 'login',
...@@ -62,10 +56,10 @@ export default { ...@@ -62,10 +56,10 @@ export default {
// 企业列表 // 企业列表
enterpriseList: [ enterpriseList: [
/*{ /*{
enterpriseId : '1231', enterpriseId : '1231',
logoUrl: require("../../assets/logo.png"), logoUrl: require("../../assets/logo.png"),
enterpriseName: '达摩网络' enterpriseName: '达摩网络'
},*/ },*/
], ],
// 登录 // 登录
...@@ -75,23 +69,19 @@ export default { ...@@ -75,23 +69,19 @@ export default {
computed: {}, computed: {},
methods: { methods: {
/** /**
* 处理路由跳转 * 处理路由跳转
*/ */
toRouterView(val) { toRouterView(val) {
const that = this; const that = this;
// 模拟检查数据,有两个参数 // 模拟检查数据,有两个参数
/*{
name:,
path:
}*/
that.$router.push({ that.$router.push({
path: val.path path: val.path
}); });
}, },
/** /**
* 选择登陆 * 选择登陆
* *
*/ */
chooseLogin(e, flag) { chooseLogin(e, flag) {
const that = this; const that = this;
that.chooseTab = flag; that.chooseTab = flag;
...@@ -111,16 +101,16 @@ export default { ...@@ -111,16 +101,16 @@ export default {
}, },
/** /**
* 折叠事件 * 折叠事件
*/ */
collapseTag(val) { collapseTag(val) {
const that = this; const that = this;
that.collapseFlag = val; that.collapseFlag = val;
}, },
/** /**
* 生成二维码 * 生成二维码
*/ */
qrcode(text) { qrcode(text) {
const that = this; const that = this;
let qrObj = { let qrObj = {
...@@ -128,8 +118,8 @@ export default { ...@@ -128,8 +118,8 @@ export default {
data: text || '123456789' data: text || '123456789'
}; };
that.qrcodeCase = new QRCode('qrcode', { that.qrcodeCase = new QRCode('qrcode', {
width: 156, width: 190,
height: 156, // 高度 height: 190, // 高度
text: JSON.stringify(qrObj) // 二维码内容 // text: JSON.stringify(qrObj) // 二维码内容 //
//render: 'canvas', // 设置渲染方式(有两种方式 table和canvas,默认是canvas) // //render: 'canvas', // 设置渲染方式(有两种方式 table和canvas,默认是canvas) //
//background: '#f0f', //background: '#f0f',
...@@ -140,8 +130,8 @@ export default { ...@@ -140,8 +130,8 @@ export default {
}, },
/** /**
* 刷新二维码 * 刷新二维码
*/ */
refreshCode: _debounce(function() { refreshCode: _debounce(function() {
const that = this; const that = this;
if (!!that.qrcodeCase) { if (!!that.qrcodeCase) {
...@@ -153,24 +143,16 @@ export default { ...@@ -153,24 +143,16 @@ export default {
}, 500), }, 500),
/** /**
* 下载好办 app * 登录
* */
*/
toDownload() {
window.open(`${window.location.origin}/haoban-web/#/download`);
},
/**
* 登录
*/
toIndex: _debounce(function() { toIndex: _debounce(function() {
const that = this; const that = this;
that.toLogin(); that.toLogin();
}, 500), }, 500),
/** /**
* 登录 --- api * 登录 --- api
*/ */
toLogin: _debounce(function() { toLogin: _debounce(function() {
const that = this; const that = this;
if (!that.enterpriseId) { if (!that.enterpriseId) {
...@@ -212,8 +194,8 @@ export default { ...@@ -212,8 +194,8 @@ export default {
}, 500), }, 500),
/** /**
* 查询登录 --- api * 查询登录 --- api
*/ */
checkLogin() { checkLogin() {
const that = this; const that = this;
let para = { let para = {
...@@ -267,11 +249,11 @@ export default { ...@@ -267,11 +249,11 @@ export default {
}, },
/** /**
* 登录---获取二维码字符串 API * 登录---获取二维码字符串 API
*/ */
getQrcode() { getQrcode() {
const that = this; const that = this;
postRequest('/haoban-manage-web/login-qrcode', {}) postRequest('/haoban-web/get-login-qrcode', {})
.then(res => { .then(res => {
let resData = res.data; let resData = res.data;
if (resData.errorCode == 1) { if (resData.errorCode == 1) {
...@@ -290,17 +272,16 @@ export default { ...@@ -290,17 +272,16 @@ export default {
}); });
}, },
/** /**
* 密码登录 * 密码登录
*/ */
changeCode(val) { changeCode(val) {
const that = this; const that = this;
that.numberCode = val; that.numberCode = val;
} }
}, },
mounted() { mounted() {
const that = this; // const that = this;
that.getQrcode(); // that.getQrcode();
// that.qrcode();
if (!!localStorage.getItem('userInfo')) { if (!!localStorage.getItem('userInfo')) {
localStorage.removeItem('userInfo'); localStorage.removeItem('userInfo');
} }
...@@ -309,41 +290,86 @@ export default { ...@@ -309,41 +290,86 @@ export default {
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.login-wrap { .login-wrap {
width: 100%;
min-height: 100vh;
.p-l-7 {
padding-left: 7px;
}
.login-body-top {
position: relative;
width: 100%; width: 100%;
height: 100vh; height: 431px;
.login-body-top { background-image: url('../../assets/login/bg.png');
position: relative; background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-color: #2f54eb;
.login-body-head {
width: 100%; width: 100%;
height: 431px; .login-body-head_inner {
background: #2F54EB; width: 100%;
.login-body-head { padding: 22px 0 0 24px;
.login-body-head_inner { img {
img { width: 25px;
width: 25px; }
} .login-body-title {
.login-body-title { font-weight: 600;
font-weight: 600; color: #fff;
color: #fff; font-size: 18px;
font-size: 18px;
}
} }
}
.login-body-qrcode {
position: absolute;
left: 50%;
margin-left: -183px;
width: 366px;
height: 343px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 6px 8px 0px rgba(208, 213, 232, 0.27);
border-radius: 5px;
} }
} }
.login-body-bottom { .bg-dot {
width: 100%; position: absolute;
height: 300px; left: 50%;
background: #fff; bottom: -93px;
margin-left: -500px;
width: 87px;
height: 142px;
background-image: url('../../assets/login/bg-dot.png');
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}
.bg-dot-center {
position: absolute;
left: 50%;
bottom: -233px;
margin-left: -71px;
width: 142px;
height: 87px;
background-image: url('../../assets/login/bg-dot-center.png');
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}
.login-body-qrcode {
position: absolute;
left: 50%;
bottom: -173px;
margin-left: -183px;
width: 366px;
height: 343px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 6px 8px 0px rgba(208, 213, 232, 0.27);
border-radius: 5px;
z-index: 1;
.login-qrcode-inner {
width: 100%;
padding: 40px 88px 25px 88px;
text-align: center;
#qrcode {
width: 190px;
height: 190px;
}
}
} }
} }
</style> .login-body-bottom {
\ No newline at end of file width: 100%;
height: 300px;
background: #fff;
}
}
</style>
...@@ -3,8 +3,8 @@ ...@@ -3,8 +3,8 @@
* @version: 1.0.0 * @version: 1.0.0
* @Author: 无尘 * @Author: 无尘
* @Date: 2019-03-20 14:36:37 * @Date: 2019-03-20 14:36:37
* @LastEditors: 无尘 * @LastEditors : 无尘
* @LastEditTime: 2019-10-24 15:23:36 * @LastEditTime : 2020-02-14 09:21:12
--> -->
<template> <template>
<div class="my-customer-wrap common-set-wrap"> <div class="my-customer-wrap common-set-wrap">
...@@ -13,23 +13,36 @@ ...@@ -13,23 +13,36 @@
<div class="right-box" :style="{ 'min-height': bgHeight }"> <div class="right-box" :style="{ 'min-height': bgHeight }">
<div class="apps-content flex" :style="{ 'min-height': bgHeight }"> <div class="apps-content flex" :style="{ 'min-height': bgHeight }">
<div class="apps-content-right"> <div class="apps-content-right">
<div class="overstore-tip"></div> <div class="overstore-body">
<div class="table-condition-search"> <div class="overstore-tip">
<el-input placeholder="请输入门店名称/CODE/ID" v-model="searchInput" class="w-369" @keyup.native="value => toInput(value, searchInput)" clearable @clear="clearInput"></el-input> <div role="alert" class="el-alert el-alert--info flex flex-align-start">
</div> <i class="el-alert__icon el-icon-info font-12 color-2f54eb"></i>
<el-table class="select-table" ref="multipleTable" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }"> <div class="el-alert__content">
<el-table-column label="门店名称" show-overflow-tooltip> <span class="el-alert__title color-606266 font-14">什么是溢出门店?<br />当新增的门店超出你所订购的门店容量,系统会自动将其放入该列表。这些门店的所有业务功能都被禁用了,请尽快前往应用市场扩容门店容量,溢出门店将在门店容量充足的情况下自动恢复为可用状态。</span>
<template slot-scope="scope">{{ scope.row.name || '--' }}</template> </div>
</el-table-column> </div>
<el-table-column prop="" label="ERP CODE" show-overflow-tooltip> </div>
<template slot-scope="scope">{{ scope.row.phoneNumber || '--' }}</template> <div class="table-condition-search m-t-20">
</el-table-column> <el-input placeholder="请输入门店名称/CODE/ID" v-model="searchInput" class="w-293" @keyup.native="value => toInput(value, searchInput)" clearable @clear="clearInput"></el-input>
<el-table-column prop="" label="企业微信部门ID" show-overflow-tooltip> </div>
<template slot-scope="scope">{{ scope.row.storeName || '--' }}</template> <div class="m-t-20">
</el-table-column> <el-table class="select-table" ref="multipleTable" :data="tableData" tooltip-effect="dark" :style="{ width: '100%', minHeight: tableH }">
</el-table> <el-table-column label="门店名称" show-overflow-tooltip>
<div class="block common-wrap__page text-right m-t-24" v-if="tableData.length != 0"> <template slot-scope="scope"
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </el-pagination> ><span class="iconfont icondianpu-kuai color-2f54eb"></span><span class="p-l-10">{{ scope.row.departmentName || '--' }}</span></template
>
</el-table-column>
<el-table-column prop="" label="ERP CODE" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.storeCode || '--' }}</template>
</el-table-column>
<el-table-column prop="" label="企业微信部门ID" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.wxDepartmentId || '--' }}</template>
</el-table-column>
</el-table>
<div class="block common-wrap__page text-right m-t-24" v-if="tableData.length != 0">
<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[20, 40, 60, 80]" :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"> </el-pagination>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -116,12 +129,12 @@ export default { ...@@ -116,12 +129,12 @@ export default {
pageNum: that.currentPage, // 当前页 pageNum: that.currentPage, // 当前页
pageSize: that.pageSize // 一页显示个数 pageSize: that.pageSize // 一页显示个数
}; };
getRequest('/haoban-app-member-web/customer/find_message_list', para) getRequest('/haoban-web/store-full-list', para)
.then(res => { .then(res => {
let resData = res.data; let resData = res.data;
if (resData.errorCode == 1) { if (resData.errorCode == 1) {
that.tableData = resData.result.list || []; that.tableData = resData.result.list || [];
that.total = resData.result.total; that.total = resData.result.pageInfo.total;
return false; return false;
} }
errMsg.errorMsg(resData); errMsg.errorMsg(resData);
...@@ -134,22 +147,10 @@ export default { ...@@ -134,22 +147,10 @@ export default {
}); });
} }
}, },
watch: { watch: {},
activeBrand: function(newData, oldData) {
const that = this;
that.activeBrand = newData;
},
activeGroup: function(newData, oldData) {
const that = this;
that.activeGroup = newData;
}
},
mounted() { mounted() {
let that = this; const that = this;
let iconUrl = that.$route.query.appIcon; that.getTableList();
if (iconUrl) {
that.appIcon = window.unescape(iconUrl);
}
document.documentElement.style.backgroundColor = '#f0f2f5'; document.documentElement.style.backgroundColor = '#f0f2f5';
}, },
destroyed() { destroyed() {
...@@ -160,7 +161,7 @@ export default { ...@@ -160,7 +161,7 @@ export default {
} }
}; };
</script> </script>
<style type="text/scss" lang="scss" scoped> <style type="text/less" lang="less" scoped>
.bg-82C5FF { .bg-82C5FF {
background: #82c5ff; background: #82c5ff;
} }
...@@ -178,6 +179,22 @@ export default { ...@@ -178,6 +179,22 @@ export default {
white-space: pre-wrap; white-space: pre-wrap;
word-break: break-all; word-break: break-all;
} }
.w-293 {
width: 293px;
}
.el-alert--info {
background: rgba(240, 245, 255, 1);
border-radius: 2px;
border: 1px solid rgba(133, 165, 255, 1);
-webkit-box-align: flex-start;
-webkit-align-items: flex-start;
-ms-flex-align: flex-start;
align-items: flex-start;
.el-alert__icon {
font-size: 12px;
padding-top: 3px;
}
}
.my-customer-wrap { .my-customer-wrap {
height: 100%; height: 100%;
} }
...@@ -185,93 +202,18 @@ export default { ...@@ -185,93 +202,18 @@ export default {
/*width: 100%;*/ /*width: 100%;*/
padding: 0 20px 20px 20px; padding: 0 20px 20px 20px;
min-height: calc(100% - 160px); min-height: calc(100% - 160px);
.right-box { .right-box {
background: #fff; background: #fff;
min-height: 500px; min-height: 500px;
padding: 0px; padding: 0px;
.apps-content { .apps-content {
.apps-content-left { .apps-content-right {
min-width: 157px; width: 100%;
height: 100%; padding: 20px;
background: #fff; background: #fff;
overflow-x: hidden; .overstore-body {
overflow-y: auto; background: #fff;
.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);
i {
color: #1890ff;
}
}
&.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;
}
i {
color: #1890ff;
}
}
.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);
i {
color: #1890ff;
}
}
&.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;
}
i {
color: #1890ff;
}
}
}
}
} }
}
.apps-content-right {
width: calc(100% - 120px);
padding-left: 10px;
background: #f0f2f5;
.daily-set-wrap { .daily-set-wrap {
height: 100%; height: 100%;
background: #fff; background: #fff;
......
...@@ -272,8 +272,7 @@ html, body { ...@@ -272,8 +272,7 @@ html, body {
width: 100%; width: 100%;
/* min-height: 100%; /* min-height: 100%;
height: 100%; */ height: 100%; */
/* background-color: #f0f2f5; */
background-color: #f0f2f5;
} }
body { body {
-webkit-text-size-adjust: none; -webkit-text-size-adjust: none;
...@@ -360,15 +359,6 @@ input:focus { ...@@ -360,15 +359,6 @@ input:focus {
.color-1890ff { .color-1890ff {
color: #1890ff; color: #1890ff;
} }
.color-1890ff {
color: #1890ff;
}
.c-909399 {
color: #909399;
}
.c-303133 {
color: #303133;
}
.color-c0c4cc { .color-c0c4cc {
color: #c0c4cc; color: #c0c4cc;
} }
...@@ -387,6 +377,9 @@ input:focus { ...@@ -387,6 +377,9 @@ input:focus {
.color-2f54eb { .color-2f54eb {
color: #2F54EB; color: #2F54EB;
} }
.color-dedfe6 {
color: #dedfe6;
}
.p-0 { .p-0 {
padding: 0; padding: 0;
} }
...@@ -447,6 +440,12 @@ input:focus { ...@@ -447,6 +440,12 @@ input:focus {
.p-t-12 { .p-t-12 {
padding-top: 12px; padding-top: 12px;
} }
.p-t-14 {
padding-top: 14px;
}
.p-t-20 {
padding-top: 20px;
}
.p-t-35 { .p-t-35 {
padding-top: 35px; padding-top: 35px;
} }
...@@ -623,6 +622,12 @@ input:focus { ...@@ -623,6 +622,12 @@ input:focus {
-ms-flex-align: center; -ms-flex-align: center;
align-items: center; align-items: center;
} }
.flex-align-start {
-webkit-box-align: flex-start;
-webkit-align-items: flex-start;
-ms-flex-align: flex-start;
align-items: flex-start;
}
.flex-pack-center { .flex-pack-center {
-webkit-box-pack: center; -webkit-box-pack: center;
-webkit-justify-content: center; -webkit-justify-content: center;
......
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