This commit is contained in:
花有清香月有阴
2021-12-23 18:06:33 +08:00
2 changed files with 96 additions and 63 deletions

View File

@@ -2,7 +2,8 @@
<div class="AppServicePublic"> <div class="AppServicePublic">
<AiTopFixed v-if="tabs.length"> <AiTopFixed v-if="tabs.length">
<div class="tab-select" @click="tabClick(item)"> <div class="tab-select" @click="tabClick(item)">
<div class="item" :class="tabIndex == index ? 'active' : ''" v-for="(item, index) in tabs" :key="index" @click="tabClick(item)">{{item.categoryName}}<span></span></div> <div class="item" :class="tabIndex == index ? 'active' : ''" v-for="(item, index) in tabs" :key="index"
@click="tabClick(item)">{{ item.categoryName }}<span></span></div>
</div> </div>
</AiTopFixed> </AiTopFixed>
<div class="header-top"> <div class="header-top">
@@ -10,21 +11,22 @@
<AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="areaSelect"></AiAreaPicker> <AiAreaPicker v-model="areaId" :areaId="user.areaId" @select="areaSelect"></AiAreaPicker>
</div> </div>
<u-search class="serach_content" placeholder="请输入标题" :show-action="false" v-model="keyword" @clear="clearSearch" @search="search"></u-search> <u-search class="serach_content" placeholder="请输入标题" :show-action="false" v-model="keyword" @clear="clearSearch"
@search="search"></u-search>
<template v-if="datas.length > 0"> <template v-if="datas.length > 0">
<AiCard v-for="(item, i) in datas" :key="i" @click.native="toAdd(item, 1)"> <AiCard v-for="(item, i) in datas" :ref="item.id" :key="i" @click.native="toAdd(item, 1)">
<template #custom> <template #custom>
<div class="titles">{{ item.title }}</div> <div class="titles">{{ item.title }}</div>
<div class="flex"> <div class="flex">
<span class="left"> <span class="left">
<span class="garydiv" v-if="item.categoryName">{{item.categoryName}}</span> <span class="garydiv" v-if="item.categoryName">{{ item.categoryName }}</span>
<span class="times">{{item.createTime.substring(0, 10)}}</span> <span class="times">{{ item.createTime.substring(0, 10) }}</span>
</span> </span>
<span class="right"> <span class="right">
<span class="font">{{item.viewCount}}</span> <span class="font">{{ item.viewCount }}</span>
<span>人看过</span> <span>人看过</span>
</span> </span>
</div> </div>
@@ -40,21 +42,22 @@
</template> </template>
</AiCard> </AiCard>
<u-loadmore :status="loadmore" color="#999" font-size="24" margin-top="32" margin-bottom="80" /> <u-loadmore :status="loadmore" color="#999" font-size="24" margin-top="32" margin-bottom="80"/>
</template> </template>
<AiEmpty description="暂无数据" v-else></AiEmpty> <AiEmpty description="暂无数据" v-else></AiEmpty>
<AiFixedBtn> <AiFixedBtn>
<div class="addBtn iconfont iconfont-iconfangda" @tap.stop="toAdd()" /> <div class="addBtn iconfont iconfont-iconfangda" @tap.stop="toAdd()"/>
</AiFixedBtn> </AiFixedBtn>
<u-modal v-model="deletShow" content="您确认要删除该条信息吗?" :show-cancel-button="true" :mask-close-able="true" :show-title="false" @confirm="delet"></u-modal> <u-modal v-model="deletShow" content="您确认要删除该条信息吗?" :show-cancel-button="true" :mask-close-able="true"
:show-title="false" @confirm="delet"></u-modal>
</div> </div>
</template> </template>
<script> <script>
import { mapState } from 'vuex' import {mapState} from 'vuex'
export default { export default {
name: 'AppServicePublic', name: 'AppServicePublic',
@@ -92,22 +95,23 @@ export default {
this.listName = o.listName this.listName = o.listName
this.getType() this.getType()
this.getList() this.getList()
uni.$on('update' , () => { uni.$on('update', () => {
this.getList() this.getList()
}) })
uni.setNavigationBarTitle({title: this.listName}) uni.setNavigationBarTitle({title: this.listName})
document.title = "三务公开"
}, },
methods: { methods: {
getType() { getType() {
this.$http.post(`/app/appcontentmoduleinfo/listByName?names=${this.listName}`).then((res) => { this.$http.post(`/app/appcontentmoduleinfo/listByName?names=${this.listName}`).then((res) => {
if (res.code == 0) { if (res.code == 0) {
if(res.data && res.data[0].categoryList.length) { if (res.data && res.data[0].categoryList.length) {
var all = [{ var all = [{
categoryName: '全部', categoryName: '全部',
id: '', id: '',
showIndex: 0, showIndex: 0,
}] }]
this.tabs = [...all, ... res.data[0].categoryList] this.tabs = [...all, ...res.data[0].categoryList]
} }
} }
}) })
@@ -141,23 +145,24 @@ export default {
}, },
toAdd(item, type) { toAdd(item, type) {
if (item?.id) {
this.$refs?.[item.id]?.[0]?.handleClose()
}
if (type == '1') { if (type == '1') {
console.log('详情') uni.navigateTo({url: `./Detail?id=${item.id}&listName=${this.listName}`})
uni.navigateTo({ url: `./Detail?id=${item.id}&listName=${this.listName}` })
} }
if (type == '2') { if (type == '2') {
console.log('编辑') uni.navigateTo({url: `./Add?id=${item.id}&moduleId=${this.moduleId}&listName=${this.listName}`})
uni.navigateTo({ url: `./Add?id=${item.id}&moduleId=${this.moduleId}&listName=${this.listName}` })
} }
if (type == null) { if (type == null) {
console.log('添加') uni.navigateTo({url: `./Add?moduleId=${this.moduleId}&listName=${this.listName}`})
uni.navigateTo({ url: `./Add?moduleId=${this.moduleId}&listName=${this.listName}` })
} }
}, },
toDetele(item) { toDetele(item) {
this.deletShow = true this.deletShow = true
this.deletId = item.id this.deletId = item.id
this.$refs?.[item.id]?.[0]?.handleClose()
}, },
delet() { delet() {
@@ -181,28 +186,33 @@ export default {
uni-page-body { uni-page-body {
height: 100%; height: 100%;
} }
::v-deep .content{
padding: 0!important; ::v-deep .content {
padding: 0 !important;
} }
.tab-select{
.tab-select {
width: 100%; width: 100%;
height: 96px; height: 96px;
line-height: 96px; line-height: 96px;
background: #3975C6; background: #3975C6;
display: flex; display: flex;
.item{
.item {
flex: 1; flex: 1;
text-align: center; text-align: center;
font-size: 28px; font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC; font-family: PingFangSC-Regular, PingFang SC;
color: #CDDCF0; color: #CDDCF0;
} }
.active{
.active {
font-family: PingFangSC-Medium, PingFang SC; font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500; font-weight: 500;
position: relative; position: relative;
color: #fff; color: #fff;
span{
span {
width: 48px; width: 48px;
height: 4px; height: 4px;
background: #FFF; background: #FFF;
@@ -213,9 +223,11 @@ uni-page-body {
} }
} }
} }
.iconfont-iconMore{
.iconfont-iconMore {
// margin-top: 8px; // margin-top: 8px;
} }
.AppServicePublic { .AppServicePublic {
height: 100%; height: 100%;
@@ -235,19 +247,23 @@ uni-page-body {
::v-deep .AiCard { ::v-deep .AiCard {
background: #f3f6f9; background: #f3f6f9;
.start { .start {
background: #fff; background: #fff;
padding: 32px; padding: 32px;
border-radius: 16px; border-radius: 16px;
.titles { .titles {
font-size: 32px; font-size: 32px;
font-weight: 500; font-weight: 500;
color: #333333; color: #333333;
margin-bottom: 16px; margin-bottom: 16px;
} }
.flex { .flex {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.left { .left {
.garydiv { .garydiv {
font-size: 28px; font-size: 28px;
@@ -256,6 +272,7 @@ uni-page-body {
border-radius: 24px; border-radius: 24px;
padding: 4px 16px; padding: 4px 16px;
} }
.times { .times {
margin-left: 16px; margin-left: 16px;
font-size: 28px; font-size: 28px;
@@ -266,12 +283,14 @@ uni-page-body {
.right { .right {
font-size: 28px; font-size: 28px;
color: #999; color: #999;
.font { .font {
color: #4181ff; color: #4181ff;
} }
} }
} }
} }
.mask { .mask {
.moreMenu { .moreMenu {
.menu { .menu {

View File

@@ -1,9 +1,10 @@
<template> <template>
<div class="AppUniMsg"> <div class="AppUniMsg">
<u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bg-color="#3975C6" inactive-color="#fff" active-color="#fff" @change="change"></u-tabs> <u-tabs :list="tabList" :is-scroll="false" :current="currentTabs" height="96" bg-color="#3975C6"
inactive-color="#fff" active-color="#fff" @change="change"></u-tabs>
<template v-if="datas.length > 0"> <template v-if="datas.length > 0">
<AiCard v-for="(item, i) in datas" :key="i" @click.native="toAdd(item, 1)"> <AiCard v-for="(item, i) in datas" :ref="item.id" :key="i" @click.native="toAdd(item, 1)">
<template #custom> <template #custom>
<div class="titles"> <div class="titles">
{{ item.title }} {{ item.title }}
@@ -20,7 +21,8 @@
</div> </div>
<div class="imgs"> <div class="imgs">
<img :src="items.url" alt="" v-for="(items, i) in item.images" :key="i" v-if="i < 3" @click.stop="previewImage(item.images, items.url)" /> <img :src="items.url" alt="" v-for="(items, i) in item.images" :key="i" v-if="i < 3"
@click.stop="previewImage(item.images, items.url)"/>
</div> </div>
</template> </template>
@@ -30,21 +32,22 @@
</template> </template>
</AiCard> </AiCard>
<u-loadmore :status="loadmore" color="#999" font-size="24" margin-top="32" margin-bottom="80" /> <u-loadmore :status="loadmore" color="#999" font-size="24" margin-top="32" margin-bottom="80"/>
</template> </template>
<AiEmpty description="暂无数据" v-else></AiEmpty> <AiEmpty description="暂无数据" v-else></AiEmpty>
<AiFixedBtn> <AiFixedBtn>
<div class="addBtn iconfont iconfont-iconfangda" @tap.stop="toAdd()" /> <div class="addBtn iconfont iconfont-iconfangda" @tap.stop="toAdd()"/>
</AiFixedBtn> </AiFixedBtn>
<u-modal v-model="deletShow" content="您确认要删除该条信息吗?" :show-cancel-button="true" :mask-close-able="true" :show-title="false" @confirm="delet"></u-modal> <u-modal v-model="deletShow" content="您确认要删除该条信息吗?" :show-cancel-button="true" :mask-close-able="true"
:show-title="false" @confirm="delet"></u-modal>
</div> </div>
</template> </template>
<script> <script>
import { mapState } from 'vuex' import {mapState} from 'vuex'
export default { export default {
name: 'AppUniMsg', name: 'AppUniMsg',
@@ -80,53 +83,55 @@ export default {
onLoad() { onLoad() {
this.getList() this.getList()
}, },
onShow() {}, onShow() {
document.title= "小程序公告"
},
methods: { methods: {
getList() { getList() {
this.$http this.$http
.post('/app/appmininotice/list', null, { .post('/app/appmininotice/list', null, {
params: { params: {
size: this.size, size: this.size,
current: this.current, current: this.current,
createUserId: this.currentTabs == 1 ? this.user.id : '', createUserId: this.currentTabs == 1 ? this.user.id : '',
}, },
}) })
.then((res) => { .then((res) => {
if (res.code == 0) { if (res.code == 0) {
this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records this.datas = this.current > 1 ? [...this.datas, ...res.data.records] : res.data.records
if (this.datas) { if (this.datas) {
this.datas.map((item) => { this.datas.map((item) => {
if (item.images) { if (item.images) {
item.images = JSON.parse(item.images || '[]') item.images = JSON.parse(item.images || '[]')
} }
return item return item
}) })
}
this.pages = res.data.pages
} }
})
this.pages = res.data.pages
}
})
}, },
toAdd(item, type) { toAdd(item, type) {
console.log(type) if (item?.id) {
this.$refs?.[item.id]?.[0]?.handleClose()
}
if (type == '1') { if (type == '1') {
console.log('详情') uni.navigateTo({url: `./Detail?id=${item.id}`})
uni.navigateTo({ url: `./Detail?id=${item.id}` })
} }
if (type == '2') { if (type == '2') {
console.log('编辑') uni.navigateTo({url: `./Add?id=${item.id}`})
uni.navigateTo({ url: `./Add?id=${item.id}` })
} }
if (type == null) { if (type == null) {
console.log('添加') uni.navigateTo({url: `./Add`})
uni.navigateTo({ url: `./Add` })
} }
}, },
toDetele(item) { toDetele(item) {
this.deletShow = true this.deletShow = true
this.deletId = item.id this.deletId = item.id
this.$refs?.[item.id]?.[0]?.handleClose()
}, },
delet() { delet() {
@@ -143,7 +148,7 @@ export default {
this.getList() this.getList()
}, },
previewImage (images, img) { previewImage(images, img) {
uni.previewImage({ uni.previewImage({
urls: images.map(v => v.url), urls: images.map(v => v.url),
current: img current: img
@@ -161,36 +166,45 @@ export default {
uni-page-body { uni-page-body {
height: 100%; height: 100%;
} }
.AppUniMsg { .AppUniMsg {
height: 100%; height: 100%;
::v-deep .AiCard { ::v-deep .AiCard {
background: #f3f6f9; background: #f3f6f9;
.start { .start {
background: #fff; background: #fff;
padding: 32px; padding: 32px;
border-radius: 16px; border-radius: 16px;
.fill { .fill {
.titles { .titles {
font-size: 30px; font-size: 30px;
color: #333; color: #333;
font-family: 500; font-family: 500;
} }
.imgs { .imgs {
margin-top: 10px; margin-top: 10px;
img { img {
width: 200px; width: 200px;
height: 200px; height: 200px;
margin-right: 8px; margin-right: 8px;
} }
img:nth-child(3n) { img:nth-child(3n) {
margin-right: 0; margin-right: 0;
} }
} }
} }
} }
.mask { .mask {
.moreMenu { .moreMenu {
transform: translate(-175px, 20px); transform: translate(-175px, 20px);
.menu { .menu {
text-align: center; text-align: center;
line-height: 80px; line-height: 80px;