shuyuanweb/src/views/pc/home/policy/OtherPolicy.vue

<template>
    <div class="other-policy" v-if="dataList && dataList.length > 0">
        <div class="other-policy-title">其他政策</div>
        <div class="other-policy-content">
            <span
                v-for="item in dataList"
                :key="item.releasePolicyId"
                :title="item.policyName"
                @click="goRoute(item)"
            >
                {{ item.policyName }}
            </span>
        </div>
    </div>
</template>
<script setup>
import { onMounted } from "vue";
import { getReleasePolicyData } from "@/views/pc/policy/policy";
import { routerOpenInNewWindow } from "@/utils/common.js";
const { params, getList } = getReleasePolicyData();
let dataList = ref([]);
const loading = ref(true);
const getListData = async () => {
    let dataObj = await getList(params);
    dataList.value = dataObj.list;
};
const goRoute = val => {
    localStorage.setItem("policyInfo", JSON.stringify(val));
    routerOpenInNewWindow({
        path: "/p_preferential-policy-detail",
        query: {
            releasePolicyId: val.releasePolicyId,
        },
    });
};
onMounted(async () => {
    loading.value = true;
    getListData();
    loading.value = false;
});
</script>
<style lang="scss" scoped>
.other-policy {
    padding: 16px;
    @include border-box;
    margin-bottom: 28px;

    &-title {
        @include font(24px, $color-black);
        text-align: center;
        font-weight: bold;
        margin-bottom: 20px;
    }
    &-content {
        @include flex(row, space-between, flex-start, wrap);
        @include font(18px, $color-black);
        line-height: 20px;
        span {
            width: 50%;
            margin-bottom: 20px;
            @include text-ellipsis;
            padding-right: 30px;
            @include border-box;
            cursor: pointer;
        }
    }
}
</style>