| | |
| | | } |
| | | }, |
| | | { |
| | | "path" : "pages/tabBar/responsivity/countyResponsivity", |
| | | "style" : |
| | | { |
| | | "navigationStyle": "custom", |
| | | "navigationBarTitleText": "", |
| | | "enablePullDownRefresh": false, |
| | | "app-plus": { |
| | | "scrollIndicator": "none" |
| | | } |
| | | } |
| | | }, |
| | | { |
| | | "path" : "pages/tabBar/responsivity/cityResponsivity", |
| | | "style" : |
| | | { |
| | | "navigationStyle": "custom", |
| | | "navigationBarTitleText": "", |
| | | "enablePullDownRefresh": false, |
| | | "app-plus": { |
| | | "scrollIndicator": "none" |
| | | } |
| | | } |
| | | }, |
| | | { |
| | | "path" : "pages/tabBar/responsivity/villageResponsivity", |
| | | "style" : |
| | | { |
| | | "navigationStyle": "custom", |
| | | "navigationBarTitleText": "", |
| | | "enablePullDownRefresh": false, |
| | | "app-plus": { |
| | | "scrollIndicator": "none" |
| | | } |
| | | } |
| | | }, |
| | | { |
| | | "path" : "pages/tabBar/notice/measures", |
| | | "style" : |
| | | { |
| | |
| | | } |
| | | }, |
| | | { |
| | | "path" : "pages/tabBar/responsivity/showMeasures", |
| | | "style" : |
| | | { |
| | | "navigationStyle": "custom", |
| | | "navigationBarTitleText": "", |
| | | "enablePullDownRefresh": false, |
| | | "app-plus": { |
| | | "scrollIndicator": "none" |
| | | } |
| | | } |
| | | }, |
| | | { |
| | | "path" : "pages/tabBar/firstPage/firstPage", |
| | | "style" : |
| | | { |
| | |
| | | z-index: 1; |
| | | } |
| | | .navBarBox .navBar { |
| | | background-color:lightgrey; |
| | | height: 45px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | background-color:#fff; |
| | | height: 50px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | } |
| | | .barText{ |
| | | text-align: center; |
| | |
| | | <!-- 状态栏占位 --> |
| | | <view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view> |
| | | <!-- 真正的导航栏内容 --> |
| | | <view style="display: flex; flex-direction: column;"> |
| | | <view class="navBar"> |
| | | <u-icon style=" margin-left: -25px;" name="arrow-left" color="black" size="17" @click="goBack" /> |
| | | <view class="barText">信息</view> |
| | | <view class="navBar"> |
| | | <view class="barText">信息查看</view> |
| | | </view> |
| | | </view> |
| | | <!-- 页面内容 --> |
| | | <view class="controlBar"> |
| | | <view class="buttonGroup"> |
| | | <view class="buttonItem all" |
| | | :class="{ 'active': selectedSaleAnalysis === 'all'}" |
| | | @click="handleButtonClick({label: 'all',name: '全部'})"> |
| | | 全部 |
| | | </view> |
| | | <view v-for="(button, index) in buttons" :key="index" class="buttonItem" |
| | | :class="{ 'active': selectedSaleAnalysis === button.label, |
| | | 'all': button.label === 'all', |
| | | 'red': button.label === 'red', |
| | | 'orange':button.label === 'orange', |
| | | 'yellow':button.label === 'yellow', |
| | | 'blue': button.label === 'blue'}" |
| | | @click="handleButtonClick(button)"> |
| | | {{ button.name }} |
| | | </view> |
| | | </view> |
| | | <view class="listHead"> |
| | | |
| | | <view class="switchBtn"> |
| | | <u-switch v-model="checked" size="20" @change="clickSwitch" style="margin-right: 6px"></u-switch> |
| | | <text>仅紧临</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <text>通用信息详情</text> |
| | | <view style="display: flex;flex-direction: column;margin-bottom: 55px;"> |
| | | <view class="examineList"> |
| | | <view class="listContent" v-if="InfoList.length > 0"> |
| | | <view v-for="(item, index) in InfoList" :key="index" class="itemContent"> |
| | | <view class="content"> |
| | | <text>[{{item.colorContent}}]</text> |
| | | <text>{{item.title}},{{item.content}}</text> |
| | | <view class="btnGroup" style="float: right;"> |
| | | <u-button |
| | | size="mini" |
| | | style="background-color:rgb(255, 223, 37);color: white;width: 100px;margin: 3px 8px;" |
| | | @click="toDetail(item)" |
| | | > |
| | | 信息详情 |
| | | </u-button> |
| | | <u-button |
| | | size="mini" |
| | | style="background-color:rgb(17, 204, 33);color: white;width: 100px;" |
| | | @click="toResponsivity(item)" |
| | | > |
| | | 查看叫应率 |
| | | </u-button> |
| | | |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view v-else> |
| | | <u-empty margin-top="40%" text="数据为空" mode="data"></u-empty> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <tabBar :currentPagePath="page"></tabBar> |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | import tabBar from '../tabBarIndex.vue' |
| | | import {getExamine} from '../../../api/examine.js' |
| | | import tebBar from '../tabBarIndex.vue' |
| | | export default { |
| | | components:{ |
| | | tabBar |
| | | }, |
| | | data() { |
| | | return { |
| | | data: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | searchParams: { |
| | | emergType: null,//1-紧急;2-常规 |
| | | warningLevel: null,//1-红色预警;2-橙色预警;3-黄色预警;4-蓝色预警 |
| | | reviewStatus: null//1:未审核,2:已审核,3:审核已驳回 |
| | | } |
| | | }, |
| | | page: 'pages/tabBar/current/current', |
| | | statusBarHeight: '' |
| | | checked: false, |
| | | isReadOnly: false, |
| | | statusBarHeight: 0, |
| | | buttons: [ |
| | | { |
| | | label: 'red', |
| | | name: '红' |
| | | }, |
| | | { |
| | | label: 'orange', |
| | | name: '橙' |
| | | }, |
| | | { |
| | | label: 'yellow', |
| | | name: '黄' |
| | | }, |
| | | { |
| | | label: 'blue', |
| | | name: '蓝' |
| | | }, |
| | | ], |
| | | selectedSaleAnalysis: 'all', |
| | | InfoList: [], |
| | | } |
| | | |
| | | }, |
| | | onLoad() { |
| | | //获取手机状态栏高度 |
| | | this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight']; |
| | | uni.hideTabBar(); |
| | | }, |
| | | onShow() { |
| | | this.getInfoList(); |
| | | }, |
| | | methods: { |
| | | goBack() { |
| | |
| | | url:'/pages/tabBar/firstPage/firstPage' |
| | | }); |
| | | }, |
| | | getInfoList() { |
| | | this.data.searchParams.emergType = this.checked ? 1 : null; |
| | | this.data.searchParams.warningLevel = this.selectedSaleAnalysis == 'all' ? null : this.selectedSaleAnalysis =='red' ? 1 : this.selectedSaleAnalysis =='orange' ? 2: this.selectedSaleAnalysis =='yellow'? 3 : 4; |
| | | // getExamine(this.data).then(res => { |
| | | // if(res.code == 100) { |
| | | this.InfoList = [ |
| | | { |
| | | attachment: null, |
| | | disasterType: 1, |
| | | gmtReviewSubmit: "2023-07-21 14:36:16", |
| | | id: 111, |
| | | infoSubmitter: "1-1", |
| | | infoSubmitterReal: "省级工作人员", |
| | | publishingUnit: "自治区自然灾害综合检测预警中心", |
| | | reviewStatus: 1, |
| | | title: "【20230721】预警信息标题", |
| | | warningLevel: 1, |
| | | } |
| | | ]; |
| | | if(this.InfoList.length > 0) { |
| | | this.InfoList.forEach((item, index) => { |
| | | this.InfoList[index].colorContent = item.warningLevel == 1 ? '红色预警': item.warningLevel == 2 ? '橙色预警': item.warningLevel == 3 ? '黄色预警':'蓝色预警'; |
| | | this.InfoList[index].warningLevel = item.warningLevel; |
| | | }); |
| | | } |
| | | // } |
| | | // }) |
| | | }, |
| | | handleButtonClick(button) { |
| | | this.selectedSaleAnalysis = button.label; |
| | | this.getInfoList(); |
| | | }, |
| | | toDetail(item) { |
| | | console.log("item",item) |
| | | uni.navigateTo({ |
| | | url: `/pages/tabBar/notice/detail?data=` + encodeURIComponent(JSON.stringify(item)) |
| | | }) |
| | | }, |
| | | toResponsivity(item) { |
| | | //县 |
| | | uni.navigateTo({ |
| | | url: `/pages/tabBar/responsivity/countyResponsivity?data=` + encodeURIComponent(JSON.stringify(item)) |
| | | }) |
| | | //市 |
| | | //村 |
| | | }, |
| | | //下拉刷新 |
| | | onPullDownRefresh() { |
| | | console.log('refresh'); |
| | | setTimeout(() => { |
| | | uni.stopPullDownRefresh(); |
| | | this.getInfoList(); |
| | | }, 1000); |
| | | }, |
| | | clickSwitch(e) { |
| | | this.getInfoList(); |
| | | } |
| | | } |
| | | } |
| | | |
| | | </script> |
| | | |
| | | <style> |
| | | <style lang="scss" scoped> |
| | | .box { |
| | | display: flex; |
| | | flex-direction: column; |
| | |
| | | z-index: 1; |
| | | } |
| | | .navBarBox .navBar { |
| | | background-color:#fff; |
| | | height: 50px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | background-color:#fff; |
| | | height: 50px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | } |
| | | .barText{ |
| | | /* margin-left: 20px; */ |
| | | text-align: center; |
| | | width: 85%; |
| | | font-size: 16px; |
| | | /* text-align: center; */ |
| | | font-weight: 600; |
| | | text-align: center; |
| | | width: 85%; |
| | | font-size: 16px; |
| | | /* text-align: center; */ |
| | | font-weight: 600; |
| | | } |
| | | .statusBar{ |
| | | background-color:lightgrey; |
| | | } |
| | | /* .contentList{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | } |
| | | .buttonGroup{ |
| | | margin: 18px 12px; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | } |
| | | .buttonAll{ |
| | | margin-left:5px; |
| | | color: white; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | width: 35px; |
| | | height: 30px; |
| | | border-radius: 5px; |
| | | font-size: 12px; |
| | | font-weight: 700; |
| | | } */ |
| | | .controlBar{ |
| | | margin: 12px 12px 0; |
| | | padding: 12px; |
| | | height: 90px; |
| | | box-sizing: border-box; |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: space-between; |
| | | width: calc(100% - 24px); |
| | | background: #fff; |
| | | border-radius: 5px; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | |
| | | .buttonGroup{ |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | margin-bottom: 12px; |
| | | } |
| | | |
| | | .listHead{ |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: flex-end; |
| | | } |
| | | } |
| | | .buttonItem{ |
| | | width: calc(20% - 4px); |
| | | color: white; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | height: 30px; |
| | | border-radius: 5px; |
| | | &.active{ |
| | | border: 1px solid rgba(0,0,0,.4); |
| | | box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
| | | } |
| | | } |
| | | .all { |
| | | background-color: rgb(17,204,33); |
| | | &.active{ |
| | | background-image: linear-gradient(#22992d,#12da23); |
| | | } |
| | | } |
| | | .active { |
| | | border: 1.5px solid #8d8d8d; |
| | | } |
| | | .red { |
| | | background-color: #ff5555; |
| | | &.active{ |
| | | background:linear-gradient(#dc2f2f, #ff5b5b); |
| | | } |
| | | } |
| | | .orange { |
| | | background-color: rgb(251, 158, 13); |
| | | &.active{ |
| | | background: linear-gradient(#e28e0c,#ffa90e); |
| | | } |
| | | } |
| | | .yellow { |
| | | background-color: rgb(255, 223, 37); |
| | | &.active{ |
| | | background: linear-gradient(#e6c921,#ffef28); |
| | | } |
| | | } |
| | | .blue { |
| | | background-color: #409EFF; |
| | | &.active{ |
| | | background: linear-gradient(#3a8ee6,#44a9ff); |
| | | } |
| | | } |
| | | .switchBtn{ |
| | | display: flex; |
| | | align-items: center; |
| | | } |
| | | .listContent{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | margin: 0 12px; |
| | | background: #fff; |
| | | border-radius: 5px; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | } |
| | | .itemContent{ |
| | | font-size: 16px; |
| | | color: #333; |
| | | margin-top: 15px; |
| | | padding: 0 12px 10px; |
| | | border-bottom: 1px solid #ebebeb; |
| | | |
| | | } |
| | | .content{ |
| | | text-overflow: ellipsis; |
| | | overflow: hidden; |
| | | white-space: nowrap; |
| | | } |
| | | .buttonCo{ |
| | | margin-top: 5px; |
| | | margin-bottom: 10px; |
| | | } |
| | | .examineList{ |
| | | margin-top: 12px; |
| | | height: calc(100vh - 266px); |
| | | overflow: hidden; |
| | | overflow-y: scroll; |
| | | } |
| | | .btnGroup{ |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: flex-end; |
| | | } |
| | | </style> |
| | |
| | | </view> |
| | | </view> |
| | | <!-- 页面内容 --> |
| | | <view class="contentList"> |
| | | <view class="controlBar"> |
| | | <view class="buttonGroup"> |
| | | <view style="display: flex;"> |
| | | <view class="buttonAll all" |
| | | :class="{ 'active': selectedSaleAnalysis === 'all'}" |
| | | @click="handleButtonClick({label: 'all',name: '全部'})"> |
| | | 全部 |
| | | </view> |
| | | <view v-for="(button, index) in buttons" :key="index" class="buttonItem" |
| | | :class="{ 'active': selectedSaleAnalysis === button.label, |
| | | 'all': button.label === 'all', |
| | | 'red': button.label === 'red', |
| | | 'orange':button.label === 'orange', |
| | | 'yellow':button.label === 'yellow', |
| | | 'blue': button.label === 'blue'}" |
| | | @click="handleButtonClick(button)"> |
| | | {{ button.name }} |
| | | </view> |
| | | <view class="buttonItem all" |
| | | :class="{ 'active': selectedSaleAnalysis === 'all'}" |
| | | @click="handleButtonClick({label: 'all',name: '全部'})"> |
| | | 全部 |
| | | </view> |
| | | <view class="switchBtn"> |
| | | <text style="margin-right: 7px;">仅紧临</text> |
| | | <u-switch v-model="checked" size="20" @change="clickSwitch"></u-switch> |
| | | <view v-for="(button, index) in buttons" :key="index" class="buttonItem" |
| | | :class="{ 'active': selectedSaleAnalysis === button.label, |
| | | 'all': button.label === 'all', |
| | | 'red': button.label === 'red', |
| | | 'orange':button.label === 'orange', |
| | | 'yellow':button.label === 'yellow', |
| | | 'blue': button.label === 'blue'}" |
| | | @click="handleButtonClick(button)"> |
| | | {{ button.name }} |
| | | </view> |
| | | </view> |
| | | <view class="examineList"> |
| | | <view class="listHead"> |
| | | <u-checkbox-group style="margin-left: 15px;"> |
| | | <u-checkbox v-model="isReadOnly" :checked="isReadOnly" @change="chooseRead"></u-checkbox>只显示待审核 |
| | | <view class="listHead"> |
| | | <view class="switchBtn"> |
| | | <u-checkbox-group> |
| | | <u-checkbox v-model="isReadOnly" :checked="isReadOnly" @change="chooseRead"></u-checkbox> |
| | | </u-checkbox-group> |
| | | <text>只显示待审核</text> |
| | | </view> |
| | | <view class="switchBtn"> |
| | | <u-switch v-model="checked" size="20" @change="clickSwitch" style="margin-right: 6px"></u-switch> |
| | | <text>仅紧临</text> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view style="display: flex;flex-direction: column;margin-bottom: 55px;"> |
| | | <view class="examineList"> |
| | | <view class="listContent" v-if="examineList.length > 0"> |
| | | <view v-for="(item, index) in examineList" :key="index" class="itemContent"> |
| | | <view class="content" @click="toDetail(item)"> |
| | |
| | | </view> |
| | | </view> |
| | | <view v-else> |
| | | <u-empty |
| | | mode="data" |
| | | icon="http://cdn.uviewui.com/uview/empty/data.png" |
| | | margin-top="50%"> |
| | | </u-empty> |
| | | <u-empty margin-top="40%" text="数据为空" mode="data"></u-empty> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | |
| | | </script> |
| | | |
| | | <style> |
| | | <style lang="scss" scoped> |
| | | .box { |
| | | display: flex; |
| | | flex-direction: column; |
| | |
| | | z-index: 1; |
| | | } |
| | | .navBarBox .navBar { |
| | | background-color:lightgrey; |
| | | height: 45px; |
| | | background-color:#fff; |
| | | height: 50px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | } |
| | | .barText{ |
| | | text-align: center; |
| | |
| | | .statusBar{ |
| | | background-color:lightgrey; |
| | | } |
| | | .contentList{ |
| | | /* .contentList{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | } |
| | |
| | | border-radius: 5px; |
| | | font-size: 12px; |
| | | font-weight: 700; |
| | | } */ |
| | | .controlBar{ |
| | | margin: 12px 12px 0; |
| | | padding: 12px; |
| | | height: 90px; |
| | | box-sizing: border-box; |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: space-between; |
| | | width: calc(100% - 24px); |
| | | background: #fff; |
| | | border-radius: 5px; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | |
| | | .buttonGroup{ |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | margin-bottom: 12px; |
| | | } |
| | | |
| | | .listHead{ |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | } |
| | | } |
| | | .buttonItem{ |
| | | margin-left:5px; |
| | | width: calc(20% - 4px); |
| | | color: white; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | width: 47px; |
| | | height: 30px; |
| | | border-radius: 5px; |
| | | &.active{ |
| | | border: 1px solid rgba(0,0,0,.4); |
| | | box-shadow: 0 1px 3px rgba(0,0,0,0.1); |
| | | } |
| | | } |
| | | .all { |
| | | background-color: rgb(17,204,33); |
| | | &.active{ |
| | | background-image: linear-gradient(#22992d,#12da23); |
| | | } |
| | | } |
| | | .active { |
| | | border: 1.5px solid #8d8d8d; |
| | | } |
| | | .all { |
| | | background-color: rgb(17,204,33); |
| | | } |
| | | .red { |
| | | background-color: red; |
| | | background-color: #ff5555; |
| | | &.active{ |
| | | background:linear-gradient(#dc2f2f, #ff5b5b); |
| | | } |
| | | } |
| | | .orange { |
| | | background-color: rgb(251, 158, 13); |
| | | &.active{ |
| | | background: linear-gradient(#e28e0c,#ffa90e); |
| | | } |
| | | } |
| | | .yellow { |
| | | background-color: rgb(255, 223, 37); |
| | | &.active{ |
| | | background: linear-gradient(#e6c921,#ffef28); |
| | | } |
| | | } |
| | | .blue { |
| | | background-color: rgb(2, 167, 240); |
| | | background-color: #409EFF; |
| | | &.active{ |
| | | background: linear-gradient(#3a8ee6,#44a9ff); |
| | | } |
| | | } |
| | | .switchBtn{ |
| | | display: flex; |
| | | align-items: center; |
| | | } |
| | | .listHead{ |
| | | display: flex; |
| | | align-items: center; |
| | | background-color:lightgrey; |
| | | height: 35px; |
| | | } |
| | | // .listHead{ |
| | | // display: flex; |
| | | // align-items: center; |
| | | // background-color:lightgrey; |
| | | // height: 35px; |
| | | // } |
| | | .listContent{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | padding: 10px 10px; |
| | | margin: 0 12px; |
| | | background: #fff; |
| | | border-radius: 5px; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | } |
| | | .itemContent{ |
| | | font-size: 16px; |
| | | color: gray; |
| | | margin-top: 10px; |
| | | border-bottom: 1px solid lightgrey; |
| | | color: #333; |
| | | margin-top: 15px; |
| | | padding: 0 12px 15px; |
| | | border-bottom: 1px solid #ebebeb; |
| | | |
| | | } |
| | | .content{ |
| | |
| | | margin-top: 5px; |
| | | margin-bottom: 10px; |
| | | } |
| | | .examineList{ |
| | | margin-top: 12px; |
| | | height: calc(100vh - 266px); |
| | | overflow: hidden; |
| | | overflow-y: scroll; |
| | | } |
| | | </style> |
| | |
| | | <view class="barText">首页</view> |
| | | </view> |
| | | </view> |
| | | <view style="display: flex;flex-direction: column;padding: 10px 15px;"> |
| | | <view class="list"> |
| | | <view class="first" @click="goExamine"> |
| | | 预警审核 |
| | | </view> |
| | |
| | | |
| | | <style> |
| | | .navBarBox .navBar { |
| | | background-color:lightgrey; |
| | | height: 45px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | font-size: 16px; |
| | | /* text-align: center; */ |
| | | font-weight: 600; |
| | | background-color:#fff; |
| | | height: 50px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | |
| | | } |
| | | .fix{ |
| | | position: sticky; |
| | |
| | | .statusBar{ |
| | | background-color:lightgrey; |
| | | } |
| | | .list{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | padding: 10px 15px; |
| | | |
| | | } |
| | | .first{ |
| | | width: 100%; |
| | | height: 110px; |
| | |
| | | font-size: 18px; |
| | | margin-top: 40px; |
| | | } |
| | | .barText{ |
| | | text-align: center; |
| | | font-size: 16px; |
| | | font-weight: 600; |
| | | } |
| | | </style> |
| | |
| | | </view> |
| | | </view> |
| | | <view v-else> |
| | | <u-empty |
| | | mode="data" |
| | | icon="http://cdn.uviewui.com/uview/empty/data.png" |
| | | margin-top="50%"> |
| | | </u-empty> |
| | | <u-empty margin-top="40%" text="数据为空" mode="data"></u-empty> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | <view class="attache" v-if="isAllImg == 'no'"> |
| | | <view v-for="(item, index) in detailData.attachments" :key="index" > |
| | | <view style="display: flex;margin-top: 10px;" v-if="item.suffix == 'jpg'|| item.suffix =='jpeg' || item.suffix =='png'"> |
| | | <image @click="previewSqs(item)" :src="item.attachment" style="width: 100rpx; height: 100rpx;margin-left: 5rpx;border: 3px solid #ccc;margin-right: 3px;"></image> |
| | | <image @click="previewSqs(item,index)" :src="item.attachment" style="width: 100rpx; height: 100rpx;margin-left: 5rpx;border: 3px solid #ccc;margin-right: 3px;"></image> |
| | | </view> |
| | | <view style="display: flex;margin-top: 10px;" @click="openFile(item)" v-else> |
| | | <u-icon name="attach" color="#2979ff" size="20"></u-icon> {{item.attachementName}} |
| | |
| | | </view> |
| | | </view> |
| | | <view v-else> |
| | | <u-empty |
| | | mode="data" |
| | | icon="http://cdn.uviewui.com/uview/empty/data.png" |
| | | margin-top="50%"> |
| | | </u-empty> |
| | | <u-empty margin-top="40%" text="数据为空" mode="data"></u-empty> |
| | | </view> |
| | | </view> |
| | | </view> |
| | |
| | | }, |
| | | methods: { |
| | | getNoticeList() { |
| | | this.noSpeak = 0; |
| | | this.data.searchParams.readStatus = this.isReadOnly ? 0 : null; |
| | | this.data.searchParams.emergType = this.checked ? 1 : null ; |
| | | this.data.searchParams.warningLevel = this.selectedSaleAnalysis =='all' ? null : this.selectedSaleAnalysis =='red' ? 1 : this.selectedSaleAnalysis =='orange' ? 2: this.selectedSaleAnalysis =='yellow'? 3 : 4; |
对比新文件 |
| | |
| | | <template> |
| | | <view class="box"> |
| | | <!-- 自定义导航栏 --> |
| | | <view class="navBarBox fix"> |
| | | <!-- 状态栏占位 --> |
| | | <view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view> |
| | | <!-- 真正的导航栏内容 --> |
| | | <view style="display: flex; flex-direction: column;"> |
| | | <view class="navBar"> |
| | | <u-icon style=" margin-left: -25px;" name="arrow-left" color="black" size="17" @click="goBack" /> |
| | | <view class="barText">叫应率统计</view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="responseCard"> |
| | | <table class="table"> |
| | | <thead class="head"> |
| | | <tr> |
| | | <th></th> |
| | | <th>叫应情况</th> |
| | | <th>乡镇叫应率</th> |
| | | <th>详情</th> |
| | | </tr> |
| | | </thead> |
| | | <tbody class="tableBody"> |
| | | <tr v-for="(item, index) in tableData" :key="index" > |
| | | <td align="center" width="90px">{{ item.unit }}</td> |
| | | <td align="center">{{ item.response }}</td> |
| | | <td align="center">{{ item.responsivity }}</td> |
| | | <td> |
| | | <u-button |
| | | size="mini" |
| | | type="text" |
| | | style="color: sandybrown" |
| | | @click="toVillage(item)" |
| | | >叫应详情 |
| | | </u-button></td> |
| | | </tr> |
| | | </tbody> |
| | | </table> |
| | | </view> |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | data() { |
| | | return { |
| | | page: 'pages/tabBar/count/count', |
| | | statusBarHeight: '', |
| | | tableData: [ |
| | | { |
| | | unit:'伊犁州', |
| | | response: '1', |
| | | responsivity: '88.9%' |
| | | }, |
| | | { |
| | | unit:'伊犁州', |
| | | response: '1', |
| | | responsivity: '88.9%' |
| | | }, |
| | | { |
| | | unit:'伊犁州', |
| | | response: '1', |
| | | responsivity: '88.9%' |
| | | }, |
| | | { |
| | | unit:'伊犁州', |
| | | response: '1', |
| | | responsivity: '88.9%' |
| | | } |
| | | ] |
| | | } |
| | | |
| | | }, |
| | | onLoad() { |
| | | //获取手机状态栏高度 |
| | | this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight']; |
| | | uni.hideTabBar(); |
| | | }, |
| | | methods: { |
| | | goBack() { |
| | | console.log("1111") |
| | | uni.navigateTo({ |
| | | url:'/pages/tabBar/responsivity/countyResponsivity' |
| | | }); |
| | | }, |
| | | toVillage(item) { |
| | | uni.navigateTo({ |
| | | url: `/pages/tabBar/responsivity/villageResponsivity?data=` + encodeURIComponent(JSON.stringify(item)) |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | |
| | | </script> |
| | | |
| | | <style lang='scss' scoped> |
| | | .box { |
| | | display: flex; |
| | | flex-direction: column; |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | .fix{ |
| | | position: sticky; |
| | | top: 0; |
| | | left: 0; |
| | | right: 0; |
| | | width: 100%; |
| | | z-index: 1; |
| | | } |
| | | .navBarBox .navBar { |
| | | background-color:#fff; |
| | | height: 50px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | } |
| | | .barText{ |
| | | text-align: center; |
| | | width: 85%; |
| | | font-size: 16px; |
| | | /* text-align: center; */ |
| | | font-weight: 600; |
| | | } |
| | | .statusBar{ |
| | | background-color:lightgrey; |
| | | } |
| | | .responseCard{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | background: #fff; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | margin: 12px 12px 20px; |
| | | border-radius: 5px; |
| | | padding: 30px 12px; |
| | | } |
| | | .table{ |
| | | .head{ |
| | | color: white; |
| | | line-height: 35px; |
| | | background-color: rgb(66, 157, 218); |
| | | } |
| | | .tableBody{ |
| | | color: black; |
| | | background-color: rgb(207, 223, 241); |
| | | line-height: 35px; |
| | | } |
| | | tr:nth-child(odd+1) { |
| | | background-color: rgb(207, 223, 241); /* 设置奇数行颜色 */ |
| | | } |
| | | tr:nth-child(even) { |
| | | background-color: rgb(233, 239, 248); /* 设置偶数行颜色 */ |
| | | } |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <view class="box"> |
| | | <!-- 自定义导航栏 --> |
| | | <view class="navBarBox fix"> |
| | | <!-- 状态栏占位 --> |
| | | <view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view> |
| | | <!-- 真正的导航栏内容 --> |
| | | <view style="display: flex; flex-direction: column;"> |
| | | <view class="navBar"> |
| | | <u-icon style=" margin-left: -25px;" name="arrow-left" color="black" size="17" @click="goBack" /> |
| | | <view class="barText">叫应率统计</view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="responseCard"> |
| | | <table class="table"> |
| | | <thead class="head"> |
| | | <tr> |
| | | <th></th> |
| | | <th>叫应情况</th> |
| | | <th>县市叫应率</th> |
| | | <th>详情</th> |
| | | </tr> |
| | | </thead> |
| | | <tbody class="tableBody"> |
| | | <tr v-for="(item, index) in tableData" :key="index" > |
| | | <td align="center" width="90px">{{ item.unit }}</td> |
| | | <td align="center">{{ item.response }}</td> |
| | | <td align="center">{{ item.responsivity }}</td> |
| | | <td> |
| | | <u-button |
| | | size="mini" |
| | | type="text" |
| | | style="color: sandybrown" |
| | | @click="toCity(item)" |
| | | >叫应详情 |
| | | </u-button> |
| | | </td> |
| | | </tr> |
| | | </tbody> |
| | | </table> |
| | | </view> |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | data() { |
| | | return { |
| | | page: 'pages/tabBar/count/count', |
| | | statusBarHeight: '', |
| | | tableData: [ |
| | | { |
| | | unit:'伊犁州', |
| | | response: '1', |
| | | responsivity: '88.9%' |
| | | }, |
| | | { |
| | | unit:'伊犁州1', |
| | | response: '1', |
| | | responsivity: '88.9%' |
| | | }, |
| | | { |
| | | unit:'伊犁州2', |
| | | response: '1', |
| | | responsivity: '88.9%' |
| | | }, |
| | | { |
| | | unit:'伊犁州3', |
| | | response: '1', |
| | | responsivity: '88.9%' |
| | | } |
| | | ] |
| | | } |
| | | |
| | | }, |
| | | onLoad() { |
| | | //获取手机状态栏高度 |
| | | this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight']; |
| | | uni.hideTabBar(); |
| | | }, |
| | | methods: { |
| | | goBack() { |
| | | console.log("1111") |
| | | uni.switchTab({ |
| | | url:'/pages/tabBar/current/current' |
| | | }); |
| | | }, |
| | | toCity(item) { |
| | | console.log("item",item) |
| | | uni.navigateTo({ |
| | | url: `/pages/tabBar/responsivity/cityResponsivity?data=` + encodeURIComponent(JSON.stringify(item)) |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | |
| | | </script> |
| | | |
| | | <style lang='scss' scoped> |
| | | .box { |
| | | display: flex; |
| | | flex-direction: column; |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | .fix{ |
| | | position: sticky; |
| | | top: 0; |
| | | left: 0; |
| | | right: 0; |
| | | width: 100%; |
| | | z-index: 1; |
| | | } |
| | | .navBarBox .navBar { |
| | | background-color:#fff; |
| | | height: 50px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | } |
| | | .barText{ |
| | | text-align: center; |
| | | width: 85%; |
| | | font-size: 16px; |
| | | /* text-align: center; */ |
| | | font-weight: 600; |
| | | } |
| | | .statusBar{ |
| | | background-color:lightgrey; |
| | | } |
| | | .responseCard{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | background: #fff; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | margin: 12px 12px 20px; |
| | | border-radius: 5px; |
| | | padding: 30px 12px; |
| | | } |
| | | .table{ |
| | | .head{ |
| | | color: white; |
| | | line-height: 35px; |
| | | background-color: rgb(66, 157, 218); |
| | | } |
| | | .tableBody{ |
| | | color: black; |
| | | background-color: rgb(207, 223, 241); |
| | | line-height: 35px; |
| | | } |
| | | tr:nth-child(odd+1) { |
| | | background-color: rgb(207, 223, 241); /* 设置奇数行颜色 */ |
| | | } |
| | | tr:nth-child(even) { |
| | | background-color: rgb(233, 239, 248); /* 设置偶数行颜色 */ |
| | | } |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <view> |
| | | <!-- 自定义导航栏 --> |
| | | <view class="navBarBox fix"> |
| | | <!-- 状态栏占位 --> |
| | | <view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view> |
| | | <!-- 真正的导航栏内容 --> |
| | | <view class="navBar"> |
| | | <u-icon name="arrow-left" color="black" size="17" @click="goBack" /> |
| | | <view class="barText">响应措施反馈</view> |
| | | </view> |
| | | </view> |
| | | <view class="measureCard"> |
| | | <view class="head"> |
| | | <u-form :model="form" ref="uForm" label-width="100px"> |
| | | <u-form-item label="信息标题 :" ></u-form-item> |
| | | <u-form-item label="发布单位 :"></u-form-item> |
| | | <u-form-item label="发布时间 :"></u-form-item> |
| | | <u-form-item label="反馈时间 :"></u-form-item> |
| | | </u-form> |
| | | </view> |
| | | <view class="first"> |
| | | <text style="font-size: 16px;margin-bottom: 20px;font-weight: 600;">基础措施</text> |
| | | <view v-for="(item, index) in measureList" :key="index" style="margin-left: 18px;margin-bottom:10px; font-size:16px;"> |
| | | <text style="margin-top: 15px;">{{item.name}}</text> |
| | | </view> |
| | | </view> |
| | | <view class="second"> |
| | | <text style="font-size: 16px;margin-bottom: 20px;font-weight: 600;">补充措施</text> |
| | | <u--textarea style="margin-top: -5px;" v-model="measures" disabled="true" placeholder="请输入内容" ></u--textarea> |
| | | </view> |
| | | <view class="third"> |
| | | <view v-for="(item, index) in images" :key="index"> |
| | | <u-image @click="previewSqs(item,index)" style="margin: 5px; 5px" width="230rpx" height="230rpx" :src="item.url"></u-image> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | components:{ |
| | | |
| | | }, |
| | | data() { |
| | | return { |
| | | statusBarHeight: [], |
| | | fileList1: [], |
| | | nameList: [], |
| | | checkboxValue1: '', |
| | | measures: "111", |
| | | type: 'textarea', |
| | | border: true, |
| | | height: 100, |
| | | autoHeight: true, |
| | | measureList: [ |
| | | { |
| | | name: '苹果', |
| | | }, |
| | | { |
| | | name: '香蕉', |
| | | }, |
| | | { |
| | | name: '橙子', |
| | | } |
| | | ], |
| | | images: [ |
| | | { |
| | | url: 'https://img2.baidu.com/it/u=638285213,1746517464&fm=253&fmt=auto&app=120&f=JPEG?w=1422&h=800' |
| | | }, |
| | | |
| | | ] |
| | | } |
| | | }, |
| | | onLoad() { |
| | | //获取手机状态栏高度 |
| | | this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight']; |
| | | uni.hideTabBar(); |
| | | }, |
| | | methods: { |
| | | goBack() { |
| | | uni.navigateBack({ |
| | | url:'/pages/tabBar/responsivity/villageResponsivity' |
| | | }); |
| | | }, |
| | | |
| | | checkboxChange(n) { |
| | | console.log('change', n); |
| | | }, |
| | | // 删除图片 |
| | | deletePic(event) { |
| | | this[`fileList${event.name}`].splice(event.index, 1) |
| | | this.nameList.splice(event.index,1) |
| | | console.log("name",this.nameList) |
| | | }, |
| | | // 新增图片 |
| | | async afterRead(event) { |
| | | // 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式 |
| | | let lists = [].concat(event.file) |
| | | let fileListLen = this[`fileList${event.name}`].length |
| | | console.log("list",lists) |
| | | lists.map((item) => { |
| | | this.nameList.push({name: item.name}); |
| | | this[`fileList${event.name}`].push({ |
| | | ...item, |
| | | status: 'uploading', |
| | | message: '上传中' |
| | | }) |
| | | }) |
| | | console.log("nameList",this.nameList) |
| | | for (let i = 0; i < lists.length; i++) { |
| | | const result = await this.uploadFilePromise(lists[i].url) |
| | | let item = this[`fileList${event.name}`][fileListLen] |
| | | this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, { |
| | | status: 'success', |
| | | message: '', |
| | | url: result |
| | | })) |
| | | fileListLen++ |
| | | } |
| | | }, |
| | | uploadFilePromise(url) { |
| | | return new Promise((resolve, reject) => { |
| | | let a = uni.uploadFile({ |
| | | url: 'http://www.example.com', // 仅为示例,非真实的接口地址 |
| | | filePath: url, |
| | | name: 'file', |
| | | formData: { |
| | | user: 'test' |
| | | }, |
| | | success: (res) => { |
| | | setTimeout(() => { |
| | | resolve(res.data.data) |
| | | }, 1000) |
| | | } |
| | | }); |
| | | }) |
| | | }, |
| | | //预览图片 |
| | | previewSqs(item,index) { |
| | | let imgs = []; |
| | | for (let i = 0; i < this.images.length; i++) { |
| | | imgs.push(this.images[i].url) |
| | | } |
| | | console.log("预览",imgs) |
| | | uni.previewImage({ |
| | | urls: imgs, |
| | | current: index, |
| | | indicator: 'number', |
| | | loop: true |
| | | }) |
| | | }, |
| | | } |
| | | } |
| | | |
| | | </script> |
| | | |
| | | <style lang='scss' scoped> |
| | | .navBarBox .navBar { |
| | | background-color:#fff; |
| | | height: 50px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | } |
| | | .barText{ |
| | | /* margin-left: 20px; */ |
| | | text-align: center; |
| | | width: 85%; |
| | | font-size: 16px; |
| | | /* text-align: center; */ |
| | | font-weight: 600; |
| | | } |
| | | |
| | | .measureCard{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | background: #fff; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | margin: 12px 12px 20px; |
| | | border-radius: 5px; |
| | | padding: 30px 12px; |
| | | } |
| | | .fix{ |
| | | position: sticky; |
| | | top: 0; |
| | | left: 0; |
| | | right: 0; |
| | | width: 100%; |
| | | z-index: 1; |
| | | } |
| | | .statusBar{ |
| | | background-color:lightgrey; |
| | | } |
| | | .first{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | } |
| | | .second{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | margin-top: 50px; |
| | | } |
| | | .third{ |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | margin-top: 30px; |
| | | margin-bottom: 50px; |
| | | } |
| | | /deep/ .u-upload__button{ |
| | | background-color: white; |
| | | } |
| | | .pic{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | background-color: rgb(242,242,242); |
| | | margin-top: 5px; |
| | | font-size: 14px; |
| | | } |
| | | |
| | | .measures{ |
| | | margin-top: 50px 12px 0; |
| | | padding: 0 12px; |
| | | |
| | | .measureBtn{ |
| | | border-radius: 5px; |
| | | box-shadow: 0 3px 12px rgba(33,239,102,0.4); |
| | | } |
| | | } |
| | | .head{ |
| | | margin-top: -20px; |
| | | margin-bottom: 20px; |
| | | line-height: 15px; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <view class="box"> |
| | | <!-- 自定义导航栏 --> |
| | | <view class="navBarBox fix"> |
| | | <!-- 状态栏占位 --> |
| | | <view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view> |
| | | <!-- 真正的导航栏内容 --> |
| | | <view style="display: flex; flex-direction: column;"> |
| | | <view class="navBar"> |
| | | <u-icon style=" margin-left: -25px;" name="arrow-left" color="black" size="17" @click="goBack" /> |
| | | <view class="barText">叫应率统计</view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | <view class="responseCard"> |
| | | <table class="table"> |
| | | <thead class="head"> |
| | | <tr> |
| | | <th></th> |
| | | <th>叫应情况</th> |
| | | <th>叫应时间</th> |
| | | <th>反馈</th> |
| | | </tr> |
| | | </thead> |
| | | <tbody class="tableBody"> |
| | | <tr v-for="(item, index) in tableData" :key="index" > |
| | | <td align="center" width="90px">{{ item.unit }}</td> |
| | | <td align="center">{{ item.response }}</td> |
| | | <td align="center" width="90px">{{ item.responseTime }}</td> |
| | | <td><u-button |
| | | size="mini" |
| | | style="color:blue" |
| | | type="text" |
| | | @click="review(item)" |
| | | >查看 |
| | | </u-button> |
| | | </td> |
| | | </tr> |
| | | </tbody> |
| | | </table> |
| | | </view> |
| | | </view> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | data() { |
| | | return { |
| | | page: 'pages/tabBar/count/count', |
| | | statusBarHeight: '', |
| | | tableData: [ |
| | | { |
| | | unit:'萨依布依街道', |
| | | response: '1', |
| | | responseTime: '6.19 13:00' |
| | | }, |
| | | { |
| | | unit:'伊犁州', |
| | | response: '1', |
| | | responseTime: '6.19 13:00' |
| | | }, |
| | | { |
| | | unit:'伊犁州', |
| | | response: '1', |
| | | responseTime: '6.19 13:00' |
| | | }, |
| | | { |
| | | unit:'伊犁州', |
| | | response: '1', |
| | | responseTime: '6.19 13:00' |
| | | } |
| | | ] |
| | | } |
| | | |
| | | }, |
| | | onLoad() { |
| | | //获取手机状态栏高度 |
| | | this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight']; |
| | | uni.hideTabBar(); |
| | | }, |
| | | methods: { |
| | | goBack() { |
| | | console.log("1111") |
| | | uni.switchTab({ |
| | | url:'/pages/tabBar/current/current' |
| | | }); |
| | | }, |
| | | review(item){ |
| | | uni.navigateTo({ |
| | | url:'/pages/tabBar/responsivity/showMeasures' |
| | | }); |
| | | } |
| | | } |
| | | } |
| | | |
| | | </script> |
| | | |
| | | <style lang='scss' scoped> |
| | | .box { |
| | | display: flex; |
| | | flex-direction: column; |
| | | width: 100%; |
| | | height: 100%; |
| | | } |
| | | .fix{ |
| | | position: sticky; |
| | | top: 0; |
| | | left: 0; |
| | | right: 0; |
| | | width: 100%; |
| | | z-index: 1; |
| | | } |
| | | .navBarBox .navBar { |
| | | background-color:#fff; |
| | | height: 50px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | } |
| | | .barText{ |
| | | text-align: center; |
| | | width: 85%; |
| | | font-size: 16px; |
| | | /* text-align: center; */ |
| | | font-weight: 600; |
| | | } |
| | | .statusBar{ |
| | | background-color:lightgrey; |
| | | } |
| | | .responseCard{ |
| | | display: flex; |
| | | flex-direction: column; |
| | | background: #fff; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | margin: 12px 12px 20px; |
| | | border-radius: 5px; |
| | | padding: 30px 12px; |
| | | } |
| | | .table{ |
| | | .head{ |
| | | color: white; |
| | | line-height: 35px; |
| | | background-color: rgb(66, 157, 218); |
| | | } |
| | | .tableBody{ |
| | | color: black; |
| | | background-color: rgb(207, 223, 241); |
| | | line-height: 35px; |
| | | } |
| | | tr:nth-child(odd+1) { |
| | | background-color: rgb(207, 223, 241); /* 设置奇数行颜色 */ |
| | | } |
| | | tr:nth-child(even) { |
| | | background-color: rgb(233, 239, 248); /* 设置偶数行颜色 */ |
| | | } |
| | | } |
| | | </style> |
| | |
| | | z-index: 1; |
| | | } |
| | | .navBarBox .navBar { |
| | | background-color:lightgrey; |
| | | height: 45px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | background-color:#fff; |
| | | height: 50px; |
| | | display: flex; |
| | | flex-direction: row; |
| | | justify-content: center; |
| | | align-items: center; |
| | | box-shadow: 0 3px 12px rgba(0,0,0,0.05); |
| | | |
| | | } |
| | | .barText{ |
| | | text-align: center; |