@@ -1,11 +1,11 @@
-<template>
- <div id="app">
- <router-view />
- </div>
-</template>
-
-<script>
-export default {
- name: 'App'
-}
-</script>
+<template>
+ <div id="app">
+ <router-view />
+ </div>
+</template>
+
+<script>
+export default {
+ name: 'App'
+}
+</script>
@@ -1,10 +1,10 @@
-import request from '@/utils/request'
-export function sendSmsCode(data) {
- return request({
- url: '/common/sendSmsCode',
- method: 'post',
- data: data
- })
+import request from '@/utils/request'
+export function sendSmsCode(data) {
+ return request({
+ url: '/common/sendSmsCode',
+ method: 'post',
+ data: data
+ })
@@ -1,26 +1,26 @@
-export function getCompanyInfo() {
- url: '/company/company/getCompanyInfo',
- method: 'get'
-export function getCompanyVoice() {
- url: '/company/company/getCompanyVoice',
-export function getCompanySms() {
- url: '/company/company/getCompanySms',
+export function getCompanyInfo() {
+ url: '/company/company/getCompanyInfo',
+ method: 'get'
+export function getCompanyVoice() {
+ url: '/company/company/getCompanyVoice',
+export function getCompanySms() {
+ url: '/company/company/getCompanySms',
@@ -1,22 +1,22 @@
-// 根据参数键名查询参数值
-export function getConfigKey(configKey) {
- url: '/company/config/configKey/' + configKey,
-// 修改参数配置
-export function updateConfig(data) {
- url: '/company/config',
- method: 'put',
+// 根据参数键名查询参数值
+export function getConfigKey(configKey) {
+ url: '/company/config/configKey/' + configKey,
+// 修改参数配置
+export function updateConfig(data) {
+ url: '/company/config',
+ method: 'put',
@@ -1,76 +1,76 @@
-// 查询部门列表
-export function listDept(query) {
- url: '/company/dept/list',
- method: 'get',
- params: query
-// 查询部门列表(排除节点)
-export function listDeptExcludeChild(deptId) {
- url: '/company/dept/list/exclude/' + deptId,
-// 查询部门详细
-export function getDept(deptId) {
- url: '/company/dept/' + deptId,
-// 查询部门下拉树结构
-export function treeselect() {
- url: '/company/dept/treeselect',
-// 根据角色ID查询部门树结构
-export function roleDeptTreeselect(roleId) {
- url: '/company/dept/roleDeptTreeselect/' + roleId,
-// 新增部门
-export function addDept(data) {
- url: '/company/dept',
-// 修改部门
-export function updateDept(data) {
-// 删除部门
-export function delDept(deptId) {
- method: 'delete'
-export function allTreeselect() {
- url: '/company/dept/allTreeselect',
+// 查询部门列表
+export function listDept(query) {
+ url: '/company/dept/list',
+ method: 'get',
+ params: query
+// 查询部门列表(排除节点)
+export function listDeptExcludeChild(deptId) {
+ url: '/company/dept/list/exclude/' + deptId,
+// 查询部门详细
+export function getDept(deptId) {
+ url: '/company/dept/' + deptId,
+// 查询部门下拉树结构
+export function treeselect() {
+ url: '/company/dept/treeselect',
+// 根据角色ID查询部门树结构
+export function roleDeptTreeselect(roleId) {
+ url: '/company/dept/roleDeptTreeselect/' + roleId,
+// 新增部门
+export function addDept(data) {
+ url: '/company/dept',
+// 修改部门
+export function updateDept(data) {
+// 删除部门
+export function delDept(deptId) {
+ method: 'delete'
+export function allTreeselect() {
+ url: '/company/dept/allTreeselect',
}
@@ -1,60 +1,60 @@
-// 查询菜单列表
-export function listMenu(query) {
- url: '/company/menu/list',
-// 查询菜单详细
-export function getMenu(menuId) {
- url: '/company/menu/' + menuId,
-// 查询菜单下拉树结构
- url: '/company/menu/treeselect',
-// 根据角色ID查询菜单下拉树结构
-export function roleMenuTreeselect(roleId) {
- url: '/company/menu/roleMenuTreeselect/' + roleId,
-// 新增菜单
-export function addMenu(data) {
- url: '/company/menu',
-// 修改菜单
-export function updateMenu(data) {
-// 删除菜单
-export function delMenu(menuId) {
+// 查询菜单列表
+export function listMenu(query) {
+ url: '/company/menu/list',
+// 查询菜单详细
+export function getMenu(menuId) {
+ url: '/company/menu/' + menuId,
+// 查询菜单下拉树结构
+ url: '/company/menu/treeselect',
+// 根据角色ID查询菜单下拉树结构
+export function roleMenuTreeselect(roleId) {
+ url: '/company/menu/roleMenuTreeselect/' + roleId,
+// 新增菜单
+export function addMenu(data) {
+ url: '/company/menu',
+// 修改菜单
+export function updateMenu(data) {
+// 删除菜单
+export function delMenu(menuId) {
@@ -1,61 +1,61 @@
-// 查询企业账户记录列表
-export function listCompanyMoneyLogs(query) {
- url: '/company/companyMoneyLogs/list',
-// 查询企业账户记录详细
-export function getCompanyMoneyLogs(logsId) {
- url: '/company/companyMoneyLogs/' + logsId,
-// 新增企业账户记录
-export function addCompanyMoneyLogs(data) {
- url: '/company/companyMoneyLogs',
-// 修改企业账户记录
-export function updateCompanyMoneyLogs(data) {
-// 删除企业账户记录
-export function delCompanyMoneyLogs(logsId) {
-// 导出企业账户记录
-export function exportCompanyMoneyLogs(query) {
- url: '/company/companyMoneyLogs/export',
-export function getCompanyTotalMoneys(query) {
- url: '/company/companyMoneyLogs/getCompanyTotalMoneys',
+// 查询企业账户记录列表
+export function listCompanyMoneyLogs(query) {
+ url: '/company/companyMoneyLogs/list',
+// 查询企业账户记录详细
+export function getCompanyMoneyLogs(logsId) {
+ url: '/company/companyMoneyLogs/' + logsId,
+// 新增企业账户记录
+export function addCompanyMoneyLogs(data) {
+ url: '/company/companyMoneyLogs',
+// 修改企业账户记录
+export function updateCompanyMoneyLogs(data) {
+// 删除企业账户记录
+export function delCompanyMoneyLogs(logsId) {
+// 导出企业账户记录
+export function exportCompanyMoneyLogs(query) {
+ url: '/company/companyMoneyLogs/export',
+export function getCompanyTotalMoneys(query) {
+ url: '/company/companyMoneyLogs/getCompanyTotalMoneys',
@@ -1,53 +1,53 @@
-// 查询岗位列表
-export function listPost(query) {
- url: '/company/post/list',
-// 查询岗位详细
-export function getPost(postId) {
- url: '/company/post/' + postId,
-// 新增岗位
-export function addPost(data) {
- url: '/company/post',
-// 修改岗位
-export function updatePost(data) {
-// 删除岗位
-export function delPost(postId) {
-// 导出岗位
-export function exportPost(query) {
- url: '/company/post/export',
+// 查询岗位列表
+export function listPost(query) {
+ url: '/company/post/list',
+// 查询岗位详细
+export function getPost(postId) {
+ url: '/company/post/' + postId,
+// 新增岗位
+export function addPost(data) {
+ url: '/company/post',
+// 修改岗位
+export function updatePost(data) {
+// 删除岗位
+export function delPost(postId) {
+// 导出岗位
+export function exportPost(query) {
+ url: '/company/post/export',
@@ -1,71 +1,71 @@
-// 查询提现列表
-export function listCompanyProfit(query) {
- url: '/company/companyProfit/list',
-// 查询提现详细
-export function getCompanyProfit(profitId) {
- url: '/company/companyProfit/' + profitId,
-export function profit(data) {
- url: '/company/companyProfit/profit',
-export function cancel(data) {
- url: '/company/companyProfit/cancel',
-// 新增提现
-export function addCompanyProfit(data) {
- url: '/company/companyProfit',
-// 修改提现
-export function updateCompanyProfit(data) {
-// 删除提现
-export function delCompanyProfit(profitId) {
-// 导出提现
-export function exportCompanyProfit(query) {
- url: '/company/companyProfit/export',
+// 查询提现列表
+export function listCompanyProfit(query) {
+ url: '/company/companyProfit/list',
+// 查询提现详细
+export function getCompanyProfit(profitId) {
+ url: '/company/companyProfit/' + profitId,
+export function profit(data) {
+ url: '/company/companyProfit/profit',
+export function cancel(data) {
+ url: '/company/companyProfit/cancel',
+// 新增提现
+export function addCompanyProfit(data) {
+ url: '/company/companyProfit',
+// 修改提现
+export function updateCompanyProfit(data) {
+// 删除提现
+export function delCompanyProfit(profitId) {
+// 导出提现
+export function exportCompanyProfit(query) {
+ url: '/company/companyProfit/export',
-// 查询充值列表
-export function listCompanyRecharge(query) {
- url: '/company/companyRecharge/list',
-// 查询充值详细
-export function getCompanyRecharge(rechargeId) {
- url: '/company/companyRecharge/' + rechargeId,
-// 新增充值
-export function addCompanyRecharge(data) {
- url: '/company/companyRecharge',
-// 修改充值
-export function updateCompanyRecharge(data) {
-// 删除充值
-export function delCompanyRecharge(rechargeId) {
-// 导出充值
-export function exportCompanyRecharge(query) {
- url: '/company/companyRecharge/export',
+// 查询充值列表
+export function listCompanyRecharge(query) {
+ url: '/company/companyRecharge/list',
+// 查询充值详细
+export function getCompanyRecharge(rechargeId) {
+ url: '/company/companyRecharge/' + rechargeId,
+// 新增充值
+export function addCompanyRecharge(data) {
+ url: '/company/companyRecharge',
+// 修改充值
+export function updateCompanyRecharge(data) {
+// 删除充值
+export function delCompanyRecharge(rechargeId) {
+// 导出充值
+export function exportCompanyRecharge(query) {
+ url: '/company/companyRecharge/export',
@@ -1,75 +1,75 @@
-// 查询角色列表
-export function listRole(query) {
- url: '/company/role/list',
-// 查询角色详细
-export function getRole(roleId) {
- url: '/company/role/' + roleId,
-// 新增角色
-export function addRole(data) {
- url: '/company/role',
-// 修改角色
-export function updateRole(data) {
-// 角色数据权限
-export function dataScope(data) {
- url: '/company/role/dataScope',
-// 角色状态修改
-export function changeRoleStatus(roleId, status) {
- const data = {
- roleId,
- status
- }
- url: '/company/role/changeStatus',
-// 删除角色
-export function delRole(roleId) {
-// 导出角色
-export function exportRole(query) {
- url: '/company/role/export',
+// 查询角色列表
+export function listRole(query) {
+ url: '/company/role/list',
+// 查询角色详细
+export function getRole(roleId) {
+ url: '/company/role/' + roleId,
+// 新增角色
+export function addRole(data) {
+ url: '/company/role',
+// 修改角色
+export function updateRole(data) {
+// 角色数据权限
+export function dataScope(data) {
+ url: '/company/role/dataScope',
+// 角色状态修改
+export function changeRoleStatus(roleId, status) {
+ const data = {
+ roleId,
+ status
+ }
+ url: '/company/role/changeStatus',
+// 删除角色
+export function delRole(roleId) {
+// 导出角色
+export function exportRole(query) {
+ url: '/company/role/export',
@@ -1,81 +1,81 @@
-// 查询公司短信列表
-export function listCompanySms(query) {
- url: '/company/companySms/list',
-// 查询公司短信详细
-export function getCompanySms(smsId) {
- url: '/company/companySms/' + smsId,
-// 新增公司短信
-export function addCompanySms(data) {
- url: '/company/companySms',
-export function sendCustomerMsg(data) {
- url: '/company/companySms/sendCustomerMsg',
-export function sendCustomerBatchMsg(data) {
- url: '/company/companySms/sendCustomerBatchMsg',
-export function getCompanySmsCount() {
- url: '/company/companySms/getCompanySmsCount',
-// 修改公司短信
-export function updateCompanySms(data) {
-// 删除公司短信
-export function delCompanySms(smsId) {
-// 导出公司短信
-export function exportCompanySms(query) {
- url: '/company/companySms/export',
+// 查询公司短信列表
+export function listCompanySms(query) {
+ url: '/company/companySms/list',
+// 查询公司短信详细
+export function getCompanySms(smsId) {
+ url: '/company/companySms/' + smsId,
+// 新增公司短信
+export function addCompanySms(data) {
+ url: '/company/companySms',
+export function sendCustomerMsg(data) {
+ url: '/company/companySms/sendCustomerMsg',
+export function sendCustomerBatchMsg(data) {
+ url: '/company/companySms/sendCustomerBatchMsg',
+export function getCompanySmsCount() {
+ url: '/company/companySms/getCompanySmsCount',
+// 修改公司短信
+export function updateCompanySms(data) {
+// 删除公司短信
+export function delCompanySms(smsId) {
+// 导出公司短信
+export function exportCompanySms(query) {
+ url: '/company/companySms/export',
-// 查询短信发送记录列表
-export function listCompanySmsLogs(query) {
- url: '/company/companySmsLogs/list',
-// 查询短信发送记录详细
-export function getCompanySmsLogs(logsId) {
- url: '/company/companySmsLogs/' + logsId,
-// 新增短信发送记录
-export function addCompanySmsLogs(data) {
- url: '/company/companySmsLogs',
-// 修改短信发送记录
-export function updateCompanySmsLogs(data) {
-// 删除短信发送记录
-export function delCompanySmsLogs(logsId) {
-// 导出短信发送记录
-export function exportCompanySmsLogs(query) {
- url: '/company/companySmsLogs/export',
+// 查询短信发送记录列表
+export function listCompanySmsLogs(query) {
+ url: '/company/companySmsLogs/list',
+// 查询短信发送记录详细
+export function getCompanySmsLogs(logsId) {
+ url: '/company/companySmsLogs/' + logsId,
+// 新增短信发送记录
+export function addCompanySmsLogs(data) {
+ url: '/company/companySmsLogs',
+// 修改短信发送记录
+export function updateCompanySmsLogs(data) {
+// 删除短信发送记录
+export function delCompanySmsLogs(logsId) {
+// 导出短信发送记录
+export function exportCompanySmsLogs(query) {
+ url: '/company/companySmsLogs/export',
-// 查询短信购买订单列表
-export function listCompanySmsOrder(query) {
- url: '/company/companySmsOrder/list',
-// 查询短信购买订单详细
-export function getCompanySmsOrder(orderId) {
- url: '/company/companySmsOrder/' + orderId,
-// 新增短信购买订单
-export function addCompanySmsOrder(data) {
- url: '/company/companySmsOrder',
-// 修改短信购买订单
-export function updateCompanySmsOrder(data) {
-// 删除短信购买订单
-export function delCompanySmsOrder(orderId) {
-// 导出短信购买订单
-export function exportCompanySmsOrder(query) {
- url: '/company/companySmsOrder/export',
+// 查询短信购买订单列表
+export function listCompanySmsOrder(query) {
+ url: '/company/companySmsOrder/list',
+// 查询短信购买订单详细
+export function getCompanySmsOrder(orderId) {
+ url: '/company/companySmsOrder/' + orderId,
+// 新增短信购买订单
+export function addCompanySmsOrder(data) {
+ url: '/company/companySmsOrder',
+// 修改短信购买订单
+export function updateCompanySmsOrder(data) {
+// 删除短信购买订单
+export function delCompanySmsOrder(orderId) {
+// 导出短信购买订单
+export function exportCompanySmsOrder(query) {
+ url: '/company/companySmsOrder/export',
@@ -1,19 +1,19 @@
-export function getSmsPackage(query) {
- url: '/company/companySmsPackage/getSmsPackage',
-export function buySmsPackage(data) {
- url: '/company/companySmsPackage/buySmsPackage',
+export function getSmsPackage(query) {
+ url: '/company/companySmsPackage/getSmsPackage',
+export function buySmsPackage(data) {
+ url: '/company/companySmsPackage/buySmsPackage',
@@ -1,63 +1,63 @@
-// 查询短信模板列表
-export function listCompanySmsTemp(query) {
- url: '/company/companySmsTemp/list',
-export function getSmsTempList(query) {
- url: '/company/companySmsTemp/getSmsTempList',
-// 查询短信模板详细
-export function getCompanySmsTemp(tempId) {
- url: '/company/companySmsTemp/' + tempId,
-// 新增短信模板
-export function addCompanySmsTemp(data) {
- url: '/company/companySmsTemp',
-// 修改短信模板
-export function updateCompanySmsTemp(data) {
-// 删除短信模板
-export function delCompanySmsTemp(tempId) {
-// 导出短信模板
-export function exportCompanySmsTemp(query) {
- url: '/company/companySmsTemp/export',
+// 查询短信模板列表
+export function listCompanySmsTemp(query) {
+ url: '/company/companySmsTemp/list',
+export function getSmsTempList(query) {
+ url: '/company/companySmsTemp/getSmsTempList',
+// 查询短信模板详细
+export function getCompanySmsTemp(tempId) {
+ url: '/company/companySmsTemp/' + tempId,
+// 新增短信模板
+export function addCompanySmsTemp(data) {
+ url: '/company/companySmsTemp',
+// 修改短信模板
+export function updateCompanySmsTemp(data) {
+// 删除短信模板
+export function delCompanySmsTemp(tempId) {
+// 导出短信模板
+export function exportCompanySmsTemp(query) {
+ url: '/company/companySmsTemp/export',
@@ -1,165 +1,165 @@
-import { praseStrEmpty } from "@/utils/common";
-// 查询用户列表
-export function listUser(query) {
- url: '/company/user/list',
-export function getList(query) {
- url: '/company/user/getList',
-export function getUserList() {
- url: '/company/user/getUserList',
-export function getUserListByDeptId(query) {
- url: '/company/user/getUserListByDeptId',
-export function getAddressBookList(query) {
- url: '/company/user/getAddressBookList',
-// 查询用户详细
-export function getUser(userId) {
- url: '/company/user/' + praseStrEmpty(userId),
-// 新增用户
-export function addUser(data) {
- url: '/company/user',
-// 修改用户
-export function updateUser(data) {
-// 删除用户
-export function delUser(userId) {
- url: '/company/user/' + userId,
-// 导出用户
-export function exportUser(query) {
- url: '/company/user/export',
-// 用户密码重置
-export function resetUserPwd(userId, password) {
- userId,
- password
- url: '/company/user/resetPwd',
-// 用户状态修改
-export function changeUserStatus(userId, status) {
- url: '/company/user/changeStatus',
-// 查询用户个人信息
-export function getUserProfile() {
- url: '/company/user/profile',
-// 修改用户个人信息
-export function updateUserProfile(data) {
-export function updateUserPwd(oldPassword, newPassword) {
- oldPassword,
- newPassword
- url: '/company/user/profile/updatePwd',
- params: data
-// 用户头像上传
-export function uploadAvatar(data) {
- url: '/company/user/profile/avatar',
-// 下载用户导入模板
-export function importTemplate() {
- url: '/company/user/importTemplate',
-export function getSelectUserList(query) {
- url: '/company/user/getSelectUserList',
+import { praseStrEmpty } from "@/utils/common";
+// 查询用户列表
+export function listUser(query) {
+ url: '/company/user/list',
+export function getList(query) {
+ url: '/company/user/getList',
+export function getUserList() {
+ url: '/company/user/getUserList',
+export function getUserListByDeptId(query) {
+ url: '/company/user/getUserListByDeptId',
+export function getAddressBookList(query) {
+ url: '/company/user/getAddressBookList',
+// 查询用户详细
+export function getUser(userId) {
+ url: '/company/user/' + praseStrEmpty(userId),
+// 新增用户
+export function addUser(data) {
+ url: '/company/user',
+// 修改用户
+export function updateUser(data) {
+// 删除用户
+export function delUser(userId) {
+ url: '/company/user/' + userId,
+// 导出用户
+export function exportUser(query) {
+ url: '/company/user/export',
+// 用户密码重置
+export function resetUserPwd(userId, password) {
+ userId,
+ password
+ url: '/company/user/resetPwd',
+// 用户状态修改
+export function changeUserStatus(userId, status) {
+ url: '/company/user/changeStatus',
+// 查询用户个人信息
+export function getUserProfile() {
+ url: '/company/user/profile',
+// 修改用户个人信息
+export function updateUserProfile(data) {
+export function updateUserPwd(oldPassword, newPassword) {
+ oldPassword,
+ newPassword
+ url: '/company/user/profile/updatePwd',
+ params: data
+// 用户头像上传
+export function uploadAvatar(data) {
+ url: '/company/user/profile/avatar',
+// 下载用户导入模板
+export function importTemplate() {
+ url: '/company/user/importTemplate',
+export function getSelectUserList(query) {
+ url: '/company/user/getSelectUserList',
@@ -1,64 +0,0 @@
-// 查询card列表
-export function listCard(query) {
- url: '/company/companUsercard/list',
-// 查询card详细
-export function getCard(id) {
- url: '/company/companUsercard/' + id,
-// 新增card
-export function addCard(data) {
- url: '/company/companUsercard',
-// 修改card
-export function updateCard(data) {
-// 删除card
-export function delCard(id) {
-// 导出card
-export function exportCard(query) {
- url: '/company/companUsercard/export',
- //群发短信
- export function sendCustomerBatchMsg(data) {
- url: '/company/companUsercard/sendCustomerBatchMsg',
@@ -1,31 +1,31 @@
-export function callMobile(query) {
- url: '/company/voiceApi/callMobile' ,
-export function callOffMobile(voiceId) {
- url: '/company/voiceApi/callOffMobile?voiceId='+voiceId ,
-export function getSipAccount() {
- url: '/company/voiceApi/getSipAccount' ,
+export function callMobile(query) {
+ url: '/company/voiceApi/callMobile' ,
+export function callOffMobile(voiceId) {
+ url: '/company/voiceApi/callOffMobile?voiceId='+voiceId ,
+export function getSipAccount() {
+ url: '/company/voiceApi/getSipAccount' ,
@@ -1,68 +1,68 @@
-// 查询企业用户坐席列表
-export function listCompanyVoiceCaller(query) {
- url: '/company/companyVoiceCaller/list',
-// 查询企业用户坐席详细
-export function getCompanyVoiceCaller(callerId) {
- url: '/company/companyVoiceCaller/' + callerId,
-// 新增企业用户坐席
-export function addCompanyVoiceCaller(data) {
- url: '/company/companyVoiceCaller',
-// 修改企业用户坐席
-export function updateCompanyVoiceCaller(data) {
-// 删除企业用户坐席
-export function delCompanyVoiceCaller(callerId) {
-// 导出企业用户坐席
-export function exportCompanyVoiceCaller(query) {
- url: '/company/companyVoiceCaller/export',
-export function getCallerList() {
- url: '/company/companyVoiceCaller/getCallerList' ,
-export function bindCallerNo(data) {
- url: '/company/companyVoiceCaller/bindCallerNo',
+// 查询企业用户坐席列表
+export function listCompanyVoiceCaller(query) {
+ url: '/company/companyVoiceCaller/list',
+// 查询企业用户坐席详细
+export function getCompanyVoiceCaller(callerId) {
+ url: '/company/companyVoiceCaller/' + callerId,
+// 新增企业用户坐席
+export function addCompanyVoiceCaller(data) {
+ url: '/company/companyVoiceCaller',
+// 修改企业用户坐席
+export function updateCompanyVoiceCaller(data) {
+// 删除企业用户坐席
+export function delCompanyVoiceCaller(callerId) {
+// 导出企业用户坐席
+export function exportCompanyVoiceCaller(query) {
+ url: '/company/companyVoiceCaller/export',
+export function getCallerList() {
+ url: '/company/companyVoiceCaller/getCallerList' ,
+export function bindCallerNo(data) {
+ url: '/company/companyVoiceCaller/bindCallerNo',
-// 查询通话记录列表
-export function listCompanyVoiceLogs(query) {
- url: '/company/companyVoiceLogs/list',
-// 查询通话记录详细
-export function getCompanyVoiceLogs(voiceId) {
- url: '/company/companyVoiceLogs/' + voiceId,
-// 新增通话记录
-export function addCompanyVoiceLogs(data) {
- url: '/company/companyVoiceLogs',
-// 修改通话记录
-export function updateCompanyVoiceLogs(data) {
-// 删除通话记录
-export function delCompanyVoiceLogs(voiceId) {
-// 导出通话记录
-export function exportCompanyVoiceLogs(query) {
- url: '/company/companyVoiceLogs/export',
+// 查询通话记录列表
+export function listCompanyVoiceLogs(query) {
+ url: '/company/companyVoiceLogs/list',
+// 查询通话记录详细
+export function getCompanyVoiceLogs(voiceId) {
+ url: '/company/companyVoiceLogs/' + voiceId,
+// 新增通话记录
+export function addCompanyVoiceLogs(data) {
+ url: '/company/companyVoiceLogs',
+// 修改通话记录
+export function updateCompanyVoiceLogs(data) {
+// 删除通话记录
+export function delCompanyVoiceLogs(voiceId) {
+// 导出通话记录
+export function exportCompanyVoiceLogs(query) {
+ url: '/company/companyVoiceLogs/export',
@@ -1,28 +1,28 @@
-// 查询套餐订单列表
-export function listCompanyVoicePackageOrder(query) {
- url: '/company/companyVoicePackageOrder/list',
-export function getVoicePackagelist(query) {
- url: '/company/companyVoicePackageOrder/getVoicePackagelist',
-export function buy(data) {
- url: '/company/companyVoicePackageOrder/buy',
+// 查询套餐订单列表
+export function listCompanyVoicePackageOrder(query) {
+ url: '/company/companyVoicePackageOrder/list',
+export function getVoicePackagelist(query) {
+ url: '/company/companyVoicePackageOrder/getVoicePackagelist',
+export function buy(data) {
+ url: '/company/companyVoicePackageOrder/buy',
@@ -1,12 +1,12 @@
-export function weixinPay(query) {
- url: '/pay/wxPay/qrPay',
+export function weixinPay(query) {
+ url: '/pay/wxPay/qrPay',
@@ -1,47 +1,47 @@
-export function voiceLogs(query) {
- url: '/company/statistics/voiceLogs',
-export function exportVoiceLogs(query) {
- url: '/company/statistics/exportVoiceLogs',
-export function myVoiceLogs(query) {
- url: '/company/statistics/myVoiceLogs',
-export function exportMyVoiceLogs(query) {
- url: '/company/statistics/exportMyVoiceLogs',
-export function smsLogs(query) {
- url: '/company/statistics/smsLogs',
-export function exportSmsLogs(query) {
- url: '/company/statistics/exportSmsLogs',
+export function voiceLogs(query) {
+ url: '/company/statistics/voiceLogs',
+export function exportVoiceLogs(query) {
+ url: '/company/statistics/exportVoiceLogs',
+export function myVoiceLogs(query) {
+ url: '/company/statistics/myVoiceLogs',
+export function exportMyVoiceLogs(query) {
+ url: '/company/statistics/exportMyVoiceLogs',
+export function smsLogs(query) {
+ url: '/company/statistics/smsLogs',
+export function exportSmsLogs(query) {
+ url: '/company/statistics/exportSmsLogs',
@@ -1,152 +1,152 @@
-export function getFullCustomerList(query) {
- url: '/crm/customer/getFullCustomerList',
-export function getLineCustomerList(query) {
- url: '/crm/customer/getLineCustomerList',
-export function getCustomerList(query) {
- url: '/crm/customer/getCustomerList',
-export function getCustomerListByIds(query) {
- url: '/crm/customer/getCustomerListByIds',
-export function getMyCustomerList(query) {
- url: '/crm/customer/getMyCustomerList',
-export function getCustomerDetails(query) {
- url: '/crm/customer/getCustomerDetails/',
-export function getCustomerListBySearch(query) {
- url: '/crm/customer/getCustomerListBySearch',
-export function exportCustomer(query) {
- url: '/crm/customer/export',
-export function assignToUser(data) {
- url: '/crm/customer/assignToUser',
-export function assignUser(data) {
- url: '/crm/customer/assignUser',
-export function receive(data) {
- url: '/crm/customer/receive',
-export function recover(data) {
- url: '/crm/customer/recover',
-export function importLineTemplate() {
- url: '/crm/customer/importLineTemplate',
-export function addCustomer(data) {
- url: '/crm/customer/add',
-export function addMyCustomer(data) {
- url: '/crm/customer/addMyCustomer',
-// 修改客户
-export function updateCustomer(data) {
- url: '/crm/customer/edit',
-export function updateCustomerSource(data) {
- url: '/crm/customer/updateCustomerSource',
+export function getFullCustomerList(query) {
+ url: '/crm/customer/getFullCustomerList',
+export function getLineCustomerList(query) {
+ url: '/crm/customer/getLineCustomerList',
+export function getCustomerList(query) {
+ url: '/crm/customer/getCustomerList',
+export function getCustomerListByIds(query) {
+ url: '/crm/customer/getCustomerListByIds',
+export function getMyCustomerList(query) {
+ url: '/crm/customer/getMyCustomerList',
+export function getCustomerDetails(query) {
+ url: '/crm/customer/getCustomerDetails/',
+export function getCustomerListBySearch(query) {
+ url: '/crm/customer/getCustomerListBySearch',
+export function exportCustomer(query) {
+ url: '/crm/customer/export',
+export function assignToUser(data) {
+ url: '/crm/customer/assignToUser',
+export function assignUser(data) {
+ url: '/crm/customer/assignUser',
+export function receive(data) {
+ url: '/crm/customer/receive',
+export function recover(data) {
+ url: '/crm/customer/recover',
+export function importLineTemplate() {
+ url: '/crm/customer/importLineTemplate',
+export function addCustomer(data) {
+ url: '/crm/customer/add',
+export function addMyCustomer(data) {
+ url: '/crm/customer/addMyCustomer',
+// 修改客户
+export function updateCustomer(data) {
+ url: '/crm/customer/edit',
+export function updateCustomerSource(data) {
+ url: '/crm/customer/updateCustomerSource',
@@ -1,21 +1,21 @@
-// 查询客户分配记录列表
-export function listCustomerAssign(query) {
- url: '/crm/customerAssign/list',
-export function cancelCustomerAssign(data) {
- url: '/crm/customerAssign/cancel' ,
+// 查询客户分配记录列表
+export function listCustomerAssign(query) {
+ url: '/crm/customerAssign/list',
+export function cancelCustomerAssign(data) {
+ url: '/crm/customerAssign/cancel' ,
-// 查询客户联系人列表
-export function listCustomerContacts(query) {
- url: '/crm/customerContacts/list',
-// 查询客户联系人详细
-export function getCustomerContacts(contactsId) {
- url: '/crm/customerContacts/' + contactsId,
-// 新增客户联系人
-export function addCustomerContacts(data) {
- url: '/crm/customerContacts',
-// 修改客户联系人
-export function updateCustomerContacts(data) {
-// 删除客户联系人
-export function delCustomerContacts(contactsId) {
-// 导出客户联系人
-export function exportCustomerContacts(query) {
- url: '/crm/customerContacts/export',
+// 查询客户联系人列表
+export function listCustomerContacts(query) {
+ url: '/crm/customerContacts/list',
+// 查询客户联系人详细
+export function getCustomerContacts(contactsId) {
+ url: '/crm/customerContacts/' + contactsId,
+// 新增客户联系人
+export function addCustomerContacts(data) {
+ url: '/crm/customerContacts',
+// 修改客户联系人
+export function updateCustomerContacts(data) {
+// 删除客户联系人
+export function delCustomerContacts(contactsId) {
+// 导出客户联系人
+export function exportCustomerContacts(query) {
+ url: '/crm/customerContacts/export',
-// 查询客户字段扩展列表
-export function listCustomerExt(query) {
- url: '/crm/customerExt/list',
-// 查询客户字段扩展详细
-export function getCustomerExt(extId) {
- url: '/crm/customerExt/' + extId,
-// 新增客户字段扩展
-export function addCustomerExt(data) {
- url: '/crm/customerExt',
-// 修改客户字段扩展
-export function updateCustomerExt(data) {
-// 删除客户字段扩展
-export function delCustomerExt(extId) {
-// 导出客户字段扩展
-export function exportCustomerExt(query) {
- url: '/crm/customerExt/export',
+// 查询客户字段扩展列表
+export function listCustomerExt(query) {
+ url: '/crm/customerExt/list',
+// 查询客户字段扩展详细
+export function getCustomerExt(extId) {
+ url: '/crm/customerExt/' + extId,
+// 新增客户字段扩展
+export function addCustomerExt(data) {
+ url: '/crm/customerExt',
+// 修改客户字段扩展
+export function updateCustomerExt(data) {
+// 删除客户字段扩展
+export function delCustomerExt(extId) {
+// 导出客户字段扩展
+export function exportCustomerExt(query) {
+ url: '/crm/customerExt/export',
@@ -0,0 +1,53 @@
+// 查询客户历史订单列表
+export function listCustomerHisOrder(query) {
+ url: '/crm/customerHisOrder/list',
+// 查询客户历史订单详细
+export function getCustomerHisOrder(orderId) {
+ url: '/crm/customerHisOrder/' + orderId,
+// 新增客户历史订单
+export function addCustomerHisOrder(data) {
+ url: '/crm/customerHisOrder',
+// 修改客户历史订单
+export function updateCustomerHisOrder(data) {
+// 删除客户历史订单
+export function delCustomerHisOrder(orderId) {
+// 导出客户历史订单
+export function exportCustomerHisOrder(query) {
+ url: '/crm/customerHisOrder/export',
-// 查询客户日志列表
-export function listCustomerLogs(query) {
- url: '/crm/customerLogs/list',
-// 查询客户日志详细
-export function getCustomerLogs(logsId) {
- url: '/crm/customerLogs/' + logsId,
-// 新增客户日志
-export function addCustomerLogs(data) {
- url: '/crm/customerLogs',
-// 修改客户日志
-export function updateCustomerLogs(data) {
-// 删除客户日志
-export function delCustomerLogs(logsId) {
-// 导出客户日志
-export function exportCustomerLogs(query) {
- url: '/crm/customerLogs/export',
+// 查询客户日志列表
+export function listCustomerLogs(query) {
+ url: '/crm/customerLogs/list',
+// 查询客户日志详细
+export function getCustomerLogs(logsId) {
+ url: '/crm/customerLogs/' + logsId,
+// 新增客户日志
+export function addCustomerLogs(data) {
+ url: '/crm/customerLogs',
+// 修改客户日志
+export function updateCustomerLogs(data) {
+// 删除客户日志
+export function delCustomerLogs(logsId) {
+// 导出客户日志
+export function exportCustomerLogs(query) {
+ url: '/crm/customerLogs/export',
-// 查询客户员工认领列表
-export function listCustomerUser(query) {
- url: '/crm/customerUser/list',
-// 查询客户员工认领详细
-export function getCustomerUser(customerUserId) {
- url: '/crm/customerUser/' + customerUserId,
-// 新增客户员工认领
-export function addCustomerUser(data) {
- url: '/crm/customerUser',
-// 修改客户员工认领
-export function updateCustomerUser(data) {
-// 删除客户员工认领
-export function delCustomerUser(customerUserId) {
-// 导出客户员工认领
-export function exportCustomerUser(query) {
- url: '/crm/customerUser/export',
+// 查询客户员工认领列表
+export function listCustomerUser(query) {
+ url: '/crm/customerUser/list',
+// 查询客户员工认领详细
+export function getCustomerUser(customerUserId) {
+ url: '/crm/customerUser/' + customerUserId,
+// 新增客户员工认领
+export function addCustomerUser(data) {
+ url: '/crm/customerUser',
+// 修改客户员工认领
+export function updateCustomerUser(data) {
+// 删除客户员工认领
+export function delCustomerUser(customerUserId) {
+// 导出客户员工认领
+export function exportCustomerUser(query) {
+ url: '/crm/customerUser/export',
-// 查询跟进列表
-export function listCustomerVisit(query) {
- url: '/crm/customerVisit/list',
-// 查询跟进详细
-export function getCustomerVisit(visitId) {
- url: '/crm/customerVisit/' + visitId,
-// 新增跟进
-export function addCustomerVisit(data) {
- url: '/crm/customerVisit',
-// 修改跟进
-export function updateCustomerVisit(data) {
-// 删除跟进
-export function delCustomerVisit(visitId) {
-// 导出跟进
-export function exportCustomerVisit(query) {
- url: '/crm/customerVisit/export',
+// 查询跟进列表
+export function listCustomerVisit(query) {
+ url: '/crm/customerVisit/list',
+// 查询跟进详细
+export function getCustomerVisit(visitId) {
+ url: '/crm/customerVisit/' + visitId,
+// 新增跟进
+export function addCustomerVisit(data) {
+ url: '/crm/customerVisit',
+// 修改跟进
+export function updateCustomerVisit(data) {
+// 删除跟进
+export function delCustomerVisit(visitId) {
+// 导出跟进
+export function exportCustomerVisit(query) {
+ url: '/crm/customerVisit/export',
@@ -1,30 +1,30 @@
-export function getMyCrmEventList(query) {
- url: '/crm/event/getMyCrmEventList',
-export function addCrmEvent(data) {
- url: '/crm/event/addCrmEvent',
-export function delCrmEvent(data) {
- url: '/crm/event/delCrmEvent',
-export function doEvent(data) {
- url: '/crm/event/doEvent',
+export function getMyCrmEventList(query) {
+ url: '/crm/event/getMyCrmEventList',
+export function addCrmEvent(data) {
+ url: '/crm/event/addCrmEvent',
+export function delCrmEvent(data) {
+ url: '/crm/event/delCrmEvent',
+export function doEvent(data) {
+ url: '/crm/event/doEvent',
@@ -1,43 +1,43 @@
-// 查询 消息列表
-export function getMsg() {
- url: '/crm/msg/getMsg',
-export function getMsgList(query) {
- url: '/crm/msg/getMsgList',
-export function getMsgCount() {
- url: '/crm/msg/getMsgCount',
-export function setRead(data) {
- url: '/crm/msg/setRead',
-export function setAllRead() {
- url: '/crm/msg/setAllRead',
- method: 'post'
+// 查询 消息列表
+export function getMsg() {
+ url: '/crm/msg/getMsg',
+export function getMsgList(query) {
+ url: '/crm/msg/getMsgList',
+export function getMsgCount() {
+ url: '/crm/msg/getMsgCount',
+export function setRead(data) {
+ url: '/crm/msg/setRead',
+export function setAllRead() {
+ url: '/crm/msg/setAllRead',
+ method: 'post'
@@ -1,35 +1,35 @@
-export function customer(query) {
- url: '/crm/statistics/customer',
- url: '/crm/statistics/exportCustomer',
-export function customerVisit(query) {
- url: '/crm/statistics/customerVisit',
- url: '/crm/statistics/exportCustomerVisit',
+export function customer(query) {
+ url: '/crm/statistics/customer',
+ url: '/crm/statistics/exportCustomer',
+export function customerVisit(query) {
+ url: '/crm/statistics/customerVisit',
+ url: '/crm/statistics/exportCustomerVisit',
-// 查询档案列表
-export function listDoc(query) {
- url: '/doc/doc/list',
-// 查询档案详细
-export function getDoc(docId) {
- url: '/doc/doc/' + docId,
-// 新增档案
-export function addDoc(data) {
- url: '/doc/doc',
-// 修改档案
-export function updateDoc(data) {
-// 删除档案
-export function delDoc(docId) {
-// 导出档案
-export function exportDoc(query) {
- url: '/doc/doc/export',
+// 查询档案列表
+export function listDoc(query) {
+ url: '/doc/doc/list',
+// 查询档案详细
+export function getDoc(docId) {
+ url: '/doc/doc/' + docId,
+// 新增档案
+export function addDoc(data) {
+ url: '/doc/doc',
+// 修改档案
+export function updateDoc(data) {
+// 删除档案
+export function delDoc(docId) {
+// 导出档案
+export function exportDoc(query) {
+ url: '/doc/doc/export',
-// 查询问医生列表
-export function listDocOrder(query) {
- url: '/doc/docOrder/list',
-// 查询问医生详细
-export function getDocOrder(orderId) {
- url: '/doc/docOrder/' + orderId,
-// 新增问医生
-export function addDocOrder(data) {
- url: '/doc/docOrder',
-// 修改问医生
-export function updateDocOrder(data) {
-// 删除问医生
-export function delDocOrder(orderId) {
-// 导出问医生
-export function exportDocOrder(query) {
- url: '/doc/docOrder/export',
+// 查询问医生列表
+export function listDocOrder(query) {
+ url: '/doc/docOrder/list',
+// 查询问医生详细
+export function getDocOrder(orderId) {
+ url: '/doc/docOrder/' + orderId,
+// 新增问医生
+export function addDocOrder(data) {
+ url: '/doc/docOrder',
+// 修改问医生
+export function updateDocOrder(data) {
+// 删除问医生
+export function delDocOrder(orderId) {
+// 导出问医生
+export function exportDocOrder(query) {
+ url: '/doc/docOrder/export',
-// 查询订单回复列表
-export function listDocOrderReply(query) {
- url: '/doc/docOrderReply/list',
-// 查询订单回复详细
-export function getDocOrderReply(replyId) {
- url: '/doc/docOrderReply/' + replyId,
-// 新增订单回复
-export function addDocOrderReply(data) {
- url: '/doc/docOrderReply',
-// 修改订单回复
-export function updateDocOrderReply(data) {
-// 删除订单回复
-export function delDocOrderReply(replyId) {
-// 导出订单回复
-export function exportDocOrderReply(query) {
- url: '/doc/docOrderReply/export',
+// 查询订单回复列表
+export function listDocOrderReply(query) {
+ url: '/doc/docOrderReply/list',
+// 查询订单回复详细
+export function getDocOrderReply(replyId) {
+ url: '/doc/docOrderReply/' + replyId,
+// 新增订单回复
+export function addDocOrderReply(data) {
+ url: '/doc/docOrderReply',
+// 修改订单回复
+export function updateDocOrderReply(data) {
+// 删除订单回复
+export function delDocOrderReply(replyId) {
+// 导出订单回复
+export function exportDocOrderReply(query) {
+ url: '/doc/docOrderReply/export',
-// 查询记录列表
-export function listDocRecord(query) {
- url: '/doc/docRecord/list',
-// 查询记录详细
-export function getDocRecord(recordId) {
- url: '/doc/docRecord/' + recordId,
-// 新增记录
-export function addDocRecord(data) {
- url: '/doc/docRecord',
-// 修改记录
-export function updateDocRecord(data) {
-// 删除记录
-export function delDocRecord(recordId) {
-// 导出记录
-export function exportDocRecord(query) {
- url: '/doc/docRecord/export',
+// 查询记录列表
+export function listDocRecord(query) {
+ url: '/doc/docRecord/list',
+// 查询记录详细
+export function getDocRecord(recordId) {
+ url: '/doc/docRecord/' + recordId,
+// 新增记录
+export function addDocRecord(data) {
+ url: '/doc/docRecord',
+// 修改记录
+export function updateDocRecord(data) {
+// 删除记录
+export function delDocRecord(recordId) {
+// 导出记录
+export function exportDocRecord(query) {
+ url: '/doc/docRecord/export',
-// 查询回复列表
-export function listDocRecordReply(query) {
- url: '/doc/docRecordReply/list',
-// 查询回复详细
-export function getDocRecordReply(replyId) {
- url: '/doc/docRecordReply/' + replyId,
-// 新增回复
-export function addDocRecordReply(data) {
- url: '/doc/docRecordReply',
-// 修改回复
-export function updateDocRecordReply(data) {
-// 删除回复
-export function delDocRecordReply(replyId) {
-// 导出回复
-export function exportDocRecordReply(query) {
- url: '/doc/docRecordReply/export',
+// 查询回复列表
+export function listDocRecordReply(query) {
+ url: '/doc/docRecordReply/list',
+// 查询回复详细
+export function getDocRecordReply(replyId) {
+ url: '/doc/docRecordReply/' + replyId,
+// 新增回复
+export function addDocRecordReply(data) {
+ url: '/doc/docRecordReply',
+// 修改回复
+export function updateDocRecordReply(data) {
+// 删除回复
+export function delDocRecordReply(replyId) {
+// 导出回复
+export function exportDocRecordReply(query) {
+ url: '/doc/docRecordReply/export',
-export function getIndexData(data) {
- url: '/common/index/getIndexData',
-export function getStoreOrderData(query) {
- url: '/common/index/getStoreOrderData',
- )
-export function getStorePaymentData(query) {
- url: '/common/index/getStorePaymentData',
+export function getIndexData(data) {
+ url: '/common/index/getIndexData',
+export function getStoreOrderData(query) {
+ url: '/common/index/getStoreOrderData',
+ )
+export function getStorePaymentData(query) {
+ url: '/common/index/getStorePaymentData',
@@ -1,40 +1,40 @@
-// 登录方法
-export function login(username, password, code, uuid) {
- username,
- password,
- code,
- uuid
- url: '/login',
-// 获取用户详细信息
-export function getInfo() {
- url: '/getInfo',
-// 退出方法
-export function logout() {
- url: '/logout',
-// 获取验证码
-export function getCodeImg() {
- url: '/captchaImage',
+// 登录方法
+export function login(username, password, code, uuid) {
+ username,
+ password,
+ code,
+ uuid
+ url: '/login',
+// 获取用户详细信息
+export function getInfo() {
+ url: '/getInfo',
+// 退出方法
+export function logout() {
+ url: '/logout',
+// 获取验证码
+export function getCodeImg() {
+ url: '/captchaImage',
@@ -1,9 +1,9 @@
-// 获取路由
-export const getRouters = () => {
- url: '/getRouters',
+// 获取路由
+export const getRouters = () => {
+ url: '/getRouters',
-// 查询登录日志列表
-export function list(query) {
- url: '/monitor/logininfor/list',
-// 删除登录日志
-export function delLogininfor(infoId) {
- url: '/monitor/logininfor/' + infoId,
-// 清空登录日志
-export function cleanLogininfor() {
- url: '/monitor/logininfor/clean',
-// 导出登录日志
-export function exportLogininfor(query) {
- url: '/monitor/logininfor/export',
+// 查询登录日志列表
+export function list(query) {
+ url: '/monitor/logininfor/list',
+// 删除登录日志
+export function delLogininfor(infoId) {
+ url: '/monitor/logininfor/' + infoId,
+// 清空登录日志
+export function cleanLogininfor() {
+ url: '/monitor/logininfor/clean',
+// 导出登录日志
+export function exportLogininfor(query) {
+ url: '/monitor/logininfor/export',
-// 查询操作日志列表
- url: '/monitor/operlog/list',
-// 删除操作日志
-export function delOperlog(operId) {
- url: '/monitor/operlog/' + operId,
-// 清空操作日志
-export function cleanOperlog() {
- url: '/monitor/operlog/clean',
-// 导出操作日志
-export function exportOperlog(query) {
- url: '/monitor/operlog/export',
+// 查询操作日志列表
+ url: '/monitor/operlog/list',
+// 删除操作日志
+export function delOperlog(operId) {
+ url: '/monitor/operlog/' + operId,
+// 清空操作日志
+export function cleanOperlog() {
+ url: '/monitor/operlog/clean',
+// 导出操作日志
+export function exportOperlog(query) {
+ url: '/monitor/operlog/export',
@@ -1,62 +1,62 @@
-// 查询城市列表
-export function listCity(query) {
- url: '/store/city/list',
-export function getCitys(query) {
- url: '/store/city/getCitys',
-// 查询城市详细
-export function getCity(id) {
- url: '/store/city/' + id,
-// 新增城市
-export function addCity(data) {
- url: '/store/city',
-// 修改城市
-export function updateCity(data) {
-// 删除城市
-export function delCity(id) {
-// 导出城市
-export function exportCity(query) {
- url: '/store/city/export',
+// 查询城市列表
+export function listCity(query) {
+ url: '/store/city/list',
+export function getCitys(query) {
+ url: '/store/city/getCitys',
+// 查询城市详细
+export function getCity(id) {
+ url: '/store/city/' + id,
+// 新增城市
+export function addCity(data) {
+ url: '/store/city',
+// 修改城市
+export function updateCity(data) {
+// 删除城市
+export function delCity(id) {
+// 导出城市
+export function exportCity(query) {
+ url: '/store/city/export',
-// 查询素材库列表
-export function listMaterial(query) {
- url: '/store/material/list',
-// 查询素材库详细
-export function getMaterial(materialId) {
- url: '/store/material/' + materialId,
-// 新增素材库
-export function addMaterial(data) {
- url: '/store/material',
-// 修改素材库
-export function updateMaterial(data) {
-// 删除素材库
-export function delMaterial(materialId) {
-// 导出素材库
-export function exportMaterial(query) {
- url: '/store/material/export',
+// 查询素材库列表
+export function listMaterial(query) {
+ url: '/store/material/list',
+// 查询素材库详细
+export function getMaterial(materialId) {
+ url: '/store/material/' + materialId,
+// 新增素材库
+export function addMaterial(data) {
+ url: '/store/material',
+// 修改素材库
+export function updateMaterial(data) {
+// 删除素材库
+export function delMaterial(materialId) {
+// 导出素材库
+export function exportMaterial(query) {
+ url: '/store/material/export',
-// 查询素材分组列表
-export function listMaterialGroup(query) {
- url: '/store/materialGroup/list',
-export function getAllMaterialGroup(query) {
- url: '/store/materialGroup/getAllList',
-// 查询素材分组详细
-export function getMaterialGroup(groupId) {
- url: '/store/materialGroup/' + groupId,
-// 新增素材分组
-export function addMaterialGroup(data) {
- url: '/store/materialGroup',
-// 修改素材分组
-export function updateMaterialGroup(data) {
-// 删除素材分组
-export function delMaterialGroup(groupId) {
-// 导出素材分组
-export function exportMaterialGroup(query) {
- url: '/store/materialGroup/export',
+// 查询素材分组列表
+export function listMaterialGroup(query) {
+ url: '/store/materialGroup/list',
+export function getAllMaterialGroup(query) {
+ url: '/store/materialGroup/getAllList',
+// 查询素材分组详细
+export function getMaterialGroup(groupId) {
+ url: '/store/materialGroup/' + groupId,
+// 新增素材分组
+export function addMaterialGroup(data) {
+ url: '/store/materialGroup',
+// 修改素材分组
+export function updateMaterialGroup(data) {
+// 删除素材分组
+export function delMaterialGroup(groupId) {
+// 导出素材分组
+export function exportMaterialGroup(query) {
+ url: '/store/materialGroup/export',
@@ -1,33 +1,33 @@
-export function storeOrder(query) {
- url: '/store/statistics/storeOrder',
-export function exportStoreOrder(query) {
- url: '/store/statistics/exportStoreOrder',
-export function storePayment(query) {
- url: '/store/statistics/storePayment',
-export function exportStorePayment(query) {
- url: '/store/statistics/exportStorePayment',
+export function storeOrder(query) {
+ url: '/store/statistics/storeOrder',
+export function exportStoreOrder(query) {
+ url: '/store/statistics/exportStoreOrder',
+export function storePayment(query) {
+ url: '/store/statistics/storePayment',
+export function exportStorePayment(query) {
+ url: '/store/statistics/exportStorePayment',
@@ -1,88 +1,88 @@
-// 查询售后记录列表
-export function listStoreAfterSales(query) {
- url: '/store/storeAfterSales/list',
-export function myListStoreAfterSales(query) {
- url: '/store/storeAfterSales/myList',
-// 查询售后记录详细
-export function getStoreAfterSales(id) {
- url: '/store/storeAfterSales/' + id,
-// 新增售后记录
-export function addStoreAfterSales(data) {
- url: '/store/storeAfterSales',
-// 修改售后记录
-export function updateStoreAfterSales(data) {
-// 删除售后记录
-export function delStoreAfterSales(id) {
-// 导出售后记录
-export function exportStoreAfterSales(query) {
- url: '/store/storeAfterSales/export',
- url: '/store/storeAfterSales/cancel',
-export function refund(data) {
- url: '/store/storeAfterSales/refund',
-export function audit(data) {
- url: '/store/storeAfterSales/audit',
+// 查询售后记录列表
+export function listStoreAfterSales(query) {
+ url: '/store/storeAfterSales/list',
+export function myListStoreAfterSales(query) {
+ url: '/store/storeAfterSales/myList',
+// 查询售后记录详细
+export function getStoreAfterSales(id) {
+ url: '/store/storeAfterSales/' + id,
+// 新增售后记录
+export function addStoreAfterSales(data) {
+ url: '/store/storeAfterSales',
+// 修改售后记录
+export function updateStoreAfterSales(data) {
+// 删除售后记录
+export function delStoreAfterSales(id) {
+// 导出售后记录
+export function exportStoreAfterSales(query) {
+ url: '/store/storeAfterSales/export',
+ url: '/store/storeAfterSales/cancel',
+export function refund(data) {
+ url: '/store/storeAfterSales/refund',
+export function audit(data) {
+ url: '/store/storeAfterSales/audit',
@@ -1,114 +1,114 @@
-// 查询订单列表
-export function listStoreOrder(query) {
- url: '/store/storeOrder/list',
-export function getCustomerOrderList(query) {
- url: '/store/storeOrder/getCustomerOrderList',
-export function myListStoreOrder(query) {
- url: '/store/storeOrder/myList',
-// 查询订单详细
-export function getStoreOrder(id) {
- url: '/store/storeOrder/' + id,
-export function getExpress(id) {
- url: '/store/storeOrder/getExpress/' + id,
-// 新增订单
-export function addStoreOrder(data) {
- url: '/store/storeOrder',
-// 修改订单
-export function updateStoreOrder(data) {
-// 删除订单
-export function delStoreOrder(id) {
-// 导出订单
- url: '/store/storeOrder/export',
-export function exportStoreOrderItems(query) {
- url: '/store/storeOrder/exportItems',
-export function createUserOrder(data) {
- url: '/store/storeOrder/createUserOrder',
-export function editPayPrice(data) {
- url: '/store/storeOrder/editPayPrice',
-export function bindCustomer(data) {
- url: '/store/storeOrder/bindCustomer',
+// 查询订单列表
+export function listStoreOrder(query) {
+ url: '/store/storeOrder/list',
+export function getCustomerOrderList(query) {
+ url: '/store/storeOrder/getCustomerOrderList',
+export function myListStoreOrder(query) {
+ url: '/store/storeOrder/myList',
+// 查询订单详细
+export function getStoreOrder(id) {
+ url: '/store/storeOrder/' + id,
+export function getExpress(id) {
+ url: '/store/storeOrder/getExpress/' + id,
+// 新增订单
+export function addStoreOrder(data) {
+ url: '/store/storeOrder',
+// 修改订单
+export function updateStoreOrder(data) {
+// 删除订单
+export function delStoreOrder(id) {
+// 导出订单
+ url: '/store/storeOrder/export',
+export function exportStoreOrderItems(query) {
+ url: '/store/storeOrder/exportItems',
+export function createUserOrder(data) {
+ url: '/store/storeOrder/createUserOrder',
+export function editPayPrice(data) {
+ url: '/store/storeOrder/editPayPrice',
+export function bindCustomer(data) {
+ url: '/store/storeOrder/bindCustomer',
-// 查询支付明细列表
-export function listStorePayment(query) {
- url: '/store/storePayment/list',
-export function getStorePaymentList(query) {
- url: '/store/storePayment/getStorePaymentList',
-export function getMyPaymentList(query) {
- url: '/store/storePayment/getMyPaymentList',
-// 查询支付明细详细
-export function getStorePayment(paymentId) {
- url: '/store/storePayment/' + paymentId,
-// 新增支付明细
-export function addStorePayment(data) {
- url: '/store/storePayment',
-// 修改支付明细
-export function updateStorePayment(data) {
-// 删除支付明细
-export function delStorePayment(paymentId) {
-// 导出支付明细
- url: '/store/storePayment/export',
+// 查询支付明细列表
+export function listStorePayment(query) {
+ url: '/store/storePayment/list',
+export function getStorePaymentList(query) {
+ url: '/store/storePayment/getStorePaymentList',
+export function getMyPaymentList(query) {
+ url: '/store/storePayment/getMyPaymentList',
+// 查询支付明细详细
+export function getStorePayment(paymentId) {
+ url: '/store/storePayment/' + paymentId,
+// 新增支付明细
+export function addStorePayment(data) {
+ url: '/store/storePayment',
+// 修改支付明细
+export function updateStorePayment(data) {
+// 删除支付明细
+export function delStorePayment(paymentId) {
+// 导出支付明细
+ url: '/store/storePayment/export',
@@ -1,24 +1,24 @@
-// 查询商品列表
-export function listStoreProduct(query) {
- url: '/store/storeProduct/list',
-export function getStoreProductAttrValueList(query) {
- url: '/store/storeProduct/getStoreProductAttrValueList',
-export function getStoreProduct(productId) {
- url: '/store/storeProduct/' + productId,
+// 查询商品列表
+export function listStoreProduct(query) {
+ url: '/store/storeProduct/list',
+export function getStoreProductAttrValueList(query) {
+ url: '/store/storeProduct/getStoreProductAttrValueList',
+export function getStoreProduct(productId) {
+ url: '/store/storeProduct/' + productId,
@@ -1,8 +1,8 @@
-export function getAllStoreProductCategory() {
- url: '/store/storeProductCategory/getAllList' ,
+export function getAllStoreProductCategory() {
+ url: '/store/storeProductCategory/getAllList' ,
-// 查询商品组合套餐列表
-export function listStoreProductPackage(query) {
- url: '/store/storeProductPackage/list',
-// 查询商品组合套餐详细
-export function getStoreProductPackage(packageId) {
- url: '/store/storeProductPackage/' + packageId,
-// 新增商品组合套餐
-export function addStoreProductPackage(data) {
- url: '/store/storeProductPackage',
-// 修改商品组合套餐
-export function updateStoreProductPackage(data) {
-// 删除商品组合套餐
-export function delStoreProductPackage(packageId) {
-// 导出商品组合套餐
-export function exportStoreProductPackage(query) {
- url: '/store/storeProductPackage/export',
+// 查询商品组合套餐列表
+export function listStoreProductPackage(query) {
+ url: '/store/storeProductPackage/list',
+// 查询商品组合套餐详细
+export function getStoreProductPackage(packageId) {
+ url: '/store/storeProductPackage/' + packageId,
+// 新增商品组合套餐
+export function addStoreProductPackage(data) {
+ url: '/store/storeProductPackage',
+// 修改商品组合套餐
+export function updateStoreProductPackage(data) {
+// 删除商品组合套餐
+export function delStoreProductPackage(packageId) {
+// 导出商品组合套餐
+export function exportStoreProductPackage(query) {
+ url: '/store/storeProductPackage/export',
-// 查询字典数据列表
-export function listData(query) {
- url: '/system/dict/data/list',
-// 查询字典数据详细
-export function getData(dictCode) {
- url: '/system/dict/data/' + dictCode,
-// 根据字典类型查询字典数据信息
-export function getDicts(dictType) {
- url: '/system/dict/data/type/' + dictType,
-// 新增字典数据
-export function addData(data) {
- url: '/system/dict/data',
-// 修改字典数据
-export function updateData(data) {
-// 删除字典数据
-export function delData(dictCode) {
-// 导出字典数据
-export function exportData(query) {
- url: '/system/dict/data/export',
+// 查询字典数据列表
+export function listData(query) {
+ url: '/system/dict/data/list',
+// 查询字典数据详细
+export function getData(dictCode) {
+ url: '/system/dict/data/' + dictCode,
+// 根据字典类型查询字典数据信息
+export function getDicts(dictType) {
+ url: '/system/dict/data/type/' + dictType,
+// 新增字典数据
+export function addData(data) {
+ url: '/system/dict/data',
+// 修改字典数据
+export function updateData(data) {
+// 删除字典数据
+export function delData(dictCode) {
+// 导出字典数据
+export function exportData(query) {
+ url: '/system/dict/data/export',
@@ -1,69 +1,69 @@
-// 查询字典类型列表
-export function listType(query) {
- url: '/system/dict/type/list',
-// 查询字典类型详细
-export function getType(dictId) {
- url: '/system/dict/type/' + dictId,
-// 新增字典类型
-export function addType(data) {
- url: '/system/dict/type',
-// 修改字典类型
-export function updateType(data) {
-// 删除字典类型
-export function delType(dictId) {
-// 清理参数缓存
-export function clearCache() {
- url: '/system/dict/type/clearCache',
-// 导出字典类型
-export function exportType(query) {
- url: '/system/dict/type/export',
-// 获取字典选择框列表
-export function optionselect() {
- url: '/system/dict/type/optionselect',
+// 查询字典类型列表
+export function listType(query) {
+ url: '/system/dict/type/list',
+// 查询字典类型详细
+export function getType(dictId) {
+ url: '/system/dict/type/' + dictId,
+// 新增字典类型
+export function addType(data) {
+ url: '/system/dict/type',
+// 修改字典类型
+export function updateType(data) {
+// 删除字典类型
+export function delType(dictId) {
+// 清理参数缓存
+export function clearCache() {
+ url: '/system/dict/type/clearCache',
+// 导出字典类型
+export function exportType(query) {
+ url: '/system/dict/type/export',
+// 获取字典选择框列表
+export function optionselect() {
+ url: '/system/dict/type/optionselect',
@@ -1,49 +1,49 @@
- url: '/users/user/list',
-export function myList(query) {
- url: '/users/user/myList',
- url: '/users/user/' + userId,
-export function getUserList(query) {
- url: '/users/user/getUserList',
- url: '/users/user',
+ url: '/users/user/list',
+export function myList(query) {
+ url: '/users/user/myList',
+ url: '/users/user/' + userId,
+export function getUserList(query) {
+ url: '/users/user/getUserList',
+ url: '/users/user',
-// 查询用户地址列表
-export function listUserAddress(query) {
- url: '/store/userAddress/list',
-// 查询用户地址详细
-export function getUserAddress(id) {
- url: '/store/userAddress/' + id,
-// 新增用户地址
-export function addUserAddress(data) {
- url: '/store/userAddress',
-// 修改用户地址
-export function updateUserAddress(data) {
-// 删除用户地址
-export function delUserAddress(id) {
-// 导出用户地址
-export function exportUserAddress(query) {
- url: '/store/userAddress/export',
-export function getAddressList(query) {
- url: '/store/userAddress/getAddressList',
+// 查询用户地址列表
+export function listUserAddress(query) {
+ url: '/store/userAddress/list',
+// 查询用户地址详细
+export function getUserAddress(id) {
+ url: '/store/userAddress/' + id,
+// 新增用户地址
+export function addUserAddress(data) {
+ url: '/store/userAddress',
+// 修改用户地址
+export function updateUserAddress(data) {
+// 删除用户地址
+export function delUserAddress(id) {
+// 导出用户地址
+export function exportUserAddress(query) {
+ url: '/store/userAddress/export',
+export function getAddressList(query) {
+ url: '/store/userAddress/getAddressList',
-import Vue from 'vue'
-import SvgIcon from '@/components/SvgIcon'// svg component
-// register globally
-Vue.component('svg-icon', SvgIcon)
-const req = require.context('./svg', false, /\.svg$/)
-const requireAll = requireContext => requireContext.keys().map(requireContext)
-requireAll(req)
+import Vue from 'vue'
+import SvgIcon from '@/components/SvgIcon'// svg component
+// register globally
+Vue.component('svg-icon', SvgIcon)
+const req = require.context('./svg', false, /\.svg$/)
+const requireAll = requireContext => requireContext.keys().map(requireContext)
+requireAll(req)
@@ -1,2 +1,2 @@
-<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1543827393750" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4695" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: rbicon; src: url("chrome-extension://dipiagiiohfljcicegpgffpbnjmgjcnf/fonts/rbicon.woff2") format("woff2"); font-weight: normal; font-style: normal; }
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1543827393750" class="icon" style="" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4695" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: rbicon; src: url("chrome-extension://dipiagiiohfljcicegpgffpbnjmgjcnf/fonts/rbicon.woff2") format("woff2"); font-weight: normal; font-style: normal; }
</style></defs><path d="M64 64V640H896V64H64zM0 0h960v704H0V0z" p-id="4696"></path><path d="M192 896H768v64H192zM448 640H512v256h-64z" p-id="4697"></path><path d="M479.232 561.604267l309.9904-348.330667-47.803733-42.5472-259.566934 291.669333L303.957333 240.008533 163.208533 438.6048l52.224 37.009067 91.6224-129.28z" p-id="4698"></path></svg>
-# replace default config
-# multipass: true
-# full: true
-plugins:
- # - name
- #
- # or:
- # - name: false
- # - name: true
- # - name:
- # param1: 1
- # param2: 2
-- removeAttrs:
- attrs:
- - 'fill'
- - 'fill-rule'
+# replace default config
+# multipass: true
+# full: true
+plugins:
+ # - name
+ #
+ # or:
+ # - name: false
+ # - name: true
+ # - name:
+ # param1: 1
+ # param2: 2
+- removeAttrs:
+ attrs:
+ - 'fill'
+ - 'fill-rule'
@@ -1,99 +1,99 @@
-@import './variables.scss';
-@mixin colorBtn($color) {
- background: $color;
- &:hover {
- color: $color;
- &:before,
- &:after {
-.blue-btn {
- @include colorBtn($blue)
-.light-blue-btn {
- @include colorBtn($light-blue)
-.red-btn {
- @include colorBtn($red)
-.pink-btn {
- @include colorBtn($pink)
-.green-btn {
- @include colorBtn($green)
-.tiffany-btn {
- @include colorBtn($tiffany)
-.yellow-btn {
- @include colorBtn($yellow)
-.pan-btn {
- font-size: 14px;
- color: #fff;
- padding: 14px 36px;
- border-radius: 8px;
- border: none;
- outline: none;
- transition: 600ms ease all;
- position: relative;
- display: inline-block;
- background: #fff;
- width: 100%;
- content: '';
- position: absolute;
- top: 0;
- right: 0;
- height: 2px;
- width: 0;
- transition: 400ms ease all;
- &::after {
- right: inherit;
- top: inherit;
- left: 0;
- bottom: 0;
-.custom-button {
- line-height: 1;
- white-space: nowrap;
- cursor: pointer;
- -webkit-appearance: none;
- text-align: center;
- box-sizing: border-box;
- outline: 0;
- margin: 0;
- padding: 10px 15px;
- border-radius: 4px;
+@import './variables.scss';
+@mixin colorBtn($color) {
+ background: $color;
+ &:hover {
+ color: $color;
+ &:before,
+ &:after {
+.blue-btn {
+ @include colorBtn($blue)
+.light-blue-btn {
+ @include colorBtn($light-blue)
+.red-btn {
+ @include colorBtn($red)
+.pink-btn {
+ @include colorBtn($pink)
+.green-btn {
+ @include colorBtn($green)
+.tiffany-btn {
+ @include colorBtn($tiffany)
+.yellow-btn {
+ @include colorBtn($yellow)
+.pan-btn {
+ font-size: 14px;
+ color: #fff;
+ padding: 14px 36px;
+ border-radius: 8px;
+ border: none;
+ outline: none;
+ transition: 600ms ease all;
+ position: relative;
+ display: inline-block;
+ background: #fff;
+ width: 100%;
+ content: '';
+ position: absolute;
+ top: 0;
+ right: 0;
+ height: 2px;
+ width: 0;
+ transition: 400ms ease all;
+ &::after {
+ right: inherit;
+ top: inherit;
+ left: 0;
+ bottom: 0;
+.custom-button {
+ line-height: 1;
+ white-space: nowrap;
+ cursor: pointer;
+ -webkit-appearance: none;
+ text-align: center;
+ box-sizing: border-box;
+ outline: 0;
+ margin: 0;
+ padding: 10px 15px;
+ border-radius: 4px;
@@ -1,276 +1,276 @@
- /**
- * 通用css样式布局处理
- * Copyright (c) 2019 fs
- */
- /** 基础通用 **/
-.pt5 {
- padding-top: 5px;
-.pr5 {
- padding-right: 5px;
-.pb5 {
- padding-bottom: 5px;
-.mt5 {
- margin-top: 5px;
-.mr5 {
- margin-right: 5px;
-.mb5 {
- margin-bottom: 5px;
-.mb8 {
- margin-bottom: 8px;
-.ml5 {
- margin-left: 5px;
-.mt10 {
- margin-top: 10px;
-.mr10 {
- margin-right: 10px;
-.mb10 {
- margin-bottom: 10px;
-.ml0 {
- margin-left: 10px;
-.mt20 {
- margin-top: 20px;
-.mr20 {
- margin-right: 20px;
-.mb20 {
- margin-bottom: 20px;
-.m20 {
- margin-left: 20px;
-.el-dialog:not(.is-fullscreen){
- margin-top: 6vh !important;
-.el-table {
- .el-table__header-wrapper, .el-table__fixed-header-wrapper {
- th {
- word-break: break-word;
- background-color: #f8f8f9;
- color: #515a6e;
- height: 40px;
- font-size: 13px;
- .el-table__body-wrapper {
- .el-button [class*="el-icon-"] + span {
- margin-left: 1px;
-/** 表单布局 **/
-.form-header {
- font-size:15px;
- color:#6379bb;
- border-bottom:1px solid #ddd;
- margin:8px 10px 25px 10px;
- padding-bottom:5px
-/** 表格布局 **/
-.pagination-container {
- height: 25px;
- margin-top: 15px;
- padding: 10px 20px !important;
-/* tree border */
-.tree-border {
- border: 1px solid #e5e6e7;
- background: #FFFFFF none;
- border-radius:4px;
-.pagination-container .el-pagination {
-.el-table .fixed-width .el-button--mini {
- color: #409EFF;
- padding-left: 0;
- padding-right: 0;
- width: inherit;
-.el-tree-node__content > .el-checkbox {
- margin-right: 8px;
-.list-group-striped > .list-group-item {
- border-left: 0;
- border-right: 0;
- border-radius: 0;
-.list-group {
- padding-left: 0px;
- list-style: none;
-.list-group-item {
- border-bottom: 1px solid #e7eaec;
- border-top: 1px solid #e7eaec;
- margin-bottom: -1px;
- padding: 11px 0px;
-.pull-right {
- float: right !important;
-.el-card__header {
- padding: 14px 15px 7px;
- min-height: 40px;
-.el-card__body {
- padding: 15px 20px 20px 20px;
-.card-box {
- padding-right: 15px;
- padding-left: 15px;
-/* button color */
-.el-button--cyan.is-active,
-.el-button--cyan:active {
-// background: #20B2AA;
-// border-color: #20B2AA;
-// color: #FFFFFF;
-.el-button--cyan:focus,
-.el-button--cyan:hover {
-// background: #48D1CC;
-// border-color: #48D1CC;
-.el-button--cyan {
-// background-color: #20B2AA;
-/* text color */
-.text-navy {
- // color: #1ab394;
-.text-primary {
- color: inherit;
-.text-success {
- color: #1c84c6;
-.text-info {
- color: #23c6c8;
-.text-warning {
- color: #f8ac59;
-.text-danger {
- color: #ed5565;
-.text-muted {
- color: #888888;
-/* image */
-.img-circle {
- border-radius: 50%;
-.img-lg {
- width: 120px;
- height: 120px;
-.avatar-upload-preview {
- top: 50%;
- transform: translate(50%, -50%);
- width: 180px;
- height: 180px;
- box-shadow: 0 0 4px #ccc;
- overflow: hidden;
-/* 拖拽列样式 */
-.sortable-ghost{
- opacity: .8;
- color: #fff!important;
- background: #42b983!important;
-.top-right-btn {
- float: right;
-/* submenu item */
-.el-menu--horizontal > .el-submenu .el-submenu__title {
- height: 50px !important;
- line-height: 50px !important;
-.el-drawer{
- overflow: scroll
-.avatar-uploader .el-upload {
- border: 1px dashed #d9d9d9;
- border-radius: 6px;
- .avatar-uploader .el-upload:hover {
- border-color: #409EFF;
- .avatar-uploader-icon {
- font-size: 28px;
- color: #8c939d;
- width: 110px;
- height: 110px;
- line-height: 110px;
- .avatar {
- display: block;
- .el-tabs__item:focus.is-active.is-focus:not(:active){
- box-shadow: 0 0 2px 2px #fff inset;
- border-radius: 3px;
+ /**
+ * 通用css样式布局处理
+ * Copyright (c) 2019 fs
+ */
+ /** 基础通用 **/
+.pt5 {
+ padding-top: 5px;
+.pr5 {
+ padding-right: 5px;
+.pb5 {
+ padding-bottom: 5px;
+.mt5 {
+ margin-top: 5px;
+.mr5 {
+ margin-right: 5px;
+.mb5 {
+ margin-bottom: 5px;
+.mb8 {
+ margin-bottom: 8px;
+.ml5 {
+ margin-left: 5px;
+.mt10 {
+ margin-top: 10px;
+.mr10 {
+ margin-right: 10px;
+.mb10 {
+ margin-bottom: 10px;
+.ml0 {
+ margin-left: 10px;
+.mt20 {
+ margin-top: 20px;
+.mr20 {
+ margin-right: 20px;
+.mb20 {
+ margin-bottom: 20px;
+.m20 {
+ margin-left: 20px;
+.el-dialog:not(.is-fullscreen){
+ margin-top: 6vh !important;
+.el-table {
+ .el-table__header-wrapper, .el-table__fixed-header-wrapper {
+ th {
+ word-break: break-word;
+ background-color: #f8f8f9;
+ color: #515a6e;
+ height: 40px;
+ font-size: 13px;
+ .el-table__body-wrapper {
+ .el-button [class*="el-icon-"] + span {
+ margin-left: 1px;
+/** 表单布局 **/
+.form-header {
+ font-size:15px;
+ color:#6379bb;
+ border-bottom:1px solid #ddd;
+ margin:8px 10px 25px 10px;
+ padding-bottom:5px
+/** 表格布局 **/
+.pagination-container {
+ height: 25px;
+ margin-top: 15px;
+ padding: 10px 20px !important;
+/* tree border */
+.tree-border {
+ border: 1px solid #e5e6e7;
+ background: #FFFFFF none;
+ border-radius:4px;
+.pagination-container .el-pagination {
+.el-table .fixed-width .el-button--mini {
+ color: #409EFF;
+ padding-left: 0;
+ padding-right: 0;
+ width: inherit;
+.el-tree-node__content > .el-checkbox {
+ margin-right: 8px;
+.list-group-striped > .list-group-item {
+ border-left: 0;
+ border-right: 0;
+ border-radius: 0;
+.list-group {
+ padding-left: 0px;
+ list-style: none;
+.list-group-item {
+ border-bottom: 1px solid #e7eaec;
+ border-top: 1px solid #e7eaec;
+ margin-bottom: -1px;
+ padding: 11px 0px;
+.pull-right {
+ float: right !important;
+.el-card__header {
+ padding: 14px 15px 7px;
+ min-height: 40px;
+.el-card__body {
+ padding: 15px 20px 20px 20px;
+.card-box {
+ padding-right: 15px;
+ padding-left: 15px;
+/* button color */
+.el-button--cyan.is-active,
+.el-button--cyan:active {
+// background: #20B2AA;
+// border-color: #20B2AA;
+// color: #FFFFFF;
+.el-button--cyan:focus,
+.el-button--cyan:hover {
+// background: #48D1CC;
+// border-color: #48D1CC;
+.el-button--cyan {
+// background-color: #20B2AA;
+/* text color */
+.text-navy {
+ // color: #1ab394;
+.text-primary {
+ color: inherit;
+.text-success {
+ color: #1c84c6;
+.text-info {
+ color: #23c6c8;
+.text-warning {
+ color: #f8ac59;
+.text-danger {
+ color: #ed5565;
+.text-muted {
+ color: #888888;
+/* image */
+.img-circle {
+ border-radius: 50%;
+.img-lg {
+ width: 120px;
+ height: 120px;
+.avatar-upload-preview {
+ top: 50%;
+ transform: translate(50%, -50%);
+ width: 180px;
+ height: 180px;
+ box-shadow: 0 0 4px #ccc;
+ overflow: hidden;
+/* 拖拽列样式 */
+.sortable-ghost{
+ opacity: .8;
+ color: #fff!important;
+ background: #42b983!important;
+.top-right-btn {
+ float: right;
+/* submenu item */
+.el-menu--horizontal > .el-submenu .el-submenu__title {
+ height: 50px !important;
+ line-height: 50px !important;
+.el-drawer{
+ overflow: scroll
+.avatar-uploader .el-upload {
+ border: 1px dashed #d9d9d9;
+ border-radius: 6px;
+ .avatar-uploader .el-upload:hover {
+ border-color: #409EFF;
+ .avatar-uploader-icon {
+ font-size: 28px;
+ color: #8c939d;
+ width: 110px;
+ height: 110px;
+ line-height: 110px;
+ .avatar {
+ display: block;
+ .el-tabs__item:focus.is-active.is-focus:not(:active){
+ box-shadow: 0 0 2px 2px #fff inset;
+ border-radius: 3px;
@@ -1,84 +1,84 @@
-// cover some element-ui styles
-.el-breadcrumb__inner,
-.el-breadcrumb__inner a {
- font-weight: 400 !important;
-.el-upload {
- input[type="file"] {
- display: none !important;
-.el-upload__input {
- display: none;
-.cell {
- .el-tag {
- margin-right: 0px;
-.small-padding {
- .cell {
- padding-left: 5px;
-.fixed-width {
- .el-button--mini {
- padding: 7px 10px;
- width: 60px;
-.status-col {
- padding: 0 10px;
-// to fixed https://github.com/ElemeFE/element/issues/2461
-.el-dialog {
- transform: none;
- margin: 0 auto;
-// refine element ui upload
-.upload-container {
- .el-upload {
- .el-upload-dragger {
- height: 200px;
-// dropdown
-.el-dropdown-menu {
- a {
- display: block
-// fix date-picker ui bug in filter-item
-.el-range-editor.el-input__inner {
- display: inline-flex !important;
-// to fix el-date-picker css style
-.el-range-separator {
- box-sizing: content-box;
+// cover some element-ui styles
+.el-breadcrumb__inner,
+.el-breadcrumb__inner a {
+ font-weight: 400 !important;
+.el-upload {
+ input[type="file"] {
+ display: none !important;
+.el-upload__input {
+ display: none;
+.cell {
+ .el-tag {
+ margin-right: 0px;
+.small-padding {
+ .cell {
+ padding-left: 5px;
+.fixed-width {
+ .el-button--mini {
+ padding: 7px 10px;
+ width: 60px;
+.status-col {
+ padding: 0 10px;
+// to fixed https://github.com/ElemeFE/element/issues/2461
+.el-dialog {
+ transform: none;
+ margin: 0 auto;
+// refine element ui upload
+.upload-container {
+ .el-upload {
+ .el-upload-dragger {
+ height: 200px;
+// dropdown
+.el-dropdown-menu {
+ a {
+ display: block
+// fix date-picker ui bug in filter-item
+.el-range-editor.el-input__inner {
+ display: inline-flex !important;
+// to fix el-date-picker css style
+.el-range-separator {
+ box-sizing: content-box;
-/**
-* I think element-ui's default theme color is too light for long-term use.
-* So I modified the default color and you can modify it to your liking.
-**/
-/* theme color */
-$--color-primary: #13c2c2;
-$--color-success: #13ce66;
-$--color-warning: #ffba00;
-$--color-danger: #ff4949;
-// $--color-info: #1E1E1E;
-$--button-font-weight: 400;
-// $--color-text-regular: #1f2d3d;
-$--border-color-light: #dfe4ed;
-$--border-color-lighter: #e6ebf5;
-$--table-border:1px solid#dfe6ec;
-/* icon font path, required */
-$--font-path: '~element-ui/lib/theme-chalk/fonts';
-@import "~element-ui/packages/theme-chalk/src/index";
-// the :export directive is the magic sauce for webpack
-// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
-:export {
- theme: $--color-primary;
+/**
+* I think element-ui's default theme color is too light for long-term use.
+* So I modified the default color and you can modify it to your liking.
+**/
+/* theme color */
+$--color-primary: #13c2c2;
+$--color-success: #13ce66;
+$--color-warning: #ffba00;
+$--color-danger: #ff4949;
+// $--color-info: #1E1E1E;
+$--button-font-weight: 400;
+// $--color-text-regular: #1f2d3d;
+$--border-color-light: #dfe4ed;
+$--border-color-lighter: #e6ebf5;
+$--table-border:1px solid#dfe6ec;
+/* icon font path, required */
+$--font-path: '~element-ui/lib/theme-chalk/fonts';
+@import "~element-ui/packages/theme-chalk/src/index";
+// the :export directive is the magic sauce for webpack
+// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
+:export {
+ theme: $--color-primary;
@@ -1,373 +1,373 @@
-@import './mixin.scss';
-@import './transition.scss';
-@import './element-ui.scss';
-@import './sidebar.scss';
-@import './btn.scss';
-body {
- height: 100%;
- -moz-osx-font-smoothing: grayscale;
- -webkit-font-smoothing: antialiased;
- text-rendering: optimizeLegibility;
- font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
-label {
- font-weight: 700;
-html {
-#app {
-*,
-*:before,
-*:after {
- box-sizing: inherit;
-.no-padding {
- padding: 0px !important;
-.padding-content {
- padding: 4px 0;
-a:focus,
-a:active {
-a,
-a:hover {
- text-decoration: none;
-div:focus {
-.fr {
-.fl {
- float: left;
-.pr-5 {
-.pl-5 {
-.block {
-.pointer {
-.inlineBlock {
-.clearfix {
- visibility: hidden;
- font-size: 0;
- content: " ";
- clear: both;
- height: 0;
-aside {
- //background: #eef1f6;
- //padding: 8px 24px;
- border-radius: 2px;
- line-height: 32px;
- font-size: 16px;
- font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
- color: #2c3e50;
- color: #337ab7;
- color: rgb(32, 160, 255);
-.app-main{
- background-color: #f0f2f5;
-//main-container全局样式
-.app-container {
- margin: 15px;
- padding: 15px;
- background-color: #fff;
-.components-container {
- margin: 20px 20px;
-.text-center {
- text-align: center
-.sub-navbar {
- height: 50px;
- line-height: 50px;
- text-align: right;
- padding-right: 20px;
- transition: 600ms ease position;
- background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
- .subtitle {
- font-size: 20px;
- &.draft {
- background: #d0d0d0;
- &.deleted {
-.link-type,
-.link-type:focus {
-.filter-container {
- .filter-item {
- vertical-align: middle;
-//refine vue-multiselect plugin
-.multiselect {
- line-height: 16px;
-.multiselect--active {
- z-index: 1000 !important;
- left: 50%;
- margin: 0 !important;
- transform: translate(-50%, -50%);
- max-height: calc(100% - 30px);
- max-width: calc(100% - 30px);
- display: flex;
- flex-direction: column;
- .el-dialog__body {
- padding: 5px 20px;
- overflow: auto;
- .el-dialog-body-custom-height {
- height: calc(100vh - 214px);
-.acea-row {
- display: -webkit-box;
- display: -moz-box;
- display: -webkit-flex;
- display: -ms-flexbox;
- -webkit-box-lines: multiple;
- -moz-box-lines: multiple;
- -o-box-lines: multiple;
- -webkit-flex-wrap: wrap;
- -ms-flex-wrap: wrap;
- flex-wrap: wrap;
- /* 辅助类 */
-.acea-row.row-middle {
- -webkit-box-align: center;
- -moz-box-align: center;
- -o-box-align: center;
- -ms-flex-align: center;
- -webkit-align-items: center;
- align-items: center;
-.acea-row.row-top {
- -webkit-box-align: start;
- -moz-box-align: start;
- -o-box-align: start;
- -ms-flex-align: start;
- -webkit-align-items: flex-start;
- align-items: flex-start;
-.acea-row.row-bottom {
- -webkit-box-align: end;
- -moz-box-align: end;
- -o-box-align: end;
- -ms-flex-align: end;
- -webkit-align-items: flex-end;
- align-items: flex-end;
-.acea-row.row-center {
- -webkit-box-pack: center;
- -moz-box-pack: center;
- -o-box-pack: center;
- -ms-flex-pack: center;
- -webkit-justify-content: center;
- justify-content: center;
-.acea-row.row-right {
- -webkit-box-pack: end;
- -moz-box-pack: end;
- -o-box-pack: end;
- -ms-flex-pack: end;
- -webkit-justify-content: flex-end;
- justify-content: flex-end;
-.acea-row.row-left {
- -webkit-box-pack: start;
- -moz-box-pack: start;
- -o-box-pack: start;
- -ms-flex-pack: start;
- -webkit-justify-content: flex-start;
- justify-content: flex-start;
-.acea-row.row-between {
- -webkit-box-pack: justify;
- -moz-box-pack: justify;
- -o-box-pack: justify;
- -ms-flex-pack: justify;
- -webkit-justify-content: space-between;
- justify-content: space-between;
-.acea-row.row-around {
- justify-content: space-around;
- -webkit-justify-content: space-around;
-.acea-row.row-column-around {
- -webkit-flex-direction: column;
- -ms-flex-direction: column;
-.acea-row.row-column {
- -webkit-box-orient: vertical;
- -moz-box-orient: vertical;
- -o-box-orient: vertical;
-.acea-row.row-column-between {
-/* 上下左右垂直居中 */
-.acea-row.row-center-wrapper {
-/* 上下两边居中对齐 */
-.acea-row.row-between-wrapper {
-.el-drawer__header{
-.el-descriptions-item__label.is-bordered-label{
- font-weight: normal;
+@import './mixin.scss';
+@import './transition.scss';
+@import './element-ui.scss';
+@import './sidebar.scss';
+@import './btn.scss';
+body {
+ height: 100%;
+ -moz-osx-font-smoothing: grayscale;
+ -webkit-font-smoothing: antialiased;
+ text-rendering: optimizeLegibility;
+ font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
+label {
+ font-weight: 700;
+html {
+#app {
+*,
+*:before,
+*:after {
+ box-sizing: inherit;
+.no-padding {
+ padding: 0px !important;
+.padding-content {
+ padding: 4px 0;
+a:focus,
+a:active {
+a,
+a:hover {
+ text-decoration: none;
+div:focus {
+.fr {
+.fl {
+ float: left;
+.pr-5 {
+.pl-5 {
+.block {
+.pointer {
+.inlineBlock {
+.clearfix {
+ visibility: hidden;
+ font-size: 0;
+ content: " ";
+ clear: both;
+ height: 0;
+aside {
+ //background: #eef1f6;
+ //padding: 8px 24px;
+ border-radius: 2px;
+ line-height: 32px;
+ font-size: 16px;
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
+ color: #2c3e50;
+ color: #337ab7;
+ color: rgb(32, 160, 255);
+.app-main{
+ background-color: #f0f2f5;
+//main-container全局样式
+.app-container {
+ margin: 15px;
+ padding: 15px;
+ background-color: #fff;
+.components-container {
+ margin: 20px 20px;
+.text-center {
+ text-align: center
+.sub-navbar {
+ height: 50px;
+ line-height: 50px;
+ text-align: right;
+ padding-right: 20px;
+ transition: 600ms ease position;
+ background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%);
+ .subtitle {
+ font-size: 20px;
+ &.draft {
+ background: #d0d0d0;
+ &.deleted {
+.link-type,
+.link-type:focus {
+.filter-container {
+ .filter-item {
+ vertical-align: middle;
+//refine vue-multiselect plugin
+.multiselect {
+ line-height: 16px;
+.multiselect--active {
+ z-index: 1000 !important;
+ left: 50%;
+ margin: 0 !important;
+ transform: translate(-50%, -50%);
+ max-height: calc(100% - 30px);
+ max-width: calc(100% - 30px);
+ display: flex;
+ flex-direction: column;
+ .el-dialog__body {
+ padding: 5px 20px;
+ overflow: auto;
+ .el-dialog-body-custom-height {
+ height: calc(100vh - 214px);
+.acea-row {
+ display: -webkit-box;
+ display: -moz-box;
+ display: -webkit-flex;
+ display: -ms-flexbox;
+ -webkit-box-lines: multiple;
+ -moz-box-lines: multiple;
+ -o-box-lines: multiple;
+ -webkit-flex-wrap: wrap;
+ -ms-flex-wrap: wrap;
+ flex-wrap: wrap;
+ /* 辅助类 */
+.acea-row.row-middle {
+ -webkit-box-align: center;
+ -moz-box-align: center;
+ -o-box-align: center;
+ -ms-flex-align: center;
+ -webkit-align-items: center;
+ align-items: center;
+.acea-row.row-top {
+ -webkit-box-align: start;
+ -moz-box-align: start;
+ -o-box-align: start;
+ -ms-flex-align: start;
+ -webkit-align-items: flex-start;
+ align-items: flex-start;
+.acea-row.row-bottom {
+ -webkit-box-align: end;
+ -moz-box-align: end;
+ -o-box-align: end;
+ -ms-flex-align: end;
+ -webkit-align-items: flex-end;
+ align-items: flex-end;
+.acea-row.row-center {
+ -webkit-box-pack: center;
+ -moz-box-pack: center;
+ -o-box-pack: center;
+ -ms-flex-pack: center;
+ -webkit-justify-content: center;
+ justify-content: center;
+.acea-row.row-right {
+ -webkit-box-pack: end;
+ -moz-box-pack: end;
+ -o-box-pack: end;
+ -ms-flex-pack: end;
+ -webkit-justify-content: flex-end;
+ justify-content: flex-end;
+.acea-row.row-left {
+ -webkit-box-pack: start;
+ -moz-box-pack: start;
+ -o-box-pack: start;
+ -ms-flex-pack: start;
+ -webkit-justify-content: flex-start;
+ justify-content: flex-start;
+.acea-row.row-between {
+ -webkit-box-pack: justify;
+ -moz-box-pack: justify;
+ -o-box-pack: justify;
+ -ms-flex-pack: justify;
+ -webkit-justify-content: space-between;
+ justify-content: space-between;
+.acea-row.row-around {
+ justify-content: space-around;
+ -webkit-justify-content: space-around;
+.acea-row.row-column-around {
+ -webkit-flex-direction: column;
+ -ms-flex-direction: column;
+.acea-row.row-column {
+ -webkit-box-orient: vertical;
+ -moz-box-orient: vertical;
+ -o-box-orient: vertical;
+.acea-row.row-column-between {
+/* 上下左右垂直居中 */
+.acea-row.row-center-wrapper {
+/* 上下两边居中对齐 */
+.acea-row.row-between-wrapper {
+.el-drawer__header{
+.el-descriptions-item__label.is-bordered-label{
+ font-weight: normal;
@@ -1,66 +1,66 @@
-@mixin clearfix {
- content: "";
- display: table;
-@mixin scrollBar {
- &::-webkit-scrollbar-track-piece {
- background: #d3dce6;
- &::-webkit-scrollbar {
- width: 6px;
- &::-webkit-scrollbar-thumb {
- background: #99a9bf;
- border-radius: 20px;
-@mixin relative {
-@mixin pct($pct) {
- width: #{$pct};
-@mixin triangle($width, $height, $color, $direction) {
- $width: $width/2;
- $color-border-style: $height solid $color;
- $transparent-border-style: $width solid transparent;
- @if $direction==up {
- border-bottom: $color-border-style;
- border-left: $transparent-border-style;
- border-right: $transparent-border-style;
- @else if $direction==right {
- border-left: $color-border-style;
- border-top: $transparent-border-style;
- border-bottom: $transparent-border-style;
- @else if $direction==down {
- border-top: $color-border-style;
- @else if $direction==left {
- border-right: $color-border-style;
+@mixin clearfix {
+ content: "";
+ display: table;
+@mixin scrollBar {
+ &::-webkit-scrollbar-track-piece {
+ background: #d3dce6;
+ &::-webkit-scrollbar {
+ width: 6px;
+ &::-webkit-scrollbar-thumb {
+ background: #99a9bf;
+ border-radius: 20px;
+@mixin relative {
+@mixin pct($pct) {
+ width: #{$pct};
+@mixin triangle($width, $height, $color, $direction) {
+ $width: $width/2;
+ $color-border-style: $height solid $color;
+ $transparent-border-style: $width solid transparent;
+ @if $direction==up {
+ border-bottom: $color-border-style;
+ border-left: $transparent-border-style;
+ border-right: $transparent-border-style;
+ @else if $direction==right {
+ border-left: $color-border-style;
+ border-top: $transparent-border-style;
+ border-bottom: $transparent-border-style;
+ @else if $direction==down {
+ border-top: $color-border-style;
+ @else if $direction==left {
+ border-right: $color-border-style;
@@ -1,215 +1,215 @@
- .main-container {
- min-height: 100%;
- transition: margin-left .28s;
- margin-left: $sideBarWidth;
- .sidebar-container {
- transition: width 0.28s;
- width: $sideBarWidth !important;
- background-color: $menuBg;
- position: fixed;
- font-size: 0px;
- z-index: 1001;
- // reset element-ui css
- .horizontal-collapse-transition {
- transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
- .scrollbar-wrapper {
- overflow-x: hidden !important;
- .el-scrollbar__bar.is-vertical {
- right: 0px;
- .el-scrollbar {
- &.has-logo {
- height: calc(100% - 50px);
- .is-horizontal {
- .svg-icon {
- margin-right: 16px;
- .el-menu {
- width: 100% !important;
- .el-menu-item, .el-submenu__title {
- overflow: hidden !important;
- text-overflow: ellipsis !important;
- white-space: nowrap !important;
- // menu hover
- .submenu-title-noDropdown,
- .el-submenu__title {
- background-color: $menuHover !important;
- .is-active>.el-submenu__title {
- color: $subMenuActiveText !important;
- & .nest-menu .el-submenu>.el-submenu__title,
- & .el-submenu .el-menu-item {
- min-width: $sideBarWidth !important;
- background-color: $subMenuBg !important;
- background-color: $subMenuHover !important;
- .hideSidebar {
- width: 54px !important;
- margin-left: 54px;
- .submenu-title-noDropdown {
- padding: 0 !important;
- .el-tooltip {
- .el-submenu {
- &>.el-submenu__title {
- .el-submenu__icon-arrow {
- .el-menu--collapse {
- &>span {
- .el-menu--collapse .el-menu .el-submenu {
- // mobile responsive
- .mobile {
- margin-left: 0px;
- transition: transform .28s;
- &.hideSidebar {
- pointer-events: none;
- transition-duration: 0.3s;
- transform: translate3d(-$sideBarWidth, 0, 0);
- .withoutAnimation {
- .main-container,
- transition: none;
-// when menu collapsed
-.el-menu--vertical {
- &>.el-menu {
- .nest-menu .el-submenu>.el-submenu__title,
- .el-menu-item {
- // you can use $subMenuHover
- // the scroll bar appears when the subMenu is too long
- >.el-menu--popup {
- max-height: 100vh;
- overflow-y: auto;
+ .main-container {
+ min-height: 100%;
+ transition: margin-left .28s;
+ margin-left: $sideBarWidth;
+ .sidebar-container {
+ transition: width 0.28s;
+ width: $sideBarWidth !important;
+ background-color: $menuBg;
+ position: fixed;
+ font-size: 0px;
+ z-index: 1001;
+ // reset element-ui css
+ .horizontal-collapse-transition {
+ transition: 0s width ease-in-out, 0s padding-left ease-in-out, 0s padding-right ease-in-out;
+ .scrollbar-wrapper {
+ overflow-x: hidden !important;
+ .el-scrollbar__bar.is-vertical {
+ right: 0px;
+ .el-scrollbar {
+ &.has-logo {
+ height: calc(100% - 50px);
+ .is-horizontal {
+ .svg-icon {
+ margin-right: 16px;
+ .el-menu {
+ width: 100% !important;
+ .el-menu-item, .el-submenu__title {
+ overflow: hidden !important;
+ text-overflow: ellipsis !important;
+ white-space: nowrap !important;
+ // menu hover
+ .submenu-title-noDropdown,
+ .el-submenu__title {
+ background-color: $menuHover !important;
+ .is-active>.el-submenu__title {
+ color: $subMenuActiveText !important;
+ & .nest-menu .el-submenu>.el-submenu__title,
+ & .el-submenu .el-menu-item {
+ min-width: $sideBarWidth !important;
+ background-color: $subMenuBg !important;
+ background-color: $subMenuHover !important;
+ .hideSidebar {
+ width: 54px !important;
+ margin-left: 54px;
+ .submenu-title-noDropdown {
+ padding: 0 !important;
+ .el-tooltip {
+ .el-submenu {
+ &>.el-submenu__title {
+ .el-submenu__icon-arrow {
+ .el-menu--collapse {
+ &>span {
+ .el-menu--collapse .el-menu .el-submenu {
+ // mobile responsive
+ .mobile {
+ margin-left: 0px;
+ transition: transform .28s;
+ &.hideSidebar {
+ pointer-events: none;
+ transition-duration: 0.3s;
+ transform: translate3d(-$sideBarWidth, 0, 0);
+ .withoutAnimation {
+ .main-container,
+ transition: none;
+// when menu collapsed
+.el-menu--vertical {
+ &>.el-menu {
+ .nest-menu .el-submenu>.el-submenu__title,
+ .el-menu-item {
+ // you can use $subMenuHover
+ // the scroll bar appears when the subMenu is too long
+ >.el-menu--popup {
+ max-height: 100vh;
+ overflow-y: auto;
@@ -1,48 +1,48 @@
-// global transition css
-/* fade */
-.fade-enter-active,
-.fade-leave-active {
- transition: opacity 0.28s;
-.fade-enter,
- opacity: 0;
-/* fade-transform */
-.fade-transform-leave-active,
-.fade-transform-enter-active {
- transition: all .5s;
-.fade-transform-enter {
- transform: translateX(-30px);
-.fade-transform-leave-to {
- transform: translateX(30px);
-/* breadcrumb transition */
-.breadcrumb-enter-active,
-.breadcrumb-leave-active {
-.breadcrumb-enter,
- transform: translateX(20px);
-.breadcrumb-move {
+// global transition css
+/* fade */
+.fade-enter-active,
+.fade-leave-active {
+ transition: opacity 0.28s;
+.fade-enter,
+ opacity: 0;
+/* fade-transform */
+.fade-transform-leave-active,
+.fade-transform-enter-active {
+ transition: all .5s;
+.fade-transform-enter {
+ transform: translateX(-30px);
+.fade-transform-leave-to {
+ transform: translateX(30px);
+/* breadcrumb transition */
+.breadcrumb-enter-active,
+.breadcrumb-leave-active {
+.breadcrumb-enter,
+ transform: translateX(20px);
+.breadcrumb-move {
-// base color
-$blue:#324157;
-$light-blue:#3A71A8;
-$red:#C03639;
-$pink: #E65D6E;
-$green: #30B08F;
-$tiffany: #4AB7BD;
-$yellow:#FEC171;
-$panGreen: #30B08F;
-// sidebar
-$menuText:#bfcbd9;
-$menuActiveText:#409EFF;
-$subMenuActiveText:#f4f4f5; // https://github.com/ElemeFE/element/issues/12951
-$menuBg:#304156;
-$menuHover:#263445;
-$subMenuBg:#1f2d3d;
-$subMenuHover:#001528;
-$sideBarWidth: 200px;
- menuText: $menuText;
- menuActiveText: $menuActiveText;
- subMenuActiveText: $subMenuActiveText;
- menuBg: $menuBg;
- menuHover: $menuHover;
- subMenuBg: $subMenuBg;
- subMenuHover: $subMenuHover;
- sideBarWidth: $sideBarWidth;
+// base color
+$blue:#324157;
+$light-blue:#3A71A8;
+$red:#C03639;
+$pink: #E65D6E;
+$green: #30B08F;
+$tiffany: #4AB7BD;
+$yellow:#FEC171;
+$panGreen: #30B08F;
+// sidebar
+$menuText:#bfcbd9;
+$menuActiveText:#409EFF;
+$subMenuActiveText:#f4f4f5; // https://github.com/ElemeFE/element/issues/12951
+$menuBg:#304156;
+$menuHover:#263445;
+$subMenuBg:#1f2d3d;
+$subMenuHover:#001528;
+$sideBarWidth: 200px;
+ menuText: $menuText;
+ menuActiveText: $menuActiveText;
+ subMenuActiveText: $subMenuActiveText;
+ menuBg: $menuBg;
+ menuHover: $menuHover;
+ subMenuBg: $subMenuBg;
+ subMenuHover: $subMenuHover;
+ sideBarWidth: $sideBarWidth;
@@ -1,74 +1,74 @@
- <el-breadcrumb class="app-breadcrumb" separator="/">
- <transition-group name="breadcrumb">
- <el-breadcrumb-item v-for="(item,index) in levelList" :key="item.path">
- <span v-if="item.redirect==='noRedirect'||index==levelList.length-1" class="no-redirect">{{ item.meta.title }}</span>
- <a v-else @click.prevent="handleLink(item)">{{ item.meta.title }}</a>
- </el-breadcrumb-item>
- </transition-group>
- </el-breadcrumb>
- data() {
- return {
- levelList: null
- },
- watch: {
- $route(route) {
- // if you go to the redirect page, do not update the breadcrumbs
- if (route.path.startsWith('/redirect/')) {
- return
- this.getBreadcrumb()
- created() {
- methods: {
- getBreadcrumb() {
- // only show routes with meta.title
- let matched = this.$route.matched.filter(item => item.meta && item.meta.title)
- const first = matched[0]
- if (!this.isDashboard(first)) {
- matched = [{ path: '/index', meta: { title: '首页' }}].concat(matched)
- this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)
- isDashboard(route) {
- const name = route && route.name
- if (!name) {
- return false
- return name.trim() === '首页'
- handleLink(item) {
- const { redirect, path } = item
- if (redirect) {
- this.$router.push(redirect)
- this.$router.push(path)
-<style lang="scss" scoped>
-.app-breadcrumb.el-breadcrumb {
- margin-left: 8px;
- .no-redirect {
- color: #97a8be;
- cursor: text;
-</style>
+ <el-breadcrumb class="app-breadcrumb" separator="/">
+ <transition-group name="breadcrumb">
+ <el-breadcrumb-item v-for="(item,index) in levelList" :key="item.path">
+ <span v-if="item.redirect==='noRedirect'||index==levelList.length-1" class="no-redirect">{{ item.meta.title }}</span>
+ <a v-else @click.prevent="handleLink(item)">{{ item.meta.title }}</a>
+ </el-breadcrumb-item>
+ </transition-group>
+ </el-breadcrumb>
+ data() {
+ return {
+ levelList: null
+ },
+ watch: {
+ $route(route) {
+ // if you go to the redirect page, do not update the breadcrumbs
+ if (route.path.startsWith('/redirect/')) {
+ return
+ this.getBreadcrumb()
+ created() {
+ methods: {
+ getBreadcrumb() {
+ // only show routes with meta.title
+ let matched = this.$route.matched.filter(item => item.meta && item.meta.title)
+ const first = matched[0]
+ if (!this.isDashboard(first)) {
+ matched = [{ path: '/index', meta: { title: '首页' }}].concat(matched)
+ this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)
+ isDashboard(route) {
+ const name = route && route.name
+ if (!name) {
+ return false
+ return name.trim() === '首页'
+ handleLink(item) {
+ const { redirect, path } = item
+ if (redirect) {
+ this.$router.push(redirect)
+ this.$router.push(path)
+<style lang="scss" scoped>
+.app-breadcrumb.el-breadcrumb {
+ margin-left: 8px;
+ .no-redirect {
+ color: #97a8be;
+ cursor: text;
+</style>
@@ -1,195 +1,195 @@
- <div class="editor" ref="editor" :style="styles"></div>
-import Quill from "quill";
-import "quill/dist/quill.core.css";
-import "quill/dist/quill.snow.css";
-import "quill/dist/quill.bubble.css";
- name: "Editor",
- props: {
- /* 编辑器的内容 */
- value: {
- type: String,
- default: "",
- /* 高度 */
- height: {
- type: Number,
- default: null,
- /* 最小高度 */
- minHeight: {
- Quill: null,
- currentValue: "",
- options: {
- theme: "snow",
- bounds: document.body,
- debug: "warn",
- modules: {
- // 工具栏配置
- toolbar: [
- ["bold", "italic", "underline", "strike"], // 加粗 斜体 下划线 删除线
- ["blockquote", "code-block"], // 引用 代码块
- [{ list: "ordered" }, { list: "bullet" }], // 有序、无序列表
- [{ indent: "-1" }, { indent: "+1" }], // 缩进
- [{ size: ["small", false, "large", "huge"] }], // 字体大小
- [{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题
- [{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
- [{ align: [] }], // 对齐方式
- ["clean"], // 清除文本格式
- ["image"] // 链接、图片、视频
- ],
- placeholder: "请输入内容",
- readOnly: false,
- };
- computed: {
- styles() {
- let style = {};
- if (this.minHeight) {
- style.minHeight = `${this.minHeight}px`;
- if (this.height) {
- style.height = `${this.height}px`;
- return style;
- handler(val) {
- if (val !== this.currentValue) {
- this.currentValue = val === null ? "" : val;
- if (this.Quill) {
- this.Quill.pasteHTML(this.currentValue);
- immediate: true,
- mounted() {
- this.init();
- beforeDestroy() {
- this.Quill = null;
- init() {
- const editor = this.$refs.editor;
- this.Quill = new Quill(editor, this.options);
- this.Quill.on("text-change", (delta, oldDelta, source) => {
- const html = this.$refs.editor.children[0].innerHTML;
- const text = this.Quill.getText();
- const quill = this.Quill;
- this.currentValue = html;
- this.$emit("input", html);
- this.$emit("on-change", { html, text, quill });
- });
- this.$emit("on-text-change", delta, oldDelta, source);
- this.Quill.on("selection-change", (range, oldRange, source) => {
- this.$emit("on-selection-change", range, oldRange, source);
- this.Quill.on("editor-change", (eventName, ...args) => {
- this.$emit("on-editor-change", eventName, ...args);
-};
-<style>
-.editor, .ql-toolbar {
- white-space: pre-wrap!important;
- line-height: normal !important;
-.quill-img {
-.ql-snow .ql-tooltip[data-mode="link"]::before {
- content: "请输入链接地址:";
-.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
- border-right: 0px;
- content: "保存";
- padding-right: 0px;
-.ql-snow .ql-tooltip[data-mode="video"]::before {
- content: "请输入视频地址:";
-.ql-snow .ql-picker.ql-size .ql-picker-label::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item::before {
- content: "14px";
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
- content: "10px";
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
- content: "18px";
-.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before,
-.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
- content: "32px";
-.ql-snow .ql-picker.ql-header .ql-picker-label::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item::before {
- content: "文本";
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
- content: "标题1";
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
- content: "标题2";
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
- content: "标题3";
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
- content: "标题4";
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
- content: "标题5";
-.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
-.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
- content: "标题6";
-.ql-snow .ql-picker.ql-font .ql-picker-label::before,
-.ql-snow .ql-picker.ql-font .ql-picker-item::before {
- content: "标准字体";
-.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before,
-.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before {
- content: "衬线字体";
-.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before,
-.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
- content: "等宽字体";
+ <div class="editor" ref="editor" :style="styles"></div>
+import Quill from "quill";
+import "quill/dist/quill.core.css";
+import "quill/dist/quill.snow.css";
+import "quill/dist/quill.bubble.css";
+ name: "Editor",
+ props: {
+ /* 编辑器的内容 */
+ value: {
+ type: String,
+ default: "",
+ /* 高度 */
+ height: {
+ type: Number,
+ default: null,
+ /* 最小高度 */
+ minHeight: {
+ Quill: null,
+ currentValue: "",
+ options: {
+ theme: "snow",
+ bounds: document.body,
+ debug: "warn",
+ modules: {
+ // 工具栏配置
+ toolbar: [
+ ["bold", "italic", "underline", "strike"], // 加粗 斜体 下划线 删除线
+ ["blockquote", "code-block"], // 引用 代码块
+ [{ list: "ordered" }, { list: "bullet" }], // 有序、无序列表
+ [{ indent: "-1" }, { indent: "+1" }], // 缩进
+ [{ size: ["small", false, "large", "huge"] }], // 字体大小
+ [{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题
+ [{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
+ [{ align: [] }], // 对齐方式
+ ["clean"], // 清除文本格式
+ ["image"] // 链接、图片、视频
+ ],
+ placeholder: "请输入内容",
+ readOnly: false,
+ };
+ computed: {
+ styles() {
+ let style = {};
+ if (this.minHeight) {
+ style.minHeight = `${this.minHeight}px`;
+ if (this.height) {
+ style.height = `${this.height}px`;
+ return style;
+ handler(val) {
+ if (val !== this.currentValue) {
+ this.currentValue = val === null ? "" : val;
+ if (this.Quill) {
+ this.Quill.pasteHTML(this.currentValue);
+ immediate: true,
+ mounted() {
+ this.init();
+ beforeDestroy() {
+ this.Quill = null;
+ init() {
+ const editor = this.$refs.editor;
+ this.Quill = new Quill(editor, this.options);
+ this.Quill.on("text-change", (delta, oldDelta, source) => {
+ const html = this.$refs.editor.children[0].innerHTML;
+ const text = this.Quill.getText();
+ const quill = this.Quill;
+ this.currentValue = html;
+ this.$emit("input", html);
+ this.$emit("on-change", { html, text, quill });
+ });
+ this.$emit("on-text-change", delta, oldDelta, source);
+ this.Quill.on("selection-change", (range, oldRange, source) => {
+ this.$emit("on-selection-change", range, oldRange, source);
+ this.Quill.on("editor-change", (eventName, ...args) => {
+ this.$emit("on-editor-change", eventName, ...args);
+};
+<style>
+.editor, .ql-toolbar {
+ white-space: pre-wrap!important;
+ line-height: normal !important;
+.quill-img {
+.ql-snow .ql-tooltip[data-mode="link"]::before {
+ content: "请输入链接地址:";
+.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
+ border-right: 0px;
+ content: "保存";
+ padding-right: 0px;
+.ql-snow .ql-tooltip[data-mode="video"]::before {
+ content: "请输入视频地址:";
+.ql-snow .ql-picker.ql-size .ql-picker-label::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item::before {
+ content: "14px";
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
+ content: "10px";
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
+ content: "18px";
+.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before,
+.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
+ content: "32px";
+.ql-snow .ql-picker.ql-header .ql-picker-label::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item::before {
+ content: "文本";
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
+ content: "标题1";
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
+ content: "标题2";
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
+ content: "标题3";
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
+ content: "标题4";
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
+ content: "标题5";
+.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
+.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
+ content: "标题6";
+.ql-snow .ql-picker.ql-font .ql-picker-label::before,
+.ql-snow .ql-picker.ql-font .ql-picker-item::before {
+ content: "标准字体";
+.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before,
+.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before {
+ content: "衬线字体";
+.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before,
+.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
+ content: "等宽字体";
</style>
@@ -1,154 +1,154 @@
- <div>
- <div ref='editor1' class="myedit"></div>
- import E from 'wangeditor'
- export default {
- name: 'editoritem',
- index:0,
- uploadUrl:process.env.VUE_APP_BASE_API+"/common/uploadWang",
- editor: null
- // 销毁编辑器
- if(this.editor!=null){
- this.editor.destroy()
- this.editor = null
- methods:{
- initEditor(){
- var that=this;
- if(this.editor==null){
- //创建编辑器
- this.editor = new E(that.$refs.editor1 )
- this.editor.config.uploadImgServer = this.uploadUrl;
- this.editor.config.uploadImgMaxLength = 5
- this.editor.config.uploadImgMaxSize = 2 * 1024 * 1024 // 2M
- this.editor.config.uploadImgAccept = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp']
- this.editor.config.uploadFileName = 'file'
- this.editor.config.zIndex = 1
- this.editor.config.menus = [
- 'head',
- 'bold',
- 'fontSize',
- 'fontName',
- 'italic',
- 'underline',
- 'strikeThrough',
- 'indent',
- 'lineHeight',
- 'foreColor',
- 'backColor',
- 'link',
- 'list',
- 'todo',
- 'justify',
- 'quote',
- 'emoticon',
- 'image',
- // 'video',
- 'table',
- 'code',
- 'splitLine',
- 'undo',
- 'redo',
- ]
- this.editor.config.onchange = function (newHtml) {
- console.log(newHtml)
- that.$emit("on-text-change", newHtml);
- this.editor.config.pasteFilterStyle = false
- // 配置触发 onchange 的时间频率,默认为 200ms
- this.editor.config.onchangeTimeout = 500 // 修改为 500ms
- this.editor.config.uploadImgHooks = {
- // 上传图片之前
- before: function(xhr) {
- //console.log(xhr)
- // 图片上传并返回了结果,图片插入已成功
- success: function(xhr) {
- //console.log('success', xhr)
- // 图片上传并返回了结果,但图片插入时出错了
- fail: function(xhr, editor, resData) {
- console.log('fail', resData)
- // 上传图片出错,一般为 http 请求的错误
- error: function(xhr, editor, resData) {
- console.log('error', xhr, resData)
- // 上传图片超时
- timeout: function(xhr) {
- //console.log('timeout')
- // 图片上传并返回了结果,想要自己把图片插入到编辑器中
- // 例如服务器端返回的不是 { errno: 0, data: [...] } 这种格式,可使用 customInsert
- customInsert: function(insertImg, result, editor) {
- console.log(result);
- // 图片上传并返回结果,自定义插入图片的事件(而不是编辑器自动插入图片!!!)
- // insertImg 是插入图片的函数,editor 是编辑器对象,result 是服务器端返回的结果
- // 举例:假如上传图片成功后,服务器端返回的是 {url:'....'} 这种格式,即可这样插入图片:
- // var url = result.data[0].url
- if(result.data!=null){
- for(var i=0;i<result.data.length;i++){
- var url = result.data[i].url
- insertImg(url)
- console.log(url);
- // result 必须是一个 JSON 格式字符串!!!否则报错
- this.editor.create()
- this.editor.txt.html("");
- setText(text){
- this.initEditor()
- if(text==undefined||text==null){
- else{
- this.editor.txt.html(text);
-<style scoped>
-.toolbar {
- border: 1px solid #ccc;
-.myedit {
- min-height: 300px;
- z-index: 1 !important;
-.w-e-toolbar{
-.w-e-text-container{
+ <div>
+ <div ref='editor1' class="myedit"></div>
+ import E from 'wangeditor'
+ export default {
+ name: 'editoritem',
+ index:0,
+ uploadUrl:process.env.VUE_APP_BASE_API+"/common/uploadWang",
+ editor: null
+ // 销毁编辑器
+ if(this.editor!=null){
+ this.editor.destroy()
+ this.editor = null
+ methods:{
+ initEditor(){
+ var that=this;
+ if(this.editor==null){
+ //创建编辑器
+ this.editor = new E(that.$refs.editor1 )
+ this.editor.config.uploadImgServer = this.uploadUrl;
+ this.editor.config.uploadImgMaxLength = 5
+ this.editor.config.uploadImgMaxSize = 2 * 1024 * 1024 // 2M
+ this.editor.config.uploadImgAccept = ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp']
+ this.editor.config.uploadFileName = 'file'
+ this.editor.config.zIndex = 1
+ this.editor.config.menus = [
+ 'head',
+ 'bold',
+ 'fontSize',
+ 'fontName',
+ 'italic',
+ 'underline',
+ 'strikeThrough',
+ 'indent',
+ 'lineHeight',
+ 'foreColor',
+ 'backColor',
+ 'link',
+ 'list',
+ 'todo',
+ 'justify',
+ 'quote',
+ 'emoticon',
+ 'image',
+ // 'video',
+ 'table',
+ 'code',
+ 'splitLine',
+ 'undo',
+ 'redo',
+ ]
+ this.editor.config.onchange = function (newHtml) {
+ console.log(newHtml)
+ that.$emit("on-text-change", newHtml);
+ this.editor.config.pasteFilterStyle = false
+ // 配置触发 onchange 的时间频率,默认为 200ms
+ this.editor.config.onchangeTimeout = 500 // 修改为 500ms
+ this.editor.config.uploadImgHooks = {
+ // 上传图片之前
+ before: function(xhr) {
+ //console.log(xhr)
+ // 图片上传并返回了结果,图片插入已成功
+ success: function(xhr) {
+ //console.log('success', xhr)
+ // 图片上传并返回了结果,但图片插入时出错了
+ fail: function(xhr, editor, resData) {
+ console.log('fail', resData)
+ // 上传图片出错,一般为 http 请求的错误
+ error: function(xhr, editor, resData) {
+ console.log('error', xhr, resData)
+ // 上传图片超时
+ timeout: function(xhr) {
+ //console.log('timeout')
+ // 图片上传并返回了结果,想要自己把图片插入到编辑器中
+ // 例如服务器端返回的不是 { errno: 0, data: [...] } 这种格式,可使用 customInsert
+ customInsert: function(insertImg, result, editor) {
+ console.log(result);
+ // 图片上传并返回结果,自定义插入图片的事件(而不是编辑器自动插入图片!!!)
+ // insertImg 是插入图片的函数,editor 是编辑器对象,result 是服务器端返回的结果
+ // 举例:假如上传图片成功后,服务器端返回的是 {url:'....'} 这种格式,即可这样插入图片:
+ // var url = result.data[0].url
+ if(result.data!=null){
+ for(var i=0;i<result.data.length;i++){
+ var url = result.data[i].url
+ insertImg(url)
+ console.log(url);
+ // result 必须是一个 JSON 格式字符串!!!否则报错
+ this.editor.create()
+ this.editor.txt.html("");
+ setText(text){
+ this.initEditor()
+ if(text==undefined||text==null){
+ else{
+ this.editor.txt.html(text);
+<style scoped>
+.toolbar {
+ border: 1px solid #ccc;
+.myedit {
+ min-height: 300px;
+ z-index: 1 !important;
+.w-e-toolbar{
+.w-e-text-container{
@@ -1,44 +1,44 @@
- <div style="padding: 0 15px;" @click="toggleClick">
- <svg
- :class="{'is-active':isActive}"
- class="hamburger"
- viewBox="0 0 1024 1024"
- xmlns="http://www.w3.org/2000/svg"
- width="64"
- height="64"
- >
- <path d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z" />
- </svg>
- name: 'Hamburger',
- isActive: {
- type: Boolean,
- default: false
- toggleClick() {
- this.$emit('toggleClick')
-.hamburger {
- width: 20px;
- height: 20px;
-.hamburger.is-active {
- transform: rotate(180deg);
+ <div style="padding: 0 15px;" @click="toggleClick">
+ <svg
+ :class="{'is-active':isActive}"
+ class="hamburger"
+ viewBox="0 0 1024 1024"
+ xmlns="http://www.w3.org/2000/svg"
+ width="64"
+ height="64"
+ >
+ <path d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z" />
+ </svg>
+ name: 'Hamburger',
+ isActive: {
+ type: Boolean,
+ default: false
+ toggleClick() {
+ this.$emit('toggleClick')
+.hamburger {
+ width: 20px;
+ height: 20px;
+.hamburger.is-active {
+ transform: rotate(180deg);
@@ -1,188 +1,188 @@
- <div :class="{'show':show}" class="header-search">
- <svg-icon class-name="search-icon" icon-class="search" @click.stop="click" />
- <el-select
- ref="headerSearchSelect"
- v-model="search"
- :remote-method="querySearch"
- filterable
- default-first-option
- remote
- placeholder="Search"
- class="header-search-select"
- @change="change"
- <el-option v-for="item in options" :key="item.path" :value="item" :label="item.title.join(' > ')" />
- </el-select>
-// fuse is a lightweight fuzzy-search module
-// make search results more in line with expectations
-import Fuse from 'fuse.js'
-import path from 'path'
- name: 'HeaderSearch',
- search: '',
- options: [],
- searchPool: [],
- show: false,
- fuse: undefined
- routes() {
- return this.$store.getters.permission_routes
- this.searchPool = this.generateRoutes(this.routes)
- searchPool(list) {
- this.initFuse(list)
- show(value) {
- if (value) {
- document.body.addEventListener('click', this.close)
- } else {
- document.body.removeEventListener('click', this.close)
- click() {
- this.show = !this.show
- if (this.show) {
- this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.focus()
- close() {
- this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.blur()
- this.options = []
- this.show = false
- change(val) {
- if(this.ishttp(val.path)) {
- // http(s):// 路径新窗口打开
- window.open(val.path, "_blank");
- this.$router.push(val.path)
- this.search = ''
- this.$nextTick(() => {
- initFuse(list) {
- this.fuse = new Fuse(list, {
- shouldSort: true,
- threshold: 0.4,
- location: 0,
- distance: 100,
- maxPatternLength: 32,
- minMatchCharLength: 1,
- keys: [{
- name: 'title',
- weight: 0.7
- }, {
- name: 'path',
- weight: 0.3
- }]
- // Filter out the routes that can be displayed in the sidebar
- // And generate the internationalized title
- generateRoutes(routes, basePath = '/', prefixTitle = []) {
- let res = []
- for (const router of routes) {
- // skip hidden router
- if (router.hidden) { continue }
- path: !this.ishttp(router.path) ? path.resolve(basePath, router.path) : router.path,
- title: [...prefixTitle]
- if (router.meta && router.meta.title) {
- data.title = [...data.title, router.meta.title]
- if (router.redirect !== 'noRedirect') {
- // only push the routes with title
- // special case: need to exclude parent router without redirect
- res.push(data)
- // recursive child routes
- if (router.children) {
- const tempRoutes = this.generateRoutes(router.children, data.path, data.title)
- if (tempRoutes.length >= 1) {
- res = [...res, ...tempRoutes]
- return res
- querySearch(query) {
- if (query !== '') {
- this.options = this.fuse.search(query)
- ishttp(url) {
- return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1
-.header-search {
- font-size: 0 !important;
- .search-icon {
- font-size: 18px;
- .header-search-select {
- transition: width 0.2s;
- background: transparent;
- /deep/ .el-input__inner {
- border: 0;
- box-shadow: none !important;
- border-bottom: 1px solid #d9d9d9;
- &.show {
- width: 210px;
+ <div :class="{'show':show}" class="header-search">
+ <svg-icon class-name="search-icon" icon-class="search" @click.stop="click" />
+ <el-select
+ ref="headerSearchSelect"
+ v-model="search"
+ :remote-method="querySearch"
+ filterable
+ default-first-option
+ remote
+ placeholder="Search"
+ class="header-search-select"
+ @change="change"
+ <el-option v-for="item in options" :key="item.path" :value="item" :label="item.title.join(' > ')" />
+ </el-select>
+// fuse is a lightweight fuzzy-search module
+// make search results more in line with expectations
+import Fuse from 'fuse.js'
+import path from 'path'
+ name: 'HeaderSearch',
+ search: '',
+ options: [],
+ searchPool: [],
+ show: false,
+ fuse: undefined
+ routes() {
+ return this.$store.getters.permission_routes
+ this.searchPool = this.generateRoutes(this.routes)
+ searchPool(list) {
+ this.initFuse(list)
+ show(value) {
+ if (value) {
+ document.body.addEventListener('click', this.close)
+ } else {
+ document.body.removeEventListener('click', this.close)
+ click() {
+ this.show = !this.show
+ if (this.show) {
+ this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.focus()
+ close() {
+ this.$refs.headerSearchSelect && this.$refs.headerSearchSelect.blur()
+ this.options = []
+ this.show = false
+ change(val) {
+ if(this.ishttp(val.path)) {
+ // http(s):// 路径新窗口打开
+ window.open(val.path, "_blank");
+ this.$router.push(val.path)
+ this.search = ''
+ this.$nextTick(() => {
+ initFuse(list) {
+ this.fuse = new Fuse(list, {
+ shouldSort: true,
+ threshold: 0.4,
+ location: 0,
+ distance: 100,
+ maxPatternLength: 32,
+ minMatchCharLength: 1,
+ keys: [{
+ name: 'title',
+ weight: 0.7
+ }, {
+ name: 'path',
+ weight: 0.3
+ }]
+ // Filter out the routes that can be displayed in the sidebar
+ // And generate the internationalized title
+ generateRoutes(routes, basePath = '/', prefixTitle = []) {
+ let res = []
+ for (const router of routes) {
+ // skip hidden router
+ if (router.hidden) { continue }
+ path: !this.ishttp(router.path) ? path.resolve(basePath, router.path) : router.path,
+ title: [...prefixTitle]
+ if (router.meta && router.meta.title) {
+ data.title = [...data.title, router.meta.title]
+ if (router.redirect !== 'noRedirect') {
+ // only push the routes with title
+ // special case: need to exclude parent router without redirect
+ res.push(data)
+ // recursive child routes
+ if (router.children) {
+ const tempRoutes = this.generateRoutes(router.children, data.path, data.title)
+ if (tempRoutes.length >= 1) {
+ res = [...res, ...tempRoutes]
+ return res
+ querySearch(query) {
+ if (query !== '') {
+ this.options = this.fuse.search(query)
+ ishttp(url) {
+ return url.indexOf('http://') !== -1 || url.indexOf('https://') !== -1
+.header-search {
+ font-size: 0 !important;
+ .search-icon {
+ font-size: 18px;
+ .header-search-select {
+ transition: width 0.2s;
+ background: transparent;
+ /deep/ .el-input__inner {
+ border: 0;
+ box-shadow: none !important;
+ border-bottom: 1px solid #d9d9d9;
+ &.show {
+ width: 210px;
-<!-- @author zhengjie -->
- <div class="icon-body">
- <el-input v-model="name" style="position: relative;" clearable placeholder="请输入图标名称" @clear="filterIcons" @input.native="filterIcons">
- <i slot="suffix" class="el-icon-search el-input__icon" />
- </el-input>
- <div class="icon-list">
- <div v-for="(item, index) in iconList" :key="index" @click="selectedIcon(item)">
- <svg-icon :icon-class="item" style="height: 30px;width: 16px;" />
- <span>{{ item }}</span>
-import icons from './requireIcons'
- name: 'IconSelect',
- name: '',
- iconList: icons
- filterIcons() {
- this.iconList = icons
- if (this.name) {
- this.iconList = this.iconList.filter(item => item.includes(this.name))
- selectedIcon(name) {
- this.$emit('selected', name)
- document.body.click()
- reset() {
- this.name = ''
-<style rel="stylesheet/scss" lang="scss" scoped>
- .icon-body {
- padding: 10px;
- .icon-list {
- overflow-y: scroll;
- div {
- height: 30px;
- line-height: 30px;
- margin-bottom: -5px;
- width: 33%;
- span {
- vertical-align: -0.15em;
- fill: currentColor;
+<!-- @author zhengjie -->
+ <div class="icon-body">
+ <el-input v-model="name" style="position: relative;" clearable placeholder="请输入图标名称" @clear="filterIcons" @input.native="filterIcons">
+ <i slot="suffix" class="el-icon-search el-input__icon" />
+ </el-input>
+ <div class="icon-list">
+ <div v-for="(item, index) in iconList" :key="index" @click="selectedIcon(item)">
+ <svg-icon :icon-class="item" style="height: 30px;width: 16px;" />
+ <span>{{ item }}</span>
+import icons from './requireIcons'
+ name: 'IconSelect',
+ name: '',
+ iconList: icons
+ filterIcons() {
+ this.iconList = icons
+ if (this.name) {
+ this.iconList = this.iconList.filter(item => item.includes(this.name))
+ selectedIcon(name) {
+ this.$emit('selected', name)
+ document.body.click()
+ reset() {
+ this.name = ''
+<style rel="stylesheet/scss" lang="scss" scoped>
+ .icon-body {
+ padding: 10px;
+ .icon-list {
+ overflow-y: scroll;
+ div {
+ height: 30px;
+ line-height: 30px;
+ margin-bottom: -5px;
+ width: 33%;
+ span {
+ vertical-align: -0.15em;
+ fill: currentColor;
-const req = require.context('../../assets/icons/svg', false, /\.svg$/)
-const requireAll = requireContext => requireContext.keys()
-const re = /\.\/(.*)\.svg/
-const icons = requireAll(req).map(i => {
- return i.match(re)[1]
-})
-export default icons
+const req = require.context('../../assets/icons/svg', false, /\.svg$/)
+const requireAll = requireContext => requireContext.keys()
+const re = /\.\/(.*)\.svg/
+const icons = requireAll(req).map(i => {
+ return i.match(re)[1]
+})
+export default icons
@@ -1,389 +1,389 @@
- <div v-if="type == 'image'">
- <ul v-for="(item,index) in value" :key="index" class="el-upload-list el-upload-list--picture-card">
- <li tabindex="0" class="el-upload-list__item is-ready" :style="'width: '+width+'px;height: '+height+'px'">
- <img :src="item" alt="" class="el-upload-list__item-thumbnail">
- <span class="el-upload-list__item-actions">
- <span v-if="index != 0" class="el-upload-list__item-preview" @click="moveMaterial(index,'up')">
- <i class="el-icon-back" />
- </span>
- <span class="el-upload-list__item-preview" @click="zoomMaterial(index)">
- <i class="el-icon-view" />
- <span class="el-upload-list__item-delete" @click="deleteMaterial(index)">
- <i class="el-icon-delete" />
- <span v-if="index != value.length-1" class="el-upload-list__item-preview" @click="moveMaterial(index,'down')">
- <i class="el-icon-right" />
- </li>
- </ul>
- <div v-if="num > value.length" tabindex="0" class="el-upload el-upload--picture-card" :style="'width: '+width+'px;height: '+height+'px;'+'line-height:'+height+'px;'" @click="toSeleteMaterial">
- <i class="el-icon-plus" />
- <!-- 查看 -->
- <el-dialog
- append-to-body
- :visible.sync="dialogVisible"
- width="35%"
- <img :src="url" alt="" style="width: 100%">
- </el-dialog>
- <!-- 素材列表 -->
- title="图片素材库"
- :visible.sync="listDialogVisible"
- width="70%"
- <el-container>
- <el-aside width="unset">
- <div style="margin-bottom: 10px">
- <el-button
- class="el-icon-plus"
- size="small"
- @click="materialgroupAdd()"
- 添加分组
- </el-button>
- <div class="group-list">
- <div class="group-item" v-for="(group) in materialGroupList">
- <el-button @click="selectGroup(group)" type="primary" plain >{{group.name}}</el-button>
- </el-aside>
- <el-main>
- <el-card>
- <div slot="header">
- <el-row>
- <el-col :span="12">
- <span>{{ materialGroup.name }}</span>
- <span v-if="materialGroup.groupId >0">
- <el-button size="small" type="text" class="el-icon-edit" style="margin-left: 10px;" @click="materialgroupEdit(materialGroup)">重命名</el-button>
- <el-button size="small" type="text" class="el-icon-delete" style="margin-left: 10px;color: red" @click="materialgroupDelete(materialGroup)">删除</el-button>
- </el-col>
- <el-col :span="12" style="text-align: right;">
- <el-upload
- :action="uploadUrl"
- :file-list="[]"
- :on-progress="handleProgress"
- :before-upload="beforeUpload"
- :on-success="handleSuccess"
- :data="{type: 1}"
- multiple
- <el-button size="small" type="primary">批量上传</el-button>
- </el-upload>
- </el-row>
- <div v-loading="tableLoading">
- <el-alert
- v-if="tableData.length <= 0"
- title="暂无数据"
- type="info"
- :closable="false"
- center
- show-icon
- />
- <el-row :gutter="5">
- <el-checkbox-group v-model="urls" :max="num - value.length">
- <el-col v-for="(item,index) in tableData" :key="index" :span="4">
- <el-card :body-style="{ padding: '5px' }">
- <el-image
- style="width: 100%;height: 100px"
- :src="item.url"
- fit="contain"
- :preview-src-list="[item.url]"
- :z-index="9999"
- <el-checkbox class="material-name" :label="item.url">
- 选择
- </el-checkbox>
- <el-col :span="24" class="col-do">
- <el-button type="text" size="medium" @click="materialDel(item)">删除</el-button>
- </el-card>
- </el-checkbox-group>
- <pagination
- v-show="total>0"
- :total="total"
- :page.sync="queryParams.pageNum"
- :limit.sync="queryParams.pageSize"
- @pagination="getMaterialList"
- </el-main>
- </el-container>
- <span slot="footer" class="dialog-footer">
- <el-button @click="listDialogVisible = false">取 消</el-button>
- <el-button type="primary" @click="submit">确 定</el-button>
-import { listMaterial, getMaterial, delMaterial, addMaterial, updateMaterial, exportMaterial } from "@/api/store/material";
-import { getAllMaterialGroup,listMaterialGroup, getMaterialGroup, delMaterialGroup, addMaterialGroup, updateMaterialGroup, exportMaterialGroup } from "@/api/store/materialGroup";
- name: 'ImageSelect',
- // 素材数据
- type: Array,
- default() {
- return []
- // 素材类型
- type: {
- type: String
- // 素材限制数量,默认5个
- num: {
- return 5
- // 宽度
- width: {
- return 150
- uploadUrl:process.env.VUE_APP_BASE_API+"/common/uploadOSS",
- dialogVisible: false,
- url: '',
- listDialogVisible: false,
- materialGroupList: [],
- materialGroupLoading: false,
- materialGroup:{},
- tableData: [],
- resultNumber: 0,
- total: 0,
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- type: null,
- groupId: null,
- name: null,
- url: null,
- isDel: null,
- createUserId: null,
- tableLoading: false,
- urls: []
- mounted(){
- this.getAllMaterialGroup();
- selectGroup(item){
- this.materialGroup=item;
- this.queryParams.groupId=item.groupId;
- this.getMaterialList();
- materialgroupAdd() {
- const that = this
- this.$prompt('请输入分组名', '提示', {
- confirmButtonText: '确定',
- cancelButtonText: '取消'
- }).then(({ value }) => {
- addMaterialGroup({
- name: value
- }).then(function() {
- that.materialGroup={};
- that.getAllMaterialGroup()
- }).catch(() => {
- materialgroupDelete(materialgroupObj) {
- this.$confirm('是否确认删除该分组?', '提示', {
- cancelButtonText: '取消',
- type: 'warning'
- delMaterialGroup(materialgroupObj.groupId)
- .then(function() {
- materialgroupEdit(materialgroupObj) {
- inputValue: materialgroupObj.name
- updateMaterialGroup({
- groupId: materialgroupObj.groupId,
- getAllMaterialGroup() {
- this.materialGroupLoading = true;
- getAllMaterialGroup({}).then(response => {
- this.materialGroupList = response.data
- console.log(this.materialGroupList)
- this.materialGroupLoading = false;
- getMaterialList() {
- this.tableLoading = true;
- listMaterial(this.queryParams).then(response => {
- this.tableData = response.rows;
- this.total = response.total;
- this.tableLoading = false;
- moveMaterial(index, type) {
- if (type == 'up') {
- const tempOption = this.value[index - 1]
- this.$set(this.value, index - 1, this.value[index])
- this.$set(this.value, index, tempOption)
- if (type == 'down') {
- const tempOption = this.value[index + 1]
- this.$set(this.value, index + 1, this.value[index])
- zoomMaterial(index) {
- this.dialogVisible = true
- this.url = this.value[index]
- deleteMaterial(index) {
- this.$confirm('是否确认删除?', '提示', {
- that.value.splice(index, 1)
- that.urls = []
- toSeleteMaterial() {
- this.listDialogVisible = true
- this.getAllMaterialGroup()
- materialDel(item) {
- this.$confirm('是否确认删除该素材?', '提示', {
- delMaterial(item.materialId)
- that.queryParams.pageNum=0;
- that.getMaterialList();
- handleProgress(event, file, fileList) {
- handleSuccess(response, file, fileList) {
- addMaterial({
- type: '1',
- groupId: this.queryParams.groupId,
- name: file.name,
- url: response.url
- }).then(() => {
- this.resultNumber++
- if (fileList.length === this.resultNumber) {
- that.getMaterialList()
- this.resultNumber = 0
- beforeUpload(file) {
- const isPic =
- file.type === 'image/jpeg' ||
- file.type === 'image/png' ||
- file.type === 'image/gif' ||
- file.type === 'image/jpg'
- const isLt2M = file.size / 1024 / 1024 < 2
- if (!isPic) {
- this.$message.error('上传图片只能是 JPG、JPEG、PNG、GIF 格式!')
- if (!isLt2M) {
- this.$message.error('上传头像图片大小不能超过 2MB!')
- return isPic && isLt2M
- submit() {
- this.urls.forEach(item => {
- this.$set(this.value, this.value.length, item)
- this.listDialogVisible = false
- ::v-deep .el-icon-circle-close{
- color: red;
- .material-name{
- padding: 8px 0px;
- .col-do{
- .button-do{
- padding: unset!important;
- font-size: 12px;
- .group-list{
- flex-direction:column;
- .group-item{
- margin: 5px;
+ <div v-if="type == 'image'">
+ <ul v-for="(item,index) in value" :key="index" class="el-upload-list el-upload-list--picture-card">
+ <li tabindex="0" class="el-upload-list__item is-ready" :style="'width: '+width+'px;height: '+height+'px'">
+ <img :src="item" alt="" class="el-upload-list__item-thumbnail">
+ <span class="el-upload-list__item-actions">
+ <span v-if="index != 0" class="el-upload-list__item-preview" @click="moveMaterial(index,'up')">
+ <i class="el-icon-back" />
+ </span>
+ <span class="el-upload-list__item-preview" @click="zoomMaterial(index)">
+ <i class="el-icon-view" />
+ <span class="el-upload-list__item-delete" @click="deleteMaterial(index)">
+ <i class="el-icon-delete" />
+ <span v-if="index != value.length-1" class="el-upload-list__item-preview" @click="moveMaterial(index,'down')">
+ <i class="el-icon-right" />
+ </li>
+ </ul>
+ <div v-if="num > value.length" tabindex="0" class="el-upload el-upload--picture-card" :style="'width: '+width+'px;height: '+height+'px;'+'line-height:'+height+'px;'" @click="toSeleteMaterial">
+ <i class="el-icon-plus" />
+ <!-- 查看 -->
+ <el-dialog
+ append-to-body
+ :visible.sync="dialogVisible"
+ width="35%"
+ <img :src="url" alt="" style="width: 100%">
+ </el-dialog>
+ <!-- 素材列表 -->
+ title="图片素材库"
+ :visible.sync="listDialogVisible"
+ width="70%"
+ <el-container>
+ <el-aside width="unset">
+ <div style="margin-bottom: 10px">
+ <el-button
+ class="el-icon-plus"
+ size="small"
+ @click="materialgroupAdd()"
+ 添加分组
+ </el-button>
+ <div class="group-list">
+ <div class="group-item" v-for="(group) in materialGroupList">
+ <el-button @click="selectGroup(group)" type="primary" plain >{{group.name}}</el-button>
+ </el-aside>
+ <el-main>
+ <el-card>
+ <div slot="header">
+ <el-row>
+ <el-col :span="12">
+ <span>{{ materialGroup.name }}</span>
+ <span v-if="materialGroup.groupId >0">
+ <el-button size="small" type="text" class="el-icon-edit" style="margin-left: 10px;" @click="materialgroupEdit(materialGroup)">重命名</el-button>
+ <el-button size="small" type="text" class="el-icon-delete" style="margin-left: 10px;color: red" @click="materialgroupDelete(materialGroup)">删除</el-button>
+ </el-col>
+ <el-col :span="12" style="text-align: right;">
+ <el-upload
+ :action="uploadUrl"
+ :file-list="[]"
+ :on-progress="handleProgress"
+ :before-upload="beforeUpload"
+ :on-success="handleSuccess"
+ :data="{type: 1}"
+ multiple
+ <el-button size="small" type="primary">批量上传</el-button>
+ </el-upload>
+ </el-row>
+ <div v-loading="tableLoading">
+ <el-alert
+ v-if="tableData.length <= 0"
+ title="暂无数据"
+ type="info"
+ :closable="false"
+ center
+ show-icon
+ />
+ <el-row :gutter="5">
+ <el-checkbox-group v-model="urls" :max="num - value.length">
+ <el-col v-for="(item,index) in tableData" :key="index" :span="4">
+ <el-card :body-style="{ padding: '5px' }">
+ <el-image
+ style="width: 100%;height: 100px"
+ :src="item.url"
+ fit="contain"
+ :preview-src-list="[item.url]"
+ :z-index="9999"
+ <el-checkbox class="material-name" :label="item.url">
+ 选择
+ </el-checkbox>
+ <el-col :span="24" class="col-do">
+ <el-button type="text" size="medium" @click="materialDel(item)">删除</el-button>
+ </el-card>
+ </el-checkbox-group>
+ <pagination
+ v-show="total>0"
+ :total="total"
+ :page.sync="queryParams.pageNum"
+ :limit.sync="queryParams.pageSize"
+ @pagination="getMaterialList"
+ </el-main>
+ </el-container>
+ <span slot="footer" class="dialog-footer">
+ <el-button @click="listDialogVisible = false">取 消</el-button>
+ <el-button type="primary" @click="submit">确 定</el-button>
+import { listMaterial, getMaterial, delMaterial, addMaterial, updateMaterial, exportMaterial } from "@/api/store/material";
+import { getAllMaterialGroup,listMaterialGroup, getMaterialGroup, delMaterialGroup, addMaterialGroup, updateMaterialGroup, exportMaterialGroup } from "@/api/store/materialGroup";
+ name: 'ImageSelect',
+ // 素材数据
+ type: Array,
+ default() {
+ return []
+ // 素材类型
+ type: {
+ type: String
+ // 素材限制数量,默认5个
+ num: {
+ return 5
+ // 宽度
+ width: {
+ return 150
+ uploadUrl:process.env.VUE_APP_BASE_API+"/common/uploadOSS",
+ dialogVisible: false,
+ url: '',
+ listDialogVisible: false,
+ materialGroupList: [],
+ materialGroupLoading: false,
+ materialGroup:{},
+ tableData: [],
+ resultNumber: 0,
+ total: 0,
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ type: null,
+ groupId: null,
+ name: null,
+ url: null,
+ isDel: null,
+ createUserId: null,
+ tableLoading: false,
+ urls: []
+ mounted(){
+ this.getAllMaterialGroup();
+ selectGroup(item){
+ this.materialGroup=item;
+ this.queryParams.groupId=item.groupId;
+ this.getMaterialList();
+ materialgroupAdd() {
+ const that = this
+ this.$prompt('请输入分组名', '提示', {
+ confirmButtonText: '确定',
+ cancelButtonText: '取消'
+ }).then(({ value }) => {
+ addMaterialGroup({
+ name: value
+ }).then(function() {
+ that.materialGroup={};
+ that.getAllMaterialGroup()
+ }).catch(() => {
+ materialgroupDelete(materialgroupObj) {
+ this.$confirm('是否确认删除该分组?', '提示', {
+ cancelButtonText: '取消',
+ type: 'warning'
+ delMaterialGroup(materialgroupObj.groupId)
+ .then(function() {
+ materialgroupEdit(materialgroupObj) {
+ inputValue: materialgroupObj.name
+ updateMaterialGroup({
+ groupId: materialgroupObj.groupId,
+ getAllMaterialGroup() {
+ this.materialGroupLoading = true;
+ getAllMaterialGroup({}).then(response => {
+ this.materialGroupList = response.data
+ console.log(this.materialGroupList)
+ this.materialGroupLoading = false;
+ getMaterialList() {
+ this.tableLoading = true;
+ listMaterial(this.queryParams).then(response => {
+ this.tableData = response.rows;
+ this.total = response.total;
+ this.tableLoading = false;
+ moveMaterial(index, type) {
+ if (type == 'up') {
+ const tempOption = this.value[index - 1]
+ this.$set(this.value, index - 1, this.value[index])
+ this.$set(this.value, index, tempOption)
+ if (type == 'down') {
+ const tempOption = this.value[index + 1]
+ this.$set(this.value, index + 1, this.value[index])
+ zoomMaterial(index) {
+ this.dialogVisible = true
+ this.url = this.value[index]
+ deleteMaterial(index) {
+ this.$confirm('是否确认删除?', '提示', {
+ that.value.splice(index, 1)
+ that.urls = []
+ toSeleteMaterial() {
+ this.listDialogVisible = true
+ this.getAllMaterialGroup()
+ materialDel(item) {
+ this.$confirm('是否确认删除该素材?', '提示', {
+ delMaterial(item.materialId)
+ that.queryParams.pageNum=0;
+ that.getMaterialList();
+ handleProgress(event, file, fileList) {
+ handleSuccess(response, file, fileList) {
+ addMaterial({
+ type: '1',
+ groupId: this.queryParams.groupId,
+ name: file.name,
+ url: response.url
+ }).then(() => {
+ this.resultNumber++
+ if (fileList.length === this.resultNumber) {
+ that.getMaterialList()
+ this.resultNumber = 0
+ beforeUpload(file) {
+ const isPic =
+ file.type === 'image/jpeg' ||
+ file.type === 'image/png' ||
+ file.type === 'image/gif' ||
+ file.type === 'image/jpg'
+ const isLt2M = file.size / 1024 / 1024 < 2
+ if (!isPic) {
+ this.$message.error('上传图片只能是 JPG、JPEG、PNG、GIF 格式!')
+ if (!isLt2M) {
+ this.$message.error('上传头像图片大小不能超过 2MB!')
+ return isPic && isLt2M
+ submit() {
+ this.urls.forEach(item => {
+ this.$set(this.value, this.value.length, item)
+ this.listDialogVisible = false
+ ::v-deep .el-icon-circle-close{
+ color: red;
+ .material-name{
+ padding: 8px 0px;
+ .col-do{
+ .button-do{
+ padding: unset!important;
+ font-size: 12px;
+ .group-list{
+ flex-direction:column;
+ .group-item{
+ margin: 5px;
@@ -1,369 +1,369 @@
- <div v-if="myValue != ''">
- <ul class="el-upload-list el-upload-list--picture-card">
- <img :src="myValue" alt="" class="el-upload-list__item-thumbnail">
- <span class="el-upload-list__item-delete" @click="deleteMaterial">
- <div v-else tabindex="0" class="el-upload el-upload--picture-card" :style="'width: '+width+'px;height: '+height+'px;'+'line-height:'+height+'px;'" @click="toSeleteMaterial">
- <svg-icon icon-class="add" class-name="card-panel-icon" />
- <el-checkbox-group v-model="urls" :max="num - myValue.length">
- value: function(val) {
- this.myValue = val
- myValue: this.value,
- deleteMaterial() {
- that.myValue = ''
- this.myValue = this.urls[0]
- this.$emit('input', this.urls[0])
+ <div v-if="myValue != ''">
+ <ul class="el-upload-list el-upload-list--picture-card">
+ <img :src="myValue" alt="" class="el-upload-list__item-thumbnail">
+ <span class="el-upload-list__item-delete" @click="deleteMaterial">
+ <div v-else tabindex="0" class="el-upload el-upload--picture-card" :style="'width: '+width+'px;height: '+height+'px;'+'line-height:'+height+'px;'" @click="toSeleteMaterial">
+ <svg-icon icon-class="add" class-name="card-panel-icon" />
+ <el-checkbox-group v-model="urls" :max="num - myValue.length">
+ value: function(val) {
+ this.myValue = val
+ myValue: this.value,
+ deleteMaterial() {
+ that.myValue = ''
+ this.myValue = this.urls[0]
+ this.$emit('input', this.urls[0])
@@ -1,101 +1,101 @@
- <div :class="{'hidden':hidden}" class="pagination-container">
- <el-pagination
- :background="background"
- :current-page.sync="currentPage"
- :page-size.sync="pageSize"
- :layout="layout"
- :page-sizes="pageSizes"
- v-bind="$attrs"
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
-import { scrollTo } from '@/utils/scroll-to'
- name: 'Pagination',
- total: {
- required: true,
- type: Number
- page: {
- default: 1
- limit: {
- default: 20
- pageSizes: {
- return [10, 20, 30, 50,100,200]
- layout: {
- default: 'total, sizes, prev, pager, next, jumper'
- background: {
- default: true
- autoScroll: {
- hidden: {
- currentPage: {
- get() {
- return this.page
- set(val) {
- this.$emit('update:page', val)
- pageSize: {
- return this.limit
- this.$emit('update:limit', val)
- handleSizeChange(val) {
- this.$emit('pagination', { page: this.currentPage, limit: val })
- if (this.autoScroll) {
- scrollTo(0, 800)
- handleCurrentChange(val) {
- this.$emit('pagination', { page: val, limit: this.pageSize })
- padding: 32px 16px;
-.pagination-container.hidden {
+ <div :class="{'hidden':hidden}" class="pagination-container">
+ <el-pagination
+ :background="background"
+ :current-page.sync="currentPage"
+ :page-size.sync="pageSize"
+ :layout="layout"
+ :page-sizes="pageSizes"
+ v-bind="$attrs"
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+import { scrollTo } from '@/utils/scroll-to'
+ name: 'Pagination',
+ total: {
+ required: true,
+ type: Number
+ page: {
+ default: 1
+ limit: {
+ default: 20
+ pageSizes: {
+ return [10, 20, 30, 50,100,200]
+ layout: {
+ default: 'total, sizes, prev, pager, next, jumper'
+ background: {
+ default: true
+ autoScroll: {
+ hidden: {
+ currentPage: {
+ get() {
+ return this.page
+ set(val) {
+ this.$emit('update:page', val)
+ pageSize: {
+ return this.limit
+ this.$emit('update:limit', val)
+ handleSizeChange(val) {
+ this.$emit('pagination', { page: this.currentPage, limit: val })
+ if (this.autoScroll) {
+ scrollTo(0, 800)
+ handleCurrentChange(val) {
+ this.$emit('pagination', { page: val, limit: this.pageSize })
+ padding: 32px 16px;
+.pagination-container.hidden {
@@ -1,142 +1,142 @@
- <div :style="{zIndex:zIndex,height:height,width:width}" class="pan-item">
- <div class="pan-info">
- <div class="pan-info-roles-container">
- <slot />
- <!-- eslint-disable-next-line -->
- <div :style="{backgroundImage: `url(${image})`}" class="pan-thumb"></div>
- name: 'PanThumb',
- image: {
- required: true
- zIndex: {
- default: '150px'
-.pan-item {
- width: 200px;
- cursor: default;
- box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
-.pan-info-roles-container {
- padding: 20px;
-.pan-thumb {
- background-position: center center;
- background-size: cover;
- transform-origin: 95% 40%;
- transition: all 0.3s ease-in-out;
-/* .pan-thumb:after {
- width: 8px;
- height: 8px;
- top: 40%;
- left: 95%;
- margin: -4px 0 0 -4px;
- background: radial-gradient(ellipse at center, rgba(14, 14, 14, 1) 0%, rgba(125, 126, 125, 1) 100%);
- box-shadow: 0 0 1px rgba(255, 255, 255, 0.9);
-} */
-.pan-info {
- height: inherit;
- box-shadow: inset 0 0 0 5px rgba(0, 0, 0, 0.05);
-.pan-info h3 {
- text-transform: uppercase;
- letter-spacing: 2px;
- margin: 0 60px;
- padding: 22px 0 0 0;
- height: 85px;
- font-family: 'Open Sans', Arial, sans-serif;
- text-shadow: 0 0 1px #fff, 0 1px 2px rgba(0, 0, 0, 0.3);
-.pan-info p {
- padding: 10px 5px;
- font-style: italic;
- margin: 0 30px;
- border-top: 1px solid rgba(255, 255, 255, 0.5);
-.pan-info p a {
- color: #333;
- width: 80px;
- height: 80px;
- background: rgba(255, 255, 255, 0.3);
- font-style: normal;
- font-size: 9px;
- letter-spacing: 1px;
- padding-top: 24px;
- margin: 7px auto 0;
- transition: transform 0.3s ease-in-out 0.2s, opacity 0.3s ease-in-out 0.2s, background 0.2s linear 0s;
- transform: translateX(60px) rotate(90deg);
-.pan-info p a:hover {
- background: rgba(255, 255, 255, 0.5);
-.pan-item:hover .pan-thumb {
- transform: rotate(-110deg);
-.pan-item:hover .pan-info p a {
- opacity: 1;
- transform: translateX(0px) rotate(0deg);
+ <div :style="{zIndex:zIndex,height:height,width:width}" class="pan-item">
+ <div class="pan-info">
+ <div class="pan-info-roles-container">
+ <slot />
+ <!-- eslint-disable-next-line -->
+ <div :style="{backgroundImage: `url(${image})`}" class="pan-thumb"></div>
+ name: 'PanThumb',
+ image: {
+ required: true
+ zIndex: {
+ default: '150px'
+.pan-item {
+ width: 200px;
+ cursor: default;
+ box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
+.pan-info-roles-container {
+ padding: 20px;
+.pan-thumb {
+ background-position: center center;
+ background-size: cover;
+ transform-origin: 95% 40%;
+ transition: all 0.3s ease-in-out;
+/* .pan-thumb:after {
+ width: 8px;
+ height: 8px;
+ top: 40%;
+ left: 95%;
+ margin: -4px 0 0 -4px;
+ background: radial-gradient(ellipse at center, rgba(14, 14, 14, 1) 0%, rgba(125, 126, 125, 1) 100%);
+ box-shadow: 0 0 1px rgba(255, 255, 255, 0.9);
+} */
+.pan-info {
+ height: inherit;
+ box-shadow: inset 0 0 0 5px rgba(0, 0, 0, 0.05);
+.pan-info h3 {
+ text-transform: uppercase;
+ letter-spacing: 2px;
+ margin: 0 60px;
+ padding: 22px 0 0 0;
+ height: 85px;
+ font-family: 'Open Sans', Arial, sans-serif;
+ text-shadow: 0 0 1px #fff, 0 1px 2px rgba(0, 0, 0, 0.3);
+.pan-info p {
+ padding: 10px 5px;
+ font-style: italic;
+ margin: 0 30px;
+ border-top: 1px solid rgba(255, 255, 255, 0.5);
+.pan-info p a {
+ color: #333;
+ width: 80px;
+ height: 80px;
+ background: rgba(255, 255, 255, 0.3);
+ font-style: normal;
+ font-size: 9px;
+ letter-spacing: 1px;
+ padding-top: 24px;
+ margin: 7px auto 0;
+ transition: transform 0.3s ease-in-out 0.2s, opacity 0.3s ease-in-out 0.2s, background 0.2s linear 0s;
+ transform: translateX(60px) rotate(90deg);
+.pan-info p a:hover {
+ background: rgba(255, 255, 255, 0.5);
+.pan-item:hover .pan-thumb {
+ transform: rotate(-110deg);
+.pan-item:hover .pan-info p a {
+ opacity: 1;
+ transform: translateX(0px) rotate(0deg);
@@ -1,149 +1,149 @@
- <div ref="rightPanel" :class="{show:show}" class="rightPanel-container">
- <div class="rightPanel-background" />
- <div class="rightPanel">
- <div class="rightPanel-items">
-import { addClass, removeClass } from '@/utils'
- name: 'RightPanel',
- clickNotClose: {
- default: false,
- type: Boolean
- buttonTop: {
- default: 250,
- show: {
- return this.$store.state.settings.showSettings
- this.$store.dispatch('settings/changeSetting', {
- key: 'showSettings',
- value: val
- theme() {
- return this.$store.state.settings.theme
- if (value && !this.clickNotClose) {
- this.addEventClick()
- addClass(document.body, 'showRightPanel')
- removeClass(document.body, 'showRightPanel')
- this.insertToBody()
- const elx = this.$refs.rightPanel
- elx.remove()
- addEventClick() {
- window.addEventListener('click', this.closeSidebar)
- closeSidebar(evt) {
- const parent = evt.target.closest('.rightPanel')
- if (!parent) {
- window.removeEventListener('click', this.closeSidebar)
- insertToBody() {
- const body = document.querySelector('body')
- body.insertBefore(elx, body.firstChild)
-.showRightPanel {
- width: calc(100% - 15px);
-.rightPanel-background {
- transition: opacity .3s cubic-bezier(.7, .3, .1, 1);
- background: rgba(0, 0, 0, .2);
- z-index: -1;
-.rightPanel {
- max-width: 260px;
- height: 100vh;
- box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .05);
- transition: all .25s cubic-bezier(.7, .3, .1, 1);
- transform: translate(100%);
- z-index: 40000;
-.show {
- transition: all .3s cubic-bezier(.7, .3, .1, 1);
- .rightPanel-background {
- z-index: 20000;
- .rightPanel {
- transform: translate(0);
-.handle-button {
- width: 48px;
- height: 48px;
- left: -48px;
- font-size: 24px;
- border-radius: 6px 0 0 6px !important;
- z-index: 0;
- pointer-events: auto;
- line-height: 48px;
- i {
+ <div ref="rightPanel" :class="{show:show}" class="rightPanel-container">
+ <div class="rightPanel-background" />
+ <div class="rightPanel">
+ <div class="rightPanel-items">
+import { addClass, removeClass } from '@/utils'
+ name: 'RightPanel',
+ clickNotClose: {
+ default: false,
+ type: Boolean
+ buttonTop: {
+ default: 250,
+ show: {
+ return this.$store.state.settings.showSettings
+ this.$store.dispatch('settings/changeSetting', {
+ key: 'showSettings',
+ value: val
+ theme() {
+ return this.$store.state.settings.theme
+ if (value && !this.clickNotClose) {
+ this.addEventClick()
+ addClass(document.body, 'showRightPanel')
+ removeClass(document.body, 'showRightPanel')
+ this.insertToBody()
+ const elx = this.$refs.rightPanel
+ elx.remove()
+ addEventClick() {
+ window.addEventListener('click', this.closeSidebar)
+ closeSidebar(evt) {
+ const parent = evt.target.closest('.rightPanel')
+ if (!parent) {
+ window.removeEventListener('click', this.closeSidebar)
+ insertToBody() {
+ const body = document.querySelector('body')
+ body.insertBefore(elx, body.firstChild)
+.showRightPanel {
+ width: calc(100% - 15px);
+.rightPanel-background {
+ transition: opacity .3s cubic-bezier(.7, .3, .1, 1);
+ background: rgba(0, 0, 0, .2);
+ z-index: -1;
+.rightPanel {
+ max-width: 260px;
+ height: 100vh;
+ box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, .05);
+ transition: all .25s cubic-bezier(.7, .3, .1, 1);
+ transform: translate(100%);
+ z-index: 40000;
+.show {
+ transition: all .3s cubic-bezier(.7, .3, .1, 1);
+ .rightPanel-background {
+ z-index: 20000;
+ .rightPanel {
+ transform: translate(0);
+.handle-button {
+ width: 48px;
+ height: 48px;
+ left: -48px;
+ font-size: 24px;
+ border-radius: 6px 0 0 6px !important;
+ z-index: 0;
+ pointer-events: auto;
+ line-height: 48px;
+ i {
@@ -1,38 +1,38 @@
-<!-- @author Shiyn/ huangmx 20200807优化-->
- <div class="top-right-btn">
- <el-tooltip class="item" effect="dark" :content="showSearch ? '隐藏搜索' : '显示搜索'" placement="top">
- <el-button size="mini" circle icon="el-icon-search" @click="toggleSearch()" />
- </el-tooltip>
- <el-tooltip class="item" effect="dark" content="刷新" placement="top">
- <el-button size="mini" circle icon="el-icon-refresh" @click="refresh()" />
- name: "RightToolbar",
- return {};
- showSearch: {
- default: true,
- //搜索
- toggleSearch() {
- this.$emit("update:showSearch", !this.showSearch);
- //刷新
- refresh() {
- this.$emit("queryTable");
+<!-- @author Shiyn/ huangmx 20200807优化-->
+ <div class="top-right-btn">
+ <el-tooltip class="item" effect="dark" :content="showSearch ? '隐藏搜索' : '显示搜索'" placement="top">
+ <el-button size="mini" circle icon="el-icon-search" @click="toggleSearch()" />
+ </el-tooltip>
+ <el-tooltip class="item" effect="dark" content="刷新" placement="top">
+ <el-button size="mini" circle icon="el-icon-refresh" @click="refresh()" />
+ name: "RightToolbar",
+ return {};
+ showSearch: {
+ default: true,
+ //搜索
+ toggleSearch() {
+ this.$emit("update:showSearch", !this.showSearch);
+ //刷新
+ refresh() {
+ this.$emit("queryTable");
- <svg-icon :icon-class="isFullscreen?'exit-fullscreen':'fullscreen'" @click="click" />
-import screenfull from 'screenfull'
- name: 'Screenfull',
- isFullscreen: false
- this.init()
- this.destroy()
- if (!screenfull.enabled) {
- this.$message({
- message: 'you browser can not work',
- screenfull.toggle()
- change() {
- this.isFullscreen = screenfull.isFullscreen
- if (screenfull.enabled) {
- screenfull.on('change', this.change)
- destroy() {
- screenfull.off('change', this.change)
-.screenfull-svg {
- fill: #5a5e66;;
- vertical-align: 10px;
+ <svg-icon :icon-class="isFullscreen?'exit-fullscreen':'fullscreen'" @click="click" />
+import screenfull from 'screenfull'
+ name: 'Screenfull',
+ isFullscreen: false
+ this.init()
+ this.destroy()
+ if (!screenfull.enabled) {
+ this.$message({
+ message: 'you browser can not work',
+ screenfull.toggle()
+ change() {
+ this.isFullscreen = screenfull.isFullscreen
+ if (screenfull.enabled) {
+ screenfull.on('change', this.change)
+ destroy() {
+ screenfull.off('change', this.change)
+.screenfull-svg {
+ fill: #5a5e66;;
+ vertical-align: 10px;
@@ -1,57 +1,57 @@
- <el-dropdown trigger="click" @command="handleSetSize">
- <svg-icon class-name="size-icon" icon-class="size" />
- <el-dropdown-menu slot="dropdown">
- <el-dropdown-item v-for="item of sizeOptions" :key="item.value" :disabled="size===item.value" :command="item.value">
- {{
- item.label }}
- </el-dropdown-item>
- </el-dropdown-menu>
- </el-dropdown>
- sizeOptions: [
- { label: 'Default', value: 'default' },
- { label: 'Medium', value: 'medium' },
- { label: 'Small', value: 'small' },
- { label: 'Mini', value: 'mini' }
- size() {
- return this.$store.getters.size
- handleSetSize(size) {
- this.$ELEMENT.size = size
- this.$store.dispatch('app/setSize', size)
- this.refreshView()
- message: 'Switch Size Success',
- type: 'success'
- refreshView() {
- // In order to make the cached page re-rendered
- this.$store.dispatch('tagsView/delAllCachedViews', this.$route)
- const { fullPath } = this.$route
- this.$router.replace({
- path: '/redirect' + fullPath
+ <el-dropdown trigger="click" @command="handleSetSize">
+ <svg-icon class-name="size-icon" icon-class="size" />
+ <el-dropdown-menu slot="dropdown">
+ <el-dropdown-item v-for="item of sizeOptions" :key="item.value" :disabled="size===item.value" :command="item.value">
+ {{
+ item.label }}
+ </el-dropdown-item>
+ </el-dropdown-menu>
+ </el-dropdown>
+ sizeOptions: [
+ { label: 'Default', value: 'default' },
+ { label: 'Medium', value: 'medium' },
+ { label: 'Small', value: 'small' },
+ { label: 'Mini', value: 'mini' }
+ size() {
+ return this.$store.getters.size
+ handleSetSize(size) {
+ this.$ELEMENT.size = size
+ this.$store.dispatch('app/setSize', size)
+ this.refreshView()
+ message: 'Switch Size Success',
+ type: 'success'
+ refreshView() {
+ // In order to make the cached page re-rendered
+ this.$store.dispatch('tagsView/delAllCachedViews', this.$route)
+ const { fullPath } = this.$route
+ this.$router.replace({
+ path: '/redirect' + fullPath
- <div v-if="isExternal" :style="styleExternalIcon" class="svg-external-icon svg-icon" v-on="$listeners" />
- <svg v-else :class="svgClass" aria-hidden="true" v-on="$listeners">
- <use :xlink:href="iconName" />
-import { isExternal } from '@/utils/validate'
- name: 'SvgIcon',
- iconClass: {
- className: {
- default: ''
- isExternal() {
- return isExternal(this.iconClass)
- iconName() {
- return `#icon-${this.iconClass}`
- svgClass() {
- if (this.className) {
- return 'svg-icon ' + this.className
- return 'svg-icon'
- styleExternalIcon() {
- mask: `url(${this.iconClass}) no-repeat 50% 50%`,
- '-webkit-mask': `url(${this.iconClass}) no-repeat 50% 50%`
-.svg-icon {
- width: 1em;
- height: 1em;
-.svg-external-icon {
- background-color: currentColor;
- mask-size: cover!important;
+ <div v-if="isExternal" :style="styleExternalIcon" class="svg-external-icon svg-icon" v-on="$listeners" />
+ <svg v-else :class="svgClass" aria-hidden="true" v-on="$listeners">
+ <use :xlink:href="iconName" />
+import { isExternal } from '@/utils/validate'
+ name: 'SvgIcon',
+ iconClass: {
+ className: {
+ default: ''
+ isExternal() {
+ return isExternal(this.iconClass)
+ iconName() {
+ return `#icon-${this.iconClass}`
+ svgClass() {
+ if (this.className) {
+ return 'svg-icon ' + this.className
+ return 'svg-icon'
+ styleExternalIcon() {
+ mask: `url(${this.iconClass}) no-repeat 50% 50%`,
+ '-webkit-mask': `url(${this.iconClass}) no-repeat 50% 50%`
+.svg-icon {
+ width: 1em;
+ height: 1em;
+.svg-external-icon {
+ background-color: currentColor;
+ mask-size: cover!important;
@@ -1,175 +1,175 @@
- <el-color-picker
- v-model="theme"
- :predefine="['#409EFF', '#1890ff', '#304156','#212121','#11a983', '#13c2c2', '#6959CD', '#f5222d', ]"
- class="theme-picker"
- popper-class="theme-picker-dropdown"
-const version = require('element-ui/package.json').version // element-ui version from node_modules
-const ORIGINAL_THEME = '#409EFF' // default color
- chalk: '', // content of theme-chalk css
- theme: ''
- defaultTheme() {
- defaultTheme: {
- handler: function(val, oldVal) {
- this.theme = val
- immediate: true
- async theme(val) {
- const oldVal = this.chalk ? this.theme : ORIGINAL_THEME
- if (typeof val !== 'string') return
- const themeCluster = this.getThemeCluster(val.replace('#', ''))
- const originalCluster = this.getThemeCluster(oldVal.replace('#', ''))
- console.log(themeCluster, originalCluster)
- const $message = this.$message({
- message: ' Compiling the theme',
- customClass: 'theme-message',
- type: 'success',
- duration: 0,
- iconClass: 'el-icon-loading'
- const getHandler = (variable, id) => {
- return () => {
- const originalCluster = this.getThemeCluster(ORIGINAL_THEME.replace('#', ''))
- const newStyle = this.updateStyle(this[variable], originalCluster, themeCluster)
- let styleTag = document.getElementById(id)
- if (!styleTag) {
- styleTag = document.createElement('style')
- styleTag.setAttribute('id', id)
- document.head.appendChild(styleTag)
- styleTag.innerText = newStyle
- if (!this.chalk) {
- const url = `https://unpkg.com/element-ui@${version}/lib/theme-chalk/index.css`
- await this.getCSSString(url, 'chalk')
- const chalkHandler = getHandler('chalk', 'chalk-style')
- chalkHandler()
- const styles = [].slice.call(document.querySelectorAll('style'))
- .filter(style => {
- const text = style.innerText
- return new RegExp(oldVal, 'i').test(text) && !/Chalk Variables/.test(text)
- styles.forEach(style => {
- const { innerText } = style
- if (typeof innerText !== 'string') return
- style.innerText = this.updateStyle(innerText, originalCluster, themeCluster)
- this.$emit('change', val)
- $message.close()
- updateStyle(style, oldCluster, newCluster) {
- let newStyle = style
- oldCluster.forEach((color, index) => {
- newStyle = newStyle.replace(new RegExp(color, 'ig'), newCluster[index])
- return newStyle
- getCSSString(url, variable) {
- return new Promise(resolve => {
- const xhr = new XMLHttpRequest()
- xhr.onreadystatechange = () => {
- if (xhr.readyState === 4 && xhr.status === 200) {
- this[variable] = xhr.responseText.replace(/@font-face{[^}]+}/, '')
- resolve()
- xhr.open('GET', url)
- xhr.send()
- getThemeCluster(theme) {
- const tintColor = (color, tint) => {
- let red = parseInt(color.slice(0, 2), 16)
- let green = parseInt(color.slice(2, 4), 16)
- let blue = parseInt(color.slice(4, 6), 16)
- if (tint === 0) { // when primary color is in its rgb space
- return [red, green, blue].join(',')
- red += Math.round(tint * (255 - red))
- green += Math.round(tint * (255 - green))
- blue += Math.round(tint * (255 - blue))
- red = red.toString(16)
- green = green.toString(16)
- blue = blue.toString(16)
- return `#${red}${green}${blue}`
- const shadeColor = (color, shade) => {
- red = Math.round((1 - shade) * red)
- green = Math.round((1 - shade) * green)
- blue = Math.round((1 - shade) * blue)
- const clusters = [theme]
- for (let i = 0; i <= 9; i++) {
- clusters.push(tintColor(theme, Number((i / 10).toFixed(2))))
- clusters.push(shadeColor(theme, 0.1))
- return clusters
-.theme-message,
-.theme-picker-dropdown {
- z-index: 99999 !important;
-.theme-picker .el-color-picker__trigger {
- height: 26px !important;
- width: 26px !important;
- padding: 2px;
-.theme-picker-dropdown .el-color-dropdown__link-btn {
+ <el-color-picker
+ v-model="theme"
+ :predefine="['#409EFF', '#1890ff', '#304156','#212121','#11a983', '#13c2c2', '#6959CD', '#f5222d', ]"
+ class="theme-picker"
+ popper-class="theme-picker-dropdown"
+const version = require('element-ui/package.json').version // element-ui version from node_modules
+const ORIGINAL_THEME = '#409EFF' // default color
+ chalk: '', // content of theme-chalk css
+ theme: ''
+ defaultTheme() {
+ defaultTheme: {
+ handler: function(val, oldVal) {
+ this.theme = val
+ immediate: true
+ async theme(val) {
+ const oldVal = this.chalk ? this.theme : ORIGINAL_THEME
+ if (typeof val !== 'string') return
+ const themeCluster = this.getThemeCluster(val.replace('#', ''))
+ const originalCluster = this.getThemeCluster(oldVal.replace('#', ''))
+ console.log(themeCluster, originalCluster)
+ const $message = this.$message({
+ message: ' Compiling the theme',
+ customClass: 'theme-message',
+ type: 'success',
+ duration: 0,
+ iconClass: 'el-icon-loading'
+ const getHandler = (variable, id) => {
+ return () => {
+ const originalCluster = this.getThemeCluster(ORIGINAL_THEME.replace('#', ''))
+ const newStyle = this.updateStyle(this[variable], originalCluster, themeCluster)
+ let styleTag = document.getElementById(id)
+ if (!styleTag) {
+ styleTag = document.createElement('style')
+ styleTag.setAttribute('id', id)
+ document.head.appendChild(styleTag)
+ styleTag.innerText = newStyle
+ if (!this.chalk) {
+ const url = `https://unpkg.com/element-ui@${version}/lib/theme-chalk/index.css`
+ await this.getCSSString(url, 'chalk')
+ const chalkHandler = getHandler('chalk', 'chalk-style')
+ chalkHandler()
+ const styles = [].slice.call(document.querySelectorAll('style'))
+ .filter(style => {
+ const text = style.innerText
+ return new RegExp(oldVal, 'i').test(text) && !/Chalk Variables/.test(text)
+ styles.forEach(style => {
+ const { innerText } = style
+ if (typeof innerText !== 'string') return
+ style.innerText = this.updateStyle(innerText, originalCluster, themeCluster)
+ this.$emit('change', val)
+ $message.close()
+ updateStyle(style, oldCluster, newCluster) {
+ let newStyle = style
+ oldCluster.forEach((color, index) => {
+ newStyle = newStyle.replace(new RegExp(color, 'ig'), newCluster[index])
+ return newStyle
+ getCSSString(url, variable) {
+ return new Promise(resolve => {
+ const xhr = new XMLHttpRequest()
+ xhr.onreadystatechange = () => {
+ if (xhr.readyState === 4 && xhr.status === 200) {
+ this[variable] = xhr.responseText.replace(/@font-face{[^}]+}/, '')
+ resolve()
+ xhr.open('GET', url)
+ xhr.send()
+ getThemeCluster(theme) {
+ const tintColor = (color, tint) => {
+ let red = parseInt(color.slice(0, 2), 16)
+ let green = parseInt(color.slice(2, 4), 16)
+ let blue = parseInt(color.slice(4, 6), 16)
+ if (tint === 0) { // when primary color is in its rgb space
+ return [red, green, blue].join(',')
+ red += Math.round(tint * (255 - red))
+ green += Math.round(tint * (255 - green))
+ blue += Math.round(tint * (255 - blue))
+ red = red.toString(16)
+ green = green.toString(16)
+ blue = blue.toString(16)
+ return `#${red}${green}${blue}`
+ const shadeColor = (color, shade) => {
+ red = Math.round((1 - shade) * red)
+ green = Math.round((1 - shade) * green)
+ blue = Math.round((1 - shade) * blue)
+ const clusters = [theme]
+ for (let i = 0; i <= 9; i++) {
+ clusters.push(tintColor(theme, Number((i / 10).toFixed(2))))
+ clusters.push(shadeColor(theme, 0.1))
+ return clusters
+.theme-message,
+.theme-picker-dropdown {
+ z-index: 99999 !important;
+.theme-picker .el-color-picker__trigger {
+ height: 26px !important;
+ width: 26px !important;
+ padding: 2px;
+.theme-picker-dropdown .el-color-dropdown__link-btn {
@@ -1,179 +1,179 @@
- <div >
- <el-dialog title="选择员工" :visible.sync="visibleInChild" :append-to-body="appendToBody" fullscreen
- :before-close="close">
- <div class="el-dialog-body-custom-height">
- <el-row :gutter="20">
- <!--部门数据-->
- <el-col :span="4" :xs="24">
- <div class="head-container">
- <el-input v-model="deptName" placeholder="请输入机构名称" clearable size="small" prefix-icon="el-icon-search" style="margin-bottom: 20px" />
- <el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false" :filter-node-method="filterNode" ref="tree" default-expand-all @node-click="handleNodeClick" />
- <!--用户数据-->
- <el-col :span="20" :xs="24">
- <el-table v-loading="loading" border :data="userList" @selection-change="handleSelectionChange">
- <el-table-column type="selection" width="50" align="center" />
- <el-table-column label="帐号" align="center" prop="userName" :show-overflow-tooltip="true" />
- <el-table-column label="姓名" align="center" prop="nickName" :show-overflow-tooltip="true" />
- <el-table-column label="所属机构" align="center" prop="dept.deptName" :show-overflow-tooltip="true" />
- <el-table-column label="手机号码" align="center" prop="phonenumber" width="120" />
- </el-table>
- <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
- <div slot="footer" class="dialog-footer">
- <el-button icon="el-icon-check" type="primary" @click="submitForm">确定</el-button>
-import {getList} from "@/api/company/companyUser";
-import { getToken } from "@/utils/auth";
-import { treeselect } from "@/api/company/companyDept";
-import Treeselect from "@riophae/vue-treeselect";
-import "@riophae/vue-treeselect/dist/vue-treeselect.css";
- name: "User",
- components: { Treeselect },
- visible: {
- multipleSelect: {
- appendToBody: {
- visibleInChild: {
- return this.visible
- this.$emit('update:visible', val)
- // 遮罩层
- loading: true,
- // 选中数组
- ids: [],
- users:[],
- // 显示搜索条件
- showSearch: true,
- // 总条数
- // 用户表格数据
- userList: null,
- // 部门树选项
- deptOptions: undefined,
- // 部门名称
- deptName: undefined,
- // 表单参数
- form: {},
- defaultProps: {
- children: "children",
- label: "label",
- // 查询参数
- // 根据名称筛选部门树
- deptName(val) {
- this.$refs.tree.filter(val);
- this.getTreeselect()
- init(){
- this.getList();
- this.visibleInChild = false;
- /** 查询用户列表 */
- getList() {
- this.loading = true;
- getList(this.addDateRange(this.queryParams, this.dateRange)).then(
- (response) => {
- this.userList = response.rows;
- this.loading = false;
- );
- /** 查询部门下拉树结构 */
- getTreeselect() {
- treeselect().then((response) => {
- this.deptOptions = response.data;
- // 筛选节点
- filterNode(value, data) {
- if (!value) return true;
- return data.label.indexOf(value) !== -1;
- // 节点单击事件
- handleNodeClick(data) {
- this.queryParams.deptId = data.id;
- // 多选框选中数据
- handleSelectionChange(selection) {
- this.users=selection.map((item) => item);
- /** 提交按钮 */
- submitForm: function () {
- if(!this.multipleSelect){
- if(this.users.length>1){
- this.msgError("只能选择一个用户");
- return;
- if(this.users.length==0){
- this.msgError("请选择用户");
- this.$emit('selectUserFinished',this.users);
+ <div >
+ <el-dialog title="选择员工" :visible.sync="visibleInChild" :append-to-body="appendToBody" fullscreen
+ :before-close="close">
+ <div class="el-dialog-body-custom-height">
+ <el-row :gutter="20">
+ <!--部门数据-->
+ <el-col :span="4" :xs="24">
+ <div class="head-container">
+ <el-input v-model="deptName" placeholder="请输入机构名称" clearable size="small" prefix-icon="el-icon-search" style="margin-bottom: 20px" />
+ <el-tree :data="deptOptions" :props="defaultProps" :expand-on-click-node="false" :filter-node-method="filterNode" ref="tree" default-expand-all @node-click="handleNodeClick" />
+ <!--用户数据-->
+ <el-col :span="20" :xs="24">
+ <el-table v-loading="loading" border :data="userList" @selection-change="handleSelectionChange">
+ <el-table-column type="selection" width="50" align="center" />
+ <el-table-column label="帐号" align="center" prop="userName" :show-overflow-tooltip="true" />
+ <el-table-column label="姓名" align="center" prop="nickName" :show-overflow-tooltip="true" />
+ <el-table-column label="所属机构" align="center" prop="dept.deptName" :show-overflow-tooltip="true" />
+ <el-table-column label="手机号码" align="center" prop="phonenumber" width="120" />
+ </el-table>
+ <pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
+ <div slot="footer" class="dialog-footer">
+ <el-button icon="el-icon-check" type="primary" @click="submitForm">确定</el-button>
+import {getList} from "@/api/company/companyUser";
+import { getToken } from "@/utils/auth";
+import { treeselect } from "@/api/company/companyDept";
+import Treeselect from "@riophae/vue-treeselect";
+import "@riophae/vue-treeselect/dist/vue-treeselect.css";
+ name: "User",
+ components: { Treeselect },
+ visible: {
+ multipleSelect: {
+ appendToBody: {
+ visibleInChild: {
+ return this.visible
+ this.$emit('update:visible', val)
+ // 遮罩层
+ loading: true,
+ // 选中数组
+ ids: [],
+ users:[],
+ // 显示搜索条件
+ showSearch: true,
+ // 总条数
+ // 用户表格数据
+ userList: null,
+ // 部门树选项
+ deptOptions: undefined,
+ // 部门名称
+ deptName: undefined,
+ // 表单参数
+ form: {},
+ defaultProps: {
+ children: "children",
+ label: "label",
+ // 查询参数
+ // 根据名称筛选部门树
+ deptName(val) {
+ this.$refs.tree.filter(val);
+ this.getTreeselect()
+ init(){
+ this.getList();
+ this.visibleInChild = false;
+ /** 查询用户列表 */
+ getList() {
+ this.loading = true;
+ getList(this.addDateRange(this.queryParams, this.dateRange)).then(
+ (response) => {
+ this.userList = response.rows;
+ this.loading = false;
+ );
+ /** 查询部门下拉树结构 */
+ getTreeselect() {
+ treeselect().then((response) => {
+ this.deptOptions = response.data;
+ // 筛选节点
+ filterNode(value, data) {
+ if (!value) return true;
+ return data.label.indexOf(value) !== -1;
+ // 节点单击事件
+ handleNodeClick(data) {
+ this.queryParams.deptId = data.id;
+ // 多选框选中数据
+ handleSelectionChange(selection) {
+ this.users=selection.map((item) => item);
+ /** 提交按钮 */
+ submitForm: function () {
+ if(!this.multipleSelect){
+ if(this.users.length>1){
+ this.msgError("只能选择一个用户");
+ return;
+ if(this.users.length==0){
+ this.msgError("请选择用户");
+ this.$emit('selectUserFinished',this.users);
- * 操作权限处理
-import store from '@/store'
- inserted(el, binding, vnode) {
- const { value } = binding
- const all_permission = "*:*:*";
- const permissions = store.getters && store.getters.permissions
- if (value && value instanceof Array && value.length > 0) {
- const permissionFlag = value
- const hasPermissions = permissions.some(permission => {
- return all_permission === permission || permissionFlag.includes(permission)
- if (!hasPermissions) {
- el.parentNode && el.parentNode.removeChild(el)
- throw new Error(`请设置操作权限标签值`)
+ * 操作权限处理
+import store from '@/store'
+ inserted(el, binding, vnode) {
+ const { value } = binding
+ const all_permission = "*:*:*";
+ const permissions = store.getters && store.getters.permissions
+ if (value && value instanceof Array && value.length > 0) {
+ const permissionFlag = value
+ const hasPermissions = permissions.some(permission => {
+ return all_permission === permission || permissionFlag.includes(permission)
+ if (!hasPermissions) {
+ el.parentNode && el.parentNode.removeChild(el)
+ throw new Error(`请设置操作权限标签值`)
- * 角色权限处理
- const super_admin = "admin";
- const roles = store.getters && store.getters.roles
- const roleFlag = value
- const hasRole = roles.some(role => {
- return super_admin === role || roleFlag.includes(role)
- if (!hasRole) {
- throw new Error(`请设置角色权限标签值"`)
+ * 角色权限处理
+ const super_admin = "admin";
+ const roles = store.getters && store.getters.roles
+ const roleFlag = value
+ const hasRole = roles.some(role => {
+ return super_admin === role || roleFlag.includes(role)
+ if (!hasRole) {
+ throw new Error(`请设置角色权限标签值"`)
@@ -1,15 +1,15 @@
-import hasRole from './hasRole'
-import hasPermi from './hasPermi'
-const install = function(Vue) {
- Vue.directive('hasRole', hasRole)
- Vue.directive('hasPermi', hasPermi)
-if (window.Vue) {
- window['hasRole'] = hasRole
- window['hasPermi'] = hasPermi
- Vue.use(install); // eslint-disable-line
-export default install
+import hasRole from './hasRole'
+import hasPermi from './hasPermi'
+const install = function(Vue) {
+ Vue.directive('hasRole', hasRole)
+ Vue.directive('hasPermi', hasPermi)
+if (window.Vue) {
+ window['hasRole'] = hasRole
+ window['hasPermi'] = hasPermi
+ Vue.use(install); // eslint-disable-line
+export default install
- <section class="app-main">
- <transition name="fade-transform" mode="out-in">
- <keep-alive :include="cachedViews">
- <router-view :key="key" />
- </keep-alive>
- </transition>
- </section>
- name: 'AppMain',
- cachedViews() {
- return this.$store.state.tagsView.cachedViews
- key() {
- return this.$route.path
-.app-main {
- /* 50= navbar 50 */
- min-height: calc(100vh - 50px);
-.fixed-header+.app-main {
- padding-top: 50px;
-.hasTagsView {
- .app-main {
- /* 84 = navbar + tags-view = 50 + 34 */
- min-height: calc(100vh - 84px);
- .fixed-header+.app-main {
- padding-top: 84px;
-<style lang="scss">
-// fix css style bug in open el-dialog
-.el-popup-parent--hidden {
- .fixed-header {
+ <section class="app-main">
+ <transition name="fade-transform" mode="out-in">
+ <keep-alive :include="cachedViews">
+ <router-view :key="key" />
+ </keep-alive>
+ </transition>
+ </section>
+ name: 'AppMain',
+ cachedViews() {
+ return this.$store.state.tagsView.cachedViews
+ key() {
+ return this.$route.path
+.app-main {
+ /* 50= navbar 50 */
+ min-height: calc(100vh - 50px);
+.fixed-header+.app-main {
+ padding-top: 50px;
+.hasTagsView {
+ .app-main {
+ /* 84 = navbar + tags-view = 50 + 34 */
+ min-height: calc(100vh - 84px);
+ .fixed-header+.app-main {
+ padding-top: 84px;
+<style lang="scss">
+// fix css style bug in open el-dialog
+.el-popup-parent--hidden {
+ .fixed-header {
@@ -1,251 +1,251 @@
- <div class="navbar">
- <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
- <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/>
- <top-nav id="topmenu-container" class="breadcrumb-container" v-if="topNav"/>
- <div class="right-menu">
- <template v-if="device!=='mobile'">
- <div class="right-menu-item hover-effect">
- <el-badge v-if="msgCount>0" :value="msgCount" :max="99" class="dot">
- </el-badge>
- <div class="msg" @click="openMsg()"><i class="el-icon-message-solid"></i> </div>
- <!-- <search id="header-search" class="right-menu-item" />
- -->
- <screenfull id="screenfull" class="right-menu-item hover-effect" />
- <el-tooltip content="布局大小" effect="dark" placement="bottom">
- <size-select id="size-select" class="right-menu-item hover-effect" />
- </template>
- <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
- <div class="avatar-wrapper">
- <img :src="avatar" class="user-avatar">
- <i class="el-icon-caret-bottom" />
- <router-link to="/user/profile">
- <el-dropdown-item>个人中心</el-dropdown-item>
- </router-link>
- <el-dropdown-item @click.native="setting = true">
- <span>布局设置</span>
- <el-dropdown-item divided @click.native="logout">
- <span>退出登录</span>
- <el-drawer
- :append-to-body="true"
- size="35%"
- title="消息中心"
- :with-header="false"
- :title="msg.title" :visible.sync="msg.open"
- <msg ref="msg" @update-count="getMsgCount" />
- </el-drawer>
-import { mapGetters } from 'vuex'
-import Breadcrumb from '@/components/Breadcrumb'
-import TopNav from '@/components/TopNav'
-import Hamburger from '@/components/Hamburger'
-import Screenfull from '@/components/Screenfull'
-import SizeSelect from '@/components/SizeSelect'
-import Search from '@/components/HeaderSearch'
-import msg from "@/views/crm/components/msg";
-import { getMsg,getMsgList,getMsgCount,setRead } from "@/api/crm/msg";
- components: {
- Breadcrumb,
- TopNav,
- Hamburger,
- Screenfull,
- SizeSelect,
- Search,
- msg
- ...mapGetters([
- 'sidebar',
- 'avatar',
- 'device'
- ]),
- setting: {
- topNav: {
- return this.$store.state.settings.topNav
- msgCount:0,
- msg:{
- open:false,
- title:'通知消息'
- this.getMsgCount();
- getMsgCount(){
- getMsgCount().then(response => {
- this.msgCount = response.counts;
- if(this.msgCount>0){
- this.$notify({
- title: '提示',
- message: '您有'+this.msgCount+"条消息通知",
- position: 'top-right'
- openMsg(){
- console.log(11);
- this.msg.open=true;
- toggleSideBar() {
- this.$store.dispatch('app/toggleSideBar')
- async logout() {
- this.$confirm('确定注销并退出系统吗?', '提示', {
- this.$store.dispatch('LogOut').then(() => {
- location.href = '/index';
-.navbar {
- box-shadow: 0 1px 4px rgba(0,21,41,.08);
- .hamburger-container {
- line-height: 46px;
- transition: background .3s;
- -webkit-tap-highlight-color:transparent;
- background: rgba(0, 0, 0, .025)
- .breadcrumb-container {
- .errLog-container {
- vertical-align: top;
- .right-menu {
- &:focus {
- .right-menu-item {
- padding: 0 8px;
- color: #5a5e66;
- vertical-align: text-bottom;
- .msg{
- width:40px;
- .dot{
- right:0px;
- top:0px;
- &.hover-effect {
- .avatar-container {
- margin-right: 30px;
- .avatar-wrapper {
- .user-avatar {
- width: 40px;
- border-radius: 10px;
- .el-icon-caret-bottom {
- right: -20px;
- top: 25px;
+ <div class="navbar">
+ <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
+ <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/>
+ <top-nav id="topmenu-container" class="breadcrumb-container" v-if="topNav"/>
+ <div class="right-menu">
+ <template v-if="device!=='mobile'">
+ <div class="right-menu-item hover-effect">
+ <el-badge v-if="msgCount>0" :value="msgCount" :max="99" class="dot">
+ </el-badge>
+ <div class="msg" @click="openMsg()"><i class="el-icon-message-solid"></i> </div>
+ <!-- <search id="header-search" class="right-menu-item" />
+ -->
+ <screenfull id="screenfull" class="right-menu-item hover-effect" />
+ <el-tooltip content="布局大小" effect="dark" placement="bottom">
+ <size-select id="size-select" class="right-menu-item hover-effect" />
+ </template>
+ <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
+ <div class="avatar-wrapper">
+ <img :src="avatar" class="user-avatar">
+ <i class="el-icon-caret-bottom" />
+ <router-link to="/user/profile">
+ <el-dropdown-item>个人中心</el-dropdown-item>
+ </router-link>
+ <el-dropdown-item @click.native="setting = true">
+ <span>布局设置</span>
+ <el-dropdown-item divided @click.native="logout">
+ <span>退出登录</span>
+ <el-drawer
+ :append-to-body="true"
+ size="35%"
+ title="消息中心"
+ :with-header="false"
+ :title="msg.title" :visible.sync="msg.open"
+ <msg ref="msg" @update-count="getMsgCount" />
+ </el-drawer>
+import { mapGetters } from 'vuex'
+import Breadcrumb from '@/components/Breadcrumb'
+import TopNav from '@/components/TopNav'
+import Hamburger from '@/components/Hamburger'
+import Screenfull from '@/components/Screenfull'
+import SizeSelect from '@/components/SizeSelect'
+import Search from '@/components/HeaderSearch'
+import msg from "@/views/crm/components/msg";
+import { getMsg,getMsgList,getMsgCount,setRead } from "@/api/crm/msg";
+ components: {
+ Breadcrumb,
+ TopNav,
+ Hamburger,
+ Screenfull,
+ SizeSelect,
+ Search,
+ msg
+ ...mapGetters([
+ 'sidebar',
+ 'avatar',
+ 'device'
+ ]),
+ setting: {
+ topNav: {
+ return this.$store.state.settings.topNav
+ msgCount:0,
+ msg:{
+ open:false,
+ title:'通知消息'
+ this.getMsgCount();
+ getMsgCount(){
+ getMsgCount().then(response => {
+ this.msgCount = response.counts;
+ if(this.msgCount>0){
+ this.$notify({
+ title: '提示',
+ message: '您有'+this.msgCount+"条消息通知",
+ position: 'top-right'
+ openMsg(){
+ console.log(11);
+ this.msg.open=true;
+ toggleSideBar() {
+ this.$store.dispatch('app/toggleSideBar')
+ async logout() {
+ this.$confirm('确定注销并退出系统吗?', '提示', {
+ this.$store.dispatch('LogOut').then(() => {
+ location.href = '/index';
+.navbar {
+ box-shadow: 0 1px 4px rgba(0,21,41,.08);
+ .hamburger-container {
+ line-height: 46px;
+ transition: background .3s;
+ -webkit-tap-highlight-color:transparent;
+ background: rgba(0, 0, 0, .025)
+ .breadcrumb-container {
+ .errLog-container {
+ vertical-align: top;
+ .right-menu {
+ &:focus {
+ .right-menu-item {
+ padding: 0 8px;
+ color: #5a5e66;
+ vertical-align: text-bottom;
+ .msg{
+ width:40px;
+ .dot{
+ right:0px;
+ top:0px;
+ &.hover-effect {
+ .avatar-container {
+ margin-right: 30px;
+ .avatar-wrapper {
+ .user-avatar {
+ width: 40px;
+ border-radius: 10px;
+ .el-icon-caret-bottom {
+ right: -20px;
+ top: 25px;
@@ -1,125 +1,125 @@
- <div class="drawer-container">
- <h3 class="drawer-title">系统布局配置</h3>
- <div class="drawer-item">
- <span>主题颜色</span>
- <theme-picker style="float: right;height: 26px;margin: -3px 8px 0 0;" @change="themeChange" />
- <span>开启 顶部菜单</span>
- <el-switch v-model="topNav" class="drawer-switch" />
- <span>开启 Tags-Views</span>
- <el-switch v-model="tagsView" class="drawer-switch" />
- <span>固定 Header</span>
- <el-switch v-model="fixedHeader" class="drawer-switch" />
- <span>显示 Logo</span>
- <el-switch v-model="sidebarLogo" class="drawer-switch" />
-import ThemePicker from '@/components/ThemePicker'
- components: { ThemePicker },
- return {}
- fixedHeader: {
- return this.$store.state.settings.fixedHeader
- key: 'fixedHeader',
- key: 'topNav',
- if (!val) {
- this.$store.commit("SET_SIDEBAR_ROUTERS", this.$store.state.permission.defaultRoutes);
- tagsView: {
- return this.$store.state.settings.tagsView
- key: 'tagsView',
- sidebarLogo: {
- return this.$store.state.settings.sidebarLogo
- key: 'sidebarLogo',
- themeChange(val) {
- key: 'theme',
-.drawer-container {
- padding: 24px;
- line-height: 1.5;
- word-wrap: break-word;
- .drawer-title {
- margin-bottom: 12px;
- color: rgba(0, 0, 0, .85);
- line-height: 22px;
- .drawer-item {
- color: rgba(0, 0, 0, .65);
- padding: 12px 0;
- .drawer-switch {
- float: right
+ <div class="drawer-container">
+ <h3 class="drawer-title">系统布局配置</h3>
+ <div class="drawer-item">
+ <span>主题颜色</span>
+ <theme-picker style="float: right;height: 26px;margin: -3px 8px 0 0;" @change="themeChange" />
+ <span>开启 顶部菜单</span>
+ <el-switch v-model="topNav" class="drawer-switch" />
+ <span>开启 Tags-Views</span>
+ <el-switch v-model="tagsView" class="drawer-switch" />
+ <span>固定 Header</span>
+ <el-switch v-model="fixedHeader" class="drawer-switch" />
+ <span>显示 Logo</span>
+ <el-switch v-model="sidebarLogo" class="drawer-switch" />
+import ThemePicker from '@/components/ThemePicker'
+ components: { ThemePicker },
+ return {}
+ fixedHeader: {
+ return this.$store.state.settings.fixedHeader
+ key: 'fixedHeader',
+ key: 'topNav',
+ if (!val) {
+ this.$store.commit("SET_SIDEBAR_ROUTERS", this.$store.state.permission.defaultRoutes);
+ tagsView: {
+ return this.$store.state.settings.tagsView
+ key: 'tagsView',
+ sidebarLogo: {
+ return this.$store.state.settings.sidebarLogo
+ key: 'sidebarLogo',
+ themeChange(val) {
+ key: 'theme',
+.drawer-container {
+ padding: 24px;
+ line-height: 1.5;
+ word-wrap: break-word;
+ .drawer-title {
+ margin-bottom: 12px;
+ color: rgba(0, 0, 0, .85);
+ line-height: 22px;
+ .drawer-item {
+ color: rgba(0, 0, 0, .65);
+ padding: 12px 0;
+ .drawer-switch {
+ float: right
@@ -1,25 +1,25 @@
- device() {
- return this.$store.state.app.device
- // In order to fix the click on menu on the ios device will trigger the mouseleave bug
- this.fixBugIniOS()
- fixBugIniOS() {
- const $subMenu = this.$refs.subMenu
- if ($subMenu) {
- const handleMouseleave = $subMenu.handleMouseleave
- $subMenu.handleMouseleave = (e) => {
- if (this.device === 'mobile') {
- handleMouseleave(e)
+ device() {
+ return this.$store.state.app.device
+ // In order to fix the click on menu on the ios device will trigger the mouseleave bug
+ this.fixBugIniOS()
+ fixBugIniOS() {
+ const $subMenu = this.$refs.subMenu
+ if ($subMenu) {
+ const handleMouseleave = $subMenu.handleMouseleave
+ $subMenu.handleMouseleave = (e) => {
+ if (this.device === 'mobile') {
+ handleMouseleave(e)
@@ -1,29 +1,29 @@
- name: 'MenuItem',
- functional: true,
- icon: {
- title: {
- render(h, context) {
- const { icon, title } = context.props
- const vnodes = []
- if (icon) {
- vnodes.push(<svg-icon icon-class={icon}/>)
- if (title) {
- vnodes.push(<span slot='title'>{(title)}</span>)
- return vnodes
+ name: 'MenuItem',
+ functional: true,
+ icon: {
+ title: {
+ render(h, context) {
+ const { icon, title } = context.props
+ const vnodes = []
+ if (icon) {
+ vnodes.push(<svg-icon icon-class={icon}/>)
+ if (title) {
+ vnodes.push(<span slot='title'>{(title)}</span>)
+ return vnodes
- <component :is="type" v-bind="linkProps(to)">
- </component>
- to: {
- return isExternal(this.to)
- type() {
- if (this.isExternal) {
- return 'a'
- return 'router-link'
- linkProps(to) {
- href: to,
- target: '_blank',
- rel: 'noopener'
- to: to
+ <component :is="type" v-bind="linkProps(to)">
+ </component>
+ to: {
+ return isExternal(this.to)
+ type() {
+ if (this.isExternal) {
+ return 'a'
+ return 'router-link'
+ linkProps(to) {
+ href: to,
+ target: '_blank',
+ rel: 'noopener'
+ to: to
@@ -1,83 +1,83 @@
- <div class="sidebar-logo-container" :class="{'collapse':collapse}">
- <transition name="sidebarLogoFade">
- <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
- <img v-if="logo" :src="logo" class="sidebar-logo">
- <h1 v-else class="sidebar-title">{{ title }} </h1>
- <router-link v-else key="expand" class="sidebar-logo-link" to="/">
- <h1 class="sidebar-title">{{ title }} </h1>
-import logoImg from '@/assets/logo/crm.png'
- name: 'SidebarLogo',
- collapse: {
- title: '御君方管理平台',
- logo: logoImg
-.sidebarLogoFade-enter-active {
- transition: opacity 1.5s;
-.sidebarLogoFade-enter,
-.sidebarLogoFade-leave-to {
-.sidebar-logo-container {
- & .sidebar-logo-link {
- & .sidebar-logo {
- width: 32px;
- height: 32px;
- margin-right: 12px;
- & .sidebar-title {
- font-weight: 600;
- font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
- &.collapse {
- .sidebar-logo {
+ <div class="sidebar-logo-container" :class="{'collapse':collapse}">
+ <transition name="sidebarLogoFade">
+ <router-link v-if="collapse" key="collapse" class="sidebar-logo-link" to="/">
+ <img v-if="logo" :src="logo" class="sidebar-logo">
+ <h1 v-else class="sidebar-title">{{ title }} </h1>
+ <router-link v-else key="expand" class="sidebar-logo-link" to="/">
+ <h1 class="sidebar-title">{{ title }} </h1>
+import logoImg from '@/assets/logo/crm.png'
+ name: 'SidebarLogo',
+ collapse: {
+ title: '御君方管理平台',
+ logo: logoImg
+.sidebarLogoFade-enter-active {
+ transition: opacity 1.5s;
+.sidebarLogoFade-enter,
+.sidebarLogoFade-leave-to {
+.sidebar-logo-container {
+ & .sidebar-logo-link {
+ & .sidebar-logo {
+ width: 32px;
+ height: 32px;
+ margin-right: 12px;
+ & .sidebar-title {
+ font-weight: 600;
+ font-family: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
+ &.collapse {
+ .sidebar-logo {