chenrui
/
zdxtLawEnforcementCodeView
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

横幅

v2
蟑螂恶霸 2 years ago
parent
50564f3b22
commit
064141f184
3 changed files with 730 additions and 692 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/views/enforce/earlyWarning.vue
  2. 854
      src/views/enforce/enforceNotice.vue
  3. 566
      src/views/enforceHome.vue

2
src/views/enforce/earlyWarning.vue
View File

@ -189,7 +189,7 @@
const onClickButton = () => { const onClickButton = () => {
data.curPage = 1; data.curPage = 1;
data.dataList = []; data.dataList = [];
queryList(); onRefresh();
} }
const toComplaintView = (id, name) => { const toComplaintView = (id, name) => {

854
src/views/enforce/enforceNotice.vue
View File

@ -1,441 +1,469 @@
<template> <template>
<div class="shop app_content"> <div class="shop app_content">
<!-- 导航栏 --> <!-- 导航栏 -->
<!-- <div class="header_body"> <!-- <div class="header_body">
<header-nav <header-nav
:leftArrow="false" :leftArrow="false"
:titelText="`通知公告`" :titelText="`通知公告`"
> >
</header-nav> </header-nav>
<header-nav :slefBack="true" @goBack="goBack" :titelText="`通知公告`"></header-nav> <header-nav :slefBack="true" @goBack="goBack" :titelText="`通知公告`"></header-nav>
</div>--> </div>-->
<van-search <van-search
v-model="searchParam.searchText" v-model="searchParam.searchText"
show-action show-action
placeholder="请输入关键字查询" placeholder="请输入关键字查询"
@search="onSearch" @search="onSearch"
> >
<template #action> <template #action>
<div @click="onClickButton">搜索</div> <div @click="onClickButton">搜索</div>
</template> </template>
</van-search> </van-search>
<!-- 中间 --> <!-- 中间 -->
<div class="shop-center"> <div class="shop-center">
<lodding-card :isLodding="isLodding">
<van-pull-refresh v-model="data.refreshing" @refresh="onRefresh">
<div class="noticebox"> <van-list v-model:loading="data.loading" :finished="data.finished" finished-text="没有更多了" @load="onLoad">
<div class="notice-item" v-for="(item, index) in data.dataList" :key="index"><i></i> <div class="notice-item" v-for="(item, index) in data.dataList" :key="index"><i></i>
<div class="item-cont"> <div class="item-cont">
<span class="item-title">{{ item.planName }}</span> <span class="item-title">{{ item.planName }}</span>
<!-- <span class="item-time"> {{ item.enforcementDepartment }} - {{ item.createTime }}</span>--> <!-- <span class="item-time"> {{ item.enforcementDepartment }} - {{ item.createTime }}</span>-->
<span class="item-time"> <span class="item-time">
<div style="display: flex; justify-content: space-between;"> <div style="display: flex; justify-content: space-between;">
<div>{{ item.enforcementDepartment }}</div> <div>{{ item.enforcementDepartment }}</div>
<div>{{ item.createTime }}</div> <div>{{ item.createTime }}</div>
</div> </div>
</span> </span>
<div class="item-text" @click="toPdfView(null==item.fileObject?'':item.fileObject.fileUrl)"><a>{{ null==item.fileObject?'':item.fileObject.fileName }}</a></div> <div class="item-text" @click="toPdfView(null==item.fileObject?'':item.fileObject.fileUrl)">
</div> <a>{{ null==item.fileObject?'':item.fileObject.fileName }}</a></div>
</div> </div>
</div>
</van-list>
</van-pull-refresh>
</div>
<!-- 底部 -->
<!-- <div class="shop_footer_body">
<footer-enforcement-nav></footer-enforcement-nav>
</div> -->
</div>
</template>
<!-- <div class="notice-item"><i></i> <script setup name="enforcementInspectionProgram">
<div class="item-cont"> import {queryEnforcementInspectionProgramListNoPermission} from "@/api/enforce";
<span class="item-title">龙华区司法局</span>
<span class="item-time">2024-02-15</span> const {useCommon} = $globalStore;
<div class="item-text">2024年度龙华区民治街道年度行政执法检查计划</div>
</div> const router = useRouter();
</div> --> let allchecked = ref(false); // 是否全选
let refreshLoad = ref(false); // 是否加载中
let searchParam = reactive({
// 分页
pageNum: 1,
pageSize: 6,
//搜索框
searchText: ref(''),
//日期查询
searchDate: ref(''),
//是否发布 1 是
isPublish: 1
});
const data = reactive({
cartList: [],
dataList: [],
dateSearch: ref(),
showDatePicker: false,
currentDate: ref(['2024', '01']),
minDate: new Date(2020, 0, 1),
maxDate: new Date(2125, 5, 1),
columnsType: ['year', 'month'],
loading: false,
finished: false,
refreshing: false,
curPage: 1,
total: 0,
});
// 设置初始值为当前时间
onMounted(() => {
console.log(useCommon.enterpriseNumber);
// getCard();
searchParam.enterpriseNumber = useCommon.enterpriseNumber;
console.log(useCommon.enterpriseNumber)
// queryList();
data.dateSearch = nowDate(new Date());
});
const queryList = () => {
searchParam.pageNum = (data.curPage-1)*searchParam.pageSize;
queryEnforcementInspectionProgramListNoPermission(searchParam, success => {
data.curPage++;
data.loading = false; // 查4出结果停止加载
if (success.total <= data.dataList.length) {
// 查到最后没数据
data.finished = ref(true);
return;
}
// data.dataList = success.data;
data.dataList.push(...success.rows);
freshMap.refreshLoad = false;
freshMap.listLoading = false;
freshMap.listFinished = true;
isLodding.value = false;
}, error => {
})
}
</div> const onSearch = (val) => {
queryEnforcementInspectionProgramListNoPermission(
{
"searchText": searchParam.searchText
}
, success => {
console.log(success)
data.dataList = success.data;
}, error => {
})
};
const onClickButton = () => {
data.curPage = 1;
data.dataList = [];
onRefresh();
}
onActivated(() => {
});
onDeactivated(() => {
});
// 返回
const goBack = () => {
router.go(-1);
};
let resetScroll = ref(0); // 滚动记录
let isLodding = ref(true); // 是否加载中
let freshMap = reactive({
refreshLoad: false, // 是否刷新
listLoading: false, // 是否加载中
listFinished: false, // 是否加载完成标识
});
//下拉刷新
const onRefresh = () => {
// 清空列表数据
data.dataList = [];
data.finished = false;
// 重新加载数据
// 将 loading 设置为 true，表示处于加载状态
data.loading = true;
onLoad();
};
// 触底加载
const onLoad = () => {
setTimeout(() => {
if (data.refreshing) {
data.refreshing = false;
}
queryList();
}, 1000);
};
//获取分类下的商品列表
const getGoodslist = async (onLoad) => {
// const res = await useClassify.classifyGoods();
// if (res?.code === 20000) {
// goodsList = onLoad ? goodsList.concat(res?.data) : res?.data;
// freshMap.refreshLoad = false;
// freshMap.listLoading = false;
// freshMap.listFinished = res?.listFinished;
// if (goodsList.length > 50) {
// freshMap.listFinished = true;
// }
// }
freshMap.refreshLoad = false;
freshMap.listLoading = false;
freshMap.listFinished = true;
isLodding.value = false;
};
onMounted(async () => {
// let res = await getClassify();
// if (res && res?.length) {
// classifyId = res?.[0]?.id;
// classifyId && getGoodslist();
// } else {
// isLodding.value = false;
// }
// queryList();
});
const selectDate = () => {
data.showDatePicker = true;
console.log(data.showDatePicker)
}
const onDateConfirm = (value) => {
console.log(value);
value.selectedValues.forEach((item, index) => {
console.log(item);
});
data.dateSearch = value.selectedValues[0] + "/" + value.selectedValues[1]
data.showDatePicker = false;
searchParam.dateSearch = value.selectedValues[0] + "-" + value.selectedValues[1];
data.curPage = 1;
data.dataList = [];
onRefresh();
}
const nowDate = (time) => {
var year = time.getFullYear(); // 年
var month = (time.getMonth() + 1).toString().padStart(2, '0'); // 月
var date = time.getDate().toString().padStart(2, '0'); // 日
var hour = time.getHours().toString().padStart(2, '0'); // 时
var minute = time.getMinutes().toString().padStart(2, '0'); // 分
var second = time.getSeconds().toString().padStart(2, '0'); // 秒
return (
year + "/" + month
)
}
</lodding-card>
</div>
<!-- 底部 --> const searchDateType = (val) => {
<!-- <div class="shop_footer_body"> searchParam.dateType = val;
<footer-enforcement-nav></footer-enforcement-nav> searchParam.isComplaint = null;
</div> -->
</div>
</template>
<script setup name="enforcementInspectionProgram"> data.curPage = 1;
import {queryEnforcementInspectionProgramListNoPermission} from "@/api/enforce"; data.dataList = [];
const { useCommon} = $globalStore; onRefresh();
}
const router = useRouter(); const searchComplaint = (val) => {
let allchecked = ref(false); // 是否全选 searchParam.isComplaint = val;
let refreshLoad = ref(false); // 是否加载中 searchParam.dateType = null;
let searchParam = reactive({ data.curPage = 1;
//搜索框 data.dataList = [];
searchText: ref(''), onRefresh();
//日期查询 }
searchDate: ref(''),
//是否发布 1 是 const toPdfView = (url) => {
isPublish: 1 console.log(url)
}); router.push(
{
const data = reactive({ path: "/pdfView",
cartList: [], query: {
dataList: [], url: url
dateSearch: ref(), }
showDatePicker:false, });
currentDate:ref(['2024', '01']),
minDate: new Date(2020, 0, 1),
maxDate: new Date(2125, 5, 1),
columnsType :['year', 'month'],
});
// 设置初始值为当前时间
onMounted(() => {
console.log(useCommon.enterpriseNumber);
// getCard();
searchParam.enterpriseNumber = useCommon.enterpriseNumber;
console.log(useCommon.enterpriseNumber)
queryList();
data.dateSearch = nowDate(new Date());
});
const queryList = () =>{
queryEnforcementInspectionProgramListNoPermission(searchParam,success =>{
console.log(success)
data.dataList = success.data;
freshMap.refreshLoad = false;
freshMap.listLoading = false;
freshMap.listFinished = true;
isLodding.value = false;
},error =>{
})
}
const onSearch = (val) => {
queryEnforcementInspectionProgramListNoPermission(
{
"searchText": searchParam.searchText
} }
,success =>{
console.log(success)
data.dataList = success.data;
},error =>{
})
};
const onClickButton = () =>{
console.log(searchParam.searchText)
queryList();
}
onActivated(() => {
});
onDeactivated(() => {
});
// 返回
const goBack = () => {
router.go(-1);
};
let resetScroll = ref(0); // 滚动记录
let isLodding = ref(true); // 是否加载中
let freshMap = reactive({
refreshLoad: false, // 是否刷新
listLoading: false, // 是否加载中
listFinished: false, // 是否加载完成标识
});
//下拉刷新
const onRefresh = () => {
freshMap.listFinished = false;
freshMap.listLoading = true;
// getGoodslist();
queryList();
};
// 触底加载
const onLoad = () => {
freshMap.listFinished = true;
freshMap.loading = false;
};
//获取分类下的商品列表
const getGoodslist = async (onLoad) => {
// const res = await useClassify.classifyGoods();
// if (res?.code === 20000) {
// goodsList = onLoad ? goodsList.concat(res?.data) : res?.data;
// freshMap.refreshLoad = false;
// freshMap.listLoading = false;
// freshMap.listFinished = res?.listFinished;
// if (goodsList.length > 50) {
// freshMap.listFinished = true;
// }
// }
freshMap.refreshLoad = false;
freshMap.listLoading = false;
freshMap.listFinished = true;
isLodding.value = false;
};
onMounted(async () => {
// let res = await getClassify();
// if (res && res?.length) {
// classifyId = res?.[0]?.id;
// classifyId && getGoodslist();
// } else {
// isLodding.value = false;
// }
queryList();
isLodding.value = false;
});
const selectDate = () =>{
data.showDatePicker = true;
console.log(data.showDatePicker)
}
const onDateConfirm = (value)=> {
console.log(value);
value.selectedValues.forEach((item,index) => {
console.log(item);
});
data.dateSearch = value.selectedValues[0] + "/" + value.selectedValues[1]
data.showDatePicker = false;
searchParam.dateSearch = value.selectedValues[0] + "-" + value.selectedValues[1];
queryList();
}
const nowDate = (time) => {
var year = time.getFullYear(); // 年
var month = (time.getMonth() + 1).toString().padStart(2, '0'); // 月
var date = time.getDate().toString().padStart(2, '0'); // 日
var hour = time.getHours().toString().padStart(2, '0'); // 时
var minute = time.getMinutes().toString().padStart(2, '0'); // 分
var second = time.getSeconds().toString().padStart(2, '0'); // 秒
return (
year + "/" + month
)
}
const searchDateType = (val) =>{
searchParam.dateType = val;
searchParam.isComplaint = null;
queryList();
}
const searchComplaint = (val) =>{
searchParam.isComplaint = val;
searchParam.dateType = null;
queryList();
}
const toPdfView = (url) =>{
console.log(url)
router.push(
{
path: "/pdfView",
query: {
url: url
}
});
}
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.shop { .shop {
height: 100%; height: 100%;
display: flex; display: flex;
flex-direction: column;
overflow: hidden;
background-color: #ebf3fb;
.header_body {
height: 1.33rem;
}
.shop-center {
display: flex;
position: relative;
margin: 2% 0;
height: 100%;
background: #fff;
overflow-y: scroll;
.goods_box {
display: flex;
background-color: #fff;
margin: 0.27rem;
border-radius: 0.27rem;
.swipe_cell {
width: 100%;
}
.card_box {
display: flex;
width: 100%;
padding: 0.27rem 0;
flex-direction: column; flex-direction: column;
.card_body { overflow: hidden;
background-color: #fff; background-color: #ebf3fb;
border-radius: 0.27rem;
flex: 1; .header_body {
} height: 1.33rem;
.card_box_span {
display: flex;
align-items: center;
margin: 2% 0;
padding-left: 3%;
font-size: 0.35rem;
line-height: 1.5;
p {
margin: 0;
}
} }
.card_box_action{
position: absolute; .shop-center {
right: 4%; display: flex;
position: relative;
margin: 2% 0;
height: 100%;
background: #fff;
overflow-y: scroll;
.goods_box {
display: flex;
background-color: #fff;
margin: 0.27rem;
border-radius: 0.27rem;
.swipe_cell {
width: 100%;
}
.card_box {
display: flex;
width: 100%;
padding: 0.27rem 0;
flex-direction: column;
.card_body {
background-color: #fff;
border-radius: 0.27rem;
flex: 1;
}
.card_box_span {
display: flex;
align-items: center;
margin: 2% 0;
padding-left: 3%;
font-size: 0.35rem;
line-height: 1.5;
p {
margin: 0;
}
}
.card_box_action {
position: absolute;
right: 4%;
}
}
}
} }
}
} .shop_footer_body {
} //height: 101px;
position: relative;
.shop_footer_body {
//height: 101px; .footer-one-btn {
position: relative; height: 1.33rem;
.footer-one-btn { bottom: 1.34rem;
height: 1.33rem; }
bottom: 1.34rem; }
} }
}
} .search-button-list {
height: 0.7rem;
.search-button-list{ display: flex;
height: 0.7rem; flex-direction: row;
display: flex; padding-left: 0.27rem;
flex-direction: row; margin-top: 0.27rem;
padding-left: 0.27rem; align-items: end;
margin-top: 0.27rem;
align-items: end; .search-button {
.search-button{ width: 15%;
width: 15%; height: 100%;
background: #e3e0e0;
border-color: #e3e0e0;
color: #4c4c4c;
font-size: 0.3rem;
}
}
.search-button-date {
display: flex;
flex-direction: row;
align-items: end;
position: relative;
.date-select {
font-size: 0.52rem;
margin: 3% 0 0 4%;
i {
transform: rotate(90deg);
font-size: 0.4rem;
}
}
.search-button {
width: 15%;
height: 80%;
position: absolute;
top: 1%;
right: 1%;
}
}
.noticebox {
position: absolute;
top: 0;
width: 100%;
height: 100%; height: 100%;
background: #e3e0e0; background-color: #fff;
border-color: #e3e0e0; border-radius: 0.2rem;
color: #4c4c4c;
font-size: 0.3rem;
} }
}
.search-button-date { .notice-item {
display: flex; display: flex;
flex-direction: row; position: relative;
align-items: end; margin: 3% 0.26rem;
position: relative; height: 10vh;
align-items: center;
.date-select { border-bottom: 1px solid #f3f4f5;
font-size: 0.52rem;
margin: 3% 0 0 4%;
i {
transform: rotate(90deg);
font-size: 0.4rem;
}
} }
.search-button{
width: 15%; .notice-item > i {
display: inline-block;
margin: 5% 0.25rem;
height: 80%; height: 80%;
position: absolute; width: 1.5rem;
top: 1%; background: url("../../assets/images/icon_notice2.png") no-repeat left top 50%;
right: 1%; background-size: auto 80%;
}
.item-cont {
display: inline-block;
width: calc(100% - 2.0rem);
}
.item-time {
float: left;
margin: 2% 0;
width: 100%;
color: #c1bfbf;
font-size: 0.3rem;
//height: 0.75rem;
//line-height: 1rem;
}
.item-title, .item-text {
float: left;
margin: 0;
width: 100%;
font-size: 0.40rem;
font-weight: 600;
line-height: 1.5;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.item-text {
width: 100%;
color: #999;
font-size: 0.35rem;
font-weight: normal;
}
.item-text a {
color: #2b75fd;
}
/deep/ .van-search__content {
height: 0.9rem;
border: 1px solid #ececec;
border-radius: 0.15rem 0 0 0.15rem;
}
/deep/ .van-search__action {
margin: 0 3% 0 0;
width: 10%;
height: 0.9rem;
background: #1367fe;
border: 1px solid #1367fe;
border-radius: 0 0.15rem 0.15rem 0;
color: #fff;
text-align: center;
line-height: 0.9rem;
} }
}
.noticebox {
position: absolute;
top: 0;
width: 100%;
height: 100%;
background-color: #fff;
border-radius: 0.2rem;
}
.notice-item {
display: flex;
position: relative;
margin: 3% 0.26rem;
height: 10vh;
align-items: center;
border-bottom: 1px solid #f3f4f5;
}
.notice-item > i {
display: inline-block;
margin: 5% 0.25rem;
height: 80%;
width: 1.5rem;
background: url("../../assets/images/icon_notice2.png") no-repeat left top 50%;
background-size: auto 80%;
}
.item-cont {
display: inline-block;
width: calc(100% - 2.0rem);
}
.item-time {
float: left;
margin: 2% 0;
width: 100%;
color: #c1bfbf;
font-size: 0.3rem;
//height: 0.75rem;
//line-height: 1rem;
}
.item-title, .item-text {
float: left;
margin: 0;
width: 100%;
font-size: 0.40rem;
font-weight: 600;
line-height: 1.5;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.item-text {
width: 100%;
color: #999;
font-size: 0.35rem;
font-weight: normal;
}
.item-text a {
color: #2b75fd;
}
/deep/ .van-search__content {
height: 0.9rem;
border: 1px solid #ececec;
border-radius: 0.15rem 0 0 0.15rem;
}
/deep/ .van-search__action {
margin: 0 3% 0 0;
width: 10%;
height: 0.9rem;
background: #1367fe;
border: 1px solid #1367fe;
border-radius: 0 0.15rem 0.15rem 0;
color: #fff;
text-align: center;
line-height: 0.9rem;
}
</style> </style>

566
src/views/enforceHome.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<!-- <Loading class="loading-div" type="spinner" v-show="isLoading" color="#1989fa" />--> <!-- <Loading class="loading-div" type="spinner" v-show="isLoading" color="#1989fa" />-->
<!-- <div class="home app_content" v-if="!isLoading">--> <!-- <div class="home app_content" v-if="!isLoading">-->
<div class="home app_content"> <div class="home app_content">
<!-- 导航栏 --> <!-- 导航栏 -->
<!-- <div class="header_body"> <!-- <div class="header_body">
@ -8,8 +8,8 @@
</div> --> </div> -->
<!-- 中间 --> <!-- 中间 -->
<div class="warp_body" > <div class="warp_body">
<div class="logobox"></div> <div class="logobox"></div>
<!-- <div class="streamer" @click=""> <!-- <div class="streamer" @click="">
<i></i> <i></i>
@ -27,14 +27,14 @@
class="streamer" class="streamer"
/> --> /> -->
<div class="noticeContent"> <div class="noticeContent">
<ul class="notice_list" :class="data.noticeList.length>1?{notice_top:freshMap.animate}:''"> <ul class="notice_list" :class="data.noticeList.length>1?{notice_top:freshMap.animate}:''">
<li v-for="(item, index) in data.noticeList" :key="index"> <li v-for="(item, index) in data.noticeList" :key="index">
{{item.content}} {{item.content}}
</li> </li>
</ul> </ul>
</div> </div>
<!-- <div class="container streamer" id="notification-container":key="freshMap.key"> <!-- <div class="container streamer" id="notification-container":key="freshMap.key">
<div class="notification" id="notification"> <div class="notification" id="notification">
{{ notificationtext }} {{ notificationtext }}
@ -81,9 +81,10 @@
<script setup name="Home"> <script setup name="Home">
import Vconsolefrom from 'vconsole'; import Vconsolefrom from 'vconsole';
import { Loading } from 'vant'; import {Loading} from 'vant';
import {getEnterpriseMerchantAuthorization, getSzyptLoginAuth} from '../api/Home'; import {getEnterpriseMerchantAuthorization, getSzyptLoginAuth} from '../api/Home';
import {queryEnforcementInspectionProgramListNoPermission} from "@/api/enforce"; import {queryEnforcementInspectionProgramListNoPermission} from "@/api/enforce";
const isLoading = ref(true); const isLoading = ref(true);
const {useCommon} = $globalStore; const {useCommon} = $globalStore;
const router = useRouter(); const router = useRouter();
@ -99,32 +100,32 @@
animate: false animate: false
}); });
const noticeList = []; const noticeList = [];
// 模拟异步数据加载 // 模拟异步数据加载
// setTimeout(() => { // setTimeout(() => {
// // 如果不是执法用户 则跳转 // // 如果不是执法用户 则跳转
// router.push( // router.push(
// { // {
// path: "/noAccess" // path: "/noAccess"
// }); // });
// isLoading.value = false; // isLoading.value = false;
// }, 3000); // }, 3000);
//定时器 //定时器
let noticeObj = reactive({ let noticeObj = reactive({
noticeList: [], noticeList: [],
notificationtext: "", notificationtext: "",
noticeTimer: null, noticeTimer: null,
itemWidth: 0, itemWidth: 0,
offset: 0, offset: 0,
step: 3, step: 3,
speed: 20, speed: 20,
}); });
const data = reactive({ const data = reactive({
noticeList: [] noticeList: []
}); });
const adviceList = reactive([]); const adviceList = reactive([]);
const boutiqueAttr = reactive({ const boutiqueAttr = reactive({
@ -175,52 +176,51 @@
path: "/enforce/enforceNotice", path: "/enforce/enforceNotice",
}); });
} }
const queryList = () =>{ const queryList = () => {
queryEnforcementInspectionProgramListNoPermission({},success =>{ queryEnforcementInspectionProgramListNoPermission({}, success => {
console.log(success) if (success.rows.length > 4) {
if(success.data.length > 4 ){ for (let i = 0; i < 5; i++) {
for (let i = 0; i < 5; i++) { carouselList.push(success.rows[i]);
carouselList.push(success.data[i]); noticeObj.noticeList.push(success.rows[i].planName)
noticeObj.noticeList.push(success.data[i].planName) var obj = {
var obj = { content: success.rows[i].planName
content: success.data[i].planName }
} data.noticeList.push(obj)
data.noticeList.push(obj) // noticeStr += success.data[i].planName + " ";
// noticeStr += success.data[i].planName + " "; // noticeStr += success.data[i].planName != null ?success.data[i].planName + "":"";
// noticeStr += success.data[i].planName != null ?success.data[i].planName + "":""; }
} noticeStr += success.rows[0].planName != null ? success.rows[0].planName + "" : "";
noticeStr += success.data[0].planName != null ?success.data[0].planName + "":""; } else {
}else{ carouselList = success.rows;
carouselList = success.data;
for (let i = 0; i < success.rows.length; i++) {
for (let i = 0; i <= success.data.length; i++) { // carouselList.push(success.data[i]);
// carouselList.push(success.data[i]); noticeObj.noticeList.push(success.rows[i].planName);
noticeObj.noticeList.push(success.data[i].planName); var obj = {
} content: success.rows[i].planName
noticeStr += success.data[0].planName != null ?success.data[0].planName + "":""; }
var obj = { data.noticeList.push(obj)
content: success.data[i].planName }
} // noticeStr += success.rows[0].planName != null ? success.rows[0].planName + "" : "";
data.noticeList.push(obj) }
freshMap.key = 1
console.log(carouselList);
console.log(data.noticeList);
// timerObj.timer = setInterval(flushMessage, 4000);
setNotificationMove();
}, error => {
})
}
const flushMessage = () => {
timerObj.value++;
freshMap.key = timerObj.value;
if (carouselList.length == timerObj.value) {
timerObj.value = 0;
} }
freshMap.key = 1 freshMap.key = timerObj.value;
console.log(carouselList); noticeStr = carouselList[timerObj.value].planName
console.log(data.noticeList);
// timerObj.timer = setInterval(flushMessage, 4000);
setNotificationMove();
},error =>{
})
} }
const flushMessage =() =>{
timerObj.value++;
freshMap.key = timerObj.value;
if(carouselList.length == timerObj.value){
timerObj.value = 0;
}
freshMap.key = timerObj.value;
noticeStr = carouselList[timerObj.value].planName
}
//下拉刷新 //下拉刷新
const onRefresh = () => { const onRefresh = () => {
@ -248,22 +248,22 @@
console.log(success.data) console.log(success.data)
useCommon.SET_USER_ID(success.data.userId); useCommon.SET_USER_ID(success.data.userId);
useCommon.SET_TOKEN(success.data.token); useCommon.SET_TOKEN(success.data.token);
if(useCommon.firstLoad){ if (useCommon.firstLoad) {
isLoading.value = false; isLoading.value = false;
} }
//设置已经初始化 //设置已经初始化
useCommon.SET_IS_FIRST_LOAD(false) useCommon.SET_IS_FIRST_LOAD(false)
queryList(); queryList();
// 如果不是执法用户 则跳转 // 如果不是执法用户 则跳转
if (!success.data.lawOfficer) { if (!success.data.lawOfficer) {
router.push( router.push(
{ {
path: "/noAccess" path: "/noAccess"
}); });
isLoading.value = false; isLoading.value = false;
} }
}, error => { }, error => {
queryList(); queryList();
}) })
// getEnterpriseMerchantAuthorization({merchantTel: useCommon.phonenumber}, success => { // getEnterpriseMerchantAuthorization({merchantTel: useCommon.phonenumber}, success => {
// if (!(success.data == null && success.data.length == 0)) { // if (!(success.data == null && success.data.length == 0)) {
@ -274,60 +274,60 @@
// queryList(); // queryList();
setInterval(showNotice, 3000) setInterval(showNotice, 3000)
}); });
const setNotificationMove =()=>{ const setNotificationMove = () => {
// 清除定时器 // 清除定时器
clearInterval(noticeObj.noticeTimer); clearInterval(noticeObj.noticeTimer);
const notificationContainer = document.getElementById( const notificationContainer = document.getElementById(
"notification-container" "notification-container"
); );
const notificationWidth = notificationContainer.offsetWidth; const notificationWidth = notificationContainer.offsetWidth;
let index = 0; let index = 0;
// 播报内容赋值 // 播报内容赋值
noticeObj.notificationtext = noticeObj.noticeList[index]; noticeObj.notificationtext = noticeObj.noticeList[index];
const notification = document.getElementById("notification"); const notification = document.getElementById("notification");
noticeObj.offset = notificationWidth; noticeObj.offset = notificationWidth;
// 初始化x轴平移距离 // 初始化x轴平移距离
notification.style.transform = `translateX(${noticeObj.offset}px)`;
// 当前通知的宽度
noticeObj.itemWidth = noticeObj.notificationtext.length * 20;
noticeObj.noticeTimer = setInterval(() => {
noticeObj.offset -= noticeObj.step;
if (noticeObj.offset < -noticeObj.itemWidth) {
noticeObj.offset = notificationWidth;
if (index >= noticeObj.noticeList.length - 1) {
index = 0;
} else {
index++;
}
noticeObj.notificationtext = noticeObj.noticeList[index];
noticeObj.itemWidth = noticeObj.notificationtext.length * 20;
}
notification.style.transform = `translateX(${noticeObj.offset}px)`; notification.style.transform = `translateX(${noticeObj.offset}px)`;
}, noticeObj.speed); // 当前通知的宽度
noticeObj.itemWidth = noticeObj.notificationtext.length * 20;
noticeObj.noticeTimer = setInterval(() => {
noticeObj.offset -= noticeObj.step;
if (noticeObj.offset < -noticeObj.itemWidth) {
noticeObj.offset = notificationWidth;
if (index >= noticeObj.noticeList.length - 1) {
index = 0;
} else {
index++;
}
noticeObj.notificationtext = noticeObj.noticeList[index];
noticeObj.itemWidth = noticeObj.notificationtext.length * 20;
}
notification.style.transform = `translateX(${noticeObj.offset}px)`;
}, noticeObj.speed);
} }
const delayNoticeMove = () =>{ const delayNoticeMove = () => {
const notification = document.getElementById("notification"); const notification = document.getElementById("notification");
let currentOffset = notification.style.transform; let currentOffset = notification.style.transform;
if (currentOffset) { if (currentOffset) {
currentOffset = currentOffset.split("(")[1]; currentOffset = currentOffset.split("(")[1];
currentOffset = currentOffset.substring(0, currentOffset.indexOf("px")); currentOffset = currentOffset.substring(0, currentOffset.indexOf("px"));
let duration = ((Number(currentOffset) + noticeObj.itemWidth) / noticeObj.step) * noticeObj.speed; let duration = ((Number(currentOffset) + noticeObj.itemWidth) / noticeObj.step) * noticeObj.speed;
// 判断当前还有多久滚动完毕 添加一个setTimeout等待滚动结束后重新计时 // 判断当前还有多久滚动完毕 添加一个setTimeout等待滚动结束后重新计时
setTimeout(() => { setTimeout(() => {
this.setNotificationMove(); this.setNotificationMove();
}, duration); }, duration);
} else { } else {
this.setNotificationMove(); this.setNotificationMove();
} }
} }
const showNotice = () => { const showNotice = () => {
freshMap.animate = true freshMap.animate = true
setTimeout(() => { setTimeout(() => {
data.noticeList.push(data.noticeList[0]) data.noticeList.push(data.noticeList[0])
data.noticeList.shift() data.noticeList.shift()
freshMap.animate = false freshMap.animate = false
}, 500) }, 500)
} }
</script> </script>
@ -340,14 +340,14 @@
background-color: #f4f4f4; background-color: #f4f4f4;
.warp_body { .warp_body {
position: relative; position: relative;
margin: 0; margin: 0;
width: 100%; width: 100%;
height: 100%; height: 100%;
background: #c6e6ff url("../assets/images/bg_el.jpg") no-repeat top; background: #c6e6ff url("../assets/images/bg_el.jpg") no-repeat top;
background-size: auto 100%; background-size: auto 100%;
overflow-x: hidden; overflow-x: hidden;
overflow-y: auto; overflow-y: auto;
.carousel_box { .carousel_box {
height: 4rem; height: 4rem;
@ -378,39 +378,40 @@
border-radius: 0.27rem; border-radius: 0.27rem;
.box-qr-code-text { .box-qr-code-text {
position: absolute; position: absolute;
z-index: 10; z-index: 10;
top: 10%; top: 10%;
right: 0.35rem; right: 0.35rem;
display: block; display: block;
font-size: 0.5rem; font-size: 0.5rem;
} }
} }
.box-qr-code::before { .box-qr-code::before {
content: ""; content: "";
position: absolute; position: absolute;
top: -0.14rem; top: -0.14rem;
left: -0.14rem; left: -0.14rem;
z-index: 0; z-index: 0;
width: calc(100% + 0.13rem); width: calc(100% + 0.13rem);
height: calc(100% + 0.13rem); height: calc(100% + 0.13rem);
background-color: #fff; background-color: #fff;
border: 0.14rem solid rgba(255,255,255,0.5); border: 0.14rem solid rgba(255, 255, 255, 0.5);
border-radius: 0.27rem; border-radius: 0.27rem;
} }
.box-qr-code::after { .box-qr-code::after {
content: ""; content: "";
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 1; z-index: 1;
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 0.27rem; border-radius: 0.27rem;
background: #fff url("../assets/images/item_scan.jpg") no-repeat left; background: #fff url("../assets/images/item_scan.jpg") no-repeat left;
background-size: auto 100%; background-size: auto 100%;
border: 0.01rem solid #8db4ff; border: 0.01rem solid #8db4ff;
} }
.box-info { .box-info {
@ -422,39 +423,40 @@
border-radius: 0.27rem; border-radius: 0.27rem;
.box-info-text { .box-info-text {
position: absolute; position: absolute;
z-index: 10; z-index: 10;
top: 10%; top: 10%;
right: 0.35rem; right: 0.35rem;
display: block; display: block;
font-size: 0.5rem; font-size: 0.5rem;
} }
} }
.box-info::before { .box-info::before {
content: ""; content: "";
position: absolute; position: absolute;
top: -0.14rem; top: -0.14rem;
left: -0.14rem; left: -0.14rem;
z-index: 0; z-index: 0;
width: calc(100% + 0.13rem); width: calc(100% + 0.13rem);
height: calc(100% + 0.13rem); height: calc(100% + 0.13rem);
background-color: #fff; background-color: #fff;
border: 0.14rem solid rgba(255,255,255,0.5); border: 0.14rem solid rgba(255, 255, 255, 0.5);
border-radius: 0.27rem; border-radius: 0.27rem;
} }
.box-info::after { .box-info::after {
content: ""; content: "";
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 1; z-index: 1;
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 0.27rem; border-radius: 0.27rem;
background: #fff url("../assets/images/item_check.jpg") no-repeat left; background: #fff url("../assets/images/item_check.jpg") no-repeat left;
background-size: auto 100%; background-size: auto 100%;
border: 1px solid #8db4ff; border: 1px solid #8db4ff;
} }
.box-complaint { .box-complaint {
@ -466,40 +468,41 @@
border-radius: 0.27rem; border-radius: 0.27rem;
.box-complaint-text { .box-complaint-text {
position: absolute; position: absolute;
z-index: 10; z-index: 10;
top: 10%; top: 10%;
right: 0.35rem; right: 0.35rem;
display: block; display: block;
font-size: 0.5rem; font-size: 0.5rem;
} }
} }
} }
.box-complaint::before { .box-complaint::before {
content: ""; content: "";
position: absolute; position: absolute;
top: -0.14rem; top: -0.14rem;
left: -0.14rem; left: -0.14rem;
z-index: 0; z-index: 0;
width: calc(100% + 0.13rem); width: calc(100% + 0.13rem);
height: calc(100% + 0.13rem); height: calc(100% + 0.13rem);
background-color: #fff; background-color: #fff;
border: 0.14rem solid rgba(255,255,255,0.5); border: 0.14rem solid rgba(255, 255, 255, 0.5);
border-radius: 0.27rem; border-radius: 0.27rem;
} }
.box-complaint::after { .box-complaint::after {
content: ""; content: "";
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 1; z-index: 1;
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 0.27rem; border-radius: 0.27rem;
background: #fff url("../assets/images/item_count.jpg") no-repeat left; background: #fff url("../assets/images/item_count.jpg") no-repeat left;
background-size: auto 100%; background-size: auto 100%;
border: 0.01rem solid #8db4ff; border: 0.01rem solid #8db4ff;
} }
.recommend_box { .recommend_box {
@ -622,84 +625,91 @@
background: url("../assets/images/logo.png") no-repeat; background: url("../assets/images/logo.png") no-repeat;
background-size: 100% auto; background-size: 100% auto;
} }
.loading-div{
position: absolute; .loading-div {
top: 45%; position: absolute;
left: 48%; top: 45%;
left: 48%;
} }
.notice-bar-container { .notice-bar-container {
margin-bottom: 0.27rem; margin-bottom: 0.27rem;
} }
.notice-bar-container:last-child { .notice-bar-container:last-child {
margin-bottom: 0; margin-bottom: 0;
} }
@media screen and (max-width: 380px) { @media screen and (max-width: 380px) {
.home .warp_body { .home .warp_body {
background: #c6e6ff url("../assets/images/bg_el.jpg") no-repeat top; background: #c6e6ff url("../assets/images/bg_el.jpg") no-repeat top;
background-size: 100% auto; background-size: 100% auto;
} }
} }
@media screen and (min-width: 540px) { @media screen and (min-width: 540px) {
.home .warp_body { .home .warp_body {
background: #c6e6ff url("../assets/images/bg_el.jpg") no-repeat top; background: #c6e6ff url("../assets/images/bg_el.jpg") no-repeat top;
background-size: 100% auto; background-size: 100% auto;
} }
}
.noticeContent {
position: absolute;
top: calc(2% + 10vh);
right: 3%;
z-index: 999;
padding: 0 0.25rem 0 1rem;
width: 94%;
min-height: 1rem;
background-color: rgba(249, 238, 219, 0.9);
border-radius: 0.5rem;
color: #df6104;
box-sizing: border-box;
overflow: hidden;
}
.noticeContent ul {
width: 100%;
}
.noticeContent li {
position: relative;
margin: 0.27rem 0 0 0;
padding: 0 0.25rem 0 1rem;
width: 100%;
text-align: left;
line-height: 1.25;
height: 0.5rem;
font-size: 0.38rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
box-sizing: border-box;
}
.noticeContent li::before {
display: inline-block;
position: absolute;
top: 0;
left: 0.3rem;
content: "";
width: 0.5rem;
height: 0.5rem;
background: url("../assets/images/icon_notice.png") no-repeat;
background-size: auto 85%;
}
.notice_list {
display: block;
position: absolute;
top: 0;
left: 0;
} }
.noticeContent { .notice_top {
position: absolute; transition: all 0.5s;
top: calc(2% + 10vh); margin-top: -30px;
right: 3%; }
z-index: 999;
padding: 0 0.25rem 0 1rem;
width: 94%;
min-height: 1rem;
background-color: rgba(249, 238, 219, 0.9);
border-radius: 0.5rem;
color: #df6104;
box-sizing: border-box;
overflow: hidden;
}
.noticeContent ul {
width: 100%;
}
.noticeContent li {
position: relative;
margin: 0.27rem 0 0 0;
padding: 0 0.25rem 0 1rem;
width: 100%;
text-align: left;
line-height: 1.25;
height: 0.5rem;
font-size: 0.38rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
box-sizing: border-box;
}
.noticeContent li::before {
display: inline-block;
position: absolute;
top: 0;
left: 0.3rem;
content: "";
width: 0.5rem;
height: 0.5rem;
background: url("../assets/images/icon_notice.png") no-repeat;
background-size: auto 85%;
}
.notice_list {
display: block;
position: absolute;
top: 0;
left: 0;
}
.notice_top {
transition: all 0.5s;
margin-top: -30px;
}
</style> </style>

Write Preview
Loading…
Cancel
Save