master
parent
b1d31b8c32
commit
4e9b321312
45 changed files with 337 additions and 210 deletions
@ -1,72 +0,0 @@ |
|||||||
<template> |
|
||||||
<div> |
|
||||||
<div class="message" @click="showMessage"> |
|
||||||
<img src="../../assets/img/message.png"> |
|
||||||
留言板 |
|
||||||
</div> |
|
||||||
|
|
||||||
<el-dialog title="留言内容" :visible.sync="messageVisible" width="30%" @close="closeMessage" :close-on-click-modal="false" :modal-append-to-body="false" :modal="true"> |
|
||||||
<div class="message-wrap"> |
|
||||||
<div class="people">张三提问于2020-12-11</div> |
|
||||||
<el-input type="textarea" rows="3"></el-input> |
|
||||||
<div class="btn-wrap"> |
|
||||||
<el-button type="primary" size="small">回复</el-button> |
|
||||||
<el-button type="error" size="small">删除</el-button> |
|
||||||
</div> |
|
||||||
<!-- <quill :border="true" :height="100"></quill> --> |
|
||||||
<el-input type="textarea" rows="3"></el-input> |
|
||||||
</div> |
|
||||||
<span slot="footer" class="dialog-footer"> |
|
||||||
<el-button @click="messageVisible = false" size="small">取消</el-button> |
|
||||||
<el-button type="primary" size="small">确定</el-button> |
|
||||||
</span> |
|
||||||
</el-dialog> |
|
||||||
</div> |
|
||||||
</template> |
|
||||||
<script> |
|
||||||
import Setting from '@/setting'; |
|
||||||
import quill from '@/components/quill'; |
|
||||||
export default { |
|
||||||
data() { |
|
||||||
return { |
|
||||||
messageVisible: false |
|
||||||
}; |
|
||||||
}, |
|
||||||
components: {quill}, |
|
||||||
methods: { |
|
||||||
closeMessage(){ |
|
||||||
|
|
||||||
}, |
|
||||||
showMessage(){ |
|
||||||
this.messageVisible = true |
|
||||||
} |
|
||||||
}, |
|
||||||
}; |
|
||||||
</script> |
|
||||||
<style lang="scss" scoped> |
|
||||||
.message{ |
|
||||||
display: inline-flex; |
|
||||||
align-items: center; |
|
||||||
margin-right: 20px; |
|
||||||
color: #666; |
|
||||||
font-size: 12px; |
|
||||||
cursor: pointer; |
|
||||||
&:hover{ |
|
||||||
opacity: .8; |
|
||||||
} |
|
||||||
img{ |
|
||||||
margin-right: 5px; |
|
||||||
} |
|
||||||
} |
|
||||||
.message-wrap{ |
|
||||||
.people{ |
|
||||||
margin-bottom: 10px; |
|
||||||
font-size: 12px; |
|
||||||
color: #333; |
|
||||||
} |
|
||||||
.btn-wrap{ |
|
||||||
margin: 10px 0; |
|
||||||
text-align: right; |
|
||||||
} |
|
||||||
} |
|
||||||
</style> |
|
||||||
@ -1,6 +1,6 @@ |
|||||||
import Vue from 'vue'; |
import Vue from 'vue' |
||||||
|
|
||||||
// 使用 Event Bus
|
// 使用 Event Bus
|
||||||
const bus = new Vue(); |
const bus = new Vue() |
||||||
|
|
||||||
export default bus; |
export default bus |
||||||
@ -1,10 +1,10 @@ |
|||||||
// 生成随机字符串
|
// 生成随机字符串
|
||||||
export default function (len = 32) { |
export default function (len = 32) { |
||||||
const $chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890'; |
const $chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890' |
||||||
const maxPos = $chars.length; |
const maxPos = $chars.length |
||||||
let str = ''; |
let str = '' |
||||||
for (let i = 0; i < len; i++) { |
for (let i = 0; i < len; i++) { |
||||||
str += $chars.charAt(Math.floor(Math.random() * maxPos)); |
str += $chars.charAt(Math.floor(Math.random() * maxPos)) |
||||||
} |
} |
||||||
return str; |
return str |
||||||
} |
} |
||||||
|
|||||||
@ -0,0 +1,26 @@ |
|||||||
|
/** |
||||||
|
* 权限管理 |
||||||
|
* */ |
||||||
|
export default { |
||||||
|
namespaced: true, |
||||||
|
state: { |
||||||
|
btns: [], |
||||||
|
routes: [] |
||||||
|
}, |
||||||
|
mutations: { |
||||||
|
SET_BTN_AUTH: (state, btns) => { |
||||||
|
state.btns = btns |
||||||
|
}, |
||||||
|
SET_ROUTE: (state, routes) => { |
||||||
|
state.routes = routes |
||||||
|
}, |
||||||
|
}, |
||||||
|
actions: { |
||||||
|
addBtnAuth({ state,commit },btns) { |
||||||
|
commit('SET_BTN_AUTH',btns) |
||||||
|
}, |
||||||
|
addRoutes({ state,commit },routes) { |
||||||
|
commit('SET_ROUTE',routes) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
@ -1,9 +0,0 @@ |
|||||||
@mixin ellipsis { |
|
||||||
overflow: hidden; |
|
||||||
text-overflow: ellipsis; |
|
||||||
white-space: nowrap; |
|
||||||
} |
|
||||||
|
|
||||||
.ellipsis{ |
|
||||||
@include ellipsis(); |
|
||||||
} |
|
||||||
@ -0,0 +1,24 @@ |
|||||||
|
$main-color: #e80909; |
||||||
|
|
||||||
|
@mixin ellipsis { |
||||||
|
overflow: hidden; |
||||||
|
text-overflow: ellipsis; |
||||||
|
white-space: nowrap; |
||||||
|
} |
||||||
|
@mixin mul-ellipsis($num) { |
||||||
|
display: -webkit-box; |
||||||
|
-webkit-box-orient: vertical; |
||||||
|
-webkit-line-clamp: $num; |
||||||
|
text-overflow: ellipsis; |
||||||
|
overflow: hidden; |
||||||
|
} |
||||||
|
|
||||||
|
.ellipsis{ |
||||||
|
@include ellipsis(); |
||||||
|
} |
||||||
|
.mul-ellipsis2{ |
||||||
|
@include mul-ellipsis(2); |
||||||
|
} |
||||||
|
.mul-ellipsis3{ |
||||||
|
@include mul-ellipsis(3); |
||||||
|
} |
||||||
Loading…
Reference in new issue