Commit 93039060 by lxyang

feat:改路由

parent 54672637
......@@ -141,13 +141,13 @@ export const constantRoutes = [
}
},
{
component: () => import('@/views/dataList/product/index'),
component: () => import('@/views/taskList/index'),
meta: {
icon: '',
title: '跟踪文档详情'
},
name: 'taskListDetails',
path: 'taskListDetails',
name: 'taskListIndex',
path: 'taskListIndex',
hidden: true
},
// {
......
......@@ -94,83 +94,85 @@ export default {
// 搜索左侧
seatchInitLeft() {
this.loadingLeft = true
// listCustomer(this.queryParams)
// .then(response => {
if (this.queryParamsLeft.pageContent === 0) {
this.queryParamsLeft.pageContent = 0
for (let i = 0; i < 10; i++) {
let data = {
media: '巨量引擎',
title: '巨量引擎开放平台' + (i + 1),
data: '2022-10-18',
link: 'https://ad.oceanengine.com/pages/login/index.html?source=oceanengine',
content: [
{
contentText: '通常情况下,应当处理 input 事件,并更新组件的绑定值(或使用v-model)。否则,输入框内显示的值将不会改变。1234', // 这是完整的一段话
contentChange:[ // 这段话里有多少变化以及链接出处
{
text: '或使用v-model',
url: 'https://www.baidu.com/'
},
{
text: '输入框内显示的值',
url: 'https://www.cnblogs.com/1234wu/p/11055005.html'
},
]
},
{
contentText: '视频或直播加热的功能,提升视频或直播间热度。121212', // 这是完整的一段话
contentChange: [
doctaskFinddifferenceSearch({
})
.then(response => {
if (this.queryParamsLeft.pageContent === 0) {
this.queryParamsLeft.pageContent = 0
for (let i = 0; i < 10; i++) {
let data = {
media: '巨量引擎',
title: '巨量引擎开放平台' + (i + 1),
data: '2022-10-18',
link: 'https://ad.oceanengine.com/pages/login/index.html?source=oceanengine',
content: [
{
text: '提升视频或直播间热度',
url: 'https://element.eleme.io/#/zh-CN/component/pagination#events'
contentText: '通常情况下,应当处理 input 事件,并更新组件的绑定值(或使用v-model)。否则,输入框内显示的值将不会改变。1234', // 这是完整的一段话
contentChange:[ // 这段话里有多少变化以及链接出处
{
text: '或使用v-model',
url: 'https://www.baidu.com/'
},
{
text: '输入框内显示的值',
url: 'https://www.cnblogs.com/1234wu/p/11055005.html'
},
]
},
{
contentText: '视频或直播加热的功能,提升视频或直播间热度。121212', // 这是完整的一段话
contentChange: [
{
text: '提升视频或直播间热度',
url: 'https://element.eleme.io/#/zh-CN/component/pagination#events'
},
]
}
]
}
]
}
let content = data.content
for (let a = 0; a < content.length; a++) {
let contentChange = content[a].contentChange
for (let b = 0; b < contentChange.length; b++) {
let text = contentChange[b].text
let url = contentChange[b].url
if (content[a].contentText.indexOf(text) >= 0) {
let values = content[a].contentText.split(text);
content[a].contentText = values.join(
`<a style="color: rgba(250, 0, 0, 1);" href="${url}" target="_blank">${text}</a>`
)
let content = data.content
for (let a = 0; a < content.length; a++) {
let contentChange = content[a].contentChange
for (let b = 0; b < contentChange.length; b++) {
let text = contentChange[b].text
let url = contentChange[b].url
if (content[a].contentText.indexOf(text) >= 0) {
let values = content[a].contentText.split(text);
content[a].contentText = values.join(
`<a style="color: rgba(250, 0, 0, 1);" href="${url}" target="_blank">${text}</a>`
)
}
}
}
}
this.listLeft.push(data)
}
this.listLeft.push(data)
}
} else {
let page = this.queryParamsLeft.pageNo + 1
let orderSize = this.queryParamsLeft.pageNo * this.queryParamsLeft.pageSize
let number = page * this.queryParamsLeft.pageSize
let content = this.queryParamsLeft.pageContent
if (number >= content) {
this.loadMoreLeft = false
} else {
this.loadMoreLeft = true
}
this.listLeft = []
for (let i = orderSize; i < number; i++) {
this.listLeft.push({
media: '巨量' + (i + 1),
title: '巨量引擎开放平台' + (i + 1),
data: '2022-10-18',
link: 'https://ad.oceanengine.com/pages/login/index.html?source=oceanengine',
content: ['视频或直播加热的功能,提升视频或直播间热度。','视频或直播加热的功能,提升视频或直播间热度。']
})
let page = this.queryParamsLeft.pageNo + 1
let orderSize = this.queryParamsLeft.pageNo * this.queryParamsLeft.pageSize
let number = page * this.queryParamsLeft.pageSize
let content = this.queryParamsLeft.pageContent
if (number >= content) {
this.loadMoreLeft = false
} else {
this.loadMoreLeft = true
}
this.listLeft = []
for (let i = orderSize; i < number; i++) {
this.listLeft.push({
media: '巨量' + (i + 1),
title: '巨量引擎开放平台' + (i + 1),
data: '2022-10-18',
link: 'https://ad.oceanengine.com/pages/login/index.html?source=oceanengine',
content: ['视频或直播加热的功能,提升视频或直播间热度。','视频或直播加热的功能,提升视频或直播间热度。']
})
}
this.queryParamsLeft.pageNo = page
}
this.queryParamsLeft.pageNo = page
// })
// .catch(error => {
// this.loading = false;
// });
}
})
.catch(error => {
this.loading = false;
});
setTimeout(() => {
this.loadingLeft = false
}, 1000);
......
......@@ -323,7 +323,7 @@ export default {
routerTaskListDetails(row) {
try {
this.$router.push({
name: 'taskListDetails',
path: '/documentManagement/taskListIndex',
query: {
id: row.docDocumentId,
name: row.name
......
<template>
<div class="app-container">
<!-- 头部 -->
<div class="seachData" ref="seachDatas">
<div class="seachData-left">
<i class="el-icon-arrow-left left-span" @click="blackTaskList"></i>
<span>{{title ? title + '文档跟踪报告' : '文档跟踪报告'}}</span>
</div>
</div>
<div class="content">
<div class="content-left scroll">
<div v-if="loading" class="content-right-content loading loading-left">
<div class="loading-div">
<i class="el-icon-loading loading-center"></i>
<div>加载中...</div>
</div>
</div>
<div class="content-left-center scroll">
<div v-if="deleteCenter.length && !loading">
<div class="delete-center" v-for="(item, index) in deleteCenter" :key="index">
<div class="title">
<span class="title-span">{{item.docTitle}}</span>
<span>更新日期:</span>
<span class="time">{{dateFilter(item.updateTime)}}</span>
<span>共1处更新</span>
</div>
<div class="center">
<div class="center-delete">
<div class="center-delete-tab green">新版</div>
<div class="center-delete-text" v-html="item.paragraphAfter"></div>
</div>
<div class="center-delete">
<div class="center-delete-tab gray">旧版</div>
<div class="center-delete-text" v-html="item.paragraphBefore"></div>
</div>
</div>
</div>
</div>
<div class="none" v-else-if="!deleteCenter.length && !loading">
暂无数据
</div>
</div>
</div>
</div>
</div>
</template>
<script>
// 接口调用方法
import {
doctaskFinddifference
} from "@/api/system/product";
export default {
data() {
return {
title: '', // 跟踪文档标题抬头
deleteId: '', // 详情id
tableHeights: 0, // table高度
loading: false,
deleteCenter: []
}
},
watch: {
},
created() {
this.init()
this.$nextTick(() => {
this.tableHeight();
})
},
computed: {
// 计算过的height
tableHeightCount() {
return this.tableHeights
}
},
methods: {
// 初始化
init() {
console.log(this.$route.query, 'this.$route.query')
this.title = this.$route.query.name
this.deleteId = this.$route.query.id
this.searchCustomer()
},
// 返回跟踪文档
blackTaskList() {
this.$router.push({
path: '/documentManagement/taskList'
})
},
dateFilter(time) {
if (!time) {
// 当时间是null或者无效格式时我们返回空
return '-'
} else {
const date = new Date(time) // 时间戳为10位需*1000,时间戳为13位的话不需乘1000
const dateNumFun = (num) => num < 10 ? `0${num}` : num // 使用箭头函数和三目运算以及es6字符串的简单操作。因为只有一个操作不需要{} ,目的就是数字小于10,例如9那么就加上一个0,变成09,否则就返回本身。 // 这是es6的解构赋值。
const [Y, M, D, h, m, s] = [
date.getFullYear(),
dateNumFun(date.getMonth() + 1),
dateNumFun(date.getDate()),
dateNumFun(date.getHours()),
dateNumFun(date.getMinutes()),
dateNumFun(date.getSeconds())
]
return `${Y}-${M}-${D} ${h}:${m}:${s}` // 一定要注意是反引号,否则无效。
}
},
searchCustomer() {
this.loading = true;
doctaskFinddifference(this.deleteId)
.then(response => {
if (response.code === 200) {
let content = response.content.value
for (let a = 0; a < content.length; a++) {
let difWordAfter = content[a].difWordAfter
let url = content[a].docUrl
if (content[a].paragraphAfter.indexOf(difWordAfter) >= 0) {
let values = content[a].paragraphAfter.split(difWordAfter);
content[a].paragraphAfter = values.join(
`<a style="color: rgba(250, 0, 0, 1);" href="${url}" target="_blank">${difWordAfter}</a>`
)
}
}
this.$set(this, 'deleteCenter', content)
}
this.loading = false
this.$nextTick(() => {
this.customerListHeights = this.$refs.customerListHeight.offsetHeight
})
})
.catch(error => {
this.loading = false;
});
},
// 计算高度
tableHeight() {
let height = document.documentElement.clientHeight - 128
this.tableHeights = height < 580 ? 580 : height
}
}
}
</script>
<style scoped lang="scss">
@import '@/views/main.scss';
.app-container {
.content {
top: 64px;
background: #fafafa;
}
}
.seachData {
.seachData-left {
padding-left: 46px;
}
}
.left-span {
margin-right: 18px;
color: #0052D9;
font-size: 26px;
text-align: center;
width: 18px;
cursor: pointer;
}
.delete-center {
width: 100%;
margin-bottom: 16px;
padding: 32px 36px;
background: #fff;
&:first-child {
margin-top: 16px;
}
.title {
font-size: 18px;
color: rgba(0, 0, 0, 0.9000);
.time {
margin-right: 24px;
}
.title-span {
margin-right: 16px;
}
}
.center {
width: 100%;
display: flex;
.center-delete {
width: 50%;
margin-top: 24px;
}
.center-delete-tab {
width: 44px;
height: 24px;
line-height: 24px;
text-align: center;
border-radius: 4px;
&.green {
background: #c8ffe8;
color: #4ec192;
}
&.gray {
background: rgba(0, 0, 0, 0.2000);
color: #8a8888;
}
}
.center-delete-text {
margin-top: 24px;
text-align: left;
font-size: 14px;
line-height: 20px;
color: rgba(0, 0, 0, 0.6);
word-break: break-all;
}
}
}
.content-left-center {
.none {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
color: #8a8888;
font-size: 16px;
}
}
</style>
\ No newline at end of file
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