no message
This commit is contained in:
kuaifan
parent
0e2f6db47c
commit
f282ed5cd9
@ -37,7 +37,7 @@
|
||||
"echarts": "^5.1.1",
|
||||
"element-ui": "^2.15.2",
|
||||
"tinymce": "^5.8.1",
|
||||
"view-design-hi": "^4.5.0-11",
|
||||
"view-design-hi": "^4.5.0-12",
|
||||
"vue-clipboard2": "^0.3.1",
|
||||
"vue-emoji-picker": "^1.0.1",
|
||||
"vue-kityminder-gg": "^1.3.6",
|
||||
|
||||
@ -1,7 +1,8 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="teditor-box" :class="[spinShow?'teditor-loadstyle':'teditor-loadedstyle']">
|
||||
<textarea ref="myTextarea" :id="id">{{ content }}</textarea>
|
||||
<div v-if="inline" ref="myTextarea" :id="id">{{ content }}</div>
|
||||
<textarea v-else ref="myTextarea" :id="id">{{ content }}</textarea>
|
||||
<Spin fix v-if="spinShow">
|
||||
<Icon type="ios-loading" size=18 class="upload-control-spin-icon-load"></Icon>
|
||||
<div>{{$L('加载组件中...')}}</div>
|
||||
@ -100,6 +101,10 @@
|
||||
return {};
|
||||
}
|
||||
},
|
||||
inline: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
@ -189,6 +194,7 @@
|
||||
|
||||
option(isFull) {
|
||||
return {
|
||||
inline: isFull ? false : this.inline,
|
||||
selector: (isFull ? '#T_' : '#') + this.id,
|
||||
base_url: $A.serverUrl('js/tinymce'),
|
||||
language: "zh_CN",
|
||||
|
||||
@ -105,6 +105,10 @@
|
||||
<Modal
|
||||
v-model="projectTask._show"
|
||||
:mask-closable="false"
|
||||
:styles="{
|
||||
width: '90%',
|
||||
maxWidth: '640px'
|
||||
}"
|
||||
footer-hide>
|
||||
<TaskDetail/>
|
||||
</Modal>
|
||||
|
||||
@ -1,18 +1,141 @@
|
||||
<template>
|
||||
<div class="task-detail">
|
||||
{{projectTask}}
|
||||
<div class="task-info">
|
||||
<div class="head">
|
||||
<Icon class="radio" type="md-radio-button-off"/>
|
||||
<div class="nav">
|
||||
<p>项目名称</p>
|
||||
<p>列表名称</p>
|
||||
<p>2222</p>
|
||||
</div>
|
||||
<Icon class="menu" type="ios-more"/>
|
||||
</div>
|
||||
<div class="title">
|
||||
<Input
|
||||
v-model="projectTask.name"
|
||||
type="textarea"
|
||||
:rows="1"
|
||||
:autosize="{ minRows: 1, maxRows: 8 }"
|
||||
:maxlength="255"/>
|
||||
</div>
|
||||
<div class="desc">
|
||||
<TEditor
|
||||
v-model="content"
|
||||
:plugins="taskPlugins"
|
||||
:options="taskOptions"
|
||||
:option-full="taskOptionFull"
|
||||
:placeholder="$L('详细描述...')"
|
||||
inline></TEditor>
|
||||
</div>
|
||||
<Form class="items" label-position="left" label-width="auto" @submit.native.prevent>
|
||||
<FormItem>
|
||||
<div class="item-label" slot="label">
|
||||
<i class="iconfont"></i>
|
||||
{{$L('优先级')}}
|
||||
</div>
|
||||
<ul class="item-content">
|
||||
<li>紧急且重要</li>
|
||||
</ul>
|
||||
</FormItem>
|
||||
<FormItem>
|
||||
<div class="item-label" slot="label">
|
||||
<i class="iconfont"></i>
|
||||
{{$L('负责人')}}
|
||||
</div>
|
||||
<ul class="item-content">
|
||||
<li><UserAvatar :userid="1"/></li>
|
||||
</ul>
|
||||
</FormItem>
|
||||
<FormItem>
|
||||
<div class="item-label" slot="label">
|
||||
<i class="iconfont"></i>
|
||||
{{$L('截止时间')}}
|
||||
</div>
|
||||
<ul class="item-content">
|
||||
<li>2020/10/11 10:00</li>
|
||||
</ul>
|
||||
</FormItem>
|
||||
<FormItem>
|
||||
<div class="item-label" slot="label">
|
||||
<i class="iconfont"></i>
|
||||
{{$L('附件')}}
|
||||
</div>
|
||||
<ul class="item-content file">
|
||||
<li>文件11</li>
|
||||
<li>文件22</li>
|
||||
<li>文件33</li>
|
||||
<li>
|
||||
<div class="add-button">
|
||||
<i class="iconfont"></i>{{$L('添加附件')}}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</FormItem>
|
||||
<FormItem>
|
||||
<div class="item-label" slot="label">
|
||||
<i class="iconfont"></i>
|
||||
{{$L('子任务')}}
|
||||
</div>
|
||||
<ul class="item-content subtask">
|
||||
<li>文件11</li>
|
||||
<li>文件22</li>
|
||||
<li>文件33</li>
|
||||
<li>
|
||||
<div class="add-button">
|
||||
<i class="iconfont"></i>{{$L('添加子任务')}}
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</FormItem>
|
||||
</Form>
|
||||
<div class="add">
|
||||
<div class="add-button">
|
||||
<i class="iconfont"></i>{{$L('添加模块')}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="task-dialog">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {mapState} from "vuex";
|
||||
import TEditor from "../../../components/TEditor";
|
||||
|
||||
export default {
|
||||
name: "TaskDetail",
|
||||
|
||||
components: {TEditor},
|
||||
data() {
|
||||
return {
|
||||
content: '随着互联网的发展,生活智能化越来越普及,各类智能产品逐渐出现到人们面前,在体验的过程中,其实里面有 很多细节需要深挖和思考。很多产品细节的背后都是为了提升用户操作效率、兼容用户使用场景、满足用户情感 表达,以最终达到对用户体验的提升。作为智能产品的设计师只有充分了解市面上的智能产品,才能设计出更好',
|
||||
|
||||
taskPlugins: [
|
||||
'advlist autolink lists link image charmap print preview hr anchor pagebreak imagetools',
|
||||
'searchreplace visualblocks visualchars code',
|
||||
'insertdatetime media nonbreaking save table contextmenu directionality',
|
||||
'emoticons paste textcolor colorpicker imagetools codesample',
|
||||
'autoresize'
|
||||
],
|
||||
taskOptions: {
|
||||
statusbar: false,
|
||||
menubar: false,
|
||||
forced_root_block : false,
|
||||
remove_trailing_brs: false,
|
||||
autoresize_bottom_margin: 2,
|
||||
min_height: 200,
|
||||
max_height: 380,
|
||||
valid_elements : 'a[href|target=_blank],em,strong/b,div[align],span[style],a,br,img,pre[class],code',
|
||||
toolbar: 'uploadImages | uploadFiles | bold italic underline forecolor backcolor | codesample | preview screenload'
|
||||
},
|
||||
taskOptionFull: {
|
||||
menubar: 'file edit view',
|
||||
forced_root_block : false,
|
||||
remove_trailing_brs: false,
|
||||
valid_elements : 'a[href|target=_blank],em,strong/b,div[align],span[style],a,br,img,pre[class],code',
|
||||
toolbar: 'uploadImages | uploadFiles | bold italic underline forecolor backcolor | codesample | preview screenload'
|
||||
},
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
@ -96,3 +96,7 @@
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.tox-tinymce-inline {
|
||||
z-index: 100000;
|
||||
}
|
||||
|
||||
6
resources/assets/sass/iconfont.scss
vendored
6
resources/assets/sass/iconfont.scss
vendored
@ -1,8 +1,8 @@
|
||||
@font-face {
|
||||
font-family: 'iconfont'; /* Project id 2583385 */
|
||||
src: url('//at.alicdn.com/t/font_2583385_e77s2y4tokk.woff2?t=1623151884621') format('woff2'),
|
||||
url('//at.alicdn.com/t/font_2583385_e77s2y4tokk.woff?t=1623151884621') format('woff'),
|
||||
url('//at.alicdn.com/t/font_2583385_e77s2y4tokk.ttf?t=1623151884621') format('truetype');
|
||||
src: url('//at.alicdn.com/t/font_2583385_xuuhcu42k99.woff2?t=1623393761654') format('woff2'),
|
||||
url('//at.alicdn.com/t/font_2583385_xuuhcu42k99.woff?t=1623393761654') format('woff'),
|
||||
url('//at.alicdn.com/t/font_2583385_xuuhcu42k99.ttf?t=1623393761654') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
|
||||
@ -1,3 +1,123 @@
|
||||
.task-detail {
|
||||
padding-bottom: 22px;
|
||||
display: flex;
|
||||
padding-bottom: 36px;
|
||||
.task-info {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
padding-bottom: 10px;
|
||||
color: #888888;
|
||||
position: relative;
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 36px;
|
||||
right: -12px;
|
||||
bottom: 0;
|
||||
height: 1px;
|
||||
background-color: #f4f5f5;
|
||||
}
|
||||
.radio {
|
||||
width: 18px;
|
||||
font-size: 16px;
|
||||
}
|
||||
.nav {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 18px;
|
||||
font-size: 12px;
|
||||
> p {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 5px;
|
||||
&:after {
|
||||
content: "/";
|
||||
padding-left: 5px;
|
||||
}
|
||||
&:last-child {
|
||||
&:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.menu {
|
||||
font-size: 22px;
|
||||
margin: 0 18px;
|
||||
}
|
||||
}
|
||||
.title {
|
||||
margin: 12px 36px 0;
|
||||
.ivu-input {
|
||||
font-weight: 500;
|
||||
font-size: 24px;
|
||||
padding: 4px 0;
|
||||
resize: none;
|
||||
border-color: transparent;
|
||||
&:focus {
|
||||
box-shadow: none
|
||||
}
|
||||
}
|
||||
}
|
||||
.desc {
|
||||
margin: 12px 36px 0;
|
||||
div[contenteditable="true"] {
|
||||
outline: none
|
||||
}
|
||||
}
|
||||
.items {
|
||||
margin: 12px 36px 0;
|
||||
.ivu-form-item {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.item-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #aaaaaa;
|
||||
.iconfont {
|
||||
margin-right: 3px;
|
||||
}
|
||||
}
|
||||
.item-content {
|
||||
margin-top: 5px;
|
||||
margin-left: 12px;
|
||||
> li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
list-style: none;
|
||||
line-height: 26px;
|
||||
}
|
||||
&.file {
|
||||
|
||||
}
|
||||
&.subtask {
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
.add {
|
||||
margin: 12px 36px 0;
|
||||
}
|
||||
.add-button {
|
||||
cursor: pointer;
|
||||
color: #aaaaaa;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
> i {
|
||||
font-size: 14px;
|
||||
padding-right: 8px;
|
||||
}
|
||||
&:hover {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
.task-dialog {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user