yxt_group
/
supervise
5
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

完善首页面样式

master
guoxing 1 year ago
parent
bdaf201dec
commit
3f76f46d6a
1 changed files with 462 additions and 93 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 555
      supervise-uniapp/pages/home/WorkFragment.vue

555
supervise-uniapp/pages/home/WorkFragment.vue
View File

@ -1,21 +1,87 @@
<template>
<view style="width: 100%;height: 100%;">
<view v-show="!isShow" style="width: 100%;height: 100%;">
<image src="https://supervise.yxtsoft.com/img/base/loading.gif" mode="aspectFill" style="width: 100%;height: 100%;"></image>
<image src="https://supervise.yxtsoft.com/img/base/loading.gif" mode="aspectFill"
style="width: 100%;height: 100%;"></image>
</view>
<view class="content" v-show="isShow">
<view class="whiteBg" style="display: flex;flex-direction: column;margin-top: 20px;">
<view class="whiteBg" style="display: flex;flex-direction: column;">
<!--circular用来设置循环轮播 indicator-dots设置下面小圆点用来点击 -->
<swiper circular indicator-dots class="swiper" :autoplay="true" :interval="2000"
v-show="swipers.length>0">
<!-- v-for循环遍历数组 -->
<swiper-item v-for="(item,index) in swipers">
<!-- <swiper circular indicator-dots class="swiper" :autoplay="true" :interval="2000"
v-show="swipers.length>0"> -->
<!-- v-for循环遍历数组 -->
<!-- <swiper-item v-for="(item,index) in swipers">
<image :src="item" @click="swiperClick(index)"></image>
</swiper-item>
</swiper>
</swiper> -->
<view style="display: flex;flex-direction: row; align-items: center;
background: #FFF6F0; " v-show="textArr.length>0">
<!-- <view style="display: flex;flex-direction: column; margin-left: 16px;">
<text
style="font-size: 18px;font-weight: bold;font-family: sans-serif;color: #FA755C; font-style:oblique;">公告</text>
<text
style="font-size: 18px;font-weight: bold;font-family: sans-serif;color: #31415F; font-style:oblique;">事项</text>
</view>
<view
style="margin-top: 20px;margin-bottom:20px;width: 2px;height: 80%;background: #E7EAF0;margin-left: 15px;margin-right: 15px;">
</view> -->
<div class="textBox">
<div class="marquee-wrap" >
<div class="marquee-list" :class="{'animate-up': animateUp}">
<view v-for="(item, index) in textArr" @click="textClick(item)">
<view style="display: flex;flex-direction: row;width: 100%;">
<image style="width: 18px;height: 18px;"
src="https://supervise.yxtsoft.com/img/newApp/earlyWarning.png"
mode="aspectFit">
</image>
<text style="flex: 1; overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;">{{item.name}}</text>
<text style="color: #999999;">{{item.date}}</text>
</view>
</view>
</div>
</div>
</div>
</view>
<view class="whiteBg-bom">
<image class="whiteBg-bom-lift" mode="scaleToFill" @click="warehouseClick('5')"
src="https://supervise.yxtsoft.com/img/newApp/allData.png" />
<view class="whiteBg-bom-right">
<image class="whiteBg-bom-right-top" mode="aspectFit" @click="warehouseClick('1')"
src="https://supervise.yxtsoft.com/img/newApp/warehouseList.png" />
<image class="whiteBg-bom-right-bom" mode="aspectFit" @click="warehouseClick('6')"
src="https://supervise.yxtsoft.com/img/newApp/warehouseSecurity.png" />
</view>
</view>
<view style="display: flex;flex-direction: row;">
@ -55,29 +121,127 @@
<text class="top_item_text">已阅工作</text>
</view>
</view>
</view>
<!-- <view style="display: flex;flex-direction: row; align-items: center;margin-top:10px;
background: #fff; padding-top: 10px;padding-bottom: 10px;" v-show="textArr.length>0">
<view style="display: flex;flex-direction: column; margin-left: 16px;">
<text
style="font-size: 18px;font-weight: bold;font-family: sans-serif;color: #FA755C; font-style:oblique;">公告</text>
<text
style="font-size: 18px;font-weight: bold;font-family: sans-serif;color: #31415F; font-style:oblique;">事项</text>
</view>
<view
style="margin-top: 20px;margin-bottom:20px;width: 2px;height: 80%;background: #E7EAF0;margin-left: 15px;margin-right: 15px;">
</view>
<div class="textBox">
<div class="marquee-wrap">
<div class="marquee-list" :class="{'animate-up': animateUp}">
<view v-for="(item, index) in textArr" @click="textClick(item)">
<view style="display: flex;flex-direction: column;">
<view style="display: flex;flex-direction: row;align-items: center;width: 100%;">
<image style="width: 18px;height: 18px;"
src="https://supervise.yxtsoft.com/img/newApp/earlyWarning.png"
mode="aspectFit">
</image>
<text style="width: 100%; overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;">{{item.name}}</text>
</view>
<text style="color: #999999;margin-top: 8px;">{{item.date}}</text>
</view>
</view>
</div>
</div>
</div>
</view> -->
<view class="top">
<text class="top-title">全部项目 ({{dataList.length}})</text>
<!-- <view class="top-num">
<image class="top-num-img" src="../../static/baseIcon/project.png"></image>
<text class="top-num-text"></text>
<view class="whiteBg-bom">
<image class="whiteBg-bom-lift" @click="warehouseClick('5')" src="https://supervise.yxtsoft.com/img/newApp/allData.png"/>
<view class="whiteBg-bom-right">
<image class="whiteBg-bom-right-top" @click="warehouseClick('1')" src="https://supervise.yxtsoft.com/img/newApp/warehouseList.png"/>
<image class="whiteBg-bom-right-bom" @click="warehouseClick('6')"src="https://supervise.yxtsoft.com/img/newApp/warehouseSecurity.png"/>
</view> -->
<view class="top-date" @click="openDate">
<text class="top-date-text">{{params.orderDate}}</text>
<image class="top-date-img" src="../../static/baseIcon/calendar.png"></image>
</view>
</view>
<view style="display: flex;flex-direction: row;align-items: center;
justify-content: center;background: #fff;padding-bottom: 16px;margin-top: -5px;">
<view style="flex: 0.5;"></view>
<view style="display: flex;flex-direction: column;flex: 1.6;justify-content: center;">
<text style="color: #666;">总授信</text>
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;">
<text style="color: #3478F5;font-size: 24px;font-weight: bold">{{allCredit}}</text>
<text style="color: #666;margin-left: 4px;">万元</text>
</view>
</view>
<view style="display: flex;flex-direction: column;flex: 1.6;justify-content: center;">
<text style="color: #666;">总用信</text>
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;">
<text style="color: #3478F5;font-size: 24px;font-weight: bold">{{allUseCredit}}</text>
<text style="color: #666;margin-left: 4px;">万元</text>
</view>
</view>
<view style="flex: 0.3;"></view>
</view>
<view class="list">
<view v-for="(item,index) in dataList" class="newslist" @click="itemClick(item)">
<view class="item" :class="{'item2':index==dataList.length-1}">
<view class="item-name">{{item.projectName}}</view>
<text class="item-num" v-show="item.isReport=='2'">当日无数据</text>
<view v-show="item.isReport=='1'">
<text class="item-num"
:class="{'item-num2':item.state=='2'}">{{item.pledgeRatePercent}}%</text>
<text class="item-num">/ {{item.bankPledgeRate}}%</text>
</view>
<image v-show="item.isReport=='1'" src="../../static/baseIcon/zy.png"
style="width: 15px;height: 15px;" mode="aspectFill">
</image>
</view>
</view>
</view>
<!-- <view class="whiteBg" style="display: flex;flex-direction: column;padding-top: 20px;margin-top: 20px;">
<!-- <view class="whiteBg" style="display: flex;flex-direction: column;padding-top: 20px;margin-top: 20px;">
<view style="display: flex;flex-direction: row;margin-left: 20px;align-items: center;">
@ -88,7 +252,7 @@
</view>
<view style=" height: 1px;background: #eee;margin-left: 25px;margin-right: 25px;margin-top: 15px;">
</view> -->
</view>
<!-- <view style="margin-top: 20px;display: flex;flex-direction: row;width: 100%;margin-bottom: 20px;">
@ -128,7 +292,7 @@
</image>
<text class="centre_text">云仓管理</text>
</view> -->
<!-- <view class="centre" @click="warehouseClick('2')">
<!-- <view class="centre" @click="warehouseClick('2')">
<image class="centre_img" src="https://supervise.yxtsoft.com/img/newApp/kcfx.png"
mode="aspectFit">
</image>
@ -146,8 +310,8 @@
</image>
<text class="centre_text">机器人巡库</text>
</view> -->
<!-- <view class="centre" @click="warehouseClick('5')">
<!-- <view class="centre" @click="warehouseClick('5')">
<image class="centre_img" src="https://supervise.yxtsoft.com/img/newApp/jqrxk.png"
mode="aspectFit">
</image>
@ -157,12 +321,17 @@
</view>
</view> -->
</view>
<u-datetime-picker ref="datetimePicker" :closeOnClickOverlay='true' @close="cancelClick" @cancel="cancelClick"
@confirm="confirmClick" :show="datetimeShow" v-model="orderDate" mode="date" :formatter="formatter">
</u-datetime-picker>
</view>
</template>
<script>
import {
formatTimeTwo,
beforeDay
} from "@/utils/index";
export default {
data() {
return {
@ -187,6 +356,17 @@
// 'https://fuss10.elemecdn.com/2/11/6535bcfb26e4c79b48ddde44f4b6fjpeg.jpeg'
],
isShow: false,
datetimeShow: false,
allCredit: "",
allUseCredit: "",
orderDate: beforeDay(null, -1),
params: {
userSid: getApp().globalData.sid,
orderDate: "",
},
dataList: [
],
};
},
@ -206,25 +386,35 @@
var userSid = getApp().globalData.sid
console.log(">>>>>", userSid)
this.getData(userSid, msg)
this.loadData(userSid);
});
},
onLoad() {
this.params.orderDate = beforeDay(null, -1)
},
mounted() {
this.startMove()
this.timer = setInterval(this.scrollAnimate, 1500);
},
onReady() {
/* #ifdef MP-WEIXIN */
// 微信小程序需要用此写法
this.$refs.datetimePicker.setFormatter(this.formatter)
/* #endif */
},
// onLoad() {
// },
onShow() {
console.log('onShow', getApp().globalData.isLogin)
let token = uni.getStorageSync("Global-Auth-Token")
if (token != null && token.length != 0) {
getApp().globalData.token = token
}
let isLogin =uni.getStorageSync("isLogin")
let isLogin = uni.getStorageSync("isLogin")
if (isLogin != null && isLogin == 1) {
getApp().globalData.isLogin = isLogin
}
@ -232,16 +422,17 @@
if (sid != null && sid.length != 0) {
getApp().globalData.sid = sid
}
console.log('用户Sid', getApp().globalData.sid)
console.log('token', getApp().globalData.token)
console.log('是否登陆', getApp().globalData.isLogin)
// setTimeout(() => {
if (getApp().globalData.isLogin) {
var userSid = getApp().globalData.sid
console.log(">>>>>", userSid)
this.getData(userSid, true)
this.loadData(userSid);
// uni.setTabBarBadge({ //显示数字
// index: 0, //tabbar下标
// text: '100' //数字
@ -298,16 +489,16 @@
this.dyNum = resp.pendingMessages
this.textArr = resp.notice
this.swipers = resp.urls
if(this.dyNum!=0){
if (this.dyNum != 0) {
uni.setTabBarBadge({ //显示数字
index: 1, //tabbar下标
text: this.dyNum > 100 ? "99+" : this.dyNum + "" //数字
})
}
}).catch(e => {
console.log('eeeee', e)
})
@ -325,7 +516,7 @@
uni.navigateTo({
url: '../index/WaitingProcessed'
});
break;
case "2":
// 已办
@ -378,10 +569,10 @@
},
textClick(item) {
console.log("111", item)
console.log("111", item.name)
uni.showToast({
icon: "none",
title: '您点击了公告，内容为：' + item,
title: '您点击了公告，内容为：' + item.name,
duration: 2000,
});
},
@ -472,29 +663,92 @@
duration: 2000,
});
break;
case "5":
// 数据总览
// uni.showToast({
// icon: "none",
// title: '数据总览',
// duration: 2000,
// });
uni.navigateTo({
url: '../index/DataAssembleList2'
});
break;
case "6":
uni.navigateTo({
url: '../index/warehouseSecurity'
});
break;
case "5":
// 数据总览
// uni.showToast({
// icon: "none",
// title: '数据总览',
// duration: 2000,
// });
uni.navigateTo({
url: '../index/DataAssembleList2'
});
break;
case "6":
uni.navigateTo({
url: '../index/warehouseSecurity'
});
break;
default:
break;
}
},
openDate() {
console.log('openDate')
this.datetimeShow = true
},
formatter(type, value) {
if (type === 'year') {
return `${value}年`
}
if (type === 'month') {
return `${value}月`
}
if (type === 'day') {
return `${value}日`
}
return value
},
cancelClick() {
this.datetimeShow = false
},
confirmClick(date) {
console.log('confirmClick', date)
console.log('date.value', date.value)
console.log('getTime', (new Date(date.value)).getTime())
console.log('formatTimeTwo', formatTimeTwo((new Date(date.value)).getTime(), "Y-M-D"))
this.params.orderDate = formatTimeTwo((new Date(date.value)).getTime(), "Y-M-D")
this.datetimeShow = false
this.loadData(getApp().globalData.sid)
},
loadData(userSid) {
this.params.userSid = userSid
console.log('params', this.params)
this.$api.projectListPageNew(this.params).then((resp) => {
// if (resp.success) {
console.log('1111', resp)
this.allCredit = resp.creditLimitTotal
this.allUseCredit = resp.useLimitTotal
this.dataList = resp.list
}).catch(e => {
console.log('eeeee', e)
})
},
itemClick(item) {
console.log('itemClick', item)
console.log('orderDate', this.params.orderDate)
if (item.isReport == '1') {
uni.navigateTo({
url: '../index/RegulatoryReporting?projectSid=' + item.projectSid + "&orderDate=" + this
.params.orderDate
});
}
}
}
}
@ -508,11 +762,9 @@
.whiteBg {
display: flex;
background-color: white;
border-radius: 20px;
padding-left: 12px;
padding-right: 12px;
height: 100%;
background: #fff;
// height: 100%;
.swiper {
width: 100%;
@ -592,47 +844,54 @@
.top_item_text {
margin-top: 5px;
color: #101010;
font-size: 13px;
color: #333;
font-size: 14px;
}
}
.whiteBg-bom{
margin-top: 10px;
.whiteBg-bom {
padding-left: 16px;
padding-right: 16px;
margin-top: 16px;
display: flex;
flex-direction: row;
justify-content: center;
.whiteBg-bom-lift {
margin-right: 8px;
flex: 0.75;
width: 100%;
height: 175px;
// border-radius: 10px;
}
.whiteBg-bom-right {
flex: 0.8;
margin-left: 8px;
display: flex;
flex-direction: row;
justify-content: center;
.whiteBg-bom-lift{
margin-right: 8px;
flex: 0.7;
flex-direction: column;
.whiteBg-bom-right-top {
// border-radius: 10px;
width: 100%;
height:175px;
height: 82px;
}
.whiteBg-bom-right{
flex: 1;
margin-left: 8px;
display: flex;
flex-direction: column;
.whiteBg-bom-right-top{
width: 100%;
height: 82px;
}
.whiteBg-bom-right-bom{
margin-top: 10px;
width: 100%;
height: 82px;
}
.whiteBg-bom-right-bom {
// border-radius: 10px;
margin-top: 10px;
width: 100%;
height: 82px;
}
}
}
}
.textBox {
flex: 1;
margin-right: 10px;
// .textBox-swiper{
// width: 100%;
@ -654,8 +913,13 @@
width: 100%;
height: 40px;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: center;
.marquee-list {
padding-left: 10px;
padding-right: 10px;
li {
width: 100%;
height: 100%;
@ -663,7 +927,7 @@
overflow: hidden;
white-space: nowrap;
list-style: none;
line-height: 40px;
line-height: 50px;
color: #000;
font-size: 15px;
font-weight: 400;
@ -671,12 +935,117 @@
}
.animate-up {
transition: all 0.8s ease-in-out;
transition: all 1s ease-in-out;
transform: translateY(-40px);
}
}
}
.top {
margin-top: 10px;
padding: 20px 16px;
background: #fff;
display: flex;
flex-direction: row;
align-items: center;
.top-title {
flex: 1;
color: #000;
font-size: 18px;
font-family: sans-serif;
font-weight: 600;
}
.top-num {
margin-left: 20px;
flex: 1;
display: flex;
flex-direction: row;
align-items: center;
.top-num-img {
width: 14px;
height: 14px;
}
.top-num-text {
margin-left: 5px;
color: #E99D42;
font-size: 14px;
}
}
.top-date {
display: flex;
flex-direction: row;
align-items: center;
.top-date-text {
color: #717171 100%;
font-size: 14px;
margin-right: 10px;
}
.top-date-img {
width: 14px;
height: 14px;
}
}
}
.list {
margin-top: 10px;
background: #fff;
.newslist {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
.item {
width: 100%;
padding: 20px 20px;
display: flex;
flex-direction: row;
align-items: center;
border-bottom: 1px #eee solid;
.item-name {
flex: 1;
color: #191919;
font-size: 15px;
font-weight: 600;
font-family: sans-serif;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
margin-right: 20px;
}
.item-num {
margin-right: 5px;
color: #999999;
font-size: 12px;
}
.item-num2 {
color: #FF5006;
}
}
.item2 {
border-bottom: none;
}
}
}
// .slide-enter-active,
// .slide-leave-active {

Write Preview
Loading…
Cancel
Save