瀏覽代碼

2023年5月11日17:39:24

yxb
wq 2 年之前
父節點
當前提交
f21d3f2125
共有 1 個檔案被更改,包括 150 行新增221 行删除
  1. 150
    221
      pages/index/index.vue

+ 150
- 221
pages/index/index.vue 查看文件

@@ -1,157 +1,131 @@
<template>
<filter>
<view class="statusBar" :style="{height:statusBarHeight+'px'}" v-show="isShowBar"></view>
<view class="wrapper">
<!-- Banner -->
<view class="banner">
<swiper class="swiper" circular :indicator-dots="swiper.indicatorDots" :autoplay="swiper.autoplay"
:interval="swiper.interval" :duration="swiper.duration"
indicator-active-color="rgba(0, 179, 139, 1)" :easing-function="swiper.easing">
<block v-if="state.swiperList.length >0" v-for="item in state.swiperList" :key="item.id">
<swiper-item class="swiper-item" @click="gotoLink(item)">
<image :src="item.imgUrl?strReplace(item.imgUrl):fileURL + 'image/index/banner-1.png'"
mode="widthFix"></image>
</swiper-item>
</block>
<block v-else>
<swiper-item class="swiper-item">
<image :src="fileURL + 'image/index/banner-1.png'" mode="widthFix"></image>
</swiper-item>
</block>
</swiper>

<view class="notice">
<image class="icon" :src="fileURL + 'image/index/icon-notice.png'" lazy-load="false">
</image>
<!-- <text class="notice-text">{{state.notice}}</text> -->
<uni-notice-bar style="width: 100%;" scrollable single :text="state.notice">
</uni-notice-bar>
</view>
<view class="statusBar" :style="{height:statusBarHeight+'px'}" v-show="isShowBar"></view>
<view class="wrapper">
<!-- Banner -->
<view class="banner">
<swiper class="swiper" circular :indicator-dots="swiper.indicatorDots" :autoplay="swiper.autoplay"
:interval="swiper.interval" :duration="swiper.duration" indicator-active-color="rgba(0, 179, 139, 1)"
:easing-function="swiper.easing">
<block v-if="state.swiperList.length >0" v-for="item in state.swiperList" :key="item.id">
<swiper-item class="swiper-item" @click="gotoLink(item)">
<image :src="item.imgUrl?strReplace(item.imgUrl):fileURL + 'image/index/banner-1.png'"
mode="widthFix"></image>
</swiper-item>
</block>
<block v-else>
<swiper-item class="swiper-item">
<image :src="fileURL + 'image/index/banner-1.png'" mode="widthFix"></image>
</swiper-item>
</block>
</swiper>

<view class="notice">
<image class="icon" :src="fileURL + 'image/index/icon-notice.png'" lazy-load="false">
</image>
<!-- <text class="notice-text">{{state.notice}}</text> -->
<uni-notice-bar style="width: 100%;" scrollable single :text="state.notice">
</uni-notice-bar>
</view>
</view>

<!-- 按钮导航 -->
<view class="nav">
<view class="item-box" @click="$util.navTo('/pages/recharge/select-car',true)">
<view class="item item-1">
<image :src="fileURL + 'image/index/item-1.png'" />
</view>
<view class="text">储值卡充值</view>
<!-- 按钮导航 -->
<view class="nav">
<view class="item-box" @click="$util.navTo('/pages/recharge/select-car',true)">
<view class="item item-1">
<image :src="fileURL + 'image/index/item-1.png'" />
</view>
<view class="item-box" @click="$util.navTo('/subpackage/service/search/select-car',true)">
<view class="item item-2">
<image :src="fileURL + 'image/index/item-2.png'" />
</view>
<view class="text">账单查询</view>
<view class="text">储值卡充值</view>
</view>
<view class="item-box" @click="$util.navTo('/subpackage/service/search/select-car',true)">
<view class="item item-2">
<image :src="fileURL + 'image/index/item-2.png'" />
</view>
<view class="item-box" @click="$util.navTo('/subpackage/invoice/Invoice-mannager',true)">
<view class="item item-3">
<image :src="fileURL + 'image/index/item-3.png'" />
</view>
<view class="text">通行发票</view>
<view class="text">账单查询</view>
</view>
<view class="item-box" @click="$util.navTo('/subpackage/invoice/Invoice-mannager',true)">
<view class="item item-3">
<image :src="fileURL + 'image/index/item-3.png'" />
</view>
<view class="item-box"
@click="$util.navTo('/subpackage/issueActivation/install-activation-order',true)">
<view class="item item-4">
<image :src="fileURL + 'image/index/item-4.png'" />
</view>
<view class="text">设备激活</view>
<view class="text">通行发票</view>
</view>
<view class="item-box" @click="$util.navTo('/subpackage/issueActivation/install-activation-order',true)">
<view class="item item-4">
<image :src="fileURL + 'image/index/item-4.png'" />
</view>
<view class="text">设备激活</view>
</view>

<view class="item-box"
@click="$util.navTo('/subpackage/after-sale/card-loss-reporting/select-car',true)">
<view class="item item-5">
<image :src="fileURL + 'image/index/item-5.png'" />
</view>
<view class="text">设备遗失</view>
<view class="item-box" @click="$util.navTo('/subpackage/after-sale/card-loss-reporting/select-car',true)">
<view class="item item-5">
<image :src="fileURL + 'image/index/item-5.png'" />
</view>
<!-- <view class="item-box" @click="$util.navTo('/subpackage/after-sale/rescind-carId/rescind-carId-select',true)"> -->
<view class="item-box"
@click="$util.navTo('/subpackage/after-sale/rescind-carId/rescind-carId-select',true)">
<view class="item item-6">
<image :src="fileURL + 'image/index/item-6.png'" />
</view>
<view class="text">解除车牌占用</view>
<view class="text">设备遗失</view>
</view>
<!-- <view class="item-box" @click="$util.navTo('/subpackage/after-sale/rescind-carId/rescind-carId-select',true)"> -->
<view class="item-box"
@click="$util.navTo('/subpackage/after-sale/rescind-carId/rescind-carId-select',true)">
<view class="item item-6">
<image :src="fileURL + 'image/index/item-6.png'" />
</view>
<view class="item-box"
@click="$util.navTo(`/subpackage/personal-center/setting/personal-information/corrections`,true)">
<view class="item item-7">
<image :src="fileURL + 'image/index/item-7.png'" />
</view>
<view class="text">基础信息变更</view>
<view class="text">解除车牌占用</view>
</view>
<view class="item-box"
@click="$util.navTo(`/subpackage/personal-center/setting/personal-information/corrections`,true)">
<view class="item item-7">
<image :src="fileURL + 'image/index/item-7.png'" />
</view>
<view class="item-box" @click="$util.navTo(`/pages/service/service`,true)">
<view class="item item-8">
<image :src="fileURL + 'image/index/item-more.png'" />
</view>
<view class="text">更多</view>
<view class="text">基础信息变更</view>
</view>
<view class="item-box" @click="$util.navTo(`/pages/service/service`,true)">
<view class="item item-8">
<image :src="fileURL + 'image/index/item-more.png'" />
</view>
<view class="text">更多</view>
</view>
</view>

<!-- 消息滚动显示 -->
<view class="backlog-notice">
<notice-bar :noticeList="state.noticeList" @noticeClick="$util.msg('该功能正在开发中,敬请期待!')"></notice-bar>
</view>
<!-- 消息滚动显示 -->
<view class="backlog-notice">
<notice-bar :noticeList="state.noticeList" @noticeClick="$util.msg('该功能正在开发中,敬请期待!')"></notice-bar>
</view>

<!--快速办理通道 -->
<view class="express-lane">
<view class="title">快速办理通道</view>
<view class="lane">
<view class="lane-item lane-1" :style="{ '--background': bgOrange }" @click="showMask(1)">
<image :src="fileURL + 'image/index/icon-car.png'"></image>
<view class="text">
<text class="head">客车通道</text>
<text class="decribe">业务内容简介</text>
</view>
<!--快速办理通道 -->
<view class="express-lane">
<view class="title">快速办理通道</view>
<view class="lane">
<view class="lane-item lane-1" :style="{ '--background': bgOrange }" @click="showMask(1)">
<image :src="fileURL + 'image/index/icon-car.png'"></image>
<view class="text">
<text class="head">客车通道</text>
<text class="decribe">业务内容简介</text>
</view>
<view class="lane-item lane-2" :style="{ '--background': bgBlue }" @click="showMask(2)">
<image :src="fileURL + 'image/index/icon-truck.png'"></image>
<view class="text">
<text class="head">货车通道</text>
<text class="decribe">业务内容简介</text>
</view>
</view>
<view class="lane-item lane-2" :style="{ '--background': bgBlue }" @click="showMask(2)">
<image :src="fileURL + 'image/index/icon-truck.png'"></image>
<view class="text">
<text class="head">货车通道</text>
<text class="decribe">业务内容简介</text>
</view>
</view>
</view>
</view>

<!-- 办理流程 -->
<view class="flow-path">
<scroll-view scroll-x="true" class="scroll-view">
<view class="top-menu">
<view :class="item == state.tabActive ? 'tab active' : 'tab'"
v-for="item in state.flowPathTabList" :key="item" @click="flowPathTabHandle(item)">
<view class="border"></view>{{ item }}
</view>
</view>
</scroll-view>

<view v-if="state.tabActive === '办理流程'">
<view class="flow-list">
<flow-path-list :options="state.flowList"></flow-path-list>
<!-- 办理流程 -->
<view class="flow-path">
<scroll-view scroll-x="true" class="scroll-view">
<view class="top-menu">
<view :class="item == state.tabActive ? 'tab active' : 'tab'" v-for="item in state.flowPathTabList"
:key="item" @click="flowPathTabHandle(item)">
<view class="border"></view>{{ item }}
</view>
</view>
<<<<<<< HEAD
<view v-else-if="state.tabActive === '办理条件'">
<view class="flow-list as-gravity-center"> 办理条件 </view>
</view>
<view v-else-if="state.tabActive === '常见问题'">
<view class="flow-list as-gravity-center"> 常见问题 </view>
</scroll-view>

<view v-if="state.tabActive === '办理流程'">
<view class="flow-list">
<flow-path-list :options="state.flowList"></flow-path-list>
</view>
</view>
</view>
<!-- 高速快讯 -->
<view class="news">
<view class="title">高速快讯</view>
<view class="news-box">
<view class="news-item" @click="$util.msg('该功能正在开发中,敬请期待!')">
<view class="left-text">
<view class="tit">贵州高速最新施工通告,请注意贵州高速最新通告,请注意...</view>
<view class="span">施工通告</view>
</view>
<view class="image-box">
<image :src="fileURL + 'image/index/news-1.png'"></image>
</view>
=======
</view>
<view v-else-if="state.tabActive === '办理条件'">
<view class="flow-list as-gravity-center"> 办理条件 </view>
</view>
@@ -165,78 +139,71 @@
<view class="news">
<view class="title">高速快讯</view>
<view class="news-box">
<view class="news-item" v-for="(item,index) in state.highMsgData" :key='index' @click="link(item)">
<view class="news-item" @click="$util.msg('该功能正在开发中,敬请期待!')">
<view class="left-text">
<view class="tit description">{{item.title}}</view>
<view class="span">{{getCodeName('COPYWRITING',item.copywriting)}}</view>
<view class="tit">贵州高速最新施工通告,请注意贵州高速最新通告,请注意...</view>
<view class="span">施工通告</view>
</view>
<view class="image-box">
<image :src="fileURL + item.speedUrl"></image>
<image :src="fileURL + 'image/index/news-1.png'"></image>
</view>
</view>
<!-- <view class="news-item" @click="$util.msg('该功能正在开发中,敬请期待!')">
<view class="news-item" @click="$util.msg('该功能正在开发中,敬请期待!')">
<view class="left-text">
<view class="tit">贵州新建服务区,请注意贵州高速最新通告,请留意...</view>
<view class="span">新建</view>
>>>>>>> b83ec7ce0e7bc59f80984fcc313d18abe89edafa
</view>
<view class="news-item" @click="$util.msg('该功能正在开发中,敬请期待!')">
<view class="left-text">
<view class="tit">贵州新建服务区,请注意贵州高速最新通告,请留意...</view>
<view class="span">新建</view>
</view>
<view class="image-box">
<image :src="fileURL + 'image/index/news-2.png'"></image>
</view>
<view class="image-box">
<image :src="fileURL + 'image/index/news-2.png'"></image>
</view>
<<<<<<< HEAD
<view class="more">查看更多</view>
</view>
=======
</view> -->
<view class="more" @click="$util.navTo('/subpackage/invoice/moreHighMsg/moreHighMsg',true)">查看更多</view>
>>>>>>> b83ec7ce0e7bc59f80984fcc313d18abe89edafa
<view class="more">查看更多</view>
</view>
<!-- 专区服务 -->
<view class="service">
<view class="title">专区服务</view>
<view class="service-box">
<view class="service-item border" @click="$util.msg('该功能正在开发中,敬请期待!')">
<image :src="fileURL + 'image/index/truck-point.png'"></image>
<view class="text">
<view class="tit">货车积分返利</view>
<view class="sub">海量商品任你选择</view>
</view>
</view>

<!-- 专区服务 -->
<view class="service">
<view class="title">专区服务</view>
<view class="service-box">
<view class="service-item border" @click="$util.msg('该功能正在开发中,敬请期待!')">
<image :src="fileURL + 'image/index/truck-point.png'"></image>
<view class="text">
<view class="tit">货车积分返利</view>
<view class="sub">海量商品任你选择</view>
</view>
<view class="service-item" @click="$util.msg('该功能正在开发中,敬请期待!')">
<image :src="fileURL + 'image/index/parking-bill.png'"></image>
<view class="text">
<view class="tit">停车场账单查询</view>
<view class="sub">消费明细一目了然{{ title }}</view>
</view>
</view>
<view class="service-item" @click="$util.msg('该功能正在开发中,敬请期待!')">
<image :src="fileURL + 'image/index/parking-bill.png'"></image>
<view class="text">
<view class="tit">停车场账单查询</view>
<view class="sub">消费明细一目了然{{ title }}</view>
</view>
</view>
</view>
<!-- ETC选择弹窗 -->
<view class="mask" v-if="isShowMask">
<view class="mask-content">
<view class="mask-close">
<image :src="fileURL + 'image/index/icon-close.png'" class="icon-closed" @click="closeMask"></image>
</view>



<!-- ETC选择弹窗 -->
<view class="mask" v-if="isShowMask">
<view class="mask-content">
<view class="mask-close">
<image :src="fileURL + 'image/index/icon-close.png'" class="icon-closed" @click="closeMask"></image>
</view>
<view class="mask-title" :style="{ '--color': color }">选择ETC用户类型</view>
<view class="mask-tab">
<view class="tab-item active" @click="toCreatOrder('1')">
<image :src="fileURL + 'image/index/icon-personal.png'"></image>
<text class="tab-tit on">个人办理</text>
</view>
<view class="mask-title" :style="{ '--color': color }">选择ETC用户类型</view>
<view class="mask-tab">
<view class="tab-item active" @click="toCreatOrder('1')">
<image :src="fileURL + 'image/index/icon-personal.png'"></image>
<text class="tab-tit on">个人办理</text>
</view>
<view class="tab-item" @click="toCreatOrder('2')">
<image :src="fileURL + 'image/index/icon-unit.png'"></image>
<text class="tab-tit on">单位办理</text>
</view>
<view class="tab-item" @click="toCreatOrder('2')">
<image :src="fileURL + 'image/index/icon-unit.png'"></image>
<text class="tab-tit on">单位办理</text>
</view>
</view>
</view>
</filter>
</view>

</template>

<script setup lang="ts">
@@ -249,7 +216,6 @@
onLoad
} from "@dcloudio/uni-app";
import flowPathList from "./components/flow-path-list.vue";
import filter from "@/components/filter/filter.vue";
import {
request
} from "@/utils/network/request.js";
@@ -269,7 +235,6 @@
querySwiper,
envs,
infoQuery,
queryHighMsg
} from "@/utils/network/api.js";
import {
reactive
@@ -281,9 +246,7 @@
navTo,
confirm
} from "@/utils/utils";
import {
getCodeName
} from "@/datas/queryKey.js";

const bgOrange = `url(${fileURL}image/index/bg-orange.png) center center no-repeat`;
const bgBlue = `url(${fileURL}image/index/bg-blue.png) center center no-repeat`;
const list = reactive(["您有一条待办事项,还未办理完成"])
@@ -347,7 +310,6 @@
desc: "支付完成订单",
},
],
highMsgData:'' //高速快讯内容
});
const isShowMask = ref(false);
const isShowBar = ref(false)
@@ -369,7 +331,6 @@
quanKeyAction().then((val: any) => {
setItem('key', val.dictTypeAndItem)
})
highMsg(); //高速快讯
})

onMounted(() => {
@@ -539,30 +500,6 @@
const strReplace = (str: string) => {
return str.replace('192.168.100.63:8087', envs[process.env.NODE_ENV].baseUrl)
}
// 高速快讯查询接口
const highMsg =()=>{
let options = {
type: 2, //type: 2,JSON格式提交数据(默认表单形式提交)
data: {
pageNo:1,
pageSize:2
}, //请求参数
method: "POST", //提交方式(默认POST)
showLoading: true, //是否显示加载中(默认显示)
};
//调用方式
request(queryHighMsg, options).then((res) => {
console.log("高速快讯查询接口",stringToJson(res.bizContent));
state.highMsgData=stringToJson(res.bizContent).data
})
.catch((err) => {
});
}
const link=(item)=>{
console.log("item",item)
navTo(`item.hyperLink`)
}
</script>

<style>
@@ -794,7 +731,6 @@
.news .image-box image {
width: 100rpx;
height: 100rpx;
border-radius: 10rpx;
}

.news .span {
@@ -986,11 +922,4 @@
padding: 55rpx 30rpx 30rpx;
}
}
.description{
overflow: hidden;
-webkit-line-clamp: 2;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
}
</style>

Loading…
取消
儲存