|
@@ -137,7 +137,7 @@
|
|
</div>
|
|
</div>
|
|
<div style="margin: 10px 0px;color:#666;">
|
|
<div style="margin: 10px 0px;color:#666;">
|
|
<i v-if="element.endDate != null" class="el-icon-date"> {{element.endDate}}</i>
|
|
<i v-if="element.endDate != null" class="el-icon-date"> {{element.endDate}}</i>
|
|
- <i :class="taskTypeIcon[element.taskType]" :style="'float:right;color:'+taskTypeColor[element.taskType]+';margin-right:5px;'" ></i>
|
|
|
|
|
|
+ <i :class="taskTypeIcon[element.taskType]" :style="'float:right;color:'+taskTypeColor[element.taskType]+';margin-right:8px;'" ></i>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
<!--子任务 -->
|
|
<!--子任务 -->
|
|
@@ -212,9 +212,6 @@
|
|
<el-tab-pane label="数据统计" name="summary"><Summary ref="summary"></Summary></el-tab-pane>
|
|
<el-tab-pane label="数据统计" name="summary"><Summary ref="summary"></Summary></el-tab-pane>
|
|
|
|
|
|
</el-tabs>
|
|
</el-tabs>
|
|
- <!-- 发布评论弹出层 -->
|
|
|
|
-
|
|
|
|
- <!-- /发布评论弹出层 -->
|
|
|
|
|
|
|
|
<!--新增任务界面-->
|
|
<!--新增任务界面-->
|
|
<el-dialog class="jm" :title="title" v-if="addFormVisible" :visible.sync="addFormVisible" :close-on-click-modal="false" customClass="customWidth" width="800px">
|
|
<el-dialog class="jm" :title="title" v-if="addFormVisible" :visible.sync="addFormVisible" :close-on-click-modal="false" customClass="customWidth" width="800px">
|
|
@@ -253,11 +250,11 @@
|
|
</el-select>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<!-- 富文本 -->
|
|
<!-- 富文本 -->
|
|
- <el-form-item label="详细描述" >
|
|
|
|
|
|
+ <el-form-item label="详细描述" style="height: 200px">
|
|
<!-- <Editor id="tinymce" v-model="tinymceHtml" :init="editorInit"></Editor> -->
|
|
<!-- <Editor id="tinymce" v-model="tinymceHtml" :init="editorInit"></Editor> -->
|
|
<!-- <el-input type="textarea" v-model="addForm.taskDesc" :rows="3"></el-input> -->
|
|
<!-- <el-input type="textarea" v-model="addForm.taskDesc" :rows="3"></el-input> -->
|
|
<!-- <quill-edito v-model="addForm.taskDesc"></quill-edito> -->
|
|
<!-- <quill-edito v-model="addForm.taskDesc"></quill-edito> -->
|
|
- <quill-editor ref="text" v-model="addForm.taskDesc" class="myQuillEditor" :options="editorOption" @blur="onEditorBlur($event)" @focus="onEditorFocus($event)"/>
|
|
|
|
|
|
+ <quill-editor style="height: 150px" ref="text" v-model="addForm.taskDesc" class="myQuillEditor" :options="editorOption" @blur="onEditorBlur($event)" @focus="onEditorFocus($event)"/>
|
|
</el-form-item>
|
|
</el-form-item>
|
|
<!-- 富文本 -->
|
|
<!-- 富文本 -->
|
|
<div v-if="addForm.id != null">
|
|
<div v-if="addForm.id != null">
|
|
@@ -304,44 +301,57 @@
|
|
</div>
|
|
</div>
|
|
<!-- 评论 -->
|
|
<!-- 评论 -->
|
|
<div class="remark">
|
|
<div class="remark">
|
|
- <div class="player">
|
|
|
|
- <p>评论</p>
|
|
|
|
- <div class="bj">
|
|
|
|
- <el-image style="width: 50px; height: 50px" :src="url" :fit="fit"></el-image>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
- <div class="subject">
|
|
|
|
- <div class="sub-all">所有动态</div>
|
|
|
|
- <div class="sub-details" ref="main">
|
|
|
|
- <ul class="infinite-list" v-infinite-scroll="load" style="overflow:auto" ref="contRoll">
|
|
|
|
- <div style="width: 100%" v-if="commentList.length <= 0">
|
|
|
|
- <img src="../../assets/image/xiao.png" alt="">
|
|
|
|
|
|
+ <span class="zh">
|
|
|
|
+ <span v-for="(pl, i) in critic" :key="i">
|
|
|
|
+ <div class="player" v-if="pl">
|
|
|
|
+ <p>参与人</p>
|
|
|
|
+ <div class="bj">
|
|
|
|
+ <span style="background: #778899">{{pl.length > 2 ? pl.substring(pl.length - 2, pl.length) : pl}}</span>
|
|
|
|
+ <!-- <span style="background: #778899">{{pl.length}}</span> -->
|
|
</div>
|
|
</div>
|
|
- <li v-for="i in count" class="infinite-list-item counli" :key="i">
|
|
|
|
- <p><i class="el-icon-s-fold"></i> <em>屈经理完成了依赖任务</em><span>4月20日</span></p>
|
|
|
|
- </li>
|
|
|
|
- <li class="carts" v-for="item in commentList" :key="item.id">
|
|
|
|
- <el-image style="width: 30px; height: 30px" :src="url" :fit="fit"></el-image>
|
|
|
|
- <div>
|
|
|
|
- <p>{{item.userName}}</p>
|
|
|
|
- <em>{{item.content}}</em>
|
|
|
|
|
|
+ </div>
|
|
|
|
+ </span>
|
|
|
|
+ <div class="subject">
|
|
|
|
+ <div class="sub-all">所有动态</div>
|
|
|
|
+ <div class="sub-details" ref="main">
|
|
|
|
+ <ul class="infinite-list" v-infinite-scroll="load" style="overflow:auto" ref="contRoll">
|
|
|
|
+ <div style="width: 100%" v-if="commentList.length <= 0">
|
|
|
|
+ <img src="../../assets/image/xiao.png" alt="">
|
|
</div>
|
|
</div>
|
|
- <span>{{item.createTime | relativeTime}}</span>
|
|
|
|
- </li>
|
|
|
|
- </ul>
|
|
|
|
|
|
+ <li v-for="i in count" class="infinite-list-item counli" :key="i">
|
|
|
|
+ <p><i class="el-icon-s-fold"></i> <em>屈经理完成了依赖任务</em><span>4月20日</span></p>
|
|
|
|
+ </li>
|
|
|
|
+ <li class="carts" v-for="item in commentList" :key="item.id">
|
|
|
|
+ <!-- <el-image style="width: 30px; height: 30px" :src="url" :fit="fit"></el-image> -->
|
|
|
|
+ <!-- <i :style="'background' + item.userColor"> -->
|
|
|
|
+ <i :style="'background' + item.userColor">
|
|
|
|
+ {{item.userName.length > 2 ? item.userName.substring(item.userName.length - 2, item.userName.length) : item.userName}}
|
|
|
|
+ </i>
|
|
|
|
+ <div>
|
|
|
|
+ <!-- <p>{{item.userName}}</p> -->
|
|
|
|
+ <p>{{item.userName}}</p>
|
|
|
|
+ <em>{{item.content}}</em>
|
|
|
|
+ </div>
|
|
|
|
+ <span>{{item.createTime | relativeTime}}</span>
|
|
|
|
+ </li>
|
|
|
|
+ </ul>
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
- </div>
|
|
|
|
- <div class="issue">
|
|
|
|
- <!-- <el-input type="textarea" class="textareays" label-width="100%" label-height="140px"></el-input> -->
|
|
|
|
- <el-input
|
|
|
|
- class="issue-input"
|
|
|
|
- type="textarea"
|
|
|
|
- placeholder="请输入内容"
|
|
|
|
- :autosize="{ minRows: 5, maxRows: 6}"
|
|
|
|
- v-model.trim="textarea2">
|
|
|
|
- </el-input>
|
|
|
|
- <el-button class="issue-button" type="primary" @click="release()">发布</el-button>
|
|
|
|
- </div>
|
|
|
|
|
|
+ <div class="issue">
|
|
|
|
+ <!-- <el-input type="textarea" class="textareays" label-width="100%" label-height="140px"></el-input> -->
|
|
|
|
+ <div class="issue_fixation">
|
|
|
|
+ <el-input
|
|
|
|
+ class="issue-input"
|
|
|
|
+ type="textarea"
|
|
|
|
+ placeholder="请输入内容"
|
|
|
|
+ :autosize="{ minRows: 6, maxRows: 6}"
|
|
|
|
+ v-model.trim="textarea2"
|
|
|
|
+ >
|
|
|
|
+ </el-input>
|
|
|
|
+ <el-button class="issue-button" type="primary" @click="release()">发布</el-button>
|
|
|
|
+ </div>
|
|
|
|
+ </div>
|
|
|
|
+ </span>
|
|
</div>
|
|
</div>
|
|
<!-- 评论 -->
|
|
<!-- 评论 -->
|
|
</el-dialog>
|
|
</el-dialog>
|
|
@@ -558,28 +568,30 @@ toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backc
|
|
textarea2: '',
|
|
textarea2: '',
|
|
taskId: null,
|
|
taskId: null,
|
|
commentList: [],
|
|
commentList: [],
|
|
|
|
+ critic: [], // 评论头像的数组
|
|
editorOption: { // 富文本框里面的默认值
|
|
editorOption: { // 富文本框里面的默认值
|
|
placeholder: '请输入文本...',
|
|
placeholder: '请输入文本...',
|
|
modules: {
|
|
modules: {
|
|
toolbar:[
|
|
toolbar:[
|
|
['bold', 'italic', 'underline', 'strike'], //加粗,斜体,下划线,删除线
|
|
['bold', 'italic', 'underline', 'strike'], //加粗,斜体,下划线,删除线
|
|
- ['blockquote', 'code-block'], //引用,代码块
|
|
|
|
|
|
+ // ['blockquote', 'code-block'], //引用,代码块
|
|
|
|
|
|
[{ 'header': 1 }, { 'header': 2 }], // 标题,键值对的形式;1、2表示字体大小
|
|
[{ 'header': 1 }, { 'header': 2 }], // 标题,键值对的形式;1、2表示字体大小
|
|
- [{ 'list': 'ordered'}, { 'list': 'bullet' }], //列表
|
|
|
|
- [{ 'script': 'sub'}, { 'script': 'super' }], // 上下标
|
|
|
|
- [{ 'indent': '-1'}, { 'indent': '+1' }], // 缩进
|
|
|
|
- [{ 'direction': 'rtl' }], // 文本方向
|
|
|
|
|
|
+ // [{ 'list': 'ordered'}, { 'list': 'bullet' }], //列表
|
|
|
|
+ // [{ 'script': 'sub'}, { 'script': 'super' }], // 上下标
|
|
|
|
+ // [{ 'indent': '-1'}, { 'indent': '+1' }], // 缩进
|
|
|
|
+ // [{ 'direction': 'rtl' }], // 文本方向
|
|
|
|
|
|
[{ 'size': ['small', false, 'large', 'huge'] }], // 字体大小
|
|
[{ 'size': ['small', false, 'large', 'huge'] }], // 字体大小
|
|
[{ 'header': [1, 2, 3, 4, 5, 6, false] }], //几级标题
|
|
[{ 'header': [1, 2, 3, 4, 5, 6, false] }], //几级标题
|
|
|
|
|
|
[{ 'color': [] }, { 'background': [] }], // 字体颜色,字体背景颜色
|
|
[{ 'color': [] }, { 'background': [] }], // 字体颜色,字体背景颜色
|
|
- [{ 'font': [] }], //字体
|
|
|
|
|
|
+ // [{ 'font': [] }], //字体
|
|
[{ 'align': [] }], //对齐方式
|
|
[{ 'align': [] }], //对齐方式
|
|
|
|
|
|
['clean'], //清除字体样式
|
|
['clean'], //清除字体样式
|
|
- ['image','video'] //上传图片、上传视频
|
|
|
|
|
|
+ // ['image','video'] //上传图片、上传视频
|
|
|
|
+ ['image'] //上传图片、上传视频
|
|
], //工具栏设置
|
|
], //工具栏设置
|
|
},
|
|
},
|
|
theme: 'snow',
|
|
theme: 'snow',
|
|
@@ -957,17 +969,21 @@ toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backc
|
|
this.title = "编辑任务";
|
|
this.title = "编辑任务";
|
|
this.getTaskDetail(task.id);
|
|
this.getTaskDetail(task.id);
|
|
this.gain(task); // 获取评论列表
|
|
this.gain(task); // 获取评论列表
|
|
- },
|
|
|
|
|
|
+ // this.gengx()
|
|
|
|
+ },
|
|
|
|
+ // gengx() {
|
|
|
|
+ // var ok = document.getElementById('player');
|
|
|
|
+ // console.log(ok,1234);
|
|
|
|
+ // },
|
|
// 获取评论列表
|
|
// 获取评论列表
|
|
gain (task) {
|
|
gain (task) {
|
|
- // this.http.get('/task-comment/getList', {params: {task: task.id}}),
|
|
|
|
- // this.http.get('/task-comment/getList', task.id),
|
|
|
|
- // this.http.get('/task-comment/getList', {task: task.id}),
|
|
|
|
this.taskId = task.id
|
|
this.taskId = task.id
|
|
this.http.post('/task-comment/getList', {taskId: task.id},
|
|
this.http.post('/task-comment/getList', {taskId: task.id},
|
|
res => {
|
|
res => {
|
|
if (res.code == "ok") {
|
|
if (res.code == "ok") {
|
|
this.commentList = res.data
|
|
this.commentList = res.data
|
|
|
|
+ this.sppk(this.commentList) // 获取参与人的方法
|
|
|
|
+ // this.cppl()
|
|
// this.commentList.reverse()
|
|
// this.commentList.reverse()
|
|
} else {
|
|
} else {
|
|
this.$message({
|
|
this.$message({
|
|
@@ -983,6 +999,15 @@ toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backc
|
|
});
|
|
});
|
|
});
|
|
});
|
|
},
|
|
},
|
|
|
|
+ // 获取评论参与人
|
|
|
|
+ sppk(comit) {
|
|
|
|
+ var sk = []
|
|
|
|
+ comit.forEach(function(e){
|
|
|
|
+ sk.push(e.userName)
|
|
|
|
+ })
|
|
|
|
+ this.critic = new Set(sk)
|
|
|
|
+ },
|
|
|
|
+
|
|
// 点击发布
|
|
// 点击发布
|
|
release() {
|
|
release() {
|
|
if(this.textarea2.length <= 0) return this.$message({message: "请输入内容", type: "error"})
|
|
if(this.textarea2.length <= 0) return this.$message({message: "请输入内容", type: "error"})
|
|
@@ -991,11 +1016,9 @@ toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backc
|
|
res => {
|
|
res => {
|
|
if(res.code == "ok"){
|
|
if(res.code == "ok"){
|
|
this.commentList.push(res.data)
|
|
this.commentList.push(res.data)
|
|
- // this.commentList.reverse()
|
|
|
|
|
|
+ this.sppk(this.commentList)
|
|
this.textarea2 = ""
|
|
this.textarea2 = ""
|
|
this.contRoll() // 滚动到底部
|
|
this.contRoll() // 滚动到底部
|
|
- // this.gain(this.taskId)
|
|
|
|
-
|
|
|
|
} else {
|
|
} else {
|
|
this.$message({
|
|
this.$message({
|
|
message: res.msg,
|
|
message: res.msg,
|
|
@@ -1012,7 +1035,7 @@ toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backc
|
|
},
|
|
},
|
|
// 滚动到底部
|
|
// 滚动到底部
|
|
contRoll(){
|
|
contRoll(){
|
|
- console.log("滚动到底部");
|
|
|
|
|
|
+ // console.log("滚动到底部");
|
|
this.$nextTick(() => {
|
|
this.$nextTick(() => {
|
|
this.$refs.main.scrollTop = this.$refs.contRoll.scrollHeight;
|
|
this.$refs.main.scrollTop = this.$refs.contRoll.scrollHeight;
|
|
})
|
|
})
|
|
@@ -1778,10 +1801,22 @@ toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backc
|
|
float: left;
|
|
float: left;
|
|
width: 90%;
|
|
width: 90%;
|
|
overflow: hidden;
|
|
overflow: hidden;
|
|
- height: 50px;
|
|
|
|
|
|
+ height: 65px;
|
|
white-space: nowrap;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
text-overflow: ellipsis;
|
|
}
|
|
}
|
|
|
|
+.bj span {
|
|
|
|
+ width: 50px;
|
|
|
|
+ height: 50px;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ border-radius: 50%;
|
|
|
|
+ color: #fff;
|
|
|
|
+ text-align: center;
|
|
|
|
+ float: left;
|
|
|
|
+ margin-right: 20px;
|
|
|
|
+ margin-top: 10px;
|
|
|
|
+ line-height: 50px;
|
|
|
|
+}
|
|
.player {
|
|
.player {
|
|
height: 15%;
|
|
height: 15%;
|
|
box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
@@ -1836,6 +1871,20 @@ toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backc
|
|
float: left;
|
|
float: left;
|
|
width: 20%;
|
|
width: 20%;
|
|
}
|
|
}
|
|
|
|
+ i {
|
|
|
|
+ width: 30px;
|
|
|
|
+ height: 30px;
|
|
|
|
+ // background: #778899;
|
|
|
|
+ display: inline-block;
|
|
|
|
+ float: left;
|
|
|
|
+ border-radius:50%;
|
|
|
|
+ font-style:normal;
|
|
|
|
+ font-size: 12px;
|
|
|
|
+ line-height: 30px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ color: #fff;
|
|
|
|
+ background: #778899;
|
|
|
|
+ }
|
|
div {
|
|
div {
|
|
text-align: left;
|
|
text-align: left;
|
|
p {
|
|
p {
|
|
@@ -1856,8 +1905,14 @@ toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backc
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.issue {
|
|
.issue {
|
|
- height: 20%;
|
|
|
|
- position: relative;
|
|
|
|
|
|
+ // height: 20%;
|
|
|
|
+ // position: relative;
|
|
|
|
+ // z-index: 4;
|
|
|
|
+ .zh{
|
|
|
|
+ position: relative;
|
|
|
|
+ width: 100%;
|
|
|
|
+ height: 100%;
|
|
|
|
+ }
|
|
.textareays {
|
|
.textareays {
|
|
background: #000;
|
|
background: #000;
|
|
height: 140px;
|
|
height: 140px;
|
|
@@ -1867,25 +1922,23 @@ toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backc
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.issue-button {
|
|
.issue-button {
|
|
- // position: fixd;
|
|
|
|
- // bottom: 0px;
|
|
|
|
- float: right;
|
|
|
|
- margin-top: 2%;
|
|
|
|
|
|
+ position: absolute;
|
|
|
|
+ bottom: 20px ;
|
|
|
|
+ right: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.issue-input {
|
|
.issue-input {
|
|
- // height: 140px;
|
|
|
|
- /deep/ .el-textarea__inner {
|
|
|
|
- border: 0;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
|
|
+ position: absolute;
|
|
|
|
+ bottom: 85px;
|
|
|
|
+}
|
|
</style>
|
|
</style>
|
|
<style>
|
|
<style>
|
|
.ql-snow .ql-picker.ql-size .ql-picker-label::before,
|
|
.ql-snow .ql-picker.ql-size .ql-picker-label::before,
|
|
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
|
|
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
|
|
content: "14px" !important;
|
|
content: "14px" !important;
|
|
|
|
+ position: relative;
|
|
|
|
+ top: -8px;
|
|
}
|
|
}
|
|
-
|
|
|
|
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
|
|
.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 {
|
|
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
|
|
content: "10px" !important;
|
|
content: "10px" !important;
|
|
@@ -1902,6 +1955,8 @@ toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backc
|
|
.ql-snow .ql-picker.ql-header .ql-picker-label::before,
|
|
.ql-snow .ql-picker.ql-header .ql-picker-label::before,
|
|
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
|
|
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
|
|
content: "文本" !important;
|
|
content: "文本" !important;
|
|
|
|
+ position: relative;
|
|
|
|
+ top: -8px;
|
|
}
|
|
}
|
|
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
|
|
.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 {
|
|
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
|
|
@@ -1940,4 +1995,13 @@ toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backc
|
|
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
|
|
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
|
|
content: "等宽字体" !important;
|
|
content: "等宽字体" !important;
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+
|
|
|
|
+/* .ql-picker-label {
|
|
|
|
+ position: relative;
|
|
|
|
+} */
|
|
|
|
+.ql-picker-label svg {
|
|
|
|
+ position: relative;
|
|
|
|
+ top: -6px;
|
|
|
|
+}
|
|
</style>
|
|
</style>
|