4 changed files with 648 additions and 52 deletions
@ -0,0 +1,321 @@ |
|||
<template> |
|||
<div class=""> |
|||
<div class="g-page" v-show="pageType == 'info'"> |
|||
<div class="g-left"> |
|||
<el-card> |
|||
<h3>议题详情</h3> |
|||
|
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span>议题标题:</span> |
|||
<span>{{ issueInfo.issueTitle }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>议题建议:</span> |
|||
<span>{{ issueInfo.issueSuggestion }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>所属网格:</span> |
|||
<span>{{ issueInfo.belongsGridName || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>议题发起人:</span> |
|||
<span>{{ issueInfo.issueInitiator }}</span> |
|||
</div> |
|||
<div |
|||
v-if="issueInfo.topicInfo && issueInfo.topicInfo.groupName" |
|||
class="info-prop" |
|||
> |
|||
<span>议题来源:</span> |
|||
<span>{{ issueInfo.topicInfo.groupName }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>转议题时间:</span> |
|||
<span>{{ issueInfo.shiftIssueTime }}</span> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="m-line"> |
|||
<div class="stat"> |
|||
<div class="stat-item"> |
|||
<div> |
|||
{{ issueTrend.realityVoteCount }}/{{ |
|||
issueTrend.shouldVoteCount |
|||
}} |
|||
</div> |
|||
<div class="z-weak">已表决/应表决</div> |
|||
</div> |
|||
<div class="stat-item"> |
|||
<div>{{ issueTrend.supportAmount }}</div> |
|||
<div class="z-weak">支持</div> |
|||
</div> |
|||
<div class="stat-item"> |
|||
<div>{{ issueTrend.oppositionAmount }}</div> |
|||
<div class="z-weak">反对</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<line-chart |
|||
v-if="issueChartData.length > 0" |
|||
:list="issueChartData" |
|||
/> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="m-btns" v-if="type == 'info'"> |
|||
<el-button size="" @click="handleClose">关闭</el-button> |
|||
</div> |
|||
</el-card> |
|||
</div> |
|||
<div class="g-right"> |
|||
<el-card class="m-card" v-if="issueProcess.length > 0"> |
|||
<h3>处理进展</h3> |
|||
<div class="m-process"> |
|||
<div class="list"> |
|||
<div |
|||
class="item" |
|||
:class="index === 0 ? 'z-on' : ''" |
|||
:key="item.processId" |
|||
v-for="(item, index) in issueProcess" |
|||
> |
|||
<div class="item-row"> |
|||
<div class="name">{{ item.processName }}</div> |
|||
<div class="date"> |
|||
{{ item.processTime }} |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="detail"> |
|||
<div class="detail-field">处理部门:</div> |
|||
<div class="detail-value">{{ item.departmentName }}</div> |
|||
</div> |
|||
|
|||
<div |
|||
class="detail" |
|||
v-if="item.processName != '转项目' && item.publicReply" |
|||
> |
|||
<div class="detail-field">说 明:</div> |
|||
<div class="detail-value"> |
|||
<fold-text :row="3">{{ item.publicReply }}</fold-text> |
|||
</div> |
|||
</div> |
|||
|
|||
<div |
|||
class="detail" |
|||
v-if="item.processName != '转项目' && item.internalRemark" |
|||
> |
|||
<div class="detail-field">内部备注:</div> |
|||
<div class="detail-value"> |
|||
<fold-text :row="3">{{ item.internalRemark }}</fold-text> |
|||
</div> |
|||
</div> |
|||
<div class="detail"> |
|||
<div class="attachement-list"> |
|||
<a |
|||
:href="att.url" |
|||
target="_blank" |
|||
:key="att.url" |
|||
v-for="att in item.internalFile" |
|||
> |
|||
<i class="el-icon-folder-opened"></i> |
|||
{{ att.name }} |
|||
</a> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</el-card> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="g-page" v-show="pageType == 'issue-info'"> |
|||
<div class="g-left"> |
|||
<div v-if="projectInfo.origin === 'issue'" class="m-info"> |
|||
<div class="info-prop"> |
|||
<span>议题标题:</span> |
|||
<span>{{ issueInfo.issueTitle }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>议题建议:</span> |
|||
<span>{{ issueInfo.issueSuggestion }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>所属网格:</span> |
|||
<span>{{ issueInfo.belongsGridName || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>议题发起人:</span> |
|||
<span>{{ issueInfo.issueInitiator }}</span> |
|||
</div> |
|||
<div |
|||
v-if="issueInfo.topicInfo && issueInfo.topicInfo.groupName" |
|||
class="info-prop" |
|||
> |
|||
<span>议题来源:</span> |
|||
<span>{{ issueInfo.topicInfo.groupName }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>转议题时间:</span> |
|||
<span>{{ issueInfo.shiftIssueTime }}</span> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost } from "@/js/dai/request"; |
|||
import foldText from "@/views/components/foldText"; |
|||
import dateFormat from "dai-js/tools/dateFormat"; |
|||
|
|||
function iniData() { |
|||
return { |
|||
pageType: "info", |
|||
|
|||
issueProcess: [], |
|||
|
|||
issueInfo: { |
|||
attitude: "", |
|||
belongsGridName: "", |
|||
issueIdea: "", |
|||
issueInitiator: "", |
|||
issueStatus: "", |
|||
issueSuggestion: "", |
|||
issueTitle: "", |
|||
joinVote: true, |
|||
projectId: "", |
|||
projectStatus: false, |
|||
publishIdeaFlag: false, |
|||
}, |
|||
|
|||
issueTrend: {}, |
|||
issueChartData: [], |
|||
}; |
|||
} |
|||
|
|||
export default { |
|||
name: "issueInfo", |
|||
props: { |
|||
issueId: { |
|||
type: String, |
|||
default: "64502a8f1048a7240295527a9b32e513", |
|||
}, |
|||
type: { |
|||
type: String, |
|||
default: "info", |
|||
}, |
|||
}, |
|||
|
|||
components: { |
|||
foldText, |
|||
}, |
|||
|
|||
data: iniData, |
|||
|
|||
computed: {}, |
|||
|
|||
watch: {}, |
|||
|
|||
mounted() { |
|||
this.getApiData(); |
|||
}, |
|||
|
|||
methods: { |
|||
watchImg(src) { |
|||
window.open(src); |
|||
}, |
|||
|
|||
handleClose() { |
|||
this.$emit("close"); |
|||
}, |
|||
|
|||
handleSubmit() { |
|||
this.$emit("afterEdit"); |
|||
}, |
|||
|
|||
async getApiData() { |
|||
this.getIssueInfo(); |
|||
this.getIssueTrend(); |
|||
this.getIssueProcess(); |
|||
}, |
|||
|
|||
//加载组织数据 |
|||
async getIssueInfo() { |
|||
const url = "/resi/hall/issue/detail"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, { |
|||
issueId: this.issueId, |
|||
}); |
|||
|
|||
if (code === 0) { |
|||
this.issueInfo = data; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
//加载组织数据 |
|||
async getIssueTrend() { |
|||
const url = "/resi/hall/issue/votingtrend"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, { |
|||
issueId: this.issueId, |
|||
}); |
|||
|
|||
if (code === 0) { |
|||
this.issueTrend = data; |
|||
let chartData = []; |
|||
data.polyLine.forEach((item) => { |
|||
let date = dateFormat(new Date(item.voteDate * 1000), "yyyy-MM-dd"); |
|||
// console.log("date:" + date); |
|||
chartData.push( |
|||
{ |
|||
date, |
|||
value: item.supportIncrement, |
|||
type: "支持", |
|||
}, |
|||
{ |
|||
date, |
|||
value: item.oppositionIncrement, |
|||
type: "反对", |
|||
} |
|||
); |
|||
}); |
|||
this.issueChartData = chartData; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
//加载组织数据 |
|||
async getIssueProcess() { |
|||
const url = "/gov/issue/manage/progress"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, { |
|||
issueId: this.issueId, |
|||
}); |
|||
|
|||
if (code === 0) { |
|||
this.issueProcess = data.map((item) => { |
|||
item.processTime = dateFormat( |
|||
new Date(item.processTime * 1000), |
|||
"yyyy-MM-dd hh:mm" |
|||
); |
|||
return item; |
|||
}); |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style |
|||
lang="scss" |
|||
src="@/assets/scss/modules/shequzhili/project-info.scss" |
|||
scoped |
|||
></style> |
@ -0,0 +1,288 @@ |
|||
<template> |
|||
<div class=""> |
|||
<div class="g-page" v-show="pageType == 'info'"> |
|||
<div class="g-left"> |
|||
<el-card> |
|||
<h3>议题详情</h3> |
|||
|
|||
<div class="m-row"> |
|||
<div class="m-info"> |
|||
<div class="info-prop"> |
|||
<span>议题标题:</span> |
|||
<span>{{ issueInfo.issueTitle }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>议题建议:</span> |
|||
<span>{{ issueInfo.issueSuggestion }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>所属网格:</span> |
|||
<span>{{ issueInfo.belongsGridName || "--" }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>议题发起人:</span> |
|||
<span>{{ issueInfo.issueInitiator }}</span> |
|||
</div> |
|||
<div |
|||
v-if="issueInfo.topicInfo && issueInfo.topicInfo.groupName" |
|||
class="info-prop" |
|||
> |
|||
<span>议题来源:</span> |
|||
<span>{{ issueInfo.topicInfo.groupName }}</span> |
|||
</div> |
|||
<div class="info-prop"> |
|||
<span>转议题时间:</span> |
|||
<span>{{ issueInfo.shiftIssueTime }}</span> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="m-line"> |
|||
<div class="stat"> |
|||
<div class="stat-item"> |
|||
<div> |
|||
{{ issueTrend.realityVoteCount }}/{{ |
|||
issueTrend.shouldVoteCount |
|||
}} |
|||
</div> |
|||
<div class="z-weak">已表决/应表决</div> |
|||
</div> |
|||
<div class="stat-item"> |
|||
<div>{{ issueTrend.supportAmount }}</div> |
|||
<div class="z-weak">支持</div> |
|||
</div> |
|||
<div class="stat-item"> |
|||
<div>{{ issueTrend.oppositionAmount }}</div> |
|||
<div class="z-weak">反对</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div v-if="issueChartData.length > 0"> |
|||
<line-chart :list="issueChartData" /> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="m-btns" v-if="type == 'info'"> |
|||
<el-button size="" @click="handleClose">关闭</el-button> |
|||
</div> |
|||
</el-card> |
|||
</div> |
|||
<div class="g-right"> |
|||
<el-card class="m-card" v-if="issueProcess.length > 0"> |
|||
<h3>处理进展</h3> |
|||
<div class="m-process"> |
|||
<div class="list"> |
|||
<div |
|||
class="item" |
|||
:class="index === 0 ? 'z-on' : ''" |
|||
:key="item.processId" |
|||
v-for="(item, index) in issueProcess" |
|||
> |
|||
<div class="item-row"> |
|||
<div class="name">{{ item.processName }}</div> |
|||
<div class="date"> |
|||
{{ item.processTime }} |
|||
</div> |
|||
</div> |
|||
|
|||
<div class="detail"> |
|||
<div class="detail-field">处理部门:</div> |
|||
<div class="detail-value">{{ item.departmentName }}</div> |
|||
</div> |
|||
|
|||
<div |
|||
class="detail" |
|||
v-if="item.processName != '转项目' && item.publicReply" |
|||
> |
|||
<div class="detail-field">说 明:</div> |
|||
<div class="detail-value"> |
|||
<fold-text :row="3">{{ item.publicReply }}</fold-text> |
|||
</div> |
|||
</div> |
|||
|
|||
<div |
|||
class="detail" |
|||
v-if="item.processName != '转项目' && item.internalRemark" |
|||
> |
|||
<div class="detail-field">内部备注:</div> |
|||
<div class="detail-value"> |
|||
<fold-text :row="3">{{ item.internalRemark }}</fold-text> |
|||
</div> |
|||
</div> |
|||
<div class="detail"> |
|||
<div class="attachement-list"> |
|||
<a |
|||
:href="att.url" |
|||
target="_blank" |
|||
:key="att.url" |
|||
v-for="att in item.internalFile" |
|||
> |
|||
<i class="el-icon-folder-opened"></i> |
|||
{{ att.name }} |
|||
</a> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</el-card> |
|||
</div> |
|||
</div> |
|||
</div> |
|||
</template> |
|||
|
|||
<script> |
|||
import { requestPost } from "@/js/dai/request"; |
|||
import foldText from "@/views/components/foldText"; |
|||
import dateFormat from "dai-js/tools/dateFormat"; |
|||
import lineChart from "@/views/modules/visual/cpts/line-chart"; |
|||
|
|||
function iniData() { |
|||
return { |
|||
pageType: "info", |
|||
|
|||
issueProcess: [], |
|||
|
|||
issueInfo: { |
|||
attitude: "", |
|||
belongsGridName: "", |
|||
issueIdea: "", |
|||
issueInitiator: "", |
|||
issueStatus: "", |
|||
issueSuggestion: "", |
|||
issueTitle: "", |
|||
joinVote: true, |
|||
projectId: "", |
|||
projectStatus: false, |
|||
publishIdeaFlag: false, |
|||
}, |
|||
|
|||
issueTrend: {}, |
|||
issueChartData: [], |
|||
}; |
|||
} |
|||
|
|||
export default { |
|||
name: "issueInfo", |
|||
props: { |
|||
issueId: { |
|||
type: String, |
|||
default: "64502a8f1048a7240295527a9b32e513", |
|||
}, |
|||
type: { |
|||
type: String, |
|||
default: "info", |
|||
}, |
|||
}, |
|||
|
|||
components: { |
|||
foldText, |
|||
lineChart, |
|||
}, |
|||
|
|||
data: iniData, |
|||
|
|||
computed: {}, |
|||
|
|||
watch: {}, |
|||
|
|||
mounted() { |
|||
this.getApiData(); |
|||
}, |
|||
|
|||
methods: { |
|||
watchImg(src) { |
|||
window.open(src); |
|||
}, |
|||
|
|||
handleClose() { |
|||
this.$emit("close"); |
|||
}, |
|||
|
|||
handleSubmit() { |
|||
this.$emit("afterEdit"); |
|||
}, |
|||
|
|||
async getApiData() { |
|||
this.getIssueInfo(); |
|||
this.getIssueTrend(); |
|||
this.getIssueProcess(); |
|||
}, |
|||
|
|||
//加载组织数据 |
|||
async getIssueInfo() { |
|||
const url = "/resi/hall/issue/detail"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, { |
|||
issueId: this.issueId, |
|||
}); |
|||
|
|||
if (code === 0) { |
|||
this.issueInfo = data; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
//加载组织数据 |
|||
async getIssueTrend() { |
|||
const url = "/resi/hall/issue/votingtrend"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, { |
|||
issueId: this.issueId, |
|||
}); |
|||
|
|||
if (code === 0) { |
|||
this.issueTrend = data; |
|||
let chartData = []; |
|||
data.polyLine.forEach((item) => { |
|||
let date = dateFormat(new Date(item.voteDate * 1000), "yyyy-MM-dd"); |
|||
// console.log("date:" + date); |
|||
chartData.push( |
|||
{ |
|||
date, |
|||
value: item.supportIncrement, |
|||
type: "支持", |
|||
}, |
|||
{ |
|||
date, |
|||
value: item.oppositionIncrement, |
|||
type: "反对", |
|||
} |
|||
); |
|||
}); |
|||
this.issueChartData = chartData; |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
|
|||
//加载组织数据 |
|||
async getIssueProcess() { |
|||
const url = "/gov/issue/manage/progress"; |
|||
|
|||
const { data, code, msg } = await requestPost(url, { |
|||
issueId: this.issueId, |
|||
}); |
|||
|
|||
if (code === 0) { |
|||
this.issueProcess = data.map((item) => { |
|||
item.processTime = dateFormat( |
|||
new Date(item.processTime * 1000), |
|||
"yyyy-MM-dd hh:mm" |
|||
); |
|||
return item; |
|||
}); |
|||
} else { |
|||
this.$message.error(msg); |
|||
} |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style |
|||
lang="scss" |
|||
src="@/assets/scss/modules/shequzhili/project-info.scss" |
|||
scoped |
|||
></style> |
Loading…
Reference in new issue