From feefbf8548220ba0fac0862fc46f44ef088ef6ed Mon Sep 17 00:00:00 2001 From: jiangyy Date: Tue, 26 Jul 2022 14:48:14 +0800 Subject: [PATCH] 111 --- .../shequzhili/event-info-visiual.scss | 401 ++++++++++++++++++ .../shequzhili/event/cpts/event-info.vue | 20 +- .../communityGovern/fivelayers/eventInfo.vue | 4 +- 3 files changed, 416 insertions(+), 9 deletions(-) create mode 100644 src/assets/scss/modules/shequzhili/event-info-visiual.scss diff --git a/src/assets/scss/modules/shequzhili/event-info-visiual.scss b/src/assets/scss/modules/shequzhili/event-info-visiual.scss new file mode 100644 index 00000000..8b84ffce --- /dev/null +++ b/src/assets/scss/modules/shequzhili/event-info-visiual.scss @@ -0,0 +1,401 @@ +@import "../../c/config"; +@import "../../c/function"; + +.g-add{ + .g-add-page{ + display: flex; + .g-left { + box-sizing: border-box; + width:40%; + padding: 5px 10px; + + } + .g-right { + box-sizing: border-box; + width: 60%; + padding: 5px 10px; + } + + .form{ + .cell-width-1{ + width: 250px + } + .avatar-uploader { + margin: 0 0 0 20px; + + } + + + } + } +} + +.g-page { + display: flex; + width:100%; + .g-total{ + width:100%; + } + .g-left { + box-sizing: border-box; + width: 65%; + padding: 5px 10px; + } + .g-right { + box-sizing: border-box; + width: 35%; + padding: 5px 10px; + } +} + +.g-process-info{ + .cell-width-area{ + width: 450px + } +} +.div_map { + position: relative; +} +.div_searchmap { + z-index: 1000; + position: absolute; + top: 5px; + left: 5px; +} + +.div-btn{ + margin-top:50px; + display: flex; + justify-content: center; +} +.cell-width-1{ + width: 250px +} +.cell-width-long{ + width: 450px +} +.cell-width-2{ + width: 350px +} + +.cell-width-map { + width: 200px; +} +.item_width_3 { + margin-left: 10px; + width: 150px; +} + +.process-form{ + margin-top:20px; +} + +.m-card { + // overflow-x: auto; +} + + + + +.m-btns { + display: flex; + justify-content: center; +} + + +.m-info { + padding-left: 30px; + font-size: 14px; + font-family: PingFang SC; + font-weight: 400; + color: #333; + line-height: 24px; + // width: 500px; + + .info-title { + margin-top: 30px; + font-size: 20px; + font-family: PingFang SC; + font-weight: bold; + color: #333; + line-height: 30px; + } + .info-content { + margin: 20px 0; + } + .info-pics { + display: flex; + margin: 20px 0; + img { + display: block; + width: 32%; + height: 90px; + margin-right: 9px; + object-fit: cover; + } + } + + .info-prop { + position: relative; + margin: 10px 0; + display: flex; + padding-left: 15px; + + .line{ + text-decoration:underline; + color: #3e8ef7; + } + .line:hover{ + cursor:pointer + } + .info-title-2 { + + flex: 0 0 100px; + font-size: 14px; + } + + > span, + > div { + display: block; + // max-width: 300px; + } + + &::before { + content: ""; + display: block; + position: absolute; + top: 9px; + left: 0; + width: 7px; + height: 7px; + background: #0c81fe; + border-radius: 3px; + margin-right: 10px; + } + } +} + +.m-case { + height: 600px; + padding: 20px 0 20px 0; + overflow-y: auto; +} + +.m-row { + // display: flex; + justify-content: space-between; + width:100%; +} + +.m-hint { + position: relative; + height: 300px; + + // 暂无数据 + img { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + margin: auto; + } +} + +.m-line { + min-width: 400px; + + .stat { + margin: 20px 0 10px; + display: flex; + .stat-item { + width: 33%; + text-align: center; + + div { + font-size: 17px; + font-family: Source Han Serif SC; + font-weight: 500; + color: rgba(#000, 0.5); + line-height: 24px; + &.z-weak { + font-size: 12px; + font-family: Source Han Serif SC; + font-weight: 500; + color: rgba(#000, 0.5); + line-height: 24px; + } + } + } + } +} + +.m-process { + margin-top: 30px; + margin-left: 15px; + // min-width: 400px; + + .process-title { + margin-bottom: 25px; + margin-left: -5px; + font-size: 16px; + font-family: PingFang SC; + font-weight: bold; + color: #333; + line-height: 18px; + } + + .list { + position: relative; + box-sizing: border-box; + margin-top: 30px/2; + margin-left: 50px/2; + padding: 0 0 0 30px/2; + width: 680px/2; + border-left: 3px solid #0c81fe; + padding-right: 10px; + + &::before { + content: ""; + position: absolute; + z-index: 1; + display: block; + top: -2px/2; + left: -2px/2; + width: 5px/2; + height: 20px/2; + background-color: #333; + } + + .item { + position: relative; + z-index: 2; + margin-bottom: 8px; + padding-bottom: 8px; + font-size: 16px; + font-family: PingFang SC; + font-weight: 400; + color: #333; + line-height: 24px; + padding-left: 20px; + padding-top: 1px; + + &::before { + content: ""; + display: block; + position: absolute; + top: -5px; + left: -11px; + width: 18px; + height: 18px; + background: #0c81fe; + border: 4px solid lighten(#0c81fe, 15); + border-radius: 100%; + } + + &.z-on { + &::before { + background: #e08400; + border-color: lighten(#e08400, 15); + } + } + + &:last-child { + margin-bottom: 0; + padding-bottom: 0; + border-bottom: none; + } + + .item-row { + margin-top: -10px; + margin-bottom: 10px; + display: flex; + } + + .name { + position: relative; + padding: 0 10px; + font-size: 12px; + font-family: PingFang SC; + font-weight: 500; + color: #fff; + line-height: 22px; + height: 22px; + border-radius: 10px 0 10px 0; + background-color: #0c81fe; + // background-color: #e08400; + } + + .date { + margin-left: 10px; + font-size: 12px; + font-family: PingFang SC; + font-weight: 500; + color: #7ca1d2; + line-height: 25px; + } + + .detail { + @include cs; + font-size: 14px; + line-height: 20px; + margin-bottom: 5px; + display: flex; + + .detail-field { + flex:0 0 100px; + + text-align: justify; + text-align-last: justify; + } + .detail-value { + // width: 78%; + .detail-link { + display: inline; + } + } + } + + .attachement-list { + padding-left: 80px; + a { + display: block; + cursor: pointer; + color: #4df0ff; + font-size: 14px; + + i { + color: #333; + } + } + } + } + } +} + +.m-top { + display: flex; +} + +.m-chart { + min-height: 200px; +} + +.div-satisfy{ + padding:10px 0 0; + display:flex ; + justify-content: flex-start; + text-align: center; + >div{ + margin-left:50px; + } + img{ + width:80px; + height:80px; + } + + .tip-satisfy{ + text-align: center; + margin-top:10px + } +} diff --git a/src/views/modules/shequzhili/event/cpts/event-info.vue b/src/views/modules/shequzhili/event/cpts/event-info.vue index b85407f3..3d62a4ef 100644 --- a/src/views/modules/shequzhili/event/cpts/event-info.vue +++ b/src/views/modules/shequzhili/event/cpts/event-info.vue @@ -258,6 +258,11 @@ export default { return {} } }, + + source: {//展示来源：manage 管理平台 visiual 可视化平台 + type: String, + default: 'manage' + } }, components: { @@ -283,7 +288,14 @@ export default { // this.getApiData(); }, }, + created () { + if (this.source === 'visiual') { + require("@/assets/scss/modules/shequzhili/event-info-visiual.scss") + } else { + require("@/assets/scss/modules/shequzhili/event-info.scss") + } + }, mounted () { this.pageTypeCopy = this.pageType if (this.pageTypeCopy !== 'add') { @@ -296,8 +308,6 @@ export default { }, methods: { - - changeName (val) { this.demandUserName = val }, @@ -563,8 +573,4 @@ export default { }; - + diff --git a/src/views/modules/visual/communityGovern/fivelayers/eventInfo.vue b/src/views/modules/visual/communityGovern/fivelayers/eventInfo.vue index 0e5ccee6..ce58cf76 100644 --- a/src/views/modules/visual/communityGovern/fivelayers/eventInfo.vue +++ b/src/views/modules/visual/communityGovern/fivelayers/eventInfo.vue @@ -11,13 +11,13 @@ @click="handleClose"> -
需求内容
@@ -111,7 +111,7 @@ export default { .wrap { .list { display: block; - width: 50%; + width: 60%; .item { display: flex; width: 100%;