Skip to content

H
haoban-3
Commit d30be4c7 by crushh
Options

update: 完成

parent 5dabb33c
Showing with 387 additions and 114 deletions
src/api/api.js
......@@ -66,12 +66,12 @@ Vue.axios.interceptors.response.use(
removePending(data.config); //在一个ajax响应后再执行一下取消操作，把已经完成的请求从pending中移除
// console.log(data);
if (data.status && data.status == 200 && data.data.errorCode != 1) {
// if (data.data.errorCode == 4) {
// if (window.location.href.indexOf('gic-error') != -1) {
// return false;
// }
// window.location.href = local + '/haoban-3/#/login';
// }
if (data.data.errorCode == 4) {
if (window.location.href.indexOf('gic-error') != -1) {
return false;
}
window.location.href = local + '/haoban-3/#/login';
}
if (data.data.errorCode == 10 || data.data.errorCode == 7) {
window.location.href = local + '/haoban-3/#/index';
......@@ -81,14 +81,14 @@ Vue.axios.interceptors.response.use(
return data;
},
err => {
// if (err.response.status == 502) {
// window.location.href = local + '/haoban-3/#/login';
// Message.error({ message: '服务异常⊙﹏⊙∥' });
// }
// if (err.response.status != 403) {
// window.location.href = local + '/haoban-3/#/login';
// Message.error({ message: '登录失效!' });
// }
if (err.response.status == 502) {
window.location.href = local + '/haoban-3/#/login';
Message.error({ message: '服务异常⊙﹏⊙∥' });
}
if (err.response.status != 403) {
window.location.href = local + '/haoban-3/#/login';
Message.error({ message: '登录失效!' });
}
return Promise.resolve(err);
}
);
......
src/common/js/error.js
......@@ -17,10 +17,10 @@ export default {
local = 'http://www.gicdev.com';
} */
if (response.errorCode != 1) {
// if (response.errorCode == 4) {
// window.location.href = local + '/haoban-3/#/login';
// return false;
// }
if (response.errorCode == 4) {
window.location.href = local + '/haoban-3/#/login';
return false;
}
if (response.errorCode == 10) {
window.location.href = local + '/haoban-3/#/index';
return false;
......
src/components/vue-office-header.vue
......@@ -224,7 +224,7 @@ export default {
type: 'success'
});
// 跳转登录页
// window.location.href = window.location.origin + '/haoban-3/#/login';
window.location.href = window.location.origin + '/haoban-3/#/login';
return;
}
that.$message.error({
......
src/views/enterprise/salutatory.vue
......@@ -33,7 +33,7 @@
</el-table-column>
<el-table-column label="附件">
<template slot-scope="{ row }">
<el-popover placement="top-start" trigger="click">
<el-popover placement="top-start" trigger="hover">
<div class="flexBox" v-for="item in row.welcomeMediaList" :key="item.welcomeMediaId">
<svg-icon :iconname="iconType[item.mediaType]" size="16" style="margin-right: 13px;"> </svg-icon>
<span class="popverText">{{ item.mediaTitle }}</span>
......@@ -49,7 +49,9 @@
<template slot-scope="{ row }">{{ row.updateTime }}</template>
</el-table-column>
<el-table-column prop="operatorName" label="操作人" width="120" show-overflow-tooltip> </el-table-column>
<el-table-column prop="suitDepartmentName" label="适用范围" width="120" show-overflow-tooltip> </el-table-column>
<el-table-column prop="suitDepartmentName" label="适用范围" width="120" show-overflow-tooltip>
<template slot-scope="{ row }">{{ row.suitDepartmentName.join(',') }}</template>
</el-table-column>
<el-table-column label="操作" width="180">
<template slot-scope="{ row }">
<el-button type="text" @click="changeRoute(row)">编辑</el-button>
......@@ -59,10 +61,14 @@
</el-table>
</div>
</div>
<el-dialog title="加好友配置" :visible.sync="dialogVisible" width="570px" :before-close="handleClose">
<el-form label-width="100px">
<el-dialog title="加好友配置" :visible.sync="dialogVisible" width="590px" :before-close="handleClose">
<span class="tips">好办欢迎语支持文字、图片、视频、文件、链接及小程序</span>
<el-form label-width="100px" style="margin-top:20px">
<el-form-item label="加好友配置">
<el-radio :label="Number(key)" v-model="type" v-for="(val, key) in friendSettingTypeOption" :key="key">{{ val }}</el-radio>
<div v-for="(val, key) in friendSettingTypeOption" :key="key">
<el-radio :label="Number(key)" v-model="type">{{ val }}</el-radio>
<el-tag size="small" v-show="key == 1">推荐使用</el-tag>
</div>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
......@@ -98,38 +104,7 @@ export default {
3: 'iconwenjianleixing-wenjian',
4: 'iconwenjianleixing-lianjie'
},
tableData: [
{
title: '华东区欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎语',
welcomeContent: '华东区欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎语华东区欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎欢迎语',
welcomeMediaList: [
{
welcomeMediaId: '121',
mediaTitle: '图片名称图片名称图片名称图片名称图片名称',
mediaType: 1
},
{
welcomeMediaId: '11',
mediaTitle: '视频名称视频名称视频名称视频名称视频名称视频名称视频名称视频名称视频名称视频名称',
mediaType: 2
},
{
welcomeMediaId: '12',
mediaTitle: '文件名称文件名称文件名称文件名称文件名称文件名称文件名称文件名称文件名称文件名称文件名称',
mediaType: 3
},
{
welcomeMediaId: '13',
mediaTitle: 'http://baidusadsssssssssssssssssssssssssssssssasasa.com',
mediaType: 4
}
],
updateTime: '2021-12-12 12:11:00',
operatorName: '稻米',
g1: '百度一下你就知道',
suitDepartmentName: '华东分部'
}
]
tableData: []
};
},
mounted() {
......@@ -194,7 +169,7 @@ export default {
* 跳转
*/
changeRoute(row) {
this.$router.push({ path: '/salutatorySet', query: { id: row.welcomeId } });
this.$router.push({ path: '/salutatorySet', query: { id: row.welcomeId, type: this.friendSettingType } });
},
/**
......@@ -206,6 +181,14 @@ export default {
let resData = res.data;
if (resData.code == 0 && resData.result) {
this.tableData = resData.result;
this.tableData.forEach(item => {
item.suitDepartmentName = [];
if (item.suitDepartmentList && item.suitDepartmentList.length) {
item.suitDepartmentList.forEach(ele => {
item.suitDepartmentName.push(ele.departmentName);
});
}
});
}
})
.catch(error => {
......@@ -275,6 +258,9 @@ export default {
}
}
}
.el-radio {
margin-right: 0;
}
.el-radio + .el-radio {
margin-left: 0;
}
......
src/views/enterprise/salutatorySet.vue
......@@ -43,7 +43,7 @@
<div class="addInfo" :style="form.welcomeMediaList && form.welcomeMediaList.length ? 'border-top: 1px dashed #dcdfe6;' : ''">
<el-popover placement="top" trigger="click">
<ul class="flex flex-wrap">
<li v-for="(item, index) in uploadList" :key="index + 'emoji'" class="uploadListBox" @click="handleUploadList(item, index)">
<li v-for="(item, index) in uploadList" :key="index + 'emoji'" :class="['uploadListBox', (item.title == '小程序' && haveAddApplet) || form.welcomeMediaList.length >= 9 ? 'disabled' : '']" @click="handleUploadList(item, index)">
<i :class="['iconfont-hb3', item.icon]" style="font-size:20px"></i>
<p>{{ item.title }}</p>
<input type="file" :accept="item.fileType" @change="e => handkeFileChange(e, item)" class="upload-input" />
......@@ -54,21 +54,27 @@
<p>添加图片/视频/文件/链接/小程序</p>
</div>
</el-popover>
<p style="font-size:12px;color:#909399">(附件不超过9个，单个大小不超过2M)</p>
<p style="font-size:12px;color:#909399">(附件不超过9个，单个大小不超过2M，小程序仅支持添加1个)</p>
</div>
</el-form-item>
<el-form-item label="使用范围">
<!-- <span @click="openDialog">请选择使用范围</span> -->
<div v-show="form.suitDepartmentAddList.length">
<el-tag size="small" v-for="(item, index) in form.suitDepartmentAddList" closable @close="handleTagClose(index)" :key="item.departmentId">
{{ item.departmentName }}
</el-tag>
</div>
<span @click="openScopeDialog" class="color-2f54eb cursor-pointer" style="margin-left:8px;"> 请选择使用范围</span>
</el-form-item>
<el-button type="primary" style="margin-left:117px;" @click="submit">保存</el-button>
<el-button type="primary" style="margin-left:117px;" :loading="btnLoading" @click="submit">保存</el-button>
</el-form>
<div class="iphone">
<div class="infoList">
<div class="infoListBox" v-if="form.welcomeContent">
<div class="infoListBox" v-if="form.welcomeContent || form.title">
<div class="infoAvatar">
<img src="@/assets/head_default.jpg" />
</div>
<div class="textInfo">
<div class="content" style="font-size:14px;font-weight: 500;">{{ form.title }}</div>
<div class="content" v-html="form.welcomeContent"></div>
</div>
</div>
......@@ -85,7 +91,7 @@
<div v-if="item.mediaType == 3" class="docInfo">
<div class="docTitle">
<b>{{ item.mediaTitle }}</b>
<p>{{ item.mediaSize }}</p>
<p>{{ item.mediaSize }} KB</p>
</div>
<svg-icon iconname="iconwenjianleixing-wenjian" size="40"> </svg-icon>
</div>
......@@ -98,6 +104,7 @@
</div>
<div v-if="item.mediaType == 5" class="appletsInfo">
<div class="appletsTitle">{{ item.mediaTitle }}</div>
<div class="appletsTitle" style="font-size:12px">{{ item.mediaMiniTitle }}</div>
<img :src="item.mediaUrl" />
</div>
</div>
......@@ -136,13 +143,13 @@
</div>
<el-form label-position="right" ref="form" :model="{}" label-width="100px">
<el-form-item label="小程序名称">
<span>京东零售</span>
<span>{{ applet.miniprogramName }}</span>
</el-form-item>
<el-form-item label="标题">
<span>京东零售助力</span>
<span>{{ applet.title }}</span>
</el-form-item>
<el-form-item label="封面">
<img src="@/assets/logo.png" />
<img :src="applet.imageUrl" style="width:128px;height:128px;border-radius: 4px;" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
......@@ -150,15 +157,46 @@
<el-button type="primary" @click="addapplets">确认添加</el-button>
</div>
</el-dialog>
<el-dialog title="请选择使用范围" width="886px" class="replay-link-dialog" :visible.sync="scopeVisible" @closed="clearAllSelectedData">
<div class="scopeBox">
<div class="left">
<el-input placeholder="请输入部门名称" maxlength="50" v-model="filterText" style="width: 398px;" clearable @clear="handlefilterTextClear" @keyup.native="value => toInput(value, searchInput)"> <i slot="prefix" class="el-input__icon el-icon-search"></i> </el-input>
<el-tree v-loading="loading" ref="tree" :data="treeData" show-checkbox node-key="departmentId" :props="defaultProps" :expand-on-click-node="false" class="tree" :check-strictly="true" :render-after-expand="false" @check-change="handleCheckChange">
<span class="custom-tree-node" slot-scope="{ node }">
<span class="font-14 color-2f54eb opacity80 iconfont-hb3 iconqiye-tianchong"></span>
<span>{{ node.label }}</span>
</span>
</el-tree>
</div>
<div class="right">
<div class="right-top">
<span>已选：{{ selectedTreeData.length }}个部门</span><span @click="clearAllSelectedData" class="color-2f54eb cursor-pointer">清空</span>
</div>
<ul v-if="selectedTreeData.length">
<li class="contact-li" v-for="(item, index) in selectedTreeData" :key="index + 'gic'">
<div class="li-cell cursor-pointer">
<div>
<span class="font-14 color-2f54eb opacity80 iconfont-hb3 iconqiye-tianchong"></span>
<span class="font-14 color-303133 span-departName"> {{ item.departmentName }}</span>
</div>
<i class="el-icon-close" @click="handleSelectedDataCancel(item, index)"></i>
</div>
</li>
</ul>
</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="scopeVisible = false">取消</el-button>
<el-button type="primary" @click="addSuitDepartment">确认</el-button>
</div>
</el-dialog>
</div>
</div>
</template>
<script>
import { getRequest, postForm, postJsonRequest } from '@/api/api';
// import { _debounce } from '@/common/js/public';
// import showMsg from '@/common/js/showmsg';
import { _debounce } from '@/common/js/public';
import limitTextarea from '@/components/limit-textarea.vue';
import errMsg from '@/common/js/error';
import { emojiArr } from '@/utils/emoji';
import multUpload from '@/components/mult-upload-img.vue';
import singleUpload from '@/components/single-upload.vue';
......@@ -166,10 +204,15 @@ export default {
props: {},
data() {
return {
filterText: '',
defaultProps: {
label: 'departmentName'
},
form: {
title: '系统默认',
welcomeContent: '你好，<微信昵称>',
welcomeMediaList: []
welcomeMediaList: [],
suitDepartmentAddList: []
},
uploadList: [
{
......@@ -213,17 +256,35 @@ export default {
addReplayDialog: false,
url: '',
urlDialogVisible: false,
appletsDialogVisible: false
appletsDialogVisible: false,
scopeVisible: false,
treeData: [],
treeDataCopy: [],
loading: false,
btnLoading: false,
selectedTreeData: [],
applet: {},
friendSettingType: ''
};
},
watch: {},
computed: {
haveAddApplet() {
return this.form.welcomeMediaList.filter(item => item.mediaType == 5).length > 0;
}
},
mounted() {
const that = this;
that.$emit('showTab', 4);
document.documentElement.style.backgroundColor = '#f0f2f5';
if (this.$route.query.id) {
const { id, type } = this.$route.query;
if (id) {
that.getData();
}
if (type) {
this.friendSettingType = type;
}
this.getAppData();
},
destroyed() {
document.documentElement.style.backgroundColor = '#fff';
......@@ -234,6 +295,139 @@ export default {
multUpload
},
methods: {
getAppData() {
// 获取小程序
getRequest('/haoban-manage3-web/list-miniprogram-setting', {})
.then(res => {
let resData = res.data;
if (resData.errorCode == 1 && resData.result) {
this.applet = resData.result.length && resData.result[0];
}
})
.catch(function(error) {
this.$message.error({
duration: 1000,
message: error.message
});
});
},
addSuitDepartment() {
this.form.suitDepartmentAddList = Object.assign([], this.selectedTreeData);
this.clearAllSelectedData();
this.scopeVisible = false;
},
handleTagClose(index) {
this.form.suitDepartmentAddList.splice(index, 1);
},
clearAllSelectedData() {
// 清空 右侧 被选中部门树的数据 和 清空 部门树的 选中节点
this.$refs.tree.setCheckedKeys([]);
},
handleSelectedDataCancel(item, index) {
// 删除 右侧 被选中部门树的数据
this.selectedTreeData.splice(index, 1);
console.log(this.selectedTreeData);
this.$refs.tree.setChecked(item.departmentId, false, true);
},
handlefilterTextClear() {
// 清空搜索部门树条件
this.treeData = this.handleTreeData(JSON.parse(JSON.stringify(this.treeDataCopy)));
this.$nextTick(() => {
this.$refs.tree.store._getAllNodes()[0].expanded = true;
if (this.selectedTreeData.length) {
this.$refs.tree.setCheckedKeys(this.selectedTreeData.map(item => item.departmentId));
} else {
this.$refs.tree.setCheckedKeys([]);
}
});
},
toInput: _debounce(function(e, value) {
// 前端搜索部门树
const that = this;
if (!that.filterText) {
that.handlefilterTextClear();
} else {
that.getSearchData();
}
}, 500),
getSearchData() {
// 前端搜索部门树
this.treeData = this.treeDataCopy.filter(ele => ele.departmentName.indexOf(this.filterText) != -1);
if (this.selectedTreeData.length) {
this.$refs.tree.setCheckedKeys(this.selectedTreeData.map(item => item.departmentId));
} else {
this.$refs.tree.setCheckedKeys([]);
}
},
handleCheckChange(data, checked, indeterminate) {
// 部门树选中变化时
const obj = JSON.parse(JSON.stringify(data));
obj.children ? delete obj.children : '';
if (checked) {
if (!this.selectedTreeData.filter(item => item.departmentId == obj.departmentId).length) this.selectedTreeData.push(obj);
} else {
this.selectedTreeData = this.selectedTreeData.filter(item => item.departmentId !== obj.departmentId);
}
console.log(this.selectedTreeData);
},
/**
* 获取部门树数据
*/
getTableList(val) {
let para = {
isStore: 0, // 当前页
parentId: '' // 一页显示个数
};
this.loading = true;
getRequest('/haoban-manage3-web/department-list-cache', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
if (!!resData.result && resData.result.length) {
this.treeData = this.handleTreeData(JSON.parse(JSON.stringify(resData.result)));
this.$nextTick(() => {
this.$refs.tree.store._getAllNodes()[0].expanded = true;
});
this.treeDataCopy = resData.result;
}
}
})
.catch(function(error) {
this.$message.error({
duration: 1000,
message: error.message
});
})
.finally(() => {
this.loading = false;
});
},
handleTreeData(data) {
let tree = data.filter(father => {
//循环所有项
let branchArr = data.filter(child => {
return father.departmentId == child.parentDepartmentId; //返回每一项的子级数组
});
if (branchArr.length > 0) {
father.hasSonNode = true;
father.children = branchArr; //如果存在子级，则给父级添加一个children属性，并赋值
} else {
father.hasSonNode = false;
}
return father.parentDepartmentId == 0; //返回第一层
});
console.log(tree);
return tree;
},
openScopeDialog() {
// 选择范围打开部门树弹窗
this.getTableList();
this.scopeVisible = true;
this.$nextTick(() => {
this.selectedTreeData = this.form.suitDepartmentAddList;
this.$refs.tree.setCheckedKeys(this.form.suitDepartmentAddList.map(item => item.departmentId));
});
},
blank(url) {
window.open(url);
},
......@@ -255,6 +449,10 @@ export default {
const file = e.target.files[0]; // only use files[0]
console.log(file);
let fileType = '';
if (file.size > 2000000) {
this.$message.error('单个大小不超过2M');
return false;
}
if (item.title == '图片') {
const isJPG = file.type === 'image/jpeg' || file.type === 'image/jpg' || file.type === 'image/png';
if (!isJPG) {
......@@ -289,11 +487,13 @@ export default {
}
if (data.errorCode == 1 && data.result) {
const obj = {
mediaTitle: data.result.mediaName,
mediaTitle: file.name,
mediaType,
mediaUrl: data.result.url,
mediaSize: data.result.size
mediaUrl: data.result.url
};
if (mediaType == 3) {
obj.mediaSize = (data.result.size / 1024).toFixed(2);
}
this.form.welcomeMediaList.push(obj);
}
});
......@@ -331,10 +531,10 @@ export default {
},
addapplets() {
this.form.welcomeMediaList.push({
mediaTitle: 'GIC达摩网络',
mediaMiniTitle: 'GIC达摩网络测试',
mediaTitle: this.applet.miniprogramName,
mediaMiniTitle: this.applet.title,
mediaType: 5,
mediaUrl: 'http://wx.qlogo.cn/mmopen/hjm3uRjuvbpjkwJXg1ZxP3f1pHffFzVFWjiardNzjonpeLicibOw1AKicecgHIsm17zpjYWl3YYW8Rml1PCxgk3saSuP3hzUlcky/0',
mediaUrl: this.applet.imageUrl,
mediaSize: ''
});
this.appletsDialogVisible = false;
......@@ -366,7 +566,10 @@ export default {
.then(res => {
let resData = res.data;
if (resData.code == 0 && resData.result) {
this.form = resData.result;
const { suitDepartmentList, title, welcomeId, welcomeContent, welcomeMediaList, wxEnterpriseId } = resData.result;
this.form = { suitDepartmentList, suitDepartmentAddList: JSON.parse(JSON.stringify(suitDepartmentList)) || [], title, welcomeId, welcomeContent, welcomeMediaList, wxEnterpriseId };
console.log(this.form);
this.form = Object.assign({}, this.form);
}
})
.catch(error => {
......@@ -377,37 +580,58 @@ export default {
});
},
submit() {
const that = this;
that.$refs.form.validate(value => {
this.$refs.form.validate(value => {
if (value) {
this.$confirm('确认保存此欢迎语？', '提示')
.then(() => {
const para = { ...that.form };
para.wxEnterpriseId = this.wxEnterpriseId;
this.btnLoading = true;
postJsonRequest('/haoban-manage3-web/welcome/save', para)
.then(res => {
let resData = res.data;
if (resData.errorCode == 1) {
this.$message({
type: 'success',
message: '保存成功!'
});
window.location.reload();
}
errMsg.errorMsg(resData);
})
.catch(function(error) {
that.$message.error({
duration: 1000,
message: error.message
});
})
.finally(() => {
this.btnLoading = false;
const { suitDepartmentAddList, suitDepartmentList, title, welcomeId, welcomeContent, welcomeMediaList, wxEnterpriseId } = this.form;
const para = { title, welcomeId, welcomeContent, mediaList: welcomeMediaList, wxEnterpriseId: wxEnterpriseId || this.wxEnterpriseId };
if (!suitDepartmentAddList.length) {
para.suitDepartmentDeleteList = suitDepartmentList;
para.suitDepartmentAddList = [];
} else {
const addArr = [];
const delArr = [];
suitDepartmentAddList.forEach(ele => {
if (!suitDepartmentList.filter(item => item.departmentId == ele.departmentId).length) {
addArr.push(ele);
}
});
suitDepartmentList.forEach(ele => {
if (!suitDepartmentAddList.filter(item => item.departmentId == ele.departmentId).length) {
delArr.push(ele);
}
});
para.suitDepartmentAddList = addArr;
para.suitDepartmentDeleteList = delArr;
}
para.suitDepartmentAddList.forEach(item => {
item.selectType = 1;
});
para.suitDepartmentDeleteList.forEach(item => {
item.selectType = 1;
});
console.log(para);
this.btnLoading = true;
postJsonRequest('/haoban-manage3-web/welcome/save', para)
.then(res => {
let resData = res.data;
if (resData.code == 0) {
this.$message({
type: 'success',
message: '保存成功!'
});
this.$router.push('/salutatory');
}
})
.catch(function(error) {
this.$message.error({
duration: 1000,
message: error.message
});
})
.catch();
.finally(() => {
this.btnLoading = false;
});
}
});
}
......@@ -454,9 +678,9 @@ export default {
box-sizing: border-box;
p {
display: inline-block;
margin-left: 8px;
margin-left: 5px;
}
p:hover {
&:hover {
color: #2f54eb;
}
}
......@@ -475,6 +699,10 @@ export default {
border: 1px solid #2f54eb;
}
}
.disabled {
pointer-events: none;
opacity: 0.5;
}
.uploadListBox + .uploadListBox {
margin-left: 20px;
}
......@@ -627,7 +855,10 @@ export default {
height: auto;
}
}
.docInfo {
display: inline-flex;
align-items: center;
}
.docTitle {
padding-right: 10px;
max-width: 100px;
......@@ -637,10 +868,6 @@ export default {
font-size: 12px;
text-align: left;
line-height: 16px;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
p {
margin-top: 5px;
......@@ -717,4 +944,64 @@ export default {
line-height: 22px;
}
}
.opacity80 {
opacity: 0.8;
}
.scopeBox {
width: 846px;
height: 522px;
background: #ffffff;
border-radius: 4px;
border: 1px solid #dcdfe6;
display: flex;
.left {
padding: 15px;
width: 50%;
.tree {
margin-top: 20px;
height: 454px;
overflow-y: auto;
}
}
.right {
width: 50%;
border-left: 1px solid #dcdfe6;
padding: 20px 15px;
height: 454px;
overflow-y: auto;
.right-top {
margin-bottom: 15px;
display: flex;
justify-content: space-between;
color: #303133;
}
.contact-li {
.li-cell {
border-radius: 2px;
line-height: 32px;
display: inline-flex;
width: 392px;
justify-content: space-between;
padding: 0 4px;
align-items: center;
box-sizing: border-box;
&:hover {
background: #f7f8fa;
}
i {
width: 20px;
height: 20px;
border-radius: 10px;
font-size: 12px;
display: inline-flex;
justify-content: center;
align-items: center;
&:hover {
background: #e5e6eb;
}
}
}
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment