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
|
||||
const bus = new Vue(); |
||||
const bus = new Vue() |
||||
|
||||
export default bus; |
||||
export default bus |
||||
@ -1,10 +1,10 @@ |
||||
// 生成随机字符串
|
||||
export default function (len = 32) { |
||||
const $chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890'; |
||||
const maxPos = $chars.length; |
||||
let str = ''; |
||||
const $chars = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890' |
||||
const maxPos = $chars.length |
||||
let str = '' |
||||
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