备份

hailu

2024-12-02 0bbcee731e5259feadd261e8a84c3e27b8387e01

 pages/checkPolicies/originalText.vue

@@ -0,0 +1,355 @@
<template>
    <view class="container">
        <header>
            <view class="left" @click="chooseLocation">
                <u-icon name="arrow-down" color="#fff"></u-icon>
                <text class="location">{{ address }}</text>
            </view>
            <u-input class="search" placeholder="搜索" type="text" v-model="search" />
            <u-button type="primary" style="width: 100upx;margin-top: 20upx;" size="normal" text="搜索"
                @click="onPageChange(1)"></u-button>
        </header>

        <view
            style="padding: 40upx;background-color: #fff;margin-top: 20upx;display: flex;justify-content: space-between;">
            <scroll-view scroll-x class="tabs-scroll" style="white-space: nowrap;">
                <u-tabs :list="tabsList" @click="chooseArticleType" style="padding-left: 4px;" lineWidth="20"
                    lineColor="#f56c6c" :activeStyle="{
                        color: '#303133',
                        fontWeight: 'bold',
                        transform: 'scale(1.05)'
                    }" :inactiveStyle="{
                        color: '#606266',
                        transform: 'scale(1)'
                    }" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;" :scrollable="true">
                </u-tabs>
            </scroll-view>
        </view>

        <view v-if="!loading &&  goodsList.length > 0"
            style="padding: 40upx;background-color: #fff;margin-top: 20upx;color: #969799;font-size: 28upx;padding-bottom: 200upx;">
            <view class="goods-item" v-for="(item, index) in goodsList" :key="index" @click="godetail(item)">
                <view style="background-color: #f7f7f7;padding: 10upx;margin-bottom: 10upx;">
                    <view style="display: flex;justify-content: space-between;">
                        <view style="font-weight: 800px;color: #000;">{{ item.ArticleTitle }}</view>

                        <view style="width: auto;" @click.stop="star(item)">
                            <u-icon :name="item.FavoriteFlag == 1 ? 'star-fill' : 'star'"
                                :color="item.FavoriteFlag == 1 ? 'gold' : 'darkgray'" size="28"></u-icon>
                        </view>
                    </view>
                    <view style="display: flex;justify-content: space-between;">
                        <view style="font-size: 22upx;line-height: 44upx;">{{ item.Platform }}</view>
                        <u-tag :text="item.PubTime.split(' ')[0]" plain size="mini" type="warning"></u-tag>
                    </view>
                </view>
            </view>
        </view>
        <view v-if="loading" style="margin-top: 100upx;">
            <u-loading-icon></u-loading-icon>
        </view>
        <u-empty v-if="!loading && goodsList.length == 0" mode="data" icon="http://cdn.uviewui.com/uview/empty/car.png">
      </u-empty>
        <view style="position: fixed;bottom: 0;background-color: #fff;width: 100%;">
            <Pagination :totalItems="total" :itemsPerPage="pageSize" :currentPage="pageIndex"
                @page-change="onPageChange" />
        </view>
        <u-popup :show="showLocation" :round="10" mode="bottom" @close="closeLocation" :closeable="true">
            <view style="padding: 40upx;display: flex;flex-wrap: wrap;">
                <view class="u-page__tag-item" v-for="(item, index) in locationList" :key="index">
                    <u-tag :text="item.Region" :plain="item.Region != address" type="warning" :name="index"
                        @click="locationClick(item.Region)">
                    </u-tag>
                </view>
            </view>
        </u-popup>
    </view>
</template>

<script>
import Pagination from '../../components/Pagination';
export default {
    components: {
        Pagination
    },
    data() {
        return {
            total: 0,
            pageIndex: 1,
            pageSize: 8,

            search: '',
            titleNViewBackground: '',
            swiperCurrent: 0,
            swiperLength: 0,
            carouselList: [],
            goodsList: [],
            address: '上海市',
            showLocation: false,
            locationList: [],
            tabsList: [
                {
                    name: '综合',
                    ArticleType: '',
                },
                {
                    name: '申报通知',
                    ArticleType: '申报通知'

                },
                {
                    name: '公示公告',
                    ArticleType: '公示公告'
                },
                {
                    name: '政策',
                    ArticleType: '政策'
                },
                {
                    name: '法规',
                    ArticleType: '法规'
                },
                {
                    name: '其他',
                    ArticleType: '其他'
                },
            ],
            ArticleType: '',
            loading: false,
        };
    },
    onLoad() {
        if (uni.getStorageSync('location')) {
            this.address = uni.getStorageSync('location')
        }
        this.GetAreaDataList()

    },
    methods: {
        // 收藏
        star(item) {
            const userId = Number(uni.getStorageSync('userId'));
            if (item.FavoriteFlag == 0) {
                const data = {
                    ArticleId: item.Id,
                    UserId: userId
                };
                this.$http.post('/CollectArticle/AddCollectArticleData', data).then(res => {
                    if (res.Check) {
                        item.FavoriteFlag = 1;
                        this.$msg('操作成功');
                    } else {
                        this.$msg(res.Msg);
                    }
                });
            } else if (item.FavoriteFlag == 1) {
                const data = {
                    ArticleId: item.Id,
                    UserId: userId
                };
                this.$http.post('/CollectArticle/DelCollectArticleDataById', data).then(res => {
                    if (res.Check) {
                        item.FavoriteFlag = 0;
                        this.$msg('操作成功');
                    } else {
                        this.$msg(res.Msg);
                    }
                });
            }
        },

        // 获取地区AreaData/GetAreaDataList
        GetAreaDataList() {
            let data = {
                City: this.address
            }
            this.locationList = [
                {
                    City: null,
                    Id: 0,
                    Province: null,
                    Region: "全部"
                },
                {
                    City: null,
                    Id: 0,
                    Province: null,
                    Region: "国家部委"
                },
                {
                    City: null,
                    Id: 0,
                    Province: null,
                    Region: this.address
                }

            ]
            this.$http.post('/AreaData/GetAreaDataList', data).then(res => {
                if (res.Check) {
                    for (let i = 0; i < res.Data.length; i++) {
                        this.locationList.push({
                            City: null,
                            Id: 0,
                            Province: null,
                            Region: res.Data[i].Region
                        })
                    }
                    this.getArticleDataList()
                } else {
                    this.$msg(res.Msg)
                }
            })
        },

        //选择地区 弹窗
        chooseLocation() {
            this.showLocation = true
        },
        locationClick(name) {
            this.address = name
            // uni.setStorageSync('location', name)
            this.getArticleDataList()
            this.showLocation = false
        },
        chooseArticleType(e) {
            console.log('item', e);
            this.ArticleType = e.ArticleType
            this.onPageChange(1)

        },
        // 
        getArticleDataList() {
            this.loading = true
            let data = {
                Platform: this.address,
                ArticleType: this.ArticleType,
                Scope: '',
                Keyword: this.search,
                PageNumber: this.pageIndex,
                PageSize: this.pageSize,
                UserId: uni.getStorageSync('userId')
            }
            this.$http.post('/ArticleData/GetArticleDataList', data).then(res => {
                if (res.Check) {
                    this.goodsList = res.Data.Data
                    this.total = res.Data.TotalCount
                    this.loading = false
                } else {
                    this.$msg(res.Msg)
                    this.goodsList = []
                    this.loading = false
                }
            })
        },
        godetail(item) {
            // 手机浏览器跳转
            window.open(item.ArticleUrl, "_blank");
        },
        onPageChange(e){
            this.pageIndex = e
            this.getArticleDataList()
        }
        
    }
}
</script>

<style lang="scss" scoped>
page {
    background-color: #F7F7F7;
}

.mp-search-box {
    position: absolute;
    left: 0;
    top: 30upx;
    z-index: 9999;
    width: 100%;
    padding: 0 80upx;

    .ser-input {
        flex: 1;
        height: 56upx;
        line-height: 56upx;
        text-align: center;
        font-size: 28upx;
        color: $font-color-base;
        border-radius: 20px;
        background: rgba(255, 255, 255, .6);
    }
}

header {
    padding: 0 30upx;
    height: 120upx;
    background-color: #236AF0;
    display: flex;
    color: #fff;
    font-size: 14px;

    .left {
        width: 150upx;
        height: 120upx;
        line-height: 120upx;
        text-align: left;
        display: flex;

        i {
            font-size: 36upx;
        }
    }

    .search {
        flex: 1;
        height: 80upx;
        line-height: 80upx;
        border-radius: 40upx;
        background-color: #fff;
        padding: 0 20upx;
        margin: 20upx 0;
        color: #236AF0;

        i {
            font-size: 26upx;
            color: #ccc;
        }
    }

}

/* 分类 */
.cate-section {
    display: flex;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap;
    padding: 30upx 22upx;
    background: #fff;

    .cate-item {
        display: flex;
        flex-direction: column;
        align-items: center;
        font-size: $font-sm + 2upx;
        color: $font-color-dark;
    }

    /* 原图标颜色太深,不想改图了,所以加了透明度 */
    image {
        width: 88upx;
        height: 88upx;
        margin-bottom: 14upx;
        border-radius: 50%;
        opacity: .7;
        box-shadow: 4upx 4upx 20upx rgba(250, 67, 106, 0.3);
    }
}

.u-page__tag-item {
    height: 40upx;
    line-height: 40upx;
    min-width: 50upx;
    text-align: center;
    margin: 10upx;
}
</style>