init(): 初始化
commit
ea82eb0296
|
|
@ -0,0 +1,26 @@
|
||||||
|
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||||
|
|
||||||
|
# dependencies
|
||||||
|
node_modules/
|
||||||
|
/.pnp
|
||||||
|
.pnp.js
|
||||||
|
unpackage/
|
||||||
|
|
||||||
|
# testing
|
||||||
|
/coverage
|
||||||
|
|
||||||
|
# production
|
||||||
|
/build
|
||||||
|
|
||||||
|
# misc
|
||||||
|
.DS_Store
|
||||||
|
.env.local
|
||||||
|
.env.development.local
|
||||||
|
.env.test.local
|
||||||
|
.env.production.local
|
||||||
|
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
yarn.lock
|
||||||
|
build.7z
|
||||||
|
|
@ -0,0 +1,23 @@
|
||||||
|
{
|
||||||
|
// launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
|
||||||
|
// launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
|
||||||
|
"version" : "0.0",
|
||||||
|
"configurations" : [
|
||||||
|
{
|
||||||
|
"app-plus" : {
|
||||||
|
"launchtype" : "local"
|
||||||
|
},
|
||||||
|
"default" : {
|
||||||
|
"launchtype" : "local"
|
||||||
|
},
|
||||||
|
"mp-weixin" : {
|
||||||
|
"launchtype" : "local"
|
||||||
|
},
|
||||||
|
"type" : "uniCloud"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"playground" : "standard",
|
||||||
|
"type" : "uni-app:app-android"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
{
|
||||||
|
"editor.formatOnSave": true,
|
||||||
|
"editor.formatOnPaste": true
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,117 @@
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
onLaunch: function() {
|
||||||
|
const token = {
|
||||||
|
loginName: uni.getStorageSync('loginName'),
|
||||||
|
secretKey: uni.getStorageSync('secretKey'),
|
||||||
|
}
|
||||||
|
if (token.secretKey){
|
||||||
|
uni.reLaunch({
|
||||||
|
url: '/pages/homeIndex/index'
|
||||||
|
})
|
||||||
|
console.log(token.secretKey,'App Launch')
|
||||||
|
} else {
|
||||||
|
uni.reLaunch({
|
||||||
|
url: '/pages/login/login'
|
||||||
|
// url:'/pages/zhjs/index'
|
||||||
|
})
|
||||||
|
console.log(token.secretKey,'App Launch2')
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
onShow: function() {
|
||||||
|
console.log('App Show')
|
||||||
|
},
|
||||||
|
onHide: function() {
|
||||||
|
console.log('App Hide')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
/*每个页面公共css */
|
||||||
|
@import '@/uni_modules/uni-scss/index.scss';
|
||||||
|
@import "@/uni_modules/uview-ui/index.scss";
|
||||||
|
/* #ifndef APP-NVUE */
|
||||||
|
@import '@/static/customicons.css';
|
||||||
|
@import 'ol/ol.css';
|
||||||
|
// 设置整个项目的背景色
|
||||||
|
page {
|
||||||
|
// background: linear-gradient(-180deg, #64acf0 0%, #ffffff 62%,#EEF3F6 70%);
|
||||||
|
}
|
||||||
|
|
||||||
|
/* #endif */
|
||||||
|
.example-info {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #333;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
.userinfo{
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
margin-top: 5vh;
|
||||||
|
margin-left: 2vw;
|
||||||
|
margin-bottom: 2vh;
|
||||||
|
align-items: center;
|
||||||
|
width: 95%;
|
||||||
|
height: 6vh;
|
||||||
|
background-color: #007afd;
|
||||||
|
|
||||||
|
}
|
||||||
|
.icon{
|
||||||
|
width: 6vw;
|
||||||
|
height: 6vh;
|
||||||
|
align-items: center;
|
||||||
|
line-height: 6vh;
|
||||||
|
}
|
||||||
|
.Header{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex: 0.95;
|
||||||
|
justify-content: center;
|
||||||
|
color: white;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
.align-center{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.align-justufy-center{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;;
|
||||||
|
}
|
||||||
|
.justify-center{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.justify-between{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.time-ranger {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
|
||||||
|
.start-time,
|
||||||
|
.end-time {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 10px 0;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search-btn {
|
||||||
|
margin: 3px 0 0 5px;
|
||||||
|
// color: #3399ef;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// .amap-logo {
|
||||||
|
// display: none !important;
|
||||||
|
// }
|
||||||
|
// .amap-copyright {
|
||||||
|
// display: none !important;
|
||||||
|
// }
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,97 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
|
||||||
|
<u--form labelPosition="left" :model="model1" :rules="rules" ref="uForm">
|
||||||
|
<u-form-item label="姓名" prop="userInfo.name" borderBottom ref="item1">
|
||||||
|
<u--input v-model="model1.userInfo.name" border="none"></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="性别" prop="userInfo.sex" borderBottom @click="showSex = true; hideKeyboard()"
|
||||||
|
ref="item1">
|
||||||
|
<u--input v-model="model1.userInfo.sex" disabled disabledColor="#ffffff" placeholder="请选择性别"
|
||||||
|
border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="内容" prop="userInfo.sex" borderBottom @click="showSex = true; hideKeyboard()"
|
||||||
|
ref="item1">
|
||||||
|
<u--textarea v-model="model1.userInfo.namevalue1" placeholder="请输入内容"></u--textarea>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="内容" prop="userInfo.sex" borderBottom @click="showSex = true; hideKeyboard()"
|
||||||
|
ref="item1">
|
||||||
|
<u-upload :fileList="fileList" @afterRead="afterRead" @delete="deletePic" name="1" multiple
|
||||||
|
:maxCount="10"></u-upload>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="内容" prop="userInfo.sex" borderBottom @click="showSex = true; hideKeyboard()"
|
||||||
|
ref="item1">
|
||||||
|
<u-upload :fileList="fileList" @afterRead="afterRead" @delete="deletePic" name="1" multiple
|
||||||
|
:maxCount="10"></u-upload>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
</u--form>
|
||||||
|
<u-action-sheet :show="showSex" :actions="actions" title="请选择性别" description="如果选择保密会报错"
|
||||||
|
@close="showSex = false" @select="sexSelect">
|
||||||
|
</u-action-sheet>
|
||||||
|
<button @click="submit">11</button>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
showSex: false,
|
||||||
|
model1: {
|
||||||
|
userInfo: {
|
||||||
|
name: 'uView UI',
|
||||||
|
sex: '',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
actions: [{
|
||||||
|
name: '男',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '女',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '保密',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
rules: {
|
||||||
|
'userInfo.name': {
|
||||||
|
type: 'string',
|
||||||
|
required: true,
|
||||||
|
message: '请填写姓名',
|
||||||
|
trigger: ['blur', 'change']
|
||||||
|
},
|
||||||
|
'userInfo.sex': {
|
||||||
|
type: 'string',
|
||||||
|
max: 1,
|
||||||
|
required: true,
|
||||||
|
message: '请选择男或女',
|
||||||
|
trigger: ['blur', 'change']
|
||||||
|
},
|
||||||
|
},
|
||||||
|
radio: '',
|
||||||
|
switchVal: false
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
sexSelect(e) {
|
||||||
|
this.model1.userInfo.sex = e.name
|
||||||
|
this.$refs.uForm.validateField('userInfo.sex')
|
||||||
|
},
|
||||||
|
submit() {
|
||||||
|
this.$refs.uForm.validate().then(res => {
|
||||||
|
uni.$u.toast('校验通过')
|
||||||
|
}).catch(errors => {
|
||||||
|
uni.$u.toast('校验失败')
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
|
||||||
|
this.$refs.uForm.setRules(this.rules)
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,26 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
|
||||||
|
<script>
|
||||||
|
var coverSupport =
|
||||||
|
'CSS' in window &&
|
||||||
|
typeof CSS.supports === 'function' &&
|
||||||
|
(CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
|
||||||
|
document.write(
|
||||||
|
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
|
||||||
|
(coverSupport ? ', viewport-fit=cover' : '') +
|
||||||
|
'" />'
|
||||||
|
)
|
||||||
|
</script>
|
||||||
|
<title></title>
|
||||||
|
<!--preload-links-->
|
||||||
|
<!--app-context-->
|
||||||
|
<script src="./static/h5Player/h5player.min.js"></script>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app"><!--app-html--></div>
|
||||||
|
<script type="module" src="/main.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,56 @@
|
||||||
|
// #ifndef VUE3
|
||||||
|
import Vue from 'vue'
|
||||||
|
import uView from '@/uni_modules/uview-ui'
|
||||||
|
Vue.use(uView)
|
||||||
|
import App from './App'
|
||||||
|
import {
|
||||||
|
$http
|
||||||
|
} from '@escook/request-miniprogram'
|
||||||
|
Vue.config.productionTip = false
|
||||||
|
uni.$http = $http
|
||||||
|
$http.baseUrl = 'http://local.gunshiiot.com:18083'
|
||||||
|
// 请求拦截器
|
||||||
|
$http.beforeRequest = function (options) {
|
||||||
|
if (options.url.indexOf('/doLogin') == -1) {
|
||||||
|
options.header = {
|
||||||
|
'Authorization': 'Bearer ' + uni.getStorageSync('Gs-Token')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 响应拦截器
|
||||||
|
$http.afterRequest = function (options) {
|
||||||
|
if (options.data.code == 405) {
|
||||||
|
uni.redirectTo({
|
||||||
|
url: '/pages/login/login'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// uni.hideLoading()
|
||||||
|
}
|
||||||
|
uni.$showMsg = function (title = '数据请求失败了', duration = 1500) {
|
||||||
|
return uni.showToast({
|
||||||
|
title,
|
||||||
|
duration,
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
Vue.config.productionTip = false
|
||||||
|
App.mpType = 'app'
|
||||||
|
|
||||||
|
const app = new Vue({
|
||||||
|
...App
|
||||||
|
})
|
||||||
|
app.$mount()
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// #ifdef VUE3
|
||||||
|
import {
|
||||||
|
createSSRApp
|
||||||
|
} from 'vue'
|
||||||
|
import App from './App.vue'
|
||||||
|
export function createApp() {
|
||||||
|
const app = createSSRApp(App)
|
||||||
|
return {
|
||||||
|
app
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// #endif
|
||||||
|
|
@ -0,0 +1,127 @@
|
||||||
|
{
|
||||||
|
"name" : "檀树岗水库",
|
||||||
|
"appid" : "__UNI__33ED56F",
|
||||||
|
"description" : "",
|
||||||
|
"versionName" : "1.0.0",
|
||||||
|
"versionCode" : 1,
|
||||||
|
"transformPx" : false,
|
||||||
|
"app-plus" : {
|
||||||
|
/* 5+App特有相关 */
|
||||||
|
"usingComponents" : true,
|
||||||
|
"nvueCompiler" : "uni-app",
|
||||||
|
"nvueStyleCompiler" : "uni-app",
|
||||||
|
"runmode" : "liberate",
|
||||||
|
"splashscreen" : {
|
||||||
|
"alwaysShowBeforeRender" : true,
|
||||||
|
"waiting" : true,
|
||||||
|
"autoclose" : true,
|
||||||
|
"delay" : 0
|
||||||
|
},
|
||||||
|
"modules" : {
|
||||||
|
"VideoPlayer" : {},
|
||||||
|
"Messaging" : {},
|
||||||
|
"Camera" : {},
|
||||||
|
"Maps" : {},
|
||||||
|
"Contacts" : {}
|
||||||
|
},
|
||||||
|
/* 模块配置 */
|
||||||
|
"distribute" : {
|
||||||
|
/* 应用发布信息 */
|
||||||
|
"android" : {
|
||||||
|
/* android打包配置 */
|
||||||
|
"packagename" : "com.gunshi.tsg",
|
||||||
|
"permissions" : [
|
||||||
|
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||||
|
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||||
|
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>",
|
||||||
|
"<uses-permission android:name=\"android.permission.CALL_PHONE\"/>"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"ios" : {
|
||||||
|
"dSYMs" : false
|
||||||
|
},
|
||||||
|
/* ios打包配置 */
|
||||||
|
"sdkConfigs" : {
|
||||||
|
"ad" : {},
|
||||||
|
"maps" : {
|
||||||
|
"amap" : {
|
||||||
|
"name" : "4799ff37874e604a22b910b44ca948e5",
|
||||||
|
"appkey_ios" : "755dafdf984df7a1609fb30f6861bd17",
|
||||||
|
"appkey_android" : "755dafdf984df7a1609fb30f6861bd17"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"splashscreen" : {
|
||||||
|
"androidStyle" : "common"
|
||||||
|
},
|
||||||
|
"icons" : {
|
||||||
|
"android" : {
|
||||||
|
"hdpi" : "unpackage/res/icons/72x72.png",
|
||||||
|
"xhdpi" : "unpackage/res/icons/96x96.png",
|
||||||
|
"xxhdpi" : "unpackage/res/icons/144x144.png",
|
||||||
|
"xxxhdpi" : "unpackage/res/icons/192x192.png"
|
||||||
|
},
|
||||||
|
"ios" : {
|
||||||
|
"appstore" : "unpackage/res/icons/1024x1024.png",
|
||||||
|
"ipad" : {
|
||||||
|
"app" : "unpackage/res/icons/76x76.png",
|
||||||
|
"app@2x" : "unpackage/res/icons/152x152.png",
|
||||||
|
"notification" : "unpackage/res/icons/20x20.png",
|
||||||
|
"notification@2x" : "unpackage/res/icons/40x40.png",
|
||||||
|
"proapp@2x" : "unpackage/res/icons/167x167.png",
|
||||||
|
"settings" : "unpackage/res/icons/29x29.png",
|
||||||
|
"settings@2x" : "unpackage/res/icons/58x58.png",
|
||||||
|
"spotlight" : "unpackage/res/icons/40x40.png",
|
||||||
|
"spotlight@2x" : "unpackage/res/icons/80x80.png"
|
||||||
|
},
|
||||||
|
"iphone" : {
|
||||||
|
"app@2x" : "unpackage/res/icons/120x120.png",
|
||||||
|
"app@3x" : "unpackage/res/icons/180x180.png",
|
||||||
|
"notification@2x" : "unpackage/res/icons/40x40.png",
|
||||||
|
"notification@3x" : "unpackage/res/icons/60x60.png",
|
||||||
|
"settings@2x" : "unpackage/res/icons/58x58.png",
|
||||||
|
"settings@3x" : "unpackage/res/icons/87x87.png",
|
||||||
|
"spotlight@2x" : "unpackage/res/icons/80x80.png",
|
||||||
|
"spotlight@3x" : "unpackage/res/icons/120x120.png"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/* SDK配置 */
|
||||||
|
"quickapp" : {},
|
||||||
|
/* 快应用特有相关 */
|
||||||
|
"mp-weixin" : {
|
||||||
|
/* 小程序特有相关 */
|
||||||
|
"appid" : "",
|
||||||
|
"setting" : {
|
||||||
|
"urlCheck" : false
|
||||||
|
},
|
||||||
|
"usingComponents" : true
|
||||||
|
},
|
||||||
|
"vueVersion" : "2",
|
||||||
|
"h5" : {
|
||||||
|
"template" : "template.html",
|
||||||
|
"sdkConfigs" : {
|
||||||
|
"maps" : {
|
||||||
|
"amap" : {
|
||||||
|
"key" : "4799ff37874e604a22b910b44ca948e5",
|
||||||
|
"securityJsCode" : "",
|
||||||
|
"serviceHost" : ""
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,428 @@
|
||||||
|
{
|
||||||
|
"name": "tsg-app",
|
||||||
|
"version": "1.0.1",
|
||||||
|
"lockfileVersion": 2,
|
||||||
|
"requires": true,
|
||||||
|
"packages": {
|
||||||
|
"": {
|
||||||
|
"dependencies": {
|
||||||
|
"@amap/amap-jsapi-loader": "^1.0.1",
|
||||||
|
"@escook/request-miniprogram": "^0.2.1",
|
||||||
|
"crypto-js": "^4.2.0",
|
||||||
|
"echarts": "^4.9.0",
|
||||||
|
"es6-promise": "^4.2.8",
|
||||||
|
"flv.js": "^1.6.2",
|
||||||
|
"moment": "^2.30.1",
|
||||||
|
"ol": "^10.2.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/@amap/amap-jsapi-loader": {
|
||||||
|
"version": "1.0.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@amap/amap-jsapi-loader/-/amap-jsapi-loader-1.0.1.tgz",
|
||||||
|
"integrity": "sha512-nPyLKt7Ow/ThHLkSvn2etQlUzqxmTVgK7bIgwdBRTg2HK5668oN7xVxkaiRe3YZEzGzfV2XgH5Jmu2T73ljejw=="
|
||||||
|
},
|
||||||
|
"node_modules/@escook/request-miniprogram": {
|
||||||
|
"version": "0.2.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@escook/request-miniprogram/-/request-miniprogram-0.2.1.tgz",
|
||||||
|
"integrity": "sha512-ueWV5YsaEm/ycQZuEjMiA88GFMhfBQSjy9GrP9omy4xAQajkGTbYIlnhzsDfWzRPmRC1fKmAiKMrCVcgS+SHcQ=="
|
||||||
|
},
|
||||||
|
"node_modules/@petamoriken/float16": {
|
||||||
|
"version": "3.8.7",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@petamoriken/float16/-/float16-3.8.7.tgz",
|
||||||
|
"integrity": "sha512-/Ri4xDDpe12NT6Ex/DRgHzLlobiQXEW/hmG08w1wj/YU7hLemk97c+zHQFp0iZQ9r7YqgLEXZR2sls4HxBf9NA=="
|
||||||
|
},
|
||||||
|
"node_modules/@types/rbush": {
|
||||||
|
"version": "3.0.3",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@types/rbush/-/rbush-3.0.3.tgz",
|
||||||
|
"integrity": "sha512-lX55lR0iYCgapxD3IrgujpQA1zDxwZI5qMRelKvmKAsSMplFVr7wmMpG7/6+Op2tjrgEex8o3vjg8CRDrRNYxg=="
|
||||||
|
},
|
||||||
|
"node_modules/color-name": {
|
||||||
|
"version": "2.0.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/color-name/-/color-name-2.0.0.tgz",
|
||||||
|
"integrity": "sha512-SbtvAMWvASO5TE2QP07jHBMXKafgdZz8Vrsrn96fiL+O92/FN/PLARzUW5sKt013fjAprK2d2iCn2hk2Xb5oow==",
|
||||||
|
"engines": {
|
||||||
|
"node": ">=12.20"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/color-parse": {
|
||||||
|
"version": "2.0.2",
|
||||||
|
"resolved": "https://registry.npmmirror.com/color-parse/-/color-parse-2.0.2.tgz",
|
||||||
|
"integrity": "sha512-eCtOz5w5ttWIUcaKLiktF+DxZO1R9KLNY/xhbV6CkhM7sR3GhVghmt6X6yOnzeaM24po+Z9/S1apbXMwA3Iepw==",
|
||||||
|
"dependencies": {
|
||||||
|
"color-name": "^2.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/color-rgba": {
|
||||||
|
"version": "3.0.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/color-rgba/-/color-rgba-3.0.0.tgz",
|
||||||
|
"integrity": "sha512-PPwZYkEY3M2THEHHV6Y95sGUie77S7X8v+h1r6LSAPF3/LL2xJ8duUXSrkic31Nzc4odPwHgUbiX/XuTYzQHQg==",
|
||||||
|
"dependencies": {
|
||||||
|
"color-parse": "^2.0.0",
|
||||||
|
"color-space": "^2.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/color-space": {
|
||||||
|
"version": "2.0.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/color-space/-/color-space-2.0.1.tgz",
|
||||||
|
"integrity": "sha512-nKqUYlo0vZATVOFHY810BSYjmCARrG7e5R3UE3CQlyjJTvv5kSSmPG1kzm/oDyyqjehM+lW1RnEt9It9GNa5JA=="
|
||||||
|
},
|
||||||
|
"node_modules/crypto-js": {
|
||||||
|
"version": "4.2.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/crypto-js/-/crypto-js-4.2.0.tgz",
|
||||||
|
"integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q=="
|
||||||
|
},
|
||||||
|
"node_modules/earcut": {
|
||||||
|
"version": "3.0.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/earcut/-/earcut-3.0.0.tgz",
|
||||||
|
"integrity": "sha512-41Fs7Q/PLq1SDbqjsgcY7GA42T0jvaCNGXgGtsNdvg+Yv8eIu06bxv4/PoREkZ9nMDNwnUSG9OFB9+yv8eKhDg=="
|
||||||
|
},
|
||||||
|
"node_modules/echarts": {
|
||||||
|
"version": "4.9.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/echarts/-/echarts-4.9.0.tgz",
|
||||||
|
"integrity": "sha512-+ugizgtJ+KmsJyyDPxaw2Br5FqzuBnyOWwcxPKO6y0gc5caYcfnEUIlNStx02necw8jmKmTafmpHhGo4XDtEIA==",
|
||||||
|
"dependencies": {
|
||||||
|
"zrender": "4.3.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/es6-promise": {
|
||||||
|
"version": "4.2.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.8.tgz",
|
||||||
|
"integrity": "sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w=="
|
||||||
|
},
|
||||||
|
"node_modules/flv.js": {
|
||||||
|
"version": "1.6.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/flv.js/-/flv.js-1.6.2.tgz",
|
||||||
|
"integrity": "sha512-xre4gUbX1MPtgQRKj2pxJENp/RnaHaxYvy3YToVVCrSmAWUu85b9mug6pTXF6zakUjNP2lFWZ1rkSX7gxhB/2A==",
|
||||||
|
"dependencies": {
|
||||||
|
"es6-promise": "^4.2.8",
|
||||||
|
"webworkify-webpack": "^2.1.5"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/geotiff": {
|
||||||
|
"version": "2.1.3",
|
||||||
|
"resolved": "https://registry.npmmirror.com/geotiff/-/geotiff-2.1.3.tgz",
|
||||||
|
"integrity": "sha512-PT6uoF5a1+kbC3tHmZSUsLHBp2QJlHasxxxxPW47QIY1VBKpFB+FcDvX+MxER6UzgLQZ0xDzJ9s48B9JbOCTqA==",
|
||||||
|
"dependencies": {
|
||||||
|
"@petamoriken/float16": "^3.4.7",
|
||||||
|
"lerc": "^3.0.0",
|
||||||
|
"pako": "^2.0.4",
|
||||||
|
"parse-headers": "^2.0.2",
|
||||||
|
"quick-lru": "^6.1.1",
|
||||||
|
"web-worker": "^1.2.0",
|
||||||
|
"xml-utils": "^1.0.2",
|
||||||
|
"zstddec": "^0.1.0"
|
||||||
|
},
|
||||||
|
"engines": {
|
||||||
|
"node": ">=10.19"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/lerc": {
|
||||||
|
"version": "3.0.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/lerc/-/lerc-3.0.0.tgz",
|
||||||
|
"integrity": "sha512-Rm4J/WaHhRa93nCN2mwWDZFoRVF18G1f47C+kvQWyHGEZxFpTUi73p7lMVSAndyxGt6lJ2/CFbOcf9ra5p8aww=="
|
||||||
|
},
|
||||||
|
"node_modules/moment": {
|
||||||
|
"version": "2.30.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz",
|
||||||
|
"integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==",
|
||||||
|
"engines": {
|
||||||
|
"node": "*"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/ol": {
|
||||||
|
"version": "10.2.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/ol/-/ol-10.2.1.tgz",
|
||||||
|
"integrity": "sha512-2bB/y2vEnmzjqynP0NA7Cp8k86No3Psn63Dueicep3E3i09axWRVIG5IS/bylEAGfWQx0QXD/uljkyFoY60Wig==",
|
||||||
|
"dependencies": {
|
||||||
|
"@types/rbush": "3.0.3",
|
||||||
|
"color-rgba": "^3.0.0",
|
||||||
|
"color-space": "^2.0.1",
|
||||||
|
"earcut": "^3.0.0",
|
||||||
|
"geotiff": "^2.0.7",
|
||||||
|
"pbf": "4.0.1",
|
||||||
|
"rbush": "^4.0.0"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"type": "opencollective",
|
||||||
|
"url": "https://opencollective.com/openlayers"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/pako": {
|
||||||
|
"version": "2.1.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/pako/-/pako-2.1.0.tgz",
|
||||||
|
"integrity": "sha512-w+eufiZ1WuJYgPXbV/PO3NCMEc3xqylkKHzp8bxp1uW4qaSNQUkwmLLEc3kKsfz8lpV1F8Ht3U1Cm+9Srog2ug=="
|
||||||
|
},
|
||||||
|
"node_modules/parse-headers": {
|
||||||
|
"version": "2.0.5",
|
||||||
|
"resolved": "https://registry.npmmirror.com/parse-headers/-/parse-headers-2.0.5.tgz",
|
||||||
|
"integrity": "sha512-ft3iAoLOB/MlwbNXgzy43SWGP6sQki2jQvAyBg/zDFAgr9bfNWZIUj42Kw2eJIl8kEi4PbgE6U1Zau/HwI75HA=="
|
||||||
|
},
|
||||||
|
"node_modules/pbf": {
|
||||||
|
"version": "4.0.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/pbf/-/pbf-4.0.1.tgz",
|
||||||
|
"integrity": "sha512-SuLdBvS42z33m8ejRbInMapQe8n0D3vN/Xd5fmWM3tufNgRQFBpaW2YVJxQZV4iPNqb0vEFvssMEo5w9c6BTIA==",
|
||||||
|
"dependencies": {
|
||||||
|
"resolve-protobuf-schema": "^2.1.0"
|
||||||
|
},
|
||||||
|
"bin": {
|
||||||
|
"pbf": "bin/pbf"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/protocol-buffers-schema": {
|
||||||
|
"version": "3.6.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/protocol-buffers-schema/-/protocol-buffers-schema-3.6.0.tgz",
|
||||||
|
"integrity": "sha512-TdDRD+/QNdrCGCE7v8340QyuXd4kIWIgapsE2+n/SaGiSSbomYl4TjHlvIoCWRpE7wFt02EpB35VVA2ImcBVqw=="
|
||||||
|
},
|
||||||
|
"node_modules/quick-lru": {
|
||||||
|
"version": "6.1.2",
|
||||||
|
"resolved": "https://registry.npmmirror.com/quick-lru/-/quick-lru-6.1.2.tgz",
|
||||||
|
"integrity": "sha512-AAFUA5O1d83pIHEhJwWCq/RQcRukCkn/NSm2QsTEMle5f2hP0ChI2+3Xb051PZCkLryI/Ir1MVKviT2FIloaTQ==",
|
||||||
|
"engines": {
|
||||||
|
"node": ">=12"
|
||||||
|
},
|
||||||
|
"funding": {
|
||||||
|
"url": "https://github.com/sponsors/sindresorhus"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/quickselect": {
|
||||||
|
"version": "3.0.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/quickselect/-/quickselect-3.0.0.tgz",
|
||||||
|
"integrity": "sha512-XdjUArbK4Bm5fLLvlm5KpTFOiOThgfWWI4axAZDWg4E/0mKdZyI9tNEfds27qCi1ze/vwTR16kvmmGhRra3c2g=="
|
||||||
|
},
|
||||||
|
"node_modules/rbush": {
|
||||||
|
"version": "4.0.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/rbush/-/rbush-4.0.1.tgz",
|
||||||
|
"integrity": "sha512-IP0UpfeWQujYC8Jg162rMNc01Rf0gWMMAb2Uxus/Q0qOFw4lCcq6ZnQEZwUoJqWyUGJ9th7JjwI4yIWo+uvoAQ==",
|
||||||
|
"dependencies": {
|
||||||
|
"quickselect": "^3.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/resolve-protobuf-schema": {
|
||||||
|
"version": "2.1.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/resolve-protobuf-schema/-/resolve-protobuf-schema-2.1.0.tgz",
|
||||||
|
"integrity": "sha512-kI5ffTiZWmJaS/huM8wZfEMer1eRd7oJQhDuxeCLe3t7N7mX3z94CN0xPxBQxFYQTSNz9T0i+v6inKqSdK8xrQ==",
|
||||||
|
"dependencies": {
|
||||||
|
"protocol-buffers-schema": "^3.3.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"node_modules/web-worker": {
|
||||||
|
"version": "1.3.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/web-worker/-/web-worker-1.3.0.tgz",
|
||||||
|
"integrity": "sha512-BSR9wyRsy/KOValMgd5kMyr3JzpdeoR9KVId8u5GVlTTAtNChlsE4yTxeY7zMdNSyOmoKBv8NH2qeRY9Tg+IaA=="
|
||||||
|
},
|
||||||
|
"node_modules/webworkify-webpack": {
|
||||||
|
"version": "2.1.5",
|
||||||
|
"resolved": "https://registry.npmjs.org/webworkify-webpack/-/webworkify-webpack-2.1.5.tgz",
|
||||||
|
"integrity": "sha512-2akF8FIyUvbiBBdD+RoHpoTbHMQF2HwjcxfDvgztAX5YwbZNyrtfUMgvfgFVsgDhDPVTlkbb5vyasqDHfIDPQw=="
|
||||||
|
},
|
||||||
|
"node_modules/xml-utils": {
|
||||||
|
"version": "1.10.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/xml-utils/-/xml-utils-1.10.1.tgz",
|
||||||
|
"integrity": "sha512-Dn6vJ1Z9v1tepSjvnCpwk5QqwIPcEFKdgnjqfYOABv1ngSofuAhtlugcUC3ehS1OHdgDWSG6C5mvj+Qm15udTQ=="
|
||||||
|
},
|
||||||
|
"node_modules/zrender": {
|
||||||
|
"version": "4.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/zrender/-/zrender-4.3.2.tgz",
|
||||||
|
"integrity": "sha512-bIusJLS8c4DkIcdiK+s13HiQ/zjQQVgpNohtd8d94Y2DnJqgM1yjh/jpDb8DoL6hd7r8Awagw8e3qK/oLaWr3g=="
|
||||||
|
},
|
||||||
|
"node_modules/zstddec": {
|
||||||
|
"version": "0.1.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/zstddec/-/zstddec-0.1.0.tgz",
|
||||||
|
"integrity": "sha512-w2NTI8+3l3eeltKAdK8QpiLo/flRAr2p8AGeakfMZOXBxOg9HIu4LVDxBi81sYgVhFhdJjv1OrB5ssI8uFPoLg=="
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@amap/amap-jsapi-loader": {
|
||||||
|
"version": "1.0.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@amap/amap-jsapi-loader/-/amap-jsapi-loader-1.0.1.tgz",
|
||||||
|
"integrity": "sha512-nPyLKt7Ow/ThHLkSvn2etQlUzqxmTVgK7bIgwdBRTg2HK5668oN7xVxkaiRe3YZEzGzfV2XgH5Jmu2T73ljejw=="
|
||||||
|
},
|
||||||
|
"@escook/request-miniprogram": {
|
||||||
|
"version": "0.2.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@escook/request-miniprogram/-/request-miniprogram-0.2.1.tgz",
|
||||||
|
"integrity": "sha512-ueWV5YsaEm/ycQZuEjMiA88GFMhfBQSjy9GrP9omy4xAQajkGTbYIlnhzsDfWzRPmRC1fKmAiKMrCVcgS+SHcQ=="
|
||||||
|
},
|
||||||
|
"@petamoriken/float16": {
|
||||||
|
"version": "3.8.7",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@petamoriken/float16/-/float16-3.8.7.tgz",
|
||||||
|
"integrity": "sha512-/Ri4xDDpe12NT6Ex/DRgHzLlobiQXEW/hmG08w1wj/YU7hLemk97c+zHQFp0iZQ9r7YqgLEXZR2sls4HxBf9NA=="
|
||||||
|
},
|
||||||
|
"@types/rbush": {
|
||||||
|
"version": "3.0.3",
|
||||||
|
"resolved": "https://registry.npmmirror.com/@types/rbush/-/rbush-3.0.3.tgz",
|
||||||
|
"integrity": "sha512-lX55lR0iYCgapxD3IrgujpQA1zDxwZI5qMRelKvmKAsSMplFVr7wmMpG7/6+Op2tjrgEex8o3vjg8CRDrRNYxg=="
|
||||||
|
},
|
||||||
|
"color-name": {
|
||||||
|
"version": "2.0.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/color-name/-/color-name-2.0.0.tgz",
|
||||||
|
"integrity": "sha512-SbtvAMWvASO5TE2QP07jHBMXKafgdZz8Vrsrn96fiL+O92/FN/PLARzUW5sKt013fjAprK2d2iCn2hk2Xb5oow=="
|
||||||
|
},
|
||||||
|
"color-parse": {
|
||||||
|
"version": "2.0.2",
|
||||||
|
"resolved": "https://registry.npmmirror.com/color-parse/-/color-parse-2.0.2.tgz",
|
||||||
|
"integrity": "sha512-eCtOz5w5ttWIUcaKLiktF+DxZO1R9KLNY/xhbV6CkhM7sR3GhVghmt6X6yOnzeaM24po+Z9/S1apbXMwA3Iepw==",
|
||||||
|
"requires": {
|
||||||
|
"color-name": "^2.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"color-rgba": {
|
||||||
|
"version": "3.0.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/color-rgba/-/color-rgba-3.0.0.tgz",
|
||||||
|
"integrity": "sha512-PPwZYkEY3M2THEHHV6Y95sGUie77S7X8v+h1r6LSAPF3/LL2xJ8duUXSrkic31Nzc4odPwHgUbiX/XuTYzQHQg==",
|
||||||
|
"requires": {
|
||||||
|
"color-parse": "^2.0.0",
|
||||||
|
"color-space": "^2.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"color-space": {
|
||||||
|
"version": "2.0.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/color-space/-/color-space-2.0.1.tgz",
|
||||||
|
"integrity": "sha512-nKqUYlo0vZATVOFHY810BSYjmCARrG7e5R3UE3CQlyjJTvv5kSSmPG1kzm/oDyyqjehM+lW1RnEt9It9GNa5JA=="
|
||||||
|
},
|
||||||
|
"crypto-js": {
|
||||||
|
"version": "4.2.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/crypto-js/-/crypto-js-4.2.0.tgz",
|
||||||
|
"integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q=="
|
||||||
|
},
|
||||||
|
"earcut": {
|
||||||
|
"version": "3.0.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/earcut/-/earcut-3.0.0.tgz",
|
||||||
|
"integrity": "sha512-41Fs7Q/PLq1SDbqjsgcY7GA42T0jvaCNGXgGtsNdvg+Yv8eIu06bxv4/PoREkZ9nMDNwnUSG9OFB9+yv8eKhDg=="
|
||||||
|
},
|
||||||
|
"echarts": {
|
||||||
|
"version": "4.9.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/echarts/-/echarts-4.9.0.tgz",
|
||||||
|
"integrity": "sha512-+ugizgtJ+KmsJyyDPxaw2Br5FqzuBnyOWwcxPKO6y0gc5caYcfnEUIlNStx02necw8jmKmTafmpHhGo4XDtEIA==",
|
||||||
|
"requires": {
|
||||||
|
"zrender": "4.3.2"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"es6-promise": {
|
||||||
|
"version": "4.2.8",
|
||||||
|
"resolved": "https://registry.npmjs.org/es6-promise/-/es6-promise-4.2.8.tgz",
|
||||||
|
"integrity": "sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w=="
|
||||||
|
},
|
||||||
|
"flv.js": {
|
||||||
|
"version": "1.6.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/flv.js/-/flv.js-1.6.2.tgz",
|
||||||
|
"integrity": "sha512-xre4gUbX1MPtgQRKj2pxJENp/RnaHaxYvy3YToVVCrSmAWUu85b9mug6pTXF6zakUjNP2lFWZ1rkSX7gxhB/2A==",
|
||||||
|
"requires": {
|
||||||
|
"es6-promise": "^4.2.8",
|
||||||
|
"webworkify-webpack": "^2.1.5"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"geotiff": {
|
||||||
|
"version": "2.1.3",
|
||||||
|
"resolved": "https://registry.npmmirror.com/geotiff/-/geotiff-2.1.3.tgz",
|
||||||
|
"integrity": "sha512-PT6uoF5a1+kbC3tHmZSUsLHBp2QJlHasxxxxPW47QIY1VBKpFB+FcDvX+MxER6UzgLQZ0xDzJ9s48B9JbOCTqA==",
|
||||||
|
"requires": {
|
||||||
|
"@petamoriken/float16": "^3.4.7",
|
||||||
|
"lerc": "^3.0.0",
|
||||||
|
"pako": "^2.0.4",
|
||||||
|
"parse-headers": "^2.0.2",
|
||||||
|
"quick-lru": "^6.1.1",
|
||||||
|
"web-worker": "^1.2.0",
|
||||||
|
"xml-utils": "^1.0.2",
|
||||||
|
"zstddec": "^0.1.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"lerc": {
|
||||||
|
"version": "3.0.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/lerc/-/lerc-3.0.0.tgz",
|
||||||
|
"integrity": "sha512-Rm4J/WaHhRa93nCN2mwWDZFoRVF18G1f47C+kvQWyHGEZxFpTUi73p7lMVSAndyxGt6lJ2/CFbOcf9ra5p8aww=="
|
||||||
|
},
|
||||||
|
"moment": {
|
||||||
|
"version": "2.30.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz",
|
||||||
|
"integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how=="
|
||||||
|
},
|
||||||
|
"ol": {
|
||||||
|
"version": "10.2.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/ol/-/ol-10.2.1.tgz",
|
||||||
|
"integrity": "sha512-2bB/y2vEnmzjqynP0NA7Cp8k86No3Psn63Dueicep3E3i09axWRVIG5IS/bylEAGfWQx0QXD/uljkyFoY60Wig==",
|
||||||
|
"requires": {
|
||||||
|
"@types/rbush": "3.0.3",
|
||||||
|
"color-rgba": "^3.0.0",
|
||||||
|
"color-space": "^2.0.1",
|
||||||
|
"earcut": "^3.0.0",
|
||||||
|
"geotiff": "^2.0.7",
|
||||||
|
"pbf": "4.0.1",
|
||||||
|
"rbush": "^4.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"pako": {
|
||||||
|
"version": "2.1.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/pako/-/pako-2.1.0.tgz",
|
||||||
|
"integrity": "sha512-w+eufiZ1WuJYgPXbV/PO3NCMEc3xqylkKHzp8bxp1uW4qaSNQUkwmLLEc3kKsfz8lpV1F8Ht3U1Cm+9Srog2ug=="
|
||||||
|
},
|
||||||
|
"parse-headers": {
|
||||||
|
"version": "2.0.5",
|
||||||
|
"resolved": "https://registry.npmmirror.com/parse-headers/-/parse-headers-2.0.5.tgz",
|
||||||
|
"integrity": "sha512-ft3iAoLOB/MlwbNXgzy43SWGP6sQki2jQvAyBg/zDFAgr9bfNWZIUj42Kw2eJIl8kEi4PbgE6U1Zau/HwI75HA=="
|
||||||
|
},
|
||||||
|
"pbf": {
|
||||||
|
"version": "4.0.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/pbf/-/pbf-4.0.1.tgz",
|
||||||
|
"integrity": "sha512-SuLdBvS42z33m8ejRbInMapQe8n0D3vN/Xd5fmWM3tufNgRQFBpaW2YVJxQZV4iPNqb0vEFvssMEo5w9c6BTIA==",
|
||||||
|
"requires": {
|
||||||
|
"resolve-protobuf-schema": "^2.1.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"protocol-buffers-schema": {
|
||||||
|
"version": "3.6.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/protocol-buffers-schema/-/protocol-buffers-schema-3.6.0.tgz",
|
||||||
|
"integrity": "sha512-TdDRD+/QNdrCGCE7v8340QyuXd4kIWIgapsE2+n/SaGiSSbomYl4TjHlvIoCWRpE7wFt02EpB35VVA2ImcBVqw=="
|
||||||
|
},
|
||||||
|
"quick-lru": {
|
||||||
|
"version": "6.1.2",
|
||||||
|
"resolved": "https://registry.npmmirror.com/quick-lru/-/quick-lru-6.1.2.tgz",
|
||||||
|
"integrity": "sha512-AAFUA5O1d83pIHEhJwWCq/RQcRukCkn/NSm2QsTEMle5f2hP0ChI2+3Xb051PZCkLryI/Ir1MVKviT2FIloaTQ=="
|
||||||
|
},
|
||||||
|
"quickselect": {
|
||||||
|
"version": "3.0.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/quickselect/-/quickselect-3.0.0.tgz",
|
||||||
|
"integrity": "sha512-XdjUArbK4Bm5fLLvlm5KpTFOiOThgfWWI4axAZDWg4E/0mKdZyI9tNEfds27qCi1ze/vwTR16kvmmGhRra3c2g=="
|
||||||
|
},
|
||||||
|
"rbush": {
|
||||||
|
"version": "4.0.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/rbush/-/rbush-4.0.1.tgz",
|
||||||
|
"integrity": "sha512-IP0UpfeWQujYC8Jg162rMNc01Rf0gWMMAb2Uxus/Q0qOFw4lCcq6ZnQEZwUoJqWyUGJ9th7JjwI4yIWo+uvoAQ==",
|
||||||
|
"requires": {
|
||||||
|
"quickselect": "^3.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"resolve-protobuf-schema": {
|
||||||
|
"version": "2.1.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/resolve-protobuf-schema/-/resolve-protobuf-schema-2.1.0.tgz",
|
||||||
|
"integrity": "sha512-kI5ffTiZWmJaS/huM8wZfEMer1eRd7oJQhDuxeCLe3t7N7mX3z94CN0xPxBQxFYQTSNz9T0i+v6inKqSdK8xrQ==",
|
||||||
|
"requires": {
|
||||||
|
"protocol-buffers-schema": "^3.3.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"web-worker": {
|
||||||
|
"version": "1.3.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/web-worker/-/web-worker-1.3.0.tgz",
|
||||||
|
"integrity": "sha512-BSR9wyRsy/KOValMgd5kMyr3JzpdeoR9KVId8u5GVlTTAtNChlsE4yTxeY7zMdNSyOmoKBv8NH2qeRY9Tg+IaA=="
|
||||||
|
},
|
||||||
|
"webworkify-webpack": {
|
||||||
|
"version": "2.1.5",
|
||||||
|
"resolved": "https://registry.npmjs.org/webworkify-webpack/-/webworkify-webpack-2.1.5.tgz",
|
||||||
|
"integrity": "sha512-2akF8FIyUvbiBBdD+RoHpoTbHMQF2HwjcxfDvgztAX5YwbZNyrtfUMgvfgFVsgDhDPVTlkbb5vyasqDHfIDPQw=="
|
||||||
|
},
|
||||||
|
"xml-utils": {
|
||||||
|
"version": "1.10.1",
|
||||||
|
"resolved": "https://registry.npmmirror.com/xml-utils/-/xml-utils-1.10.1.tgz",
|
||||||
|
"integrity": "sha512-Dn6vJ1Z9v1tepSjvnCpwk5QqwIPcEFKdgnjqfYOABv1ngSofuAhtlugcUC3ehS1OHdgDWSG6C5mvj+Qm15udTQ=="
|
||||||
|
},
|
||||||
|
"zrender": {
|
||||||
|
"version": "4.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/zrender/-/zrender-4.3.2.tgz",
|
||||||
|
"integrity": "sha512-bIusJLS8c4DkIcdiK+s13HiQ/zjQQVgpNohtd8d94Y2DnJqgM1yjh/jpDb8DoL6hd7r8Awagw8e3qK/oLaWr3g=="
|
||||||
|
},
|
||||||
|
"zstddec": {
|
||||||
|
"version": "0.1.0",
|
||||||
|
"resolved": "https://registry.npmmirror.com/zstddec/-/zstddec-0.1.0.tgz",
|
||||||
|
"integrity": "sha512-w2NTI8+3l3eeltKAdK8QpiLo/flRAr2p8AGeakfMZOXBxOg9HIu4LVDxBi81sYgVhFhdJjv1OrB5ssI8uFPoLg=="
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,12 @@
|
||||||
|
{
|
||||||
|
"dependencies": {
|
||||||
|
"@amap/amap-jsapi-loader": "^1.0.1",
|
||||||
|
"@escook/request-miniprogram": "^0.2.1",
|
||||||
|
"crypto-js": "^4.2.0",
|
||||||
|
"echarts": "^4.9.0",
|
||||||
|
"es6-promise": "^4.2.8",
|
||||||
|
"flv.js": "^1.6.2",
|
||||||
|
"moment": "^2.30.1",
|
||||||
|
"ol": "^10.2.1"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,284 @@
|
||||||
|
{
|
||||||
|
"easycom": {
|
||||||
|
"^u-(.*)": "@/uni_modules/uview-ui/components/u-$1/u-$1.vue"
|
||||||
|
},
|
||||||
|
"pages": [{
|
||||||
|
"path": "pages/login/login",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/upgrade/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"navigationStyle": "custom",
|
||||||
|
"app-plus": {
|
||||||
|
"bounce": "none",
|
||||||
|
"animationType": "none",
|
||||||
|
"background": "transparent"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
"path": "pages/xcrw/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/xcrw/detail/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/stlljk/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/spjk/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/spjk/spbf/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/aqjc/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/homeIndex/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"enablePullDownRefresh": true,
|
||||||
|
"app-plus": {
|
||||||
|
"pullToRefresh": {
|
||||||
|
"support": true,
|
||||||
|
"style": "default",
|
||||||
|
"offset": "70px"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
"path": "pages/mypage/mypage",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/zhjs/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "",
|
||||||
|
"app-plus": {
|
||||||
|
"titleNView": false,
|
||||||
|
"subNVues": [
|
||||||
|
{
|
||||||
|
"id": "drawer",
|
||||||
|
"path": "pages/zhjs/subnvue/index.nvue",
|
||||||
|
"style": {
|
||||||
|
"position": "absolute",
|
||||||
|
"width": "100%",
|
||||||
|
"height": "100%"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/sjc/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/mypage/compents/wtcl/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/mypage/compents/wxyh/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/mypage/compents/wxyh/formZdy/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/mypage/compents/xcrw/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/mypage/compents/wtcl/detail/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/mypage/compents/xcrw/detail/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/personInfo/personInfo",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/modifyPassword/modifyPassword",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
"path": "pages/wxyh/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/wtcl/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/wtcl/detail/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/yj/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/yj/detail/qxyj",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/yj/detail/wyyj",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/yj/detail/aiyj",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/messageList/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/messageList/detail/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/skInfo/detail/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/skInfo/waterDatail/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/ylzList/detail/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path": "pages/sws/detail/index",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": ""
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"usingComponents": {
|
||||||
|
"map": "/uni_modules/@dcloudio/uni-map/components/uni-map/uni-map"
|
||||||
|
},
|
||||||
|
|
||||||
|
"tabBar": {
|
||||||
|
"color": "#333333",
|
||||||
|
"selectedColor": "#59A7FF",
|
||||||
|
"list": [{
|
||||||
|
"pagePath": "pages/homeIndex/index",
|
||||||
|
"iconPath": "/static/tabs/home.png",
|
||||||
|
"selectedIconPath": "static/tabs/home2.png",
|
||||||
|
"text": "首页"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"pagePath": "pages/mypage/mypage",
|
||||||
|
"iconPath": "/static/images/my2_icon@2x.png",
|
||||||
|
"selectedIconPath": "static/images/my2_icon@2x2.png",
|
||||||
|
"text": "我的"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"globalStyle": {
|
||||||
|
"navigationBarTextStyle": "black",
|
||||||
|
"navigationBarTitleText": "uni-app",
|
||||||
|
"navigationBarBackgroundColor": "#F8F8F8",
|
||||||
|
"backgroundColor": "#F8F8F8",
|
||||||
|
"backgroundColorTop": "transparent",
|
||||||
|
"navigationStyle": "custom",
|
||||||
|
"app-plus": {
|
||||||
|
"background": "#efeff4"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"subPackages": [{
|
||||||
|
"root": "subpkg",
|
||||||
|
"pages": [{
|
||||||
|
"path": "rainDetail/rainDetail"
|
||||||
|
}]
|
||||||
|
}],
|
||||||
|
"globalStyle": {
|
||||||
|
"navigationBarTextStyle": "black",
|
||||||
|
"navigationBarTitleText": "uni-app",
|
||||||
|
"navigationBarBackgroundColor": "#F8F8F8",
|
||||||
|
"backgroundColor": "#F8F8F8",
|
||||||
|
"backgroundColorTop": "transparent",
|
||||||
|
"navigationStyle": "custom",
|
||||||
|
"app-plus": {
|
||||||
|
"background": "#efeff4"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,329 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{backgroundColor:'#f7f7f7'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<div class="titleBar">通讯录</div>
|
||||||
|
<div class="searchBar">
|
||||||
|
<u-search
|
||||||
|
placeholder="请输入姓名或手机号"
|
||||||
|
shape="square"
|
||||||
|
:showAction="false"
|
||||||
|
v-model="keyword"
|
||||||
|
@change="getSearch"
|
||||||
|
></u-search>
|
||||||
|
<div class="iconRow">
|
||||||
|
<div class="iconBox" @click="toMyDept">
|
||||||
|
<u--image :src="'../../static/images/dept.png'" width="22px" height="22px"></u--image>
|
||||||
|
<text class="icon_text">我的部门</text>
|
||||||
|
</div>
|
||||||
|
<div class="iconBox" @click="toFollow">
|
||||||
|
<u--image :src="'../../static/images/follow.png'" width="22px" height="22px"></u--image>
|
||||||
|
<text class="icon_text">关注人员</text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="mybody">
|
||||||
|
<div class="breadcrumb">
|
||||||
|
<text
|
||||||
|
v-for="(item,index) in treePath"
|
||||||
|
class="breadcrumb_item"
|
||||||
|
:style="{color:(treePath.length-1)===index?'#000000':'#3595F9'}"
|
||||||
|
@click="breadcrumbClick(item,index)"
|
||||||
|
>
|
||||||
|
{{item.name}}
|
||||||
|
<text v-if="(treePath.length-1)!==index" :style="{marginLeft:'8px',color:'#000000'}">></text>
|
||||||
|
</text>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'calc( 100vh - 280px)',overflow:'scroll'}">
|
||||||
|
<div v-if="!keyword">
|
||||||
|
<div v-for="(item,index) in treeData">
|
||||||
|
<div class="deptItem" @click="itemClick(item,index)">
|
||||||
|
<u--image :src="'../../static/images/deptItem.png'" width="22px" height="22px"></u--image>
|
||||||
|
<div class="deptItem_border">
|
||||||
|
<text class="deptItem_name">{{item.departmentName}}</text>
|
||||||
|
<text class="deptItem_num">{{item.count}}</text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-if="treeData==null || keyword">
|
||||||
|
<div :style="{display:'flex',alignItems:'center',height:'60px'}" v-for="(item,index) in personList">
|
||||||
|
<!-- <u--image :style="{margin:'0 30px'}" :src="'../../static/images/filter.png'" width="22px" height="22px"></u--image> -->
|
||||||
|
<div class="personItemIcon"><text>{{item.userName.slice(0, 1)}}</text></div>
|
||||||
|
<div class="personItemRow_right">
|
||||||
|
<div class="personItemRow_right_top">
|
||||||
|
<rich-text :style="{width:'100px'}" :nodes="highlightKeyword(item.userName, keyword)"></rich-text>
|
||||||
|
<rich-text :style="{flex:'1'}" :nodes="highlightKeyword(item.phone, keyword)"></rich-text>
|
||||||
|
</div>
|
||||||
|
<div class="personItemRow_right_bottom">
|
||||||
|
<text :style="{fontSize:'12px',color:'rgba(0, 0, 0, 0.4)'}">{{item.duty}}</text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="personItemRow_right2">
|
||||||
|
<u-icon v-if="item.isMyAttendee" name="star-fill" color="#f5dc4d" size="24" @click="follow(false,item.userId)"></u-icon>
|
||||||
|
<u-icon v-if="!item.isMyAttendee" name="star" color="#f5dc4d" size="24" @click="follow(true,item.userId)"></u-icon>
|
||||||
|
<u-icon name="phone" size="24" :style="{margin:'3px 10px 0 10px'}" @click="callNum(item.phone)"></u-icon>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
keyword:'',
|
||||||
|
show:'',
|
||||||
|
treeData:[],
|
||||||
|
treePath:[],
|
||||||
|
personList:[],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getItem() {
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
treePath(newData,oldData){
|
||||||
|
const last = this.treePath[this.treePath.length-1]
|
||||||
|
if(this.keyword){
|
||||||
|
this.getPerson({code:last.code, name:this.keyword})
|
||||||
|
}else{
|
||||||
|
if(last.data.children === null){
|
||||||
|
this.getPerson({code:last.code})
|
||||||
|
}else{
|
||||||
|
this.personList = []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
this.getSearch(this.keyword)
|
||||||
|
this.setInsert()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getHighlight(val) {
|
||||||
|
const keyword = this.keyword
|
||||||
|
if (keyword && val.indexOf(keyword) !== -1) {
|
||||||
|
const text = val.replace(keyword, `<text :style="{color:'#42cccc'}">${keyword}</text>`)
|
||||||
|
console.log(text)
|
||||||
|
return text
|
||||||
|
} else {
|
||||||
|
return val
|
||||||
|
}
|
||||||
|
},
|
||||||
|
highlightKeyword(text, keyword) {
|
||||||
|
const highlightedText = text.replace(new RegExp(keyword, 'gi'), match => {
|
||||||
|
return `<span style="color: red;">${match}</span>`;
|
||||||
|
});
|
||||||
|
return highlightedText;
|
||||||
|
},
|
||||||
|
getSearch(e) {
|
||||||
|
if(e){
|
||||||
|
const last = this.treePath[this.treePath.length-1]
|
||||||
|
this.getPerson({name:e, code:last.code})
|
||||||
|
}else{
|
||||||
|
const last = this.treePath[this.treePath.length-1]
|
||||||
|
if(last.data.children === null){
|
||||||
|
this.getPerson({code:last.code})
|
||||||
|
}else{
|
||||||
|
// this.getPerson({code:last.code,name:'不可能查到的值'})
|
||||||
|
this.personList = []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
,
|
||||||
|
async getPerson({code,name}) {
|
||||||
|
try{
|
||||||
|
let url = '/gunshiApp/xfflood/addressbook/list/query'
|
||||||
|
if(name){
|
||||||
|
//搜索名字
|
||||||
|
url = '/gunshiApp/xfflood/addressbook/list/query?args='+name+'&departmentCode='+code
|
||||||
|
}else{
|
||||||
|
//搜索code
|
||||||
|
url = '/gunshiApp/xfflood/addressbook/list/query?departmentCode='+code
|
||||||
|
}
|
||||||
|
console.log('查询的url',url)
|
||||||
|
const res = await uni.$http.get(url)
|
||||||
|
this.personList = res.data.data
|
||||||
|
console.log('查询的人员',res)
|
||||||
|
}catch(e){
|
||||||
|
this.personList = []
|
||||||
|
//TODO handle the exception
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async getData() {
|
||||||
|
try {
|
||||||
|
const res = await uni.$http.get('/gunshiApp/xfflood/department/app/tree')
|
||||||
|
this.treeData = res.data.data[0].children
|
||||||
|
this.treePath = [...this.treePath,{
|
||||||
|
name:res.data.data[0].departmentName,
|
||||||
|
code:res.data.data[0].departmentCode,
|
||||||
|
data:res.data.data[0],
|
||||||
|
}]
|
||||||
|
} catch (e) {
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async follow (flag,id) {
|
||||||
|
let url = flag?'/gunshiApp/xfflood/addressbook/attendee/add':'/gunshiApp/xfflood/addressbook/attendee/cancel'
|
||||||
|
const params = {
|
||||||
|
addUserId:id
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
const res = await uni.$http.post(url,params)
|
||||||
|
if(res.data.code === 200){
|
||||||
|
//关注成功
|
||||||
|
this.getSearch(this.keyword)
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
async setInsert () {
|
||||||
|
try {
|
||||||
|
const params = {
|
||||||
|
createId: uni.getStorageSync('value').userId,
|
||||||
|
loginType:1,
|
||||||
|
menu1:'通讯录',
|
||||||
|
menu2:'通讯录',
|
||||||
|
}
|
||||||
|
|
||||||
|
const { data } = await uni.$http.post('/gunshiApp/xfflood/visitMenuLog/insert',params)
|
||||||
|
console.log('用户行为',params,data)
|
||||||
|
} catch (error) {}
|
||||||
|
},
|
||||||
|
itemClick(item,index) {
|
||||||
|
this.treeData = item.children,
|
||||||
|
this.treePath = [...this.treePath,{
|
||||||
|
name:item.departmentName,
|
||||||
|
code:item.departmentCode,
|
||||||
|
data:item,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
breadcrumbClick(item,index) {
|
||||||
|
this.treeData = item.data.children,
|
||||||
|
this.treePath = [...this.treePath].filter((item,index2)=>index2<=index)
|
||||||
|
},
|
||||||
|
callNum(num) {
|
||||||
|
uni.makePhoneCall({
|
||||||
|
phoneNumber: num //仅为示例
|
||||||
|
});
|
||||||
|
},
|
||||||
|
toFollow() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/addressBook/follow'
|
||||||
|
});
|
||||||
|
},
|
||||||
|
toMyDept() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/addressBook/myDept'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.titleBar{
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
background-color: #007afd;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 40px;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
.searchBar{
|
||||||
|
background-color: #ffffff;
|
||||||
|
padding: 10px 10px 0 10px;
|
||||||
|
border-bottom: 1px solid rgba(233, 233, 233, 1);
|
||||||
|
}
|
||||||
|
.iconRow{
|
||||||
|
margin: 15px 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
}
|
||||||
|
.iconBox{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.icon_text{
|
||||||
|
margin-top: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #666666;
|
||||||
|
}
|
||||||
|
.mybody{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin-top: 10px;
|
||||||
|
border-top: 1px solid rgba(233, 233, 233, 1);
|
||||||
|
height: calc( 100vh - 233px);
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.breadcrumb{
|
||||||
|
padding: 10px;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.breadcrumb_item{
|
||||||
|
padding: 8px;
|
||||||
|
padding-right: 0px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.deptItem{
|
||||||
|
height: 50px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
}
|
||||||
|
.deptItem_border{
|
||||||
|
width: 80%;
|
||||||
|
height: 50px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
font-size: 14px;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.deptItem_num{
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
.personItemIcon{
|
||||||
|
width: 40px;
|
||||||
|
height:40px;
|
||||||
|
background-color: rgb(53, 133, 249);;
|
||||||
|
border-radius: 20px;
|
||||||
|
margin: 0 20px;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 40px;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
.personItemRow_right{
|
||||||
|
height: 100%;
|
||||||
|
flex: 1;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.personItemRow_right2{
|
||||||
|
width: 100px;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.personItemRow_right_top{
|
||||||
|
margin-top: 5px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,159 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden',background:'#f7f7f7'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
title="关注"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<div class="searchBar">
|
||||||
|
<u-search
|
||||||
|
placeholder="请输入姓名或手机号"
|
||||||
|
shape="square"
|
||||||
|
:showAction="false"
|
||||||
|
height="35"
|
||||||
|
v-model="keyword"
|
||||||
|
></u-search>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mybody">
|
||||||
|
<div :style="{display:'flex',alignItems:'center',height:'60px'}" v-for="(item,index) in getList">
|
||||||
|
<!-- <u--image :style="{margin:'0 30px'}" :src="'../../static/images/filter.png'" width="22px" height="22px"></u--image> -->
|
||||||
|
<div class="personItemIcon"><text>{{item.userName.slice(0, 1)}}</text></div>
|
||||||
|
<div class="personItemRow_right">
|
||||||
|
<div class="personItemRow_right_top">
|
||||||
|
<rich-text :style="{width:'100px'}" :nodes="highlightKeyword(item.userName, keyword)"></rich-text>
|
||||||
|
<rich-text :style="{flex:'1'}" :nodes="highlightKeyword(item.phone, keyword)"></rich-text>
|
||||||
|
</div>
|
||||||
|
<div class="personItemRow_right_bottom">
|
||||||
|
<text :style="{fontSize:'12px',color:'rgba(0, 0, 0, 0.4)'}">{{item.duty}}</text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="personItemRow_right2">
|
||||||
|
<u-icon v-if="item.isMyAttendee" name="star-fill" color="#f5dc4d" size="24" @click="follow(false,item.userId)"></u-icon>
|
||||||
|
<u-icon v-if="!item.isMyAttendee" name="star" color="#f5dc4d" size="24" @click="follow(true,item.userId)"></u-icon>
|
||||||
|
<u-icon name="phone" size="24" :style="{margin:'3px 10px 0 10px'}" @click="callNum(item.phone)"></u-icon>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div :style="{height:'100px'}"></div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
keyword:'',
|
||||||
|
list:[]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getList() {
|
||||||
|
if(this.keyword){
|
||||||
|
return [...this.list].filter(o=>o.userName.indexOf(this.keyword)!==-1)
|
||||||
|
}else{
|
||||||
|
return [...this.list]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
highlightKeyword(text, keyword) {
|
||||||
|
const highlightedText = text.replace(new RegExp(keyword, 'gi'), match => {
|
||||||
|
return `<span style="color: red;">${match}</span>`;
|
||||||
|
});
|
||||||
|
return highlightedText;
|
||||||
|
},
|
||||||
|
async getData () {
|
||||||
|
try {
|
||||||
|
const res = await uni.$http.get('/gunshiApp/xfflood/addressbook/my/attendee')
|
||||||
|
this.list = res.data.data
|
||||||
|
} catch (e) {
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async follow (flag,id) {
|
||||||
|
let url = flag?'/gunshiApp/xfflood/addressbook/attendee/add':'/gunshiApp/xfflood/addressbook/attendee/cancel'
|
||||||
|
const params = {
|
||||||
|
addUserId:id
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
const res = await uni.$http.post(url,params)
|
||||||
|
if(res.data.code === 200){
|
||||||
|
//关注成功
|
||||||
|
this.getData()
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
callNum(num) {
|
||||||
|
uni.makePhoneCall({
|
||||||
|
phoneNumber: num //仅为示例
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getData()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.searchBar{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 60px;
|
||||||
|
display: flex;
|
||||||
|
padding: 0 10px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.mybody{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin: 5px 5px;
|
||||||
|
padding: 5px 0px;
|
||||||
|
height: calc( 100vh - 100px );
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
.personItemIcon{
|
||||||
|
width: 40px;
|
||||||
|
height:40px;
|
||||||
|
background-color: rgb(53, 133, 249);;
|
||||||
|
border-radius: 20px;
|
||||||
|
margin: 0 20px;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 40px;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
.personItemRow_right{
|
||||||
|
height: 100%;
|
||||||
|
flex: 1;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.personItemRow_right2{
|
||||||
|
width: 100px;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.personItemRow_right_top{
|
||||||
|
margin-top: 5px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,189 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden',background:'#f7f7f7'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
title="我的部门"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<div class="searchBar">
|
||||||
|
<u-search
|
||||||
|
placeholder="请输入姓名或手机号"
|
||||||
|
shape="square"
|
||||||
|
:showAction="false"
|
||||||
|
height="35"
|
||||||
|
v-model="keyword"
|
||||||
|
></u-search>
|
||||||
|
</div>
|
||||||
|
<div class="breadcrumb" v-if="deptList.length>0">
|
||||||
|
<text
|
||||||
|
v-for="(item,index) in deptList"
|
||||||
|
class="breadcrumb_item"
|
||||||
|
>
|
||||||
|
{{item.departmentName}}
|
||||||
|
<text v-if="(deptList.length-1)!==index" :style="{marginLeft:'8px',color:'#000000'}">></text>
|
||||||
|
</text>
|
||||||
|
</div>
|
||||||
|
<div class="mybody">
|
||||||
|
<div :style="{display:'flex',alignItems:'center',height:'60px'}" v-for="(item,index) in getList">
|
||||||
|
<!-- <u--image :style="{margin:'0 30px'}" :src="'../../static/images/filter.png'" width="22px" height="22px"></u--image> -->
|
||||||
|
<div class="personItemIcon"><text>{{item.userName.slice(0, 1)}}</text></div>
|
||||||
|
<div class="personItemRow_right">
|
||||||
|
<div class="personItemRow_right_top">
|
||||||
|
<rich-text :style="{width:'100px'}" :nodes="highlightKeyword(item.userName, keyword)"></rich-text>
|
||||||
|
<rich-text :style="{flex:'1'}" :nodes="highlightKeyword(item.phone, keyword)"></rich-text>
|
||||||
|
</div>
|
||||||
|
<div class="personItemRow_right_bottom">
|
||||||
|
<text :style="{fontSize:'12px',color:'rgba(0, 0, 0, 0.4)'}">{{item.duty}}</text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="personItemRow_right2">
|
||||||
|
<u-icon v-if="item.isMyAttendee" name="star-fill" color="#f5dc4d" size="24" @click="follow(false,item.userId)"></u-icon>
|
||||||
|
<u-icon v-if="!item.isMyAttendee" name="star" color="#f5dc4d" size="24" @click="follow(true,item.userId)"></u-icon>
|
||||||
|
<u-icon name="phone" size="24" :style="{margin:'3px 10px 0 10px'}" @click="callNum(item.phone)"></u-icon>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div :style="{height:'100px'}"></div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
keyword:'',
|
||||||
|
list:[],
|
||||||
|
deptList:[]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getList() {
|
||||||
|
if(this.keyword){
|
||||||
|
return [...this.list].filter(o=>o.userName.indexOf(this.keyword)!==-1||o.phone.indexOf(this.keyword)!==-1)
|
||||||
|
}else{
|
||||||
|
return [...this.list]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
highlightKeyword(text, keyword) {
|
||||||
|
const highlightedText = text.replace(new RegExp(keyword, 'gi'), match => {
|
||||||
|
return `<span style="color: red;">${match}</span>`;
|
||||||
|
});
|
||||||
|
return highlightedText;
|
||||||
|
},
|
||||||
|
async getData () {
|
||||||
|
try {
|
||||||
|
const res = await uni.$http.get('/gunshiApp/xfflood/addressbook/my/department')
|
||||||
|
console.log('人员信息',res)
|
||||||
|
this.list = [...res.data.data]
|
||||||
|
} catch (e) {
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async getDept () {
|
||||||
|
try {
|
||||||
|
const res = await uni.$http.get('/gunshiApp/xfflood/addressbook/my/department/super')
|
||||||
|
console.log('部门信息',res)
|
||||||
|
this.deptList = res.data.data
|
||||||
|
} catch (e) {
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async follow (flag,id) {
|
||||||
|
let url = flag?'/gunshiApp/xfflood/addressbook/attendee/add':'/gunshiApp/xfflood/addressbook/attendee/cancel'
|
||||||
|
const params = {
|
||||||
|
addUserId:id
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
const res = await uni.$http.post(url,params)
|
||||||
|
if(res.data.code === 200){
|
||||||
|
//关注成功
|
||||||
|
this.getData()
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
callNum(num) {
|
||||||
|
uni.makePhoneCall({
|
||||||
|
phoneNumber: num //仅为示例
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getData()
|
||||||
|
this.getDept()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.searchBar{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 60px;
|
||||||
|
display: flex;
|
||||||
|
padding: 0 10px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.mybody{
|
||||||
|
background-color: #ffffff;
|
||||||
|
// margin: 5px 5px;
|
||||||
|
padding: 5px 0px;
|
||||||
|
height: calc( 100vh - 100px );
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
.personItemIcon{
|
||||||
|
width: 40px;
|
||||||
|
height:40px;
|
||||||
|
background-color: rgb(53, 133, 249);;
|
||||||
|
border-radius: 20px;
|
||||||
|
margin: 0 20px;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 40px;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
.personItemRow_right{
|
||||||
|
height: 100%;
|
||||||
|
flex: 1;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.personItemRow_right2{
|
||||||
|
width: 100px;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.personItemRow_right_top{
|
||||||
|
margin-top: 5px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start
|
||||||
|
}
|
||||||
|
.breadcrumb{
|
||||||
|
padding: 10px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.breadcrumb_item{
|
||||||
|
padding: 8px;
|
||||||
|
padding-right: 0px;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,421 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden',backgroundColor:'#fff'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar title="安全监测" :autoBack="true" :titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}" :height='44' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
|
||||||
|
</u-navbar>
|
||||||
|
<picker @change="bindPickerChange" :range="array" range-key="profileName" style="margin-top:50px;padding: 0 10px;">
|
||||||
|
<view class="uni-input12">
|
||||||
|
<view>{{profileName}}</view>
|
||||||
|
<u-icon name="arrow-down-fill" color="#000" size="15"></u-icon>
|
||||||
|
</view>
|
||||||
|
</picker>
|
||||||
|
|
||||||
|
<view class="jcsj-box">
|
||||||
|
<view class="time-ranger">
|
||||||
|
<view class="start-time">
|
||||||
|
<text>开始时间</text>
|
||||||
|
<text @click="showTime=true" style="margin-left:10%;color:#3399ef">{{stm}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="end-time">
|
||||||
|
<text>结束时间</text>
|
||||||
|
<text @click="showTime1=true" style="margin:0 10%;color:#3399ef">{{etm}}</text>
|
||||||
|
<view class="search-btn" @click="searchHandle">
|
||||||
|
搜索
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="jcsj-content">
|
||||||
|
<view class="tool-btn">
|
||||||
|
<view class="scale-btn">
|
||||||
|
<u-button style="margin-right:10px" @click="fd" class="aqjc-custom-style">+</u-button>
|
||||||
|
<u-button @click="sx" class="aqjc-custom-style">-</u-button>
|
||||||
|
</view>
|
||||||
|
<view class="play-btn">
|
||||||
|
<uni-icons type="videocam" size="40" :color="swiper ? '#2979ff':'#909399' " @click="play"></uni-icons>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="jcsj-charts">
|
||||||
|
<movable-area :style="areaStyle">
|
||||||
|
<movable-view @scale="scale" direction="all" :scale-value="scaleValue" scale-min="0.5" scale="true"
|
||||||
|
scale-max="4" out-of-bounds="true">
|
||||||
|
<qiun-data-charts :chartData="chartData.chartData" :echartsApp="true" :eopts="chartData.eopts" />
|
||||||
|
</movable-view>
|
||||||
|
</movable-area>
|
||||||
|
</view>
|
||||||
|
<view style="margin-top: 20px;">
|
||||||
|
<JcsjTable :columns="columns" :data="dataSources" :newCol="newCol" :cols2="cols2" />
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker :show="showTime" v-model="startTime" mode="datetime" @confirm="handleStartTime"
|
||||||
|
@cancel="showTime=false"></u-datetime-picker>
|
||||||
|
<u-datetime-picker :show="showTime1" v-model="endTime" mode="datetime" @confirm="handleEndTime"
|
||||||
|
@cancel="showTime1=false"></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
import drpOption from './jrxOptions';
|
||||||
|
import JcsjTable from "./jcsjTable"
|
||||||
|
const stm = moment().subtract(1, 'days').add(1, 'hour').set({
|
||||||
|
minute: 0,
|
||||||
|
second: 0
|
||||||
|
}).format("YYYY-MM-DD HH:mm");
|
||||||
|
const etm = moment().add(1, 'hour').set({
|
||||||
|
minute: 0,
|
||||||
|
second: 0
|
||||||
|
}).format("YYYY-MM-DD HH:mm");
|
||||||
|
export default {
|
||||||
|
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
startTime: stm,
|
||||||
|
endTime: etm,
|
||||||
|
stm,
|
||||||
|
etm,
|
||||||
|
showTime: false,
|
||||||
|
showTime1: false,
|
||||||
|
array: [],
|
||||||
|
profileCode: '',
|
||||||
|
dbType: '',
|
||||||
|
trData: [],
|
||||||
|
dataSources: [],
|
||||||
|
chartData: {
|
||||||
|
chartData: {},
|
||||||
|
eopts: {}
|
||||||
|
},
|
||||||
|
areaStyle: {
|
||||||
|
left: "-450px"
|
||||||
|
},
|
||||||
|
scaleValue: 0.5,
|
||||||
|
swiper: false,
|
||||||
|
timer: 100,
|
||||||
|
columns: [],
|
||||||
|
cols1: [{
|
||||||
|
title: '序号',
|
||||||
|
key: 'index',
|
||||||
|
width: 60,
|
||||||
|
align: 'center',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '时间',
|
||||||
|
key: 'time',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '库水位(m)',
|
||||||
|
key: 'rz',
|
||||||
|
dataIndex: 'rz',
|
||||||
|
width: 150,
|
||||||
|
align: "center"
|
||||||
|
},
|
||||||
|
],
|
||||||
|
cols2: [{
|
||||||
|
title: '结果分析',
|
||||||
|
key: 'status',
|
||||||
|
dataIndex: 'status',
|
||||||
|
width: 150,
|
||||||
|
align: "center",
|
||||||
|
}],
|
||||||
|
newCol: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
JcsjTable
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
profileName() {
|
||||||
|
if (this.array.length > 0) {
|
||||||
|
return this.array.find(item => item.profileCode == this.profileCode).profileName;
|
||||||
|
} else {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
profileCode: {
|
||||||
|
handler(newVal, oldVal) {
|
||||||
|
if (newVal) {
|
||||||
|
let name = this.array.find(item => item.profileCode == newVal).profileName;
|
||||||
|
this.dbType = name == "大坝B0+060" ? "1" :
|
||||||
|
name == "大坝B0+090" ? "2" :
|
||||||
|
name == "大坝B0+120" ? "2" : '1'
|
||||||
|
this.getDmTree();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
immediate: true,
|
||||||
|
},
|
||||||
|
trData: {
|
||||||
|
handler(newVal, oldVal) {
|
||||||
|
if (newVal) {
|
||||||
|
this.getTableData()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
deep: true,
|
||||||
|
},
|
||||||
|
dataSources: {
|
||||||
|
handler(newVal, oldVal) {
|
||||||
|
if (newVal) {
|
||||||
|
this.chartData = {
|
||||||
|
...drpOption(newVal[0], this.dbType)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
deep: true,
|
||||||
|
immediate: true,
|
||||||
|
},
|
||||||
|
swiper(newVal) {
|
||||||
|
console.log("ww", newVal);
|
||||||
|
|
||||||
|
if (newVal) {
|
||||||
|
this.InitialScroll(this.dataSources)
|
||||||
|
} else {
|
||||||
|
clearInterval(this.timer)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
InitialScroll(data) {
|
||||||
|
let index = 0;
|
||||||
|
this.timer = setInterval(() => {
|
||||||
|
console.log("data", data[index % data.length]);
|
||||||
|
|
||||||
|
this.chartData = {
|
||||||
|
...drpOption(data[index % data.length], this.dbType)
|
||||||
|
}
|
||||||
|
index++;
|
||||||
|
}, 1000)
|
||||||
|
},
|
||||||
|
// 播放
|
||||||
|
play() {
|
||||||
|
this.swiper = !this.swiper;
|
||||||
|
},
|
||||||
|
// 放大回调
|
||||||
|
fd() {
|
||||||
|
if (this.scaleValue == 4) {
|
||||||
|
return;
|
||||||
|
} else {
|
||||||
|
this.scaleValue += 0.1;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 缩小回调
|
||||||
|
sx() {
|
||||||
|
if (this.scaleValue == 0.5) {
|
||||||
|
return ''
|
||||||
|
} else {
|
||||||
|
this.scaleValue -= 0.1;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 缩放
|
||||||
|
scale(e) {
|
||||||
|
this.areaStyle.left = -(e.detail.scale + 1) * 450 + 'px';
|
||||||
|
},
|
||||||
|
searchHandle() {
|
||||||
|
this.getTableData();
|
||||||
|
},
|
||||||
|
handleStartTime(e) {
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
console.log("time", time);
|
||||||
|
|
||||||
|
this.stm = time
|
||||||
|
this.showTime = false
|
||||||
|
},
|
||||||
|
handleEndTime(e) {
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
this.etm = time;
|
||||||
|
this.showTime1 = false
|
||||||
|
},
|
||||||
|
handleRanger(e) {
|
||||||
|
console.log(e);
|
||||||
|
this.tm = [...e]
|
||||||
|
},
|
||||||
|
bindPickerChange(e) {
|
||||||
|
this.profileCode = this.array[e.target.value].profileCode
|
||||||
|
},
|
||||||
|
// 获取监测点数据
|
||||||
|
async getMonthData() {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post(
|
||||||
|
`/gunshiApp/tsg/attDamProfile/list`, )
|
||||||
|
if (data.code == 200) {
|
||||||
|
this.array = data.data
|
||||||
|
this.profileCode = data.data[0].profileCode;
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 获取坝面上点位数据
|
||||||
|
async getTableData() {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post(
|
||||||
|
"/gunshiApp/tsg/osmoticPressR/infiltra/line", {
|
||||||
|
stationCodes: this.trData,
|
||||||
|
dateTimeRangeSo: {
|
||||||
|
start: moment(this.stm).format("YYYY-MM-DD HH:mm:00"),
|
||||||
|
end: moment(this.etm).format("YYYY-MM-DD HH:mm:00"),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
if (data.code == 200) {
|
||||||
|
let newArr = [];
|
||||||
|
let newData = data.data.map((s, i) => {
|
||||||
|
newArr.push(s.list.map(c => ({
|
||||||
|
[c.stationCode]: c.value || '-',
|
||||||
|
tm: c.tm,
|
||||||
|
|
||||||
|
})))
|
||||||
|
return {
|
||||||
|
tm: s.tm,
|
||||||
|
rz: s.rz,
|
||||||
|
status: s.status || '',
|
||||||
|
inx: i + 1
|
||||||
|
}
|
||||||
|
})
|
||||||
|
let filterData = newArr.filter(s => s.length > 0).flat()
|
||||||
|
let result = newData.map(s => {
|
||||||
|
let tm1 = s.tm;
|
||||||
|
let r = filterData.filter(t => {
|
||||||
|
return t.tm == tm1
|
||||||
|
})
|
||||||
|
let obj = {};
|
||||||
|
r.forEach(s1 => {
|
||||||
|
obj = {
|
||||||
|
...s1,
|
||||||
|
...obj
|
||||||
|
}
|
||||||
|
})
|
||||||
|
return {
|
||||||
|
...s,
|
||||||
|
...obj,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
this.dataSources = [...result];
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取各点
|
||||||
|
async getDmTree() {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post("/gunshiApp/tsg/attDamProfile/tree")
|
||||||
|
if (data.code == 200) {
|
||||||
|
console.log("data", data);
|
||||||
|
|
||||||
|
let filterData = data.data.filter(s => s.profileCode == this.profileCode)
|
||||||
|
this.trData = filterData[0].children;
|
||||||
|
const newCol = filterData[0].children.map(s => ({
|
||||||
|
title: `${s}(m)`,
|
||||||
|
key: s,
|
||||||
|
dataIndex: s,
|
||||||
|
width: 150,
|
||||||
|
align: "center",
|
||||||
|
}))
|
||||||
|
this.columns = [...this.cols1, ...newCol, ...this.cols2]
|
||||||
|
this.newCol = newCol;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 拖动回调
|
||||||
|
onChange(e) {
|
||||||
|
console.log(e);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getMonthData()
|
||||||
|
this.getDmTree()
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.uni-input12 {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
column-gap: 30px;
|
||||||
|
align-items: center;
|
||||||
|
padding: 5px 0;
|
||||||
|
border: 1px solid #f2f2f2;
|
||||||
|
border-left: none;
|
||||||
|
border-right: none;
|
||||||
|
// background-image: '../../static/images/';
|
||||||
|
}
|
||||||
|
|
||||||
|
.jcsj-box {
|
||||||
|
padding: 0 10px;
|
||||||
|
|
||||||
|
.jcsj-content {
|
||||||
|
max-height: 100vh;
|
||||||
|
width: 100%;
|
||||||
|
overflow-y: auto;
|
||||||
|
overflow-x: hidden;
|
||||||
|
|
||||||
|
.tool-btn {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: "center";
|
||||||
|
padding: 5px;
|
||||||
|
|
||||||
|
.scale-btn {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
button {
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.jcsj-charts {
|
||||||
|
width: 1310px;
|
||||||
|
height: 250px;
|
||||||
|
overflow-y: auto;
|
||||||
|
|
||||||
|
// margin-top: 20px;
|
||||||
|
&>movable-area {
|
||||||
|
height: 250px;
|
||||||
|
width: 3000px;
|
||||||
|
// position:fixed;
|
||||||
|
overflow: hidden;
|
||||||
|
z-index: 1;
|
||||||
|
background-color: #efefef;
|
||||||
|
|
||||||
|
movable-view {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
width: 1310px;
|
||||||
|
height: 380px;
|
||||||
|
background-color: #fff;
|
||||||
|
left: 450px;
|
||||||
|
top: 10px
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.active {
|
||||||
|
border-color: #68bbff !important;
|
||||||
|
color: #68bbff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.aqjc-custom-style {
|
||||||
|
width: 80rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,120 @@
|
||||||
|
<template>
|
||||||
|
<div class="table_div">
|
||||||
|
<div class="table_cur">
|
||||||
|
<table style="display:block;width:700px;overflow-x:auto">
|
||||||
|
<tr>
|
||||||
|
<th v-for="(cols,i) in columns" :key="i" :style="getStyle(cols)">
|
||||||
|
{{ cols.title }}
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
<!-- style="max-height: 480px; overflow-y: auto" -->
|
||||||
|
<div class="scroll-table">
|
||||||
|
<tr v-for="(item, index) in data" :key="index">
|
||||||
|
<td style="width:100px;text-align:center">{{ index + 1 }}</td>
|
||||||
|
<td style="width:200px;text-align:center">{{ item.tm }}</td>
|
||||||
|
<td style="width:100px;text-align:center">{{ item.rz }}</td>
|
||||||
|
<td v-for="(col,i) in newCol" :key="i" style="width:100px;text-align:center;">
|
||||||
|
{{item[col.key] }}
|
||||||
|
</td>
|
||||||
|
<td style="width:100px;">
|
||||||
|
{{item.status == 1 ? "正常" : rec == 0 ? "异常" : ''}}
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</div>
|
||||||
|
<div style="height:180px"></div>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
columns:{
|
||||||
|
type:Array,
|
||||||
|
default:[],
|
||||||
|
},
|
||||||
|
data:{
|
||||||
|
type:Array,
|
||||||
|
default:[],
|
||||||
|
},
|
||||||
|
cols2:{
|
||||||
|
type:Array,
|
||||||
|
default:[],
|
||||||
|
},
|
||||||
|
newCol:{
|
||||||
|
type:Array,
|
||||||
|
default:[],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed:{
|
||||||
|
// newList(){
|
||||||
|
// if(this.tableData.length){
|
||||||
|
// return this.tableData.map(item => ({...item,tm:moment(item.tm).format("MM-DD HH:mm")}))
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
getStyle(row){
|
||||||
|
return {
|
||||||
|
width:row.title == "时间" ? "200px": "100px"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.table_div {
|
||||||
|
height: 100%;
|
||||||
|
max-width: calc(100% - 0px);
|
||||||
|
max-height: calc(100vh);
|
||||||
|
flex: 1;
|
||||||
|
padding-top: 0px;
|
||||||
|
overflow-x: scroll;
|
||||||
|
}
|
||||||
|
/*table样式*/
|
||||||
|
.table_cur {
|
||||||
|
width: 100%;
|
||||||
|
empty-cells: show;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.scroll-table{
|
||||||
|
height: calc(100vh - 180px);
|
||||||
|
overflow-y: auto;
|
||||||
|
overflow-x: auto;
|
||||||
|
width:'100%'
|
||||||
|
}
|
||||||
|
.table_cur tr {
|
||||||
|
display: flex;
|
||||||
|
line-height: 90rpx;
|
||||||
|
// overflow-x: auto;
|
||||||
|
}
|
||||||
|
.table_cur th {
|
||||||
|
height: 85rpx;
|
||||||
|
color: #3399ef;
|
||||||
|
background: #e1f3ff;
|
||||||
|
font-size: 14px;
|
||||||
|
// font-weight: bold;
|
||||||
|
padding: 0px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur td {
|
||||||
|
height: 65rpx;
|
||||||
|
// border-bottom: 1px solid #d8ddeb;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #2f4056;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
/*table样式 end*/
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,325 @@
|
||||||
|
|
||||||
|
import { imageUrl060,imageUrl090,rule } from './dataUrl'
|
||||||
|
|
||||||
|
export default function jrxOptions(data = {}, type = "1") {
|
||||||
|
const yMin = type == "1" ? 70 : type == "2" ? 70 : 70;
|
||||||
|
const yMax = type == "1" ? 154 : type == "2" ? 150 : 150;
|
||||||
|
const type1 = ["SY05", "SY06", "SY07", "SY08"]
|
||||||
|
const type2 = ["SY09","SY10","SY11","SY12"]
|
||||||
|
const alltype = type == "1" ? type1 : type == "2" ? type2 : type2;
|
||||||
|
// 字体颜色
|
||||||
|
const textColor = '#666'
|
||||||
|
const imageUrl = type == "1" ? imageUrl060:
|
||||||
|
type == "2" ? imageUrl090 : imageUrl090;
|
||||||
|
const xValue = type == "1" ? (((data?.rz - 99) + 1.1 * 13) / 1.1):
|
||||||
|
type == "2" ? (((data?.rz - 99) + 1 * 14) / 1) : (((data?.rz - 99) + 1 * 14) / 1)
|
||||||
|
const rz = data?.rz ?
|
||||||
|
[[xValue, data?.rz], [0, data?.rz], ] :
|
||||||
|
[]
|
||||||
|
const rz1 = data?.rz ?
|
||||||
|
type == "1" ?
|
||||||
|
[[0, 99], [13, 99], [xValue, data?.rz]]:
|
||||||
|
type == "2" ?
|
||||||
|
[[0, 99], [14, 99], [xValue, data?.rz]]
|
||||||
|
: [[0, 99], [14, 99], [xValue, data?.rz]]
|
||||||
|
:
|
||||||
|
[]
|
||||||
|
const gz1 = data[alltype[0]] ?
|
||||||
|
type == "1" ? [[51.6, 85], [51.6, data[alltype[0]]]] :
|
||||||
|
type == "2" ? [[47.5, 85], [47.5, data[alltype[0]]]] :
|
||||||
|
[[47.5, 158], [85, data[alltype[0]]]]
|
||||||
|
: [];
|
||||||
|
const gz2 = data[alltype[1]] ?
|
||||||
|
type == "1" ? [[53.6, 85], [53.6, data[alltype[1]]]] :
|
||||||
|
type == "2" ? [[49.5, 85], [49.5, data[alltype[1]]]] :
|
||||||
|
[[53.6, 158], [53.6, data[alltype[1]]]] :
|
||||||
|
[];
|
||||||
|
|
||||||
|
const gz3 = data[alltype[2]] ?
|
||||||
|
type == "1" ? [[72.5, 90], [72.5, data[alltype[2]]]] :
|
||||||
|
type == "2" ? [[66.5, 90], [66.5, data[alltype[2]]]] :
|
||||||
|
[[73, 161], [73, data[alltype[2]]]] : [];
|
||||||
|
|
||||||
|
const gz4 = data[alltype[3]] ?
|
||||||
|
type == "1" ? [[84.5, 96], [84.5, data[alltype[3]]]] :
|
||||||
|
type == "2" ? [[77, 96], [77, data[alltype[3]]]] :
|
||||||
|
[[85, 166], [85, data[alltype[3]]]] : [];
|
||||||
|
|
||||||
|
const line = data?.rz ?
|
||||||
|
type == "1" ?
|
||||||
|
[
|
||||||
|
[xValue, data?.rz],
|
||||||
|
[51.6, data[alltype[0]]],
|
||||||
|
[53.6, data[alltype[1]]],
|
||||||
|
[72.5, data[alltype[2]]],
|
||||||
|
[84.5, data[alltype[3]]]
|
||||||
|
] :
|
||||||
|
type == "2" ?
|
||||||
|
[
|
||||||
|
[xValue, data?.rz],
|
||||||
|
[47.5, data[alltype[0]]],
|
||||||
|
[49.5, data[alltype[1]]],
|
||||||
|
[66.5, data[alltype[2]]],
|
||||||
|
[77, data[alltype[3]]]
|
||||||
|
] :
|
||||||
|
[
|
||||||
|
[xValue, data?.rz],
|
||||||
|
[51.6, data[alltype[0]]],
|
||||||
|
[53.6, data[alltype[1]]],
|
||||||
|
[73, data[alltype[2]]],
|
||||||
|
[85, data[alltype[3]]]
|
||||||
|
]
|
||||||
|
: []
|
||||||
|
let eopts = {
|
||||||
|
toolbox: {
|
||||||
|
show: true,
|
||||||
|
feature: {
|
||||||
|
saveAsImage: {
|
||||||
|
show: true,
|
||||||
|
excludeComponents: ['toolbox'],
|
||||||
|
pixelRatio: 2,
|
||||||
|
name:"测值图"
|
||||||
|
},
|
||||||
|
},
|
||||||
|
right: "10%",
|
||||||
|
top:"4%"
|
||||||
|
},
|
||||||
|
graphic: [
|
||||||
|
{
|
||||||
|
type: 'image',
|
||||||
|
left: '5%',
|
||||||
|
top: 0,
|
||||||
|
bottom:0,
|
||||||
|
z: 1,
|
||||||
|
bounding: 'raw',
|
||||||
|
style: {
|
||||||
|
image: imageUrl,
|
||||||
|
width: 1310,
|
||||||
|
height: 380
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'image',
|
||||||
|
// id: 'background',
|
||||||
|
left: '5%',
|
||||||
|
bottom:"5%",
|
||||||
|
z: 1,
|
||||||
|
bounding: 'all',
|
||||||
|
style: {
|
||||||
|
image: rule,
|
||||||
|
width: 10,
|
||||||
|
height: 450
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
grid: {
|
||||||
|
top: '0%',
|
||||||
|
left: '2%',
|
||||||
|
right: '5%',
|
||||||
|
bottom: '0%',
|
||||||
|
containLabel: true
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
min: 0,
|
||||||
|
max:100,
|
||||||
|
axisLabel: {
|
||||||
|
show:false,
|
||||||
|
// 坐标轴字体颜色
|
||||||
|
color: textColor,
|
||||||
|
fontSize: 18
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show:false,
|
||||||
|
lineStyle: {
|
||||||
|
color: textColor
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
// y轴刻度线
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
// 网格
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
boundaryGap: false
|
||||||
|
},
|
||||||
|
yAxis: {
|
||||||
|
type: 'value',
|
||||||
|
min: yMin,
|
||||||
|
max: yMax,
|
||||||
|
interval:5,
|
||||||
|
// data:[155,160,180,190,210],
|
||||||
|
nameTextStyle: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 18,
|
||||||
|
padding: [0, 0, 0, 80]
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
// 坐标轴字体颜色
|
||||||
|
color: textColor,
|
||||||
|
fontSize: 18,
|
||||||
|
showMinLabel: false,
|
||||||
|
showMaxLabel: false
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
// y轴刻度线
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
// 网格
|
||||||
|
show: false,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#CCCCCC',
|
||||||
|
type: 'dashed'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
let chartData = {
|
||||||
|
series: [
|
||||||
|
// 和大坝坡面重合的线 斜率为0.75
|
||||||
|
{
|
||||||
|
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
symbolSize: 10,
|
||||||
|
z: 1,
|
||||||
|
itemStyle: {
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
color: '#fff'
|
||||||
|
},
|
||||||
|
areaStyle: {
|
||||||
|
origin: "end",
|
||||||
|
color: 'rgba(0, 128, 255, 0.3)' // 设置区域填充颜色
|
||||||
|
},
|
||||||
|
data:[...rz,...rz1]
|
||||||
|
|
||||||
|
},
|
||||||
|
{
|
||||||
|
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
symbolSize: 10,
|
||||||
|
z: 1,
|
||||||
|
itemStyle: {
|
||||||
|
color: '#5487FF'
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
color: '#5487FF'
|
||||||
|
},
|
||||||
|
markPoint: {
|
||||||
|
data: [{ type: 'max',x:"20%", coord: [xValue, data?.rz] }],
|
||||||
|
symbol: 'pin',
|
||||||
|
symbolSize: [30, 10],
|
||||||
|
itemStyle: {
|
||||||
|
color: '#fff', // 标注点颜色
|
||||||
|
borderColor: '#ffa500', // 标注点边框颜色
|
||||||
|
borderWidth: 0 // 标注点边框宽度
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
show: true, // 是否显示标签
|
||||||
|
formatter: "库水位" +data?.rz + "m", // 标签格式
|
||||||
|
color: '#5487FF', // 标签文字颜色
|
||||||
|
fontSize: 12, // 标签文字大小
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data:rz
|
||||||
|
},
|
||||||
|
{
|
||||||
|
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
symbolSize: 10,
|
||||||
|
z: 1,
|
||||||
|
itemStyle: {
|
||||||
|
color: '#5487FF'
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
color: '#5487FF'
|
||||||
|
},
|
||||||
|
data:rz1
|
||||||
|
},
|
||||||
|
// 管位
|
||||||
|
{
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
symbolSize: 10,
|
||||||
|
z: 1,
|
||||||
|
itemStyle: {
|
||||||
|
color: '#5487FF'
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
color: '#5487FF',
|
||||||
|
width:6
|
||||||
|
},
|
||||||
|
data: gz1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
symbolSize: 10,
|
||||||
|
z: 1,
|
||||||
|
itemStyle: {
|
||||||
|
color: '#5487FF'
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
color: '#5487FF',
|
||||||
|
width:6
|
||||||
|
},
|
||||||
|
data: gz2
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
symbolSize: 10,
|
||||||
|
z: 1,
|
||||||
|
itemStyle: {
|
||||||
|
color: '#5487FF'
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
color: '#5487FF',
|
||||||
|
width:6
|
||||||
|
},
|
||||||
|
data: gz3
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
symbolSize: 10,
|
||||||
|
z: 1,
|
||||||
|
itemStyle: {
|
||||||
|
color: '#5487FF'
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
color: '#5487FF',
|
||||||
|
width:6
|
||||||
|
},
|
||||||
|
data: gz4
|
||||||
|
},
|
||||||
|
// 管位连接线
|
||||||
|
{
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
symbolSize: 10,
|
||||||
|
z: 1,
|
||||||
|
itemStyle: {
|
||||||
|
color: '#5487FF'
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
color: '#5487FF',
|
||||||
|
},
|
||||||
|
data: line
|
||||||
|
},
|
||||||
|
]
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
eopts,
|
||||||
|
chartData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,82 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
title="预警"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<u-tabs
|
||||||
|
:list="tabsOptions"
|
||||||
|
@click="tabsChange"
|
||||||
|
:scrollable=false
|
||||||
|
class="tabsClass"
|
||||||
|
:activeStyle="{color: 'rgb(37, 157, 255)',fontSize: '16px'}"
|
||||||
|
:inactiveStyle="{color: '#606266',fontSize: '16px'}"
|
||||||
|
lineColor="transparent"
|
||||||
|
itemStyle="height: 44px"
|
||||||
|
>
|
||||||
|
</u-tabs>
|
||||||
|
<uniSh v-if="tabsVal==='uniSh'"></uniSh>
|
||||||
|
<uniSk v-if="tabsVal==='uniSk'"></uniSk>
|
||||||
|
<uniHd v-if="tabsVal==='uniHd'"></uniHd>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
import uniSh from './sh.vue';
|
||||||
|
import uniSk from './sk.vue';
|
||||||
|
import uniHd from './hd.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: { uniSh, uniSk, uniHd },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tabsOptions:[
|
||||||
|
{
|
||||||
|
name:'水库预警',
|
||||||
|
components:'uniSk'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name:'河道预警',
|
||||||
|
components:'uniHd'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name:'山洪预警',
|
||||||
|
components:'uniSh'
|
||||||
|
},
|
||||||
|
],
|
||||||
|
tabsVal:'uniSk'
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
tabsChange(item) {
|
||||||
|
this.tabsVal = item.components
|
||||||
|
console.log(this.tabsVal);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.myTitleStyle{
|
||||||
|
font-size: 30px;
|
||||||
|
background-color: red;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
.tabsClass{
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 40px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,259 @@
|
||||||
|
<template>
|
||||||
|
<view class="tabBody">
|
||||||
|
<div class="searchBox">
|
||||||
|
<div class="searchBox_left">
|
||||||
|
<u-search
|
||||||
|
shape="square"
|
||||||
|
:clearabled="true"
|
||||||
|
:showAction=false
|
||||||
|
v-model="searchVal"
|
||||||
|
placeholder='请输入站名'
|
||||||
|
height=40
|
||||||
|
>
|
||||||
|
</u-search>
|
||||||
|
</div>
|
||||||
|
<div class="searchBox_right">
|
||||||
|
<view
|
||||||
|
hover-class="is-hover"
|
||||||
|
class="searchBox_right_btn"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="myShow"
|
||||||
|
>
|
||||||
|
<u--image :src="'../../static/images/filter.png'" width="22px" height="22px"></u--image>
|
||||||
|
</view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="tableHead">
|
||||||
|
<div class="td t1">站名</div>
|
||||||
|
<div class="td t2">水位(m)</div>
|
||||||
|
<div class="td t3">类型</div>
|
||||||
|
<div class="td t4">预警类型</div>
|
||||||
|
</div>
|
||||||
|
<div class="tableBody">
|
||||||
|
<div v-for="(item,index) in getSearchVal" class="tableRow">
|
||||||
|
<div class="td t1" @click="toSh(item)">{{item.stnm}}</div>
|
||||||
|
<div class="td t2">{{Number(item.z).toFixed(2)}}({{Number(item.gstate===1?(item.z-item.grz):(item.z-item.wrz)).toFixed(2)}})</div>
|
||||||
|
<div class="td t3">{{sttp[item.sttp]}}</div>
|
||||||
|
<div class="td t4">{{item.gstate===1?'超危险水位':item.wstate===1?'超警戒水位':'-'}}</div>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'80px'}">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<u-popup
|
||||||
|
:show="show"
|
||||||
|
mode="right"
|
||||||
|
:safeAreaInsetTop='true'
|
||||||
|
:closeOnClickOverlay='false'
|
||||||
|
@close="close"
|
||||||
|
@open="myShow">
|
||||||
|
<view :style="{padding:'10px',width:'250px'}">
|
||||||
|
<u-toast ref="uToast"></u-toast>
|
||||||
|
<text class="title">按类型</text>
|
||||||
|
<u-checkbox-group
|
||||||
|
placement="row"
|
||||||
|
v-model="check1"
|
||||||
|
:style="{padding:'10px 0px 20px 0px'}"
|
||||||
|
>
|
||||||
|
<u-checkbox name="SH" label="山洪" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="SW" label="水文" class="checkItem"></u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
<text class="title">按预警类型</text>
|
||||||
|
<u-checkbox-group
|
||||||
|
placement="row"
|
||||||
|
v-model="check2"
|
||||||
|
:style="{padding:'10px 0px 20px 0px'}"
|
||||||
|
>
|
||||||
|
<u-checkbox name="1" label="超危险水位" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="2" label="超警戒水位" class="checkItem"></u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
<div :style="{position:'absolute',bottom:'20px',right:'20px',display:'flex'}">
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px',marginRight:'10px'}"
|
||||||
|
text="重置"
|
||||||
|
@click="reSet"
|
||||||
|
></u-button>
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px'}"
|
||||||
|
color="rgba(217, 0, 27, 1)"
|
||||||
|
type="primary"
|
||||||
|
text="确定"
|
||||||
|
@click="submit"
|
||||||
|
></u-button>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
const sttp = {
|
||||||
|
RR:'水库水文站',
|
||||||
|
ZQ:'河道水文站',
|
||||||
|
ZP:'河道水文站',
|
||||||
|
}
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
sttp:sttp,
|
||||||
|
show:false,
|
||||||
|
searchVal:'',
|
||||||
|
check1:['SH','SW'],
|
||||||
|
check2:['1','2'],
|
||||||
|
list:[]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getSearchVal() {
|
||||||
|
if(this.searchVal){
|
||||||
|
return this.list.filter(o => o.adnm && o.adnm?.indexOf(this.searchVal)>-1)
|
||||||
|
}else{
|
||||||
|
return this.list
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
myShow() {
|
||||||
|
this.show = true
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
reSet() {
|
||||||
|
this.check1 = ['SH','SW']
|
||||||
|
this.check2 = ['1','2']
|
||||||
|
},
|
||||||
|
async submit() {
|
||||||
|
try{
|
||||||
|
const params = {
|
||||||
|
sources:this.check1,
|
||||||
|
types:this.check2
|
||||||
|
}
|
||||||
|
const res = await uni.$http.post('/gunshiApp/xfflood/current/situation/app/rv/warn',params)
|
||||||
|
this.list = res.data.data
|
||||||
|
this.close()
|
||||||
|
}catch(e){
|
||||||
|
//TODO handle the exception
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请求失败",
|
||||||
|
})
|
||||||
|
setTimeout(()=>{
|
||||||
|
this.close()
|
||||||
|
},1000)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
toSh(params) {
|
||||||
|
console.log(`/pages/hdDetail/hdDetail?stcd=${params.stcd}&stnm=${params.stnm}&source=${params.source}&wrz=${params.wrz}&grz=${params.grz}`)
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pages/hdDetail/hdDetail?stcd=${params.stcd}&stnm=${params.stnm}&source=${params.source}&wrz=${params.wrz}&grz=${params.grz}`
|
||||||
|
})
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.submit()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.tabBody{
|
||||||
|
background-color: rgba(247, 247, 247, 1);
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.searchBox{
|
||||||
|
height: 62px;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.tableHead{
|
||||||
|
width: 97%;
|
||||||
|
margin-top: 5px;
|
||||||
|
height: 50px;
|
||||||
|
background-color: #e4f2fe;
|
||||||
|
display: flex;
|
||||||
|
color: #208FEE;
|
||||||
|
}
|
||||||
|
.tableBody{
|
||||||
|
width: 97%;
|
||||||
|
height: calc( 100vh - 214px );
|
||||||
|
background-color: #f7f7f7;//#ffffff;
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
||||||
|
.tableRow{
|
||||||
|
width: 100%;
|
||||||
|
height: 46px;
|
||||||
|
display: flex;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.td{
|
||||||
|
text-align: center;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
.t1{
|
||||||
|
width: 25%;
|
||||||
|
color: #208FEE;
|
||||||
|
}
|
||||||
|
.t2{
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
.t3{
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
.t4{
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
.searchBox_left{
|
||||||
|
width: 82%;
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
.searchBox_right{
|
||||||
|
width: 18%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.searchBox_right_btn{
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.is-hover{
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
.title{
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.checkItem{
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.tmPicker{
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
border: 1px solid rgba(240, 240, 240, 1);
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
// padding-left: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,328 @@
|
||||||
|
<template>
|
||||||
|
<view class="tabBody">
|
||||||
|
<div class="searchBox">
|
||||||
|
<div class="searchBox_left">
|
||||||
|
<u-search
|
||||||
|
shape="square"
|
||||||
|
:clearabled="true"
|
||||||
|
:showAction=false
|
||||||
|
v-model="searchVal"
|
||||||
|
placeholder='请输入乡镇'
|
||||||
|
height=40
|
||||||
|
>
|
||||||
|
</u-search>
|
||||||
|
</div>
|
||||||
|
<div class="searchBox_right">
|
||||||
|
<view
|
||||||
|
hover-class="is-hover"
|
||||||
|
class="searchBox_right_btn"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="myShow"
|
||||||
|
>
|
||||||
|
<u--image :src="'../../static/images/filter.png'" width="22px" height="22px"></u--image>
|
||||||
|
</view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="tableHead">
|
||||||
|
<div class="td t1">乡镇</div>
|
||||||
|
<div class="td t2">预警时间</div>
|
||||||
|
<div class="td t3">预警状态</div>
|
||||||
|
<div class="td t4">危险等级</div>
|
||||||
|
</div>
|
||||||
|
<div class="tableBody">
|
||||||
|
<div v-for="(item,index) in getSearchVal" class="tableRow">
|
||||||
|
<div class="td t1" @click="toSh(item)">{{item.adnm}}</div>
|
||||||
|
<div class="td t2">{{item.warnstm}}</div>
|
||||||
|
<div class="td t3">{{warnstatus[item.warnstatusid]}}</div>
|
||||||
|
<div class="td t4">{{warngrade[item.warngradeid]}}</div>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'80px'}">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<u-popup
|
||||||
|
:show="show"
|
||||||
|
mode="right"
|
||||||
|
:safeAreaInsetTop='true'
|
||||||
|
:closeOnClickOverlay='false'
|
||||||
|
@close="close"
|
||||||
|
@open="myShow">
|
||||||
|
<view :style="{padding:'10px',width:'250px'}">
|
||||||
|
<u-toast ref="uToast"></u-toast>
|
||||||
|
<text class="title">按预警状态</text>
|
||||||
|
<u-checkbox-group
|
||||||
|
placement="row"
|
||||||
|
v-model="check1"
|
||||||
|
:style="{padding:'10px 0px 20px 0px'}"
|
||||||
|
>
|
||||||
|
<u-checkbox name="0" label="新产生" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="30" label="已关闭" class="checkItem"></u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
<text class="title">按危险等级</text>
|
||||||
|
<u-checkbox-group
|
||||||
|
placement="row"
|
||||||
|
v-model="check2"
|
||||||
|
:style="{padding:'10px 0px 20px 0px'}"
|
||||||
|
>
|
||||||
|
<u-checkbox name="6" label="立即转移" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="5" label="准备转移" class="checkItem"></u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
<text class="title">按预警时间</text>
|
||||||
|
<div :style="{display:'flex',marginTop:'10px'}">
|
||||||
|
<view
|
||||||
|
class="tmPicker"
|
||||||
|
@click="showStmPicker = true"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
>{{getStmStr}}<u-icon name="calendar" size="18" color="#909399"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text :style="{width:'20%',lineHeight:'32px',textAlign:'center'}">至</text>
|
||||||
|
</div>
|
||||||
|
<div :style="{display:'flex',marginTop:'10px'}">
|
||||||
|
<view
|
||||||
|
class="tmPicker"
|
||||||
|
@click="showEtmPicker = true"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
>{{getEtmStr}}<u-icon name="calendar" size="18" color="#909399"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text :style="{width:'20%'}"></text>
|
||||||
|
</div>
|
||||||
|
<div :style="{position:'absolute',bottom:'20px',right:'20px',display:'flex'}">
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px',marginRight:'10px'}"
|
||||||
|
text="重置"
|
||||||
|
@click="reSet"
|
||||||
|
></u-button>
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px'}"
|
||||||
|
color="rgba(217, 0, 27, 1)"
|
||||||
|
type="primary"
|
||||||
|
text="确定"
|
||||||
|
@click="submit"
|
||||||
|
></u-button>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showStmPicker"
|
||||||
|
v-model="stm"
|
||||||
|
mode="datetime"
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="showStmPicker = false"
|
||||||
|
@cancel="showStmPicker = false"
|
||||||
|
@close="showStmPicker = false"
|
||||||
|
>
|
||||||
|
</u-datetime-picker>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showEtmPicker"
|
||||||
|
v-model="etm"
|
||||||
|
mode="datetime"
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="showEtmPicker = false"
|
||||||
|
@cancel="showEtmPicker = false"
|
||||||
|
@close="showEtmPicker = false"
|
||||||
|
>
|
||||||
|
</u-datetime-picker>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
const warnstatus = {
|
||||||
|
'0':'新产生',
|
||||||
|
'10':'已内部告警',
|
||||||
|
'20':'已外部告警',
|
||||||
|
'30':'关闭预警',
|
||||||
|
'70':'灾情上报',
|
||||||
|
}
|
||||||
|
const warngrade = {
|
||||||
|
'5':'准备转移',
|
||||||
|
'6':'立即转移'
|
||||||
|
}
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
warnstatus:warnstatus,
|
||||||
|
warngrade:warngrade,
|
||||||
|
show:false,
|
||||||
|
showStmPicker:false,
|
||||||
|
showEtmPicker:false,
|
||||||
|
searchVal:'',
|
||||||
|
stm:Number(moment(new Date()).add(-1,'days')),
|
||||||
|
etm:Number(new Date()),
|
||||||
|
check1:['0','30'],
|
||||||
|
check2:['6','5'],
|
||||||
|
list:[]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getStmStr() {
|
||||||
|
return moment(this.stm).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
},
|
||||||
|
getEtmStr() {
|
||||||
|
return moment(this.etm).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
},
|
||||||
|
getSearchVal() {
|
||||||
|
if(this.searchVal){
|
||||||
|
return this.list.filter(o => o.adnm && o.adnm?.indexOf(this.searchVal)>-1)
|
||||||
|
}else{
|
||||||
|
return this.list
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
myShow() {
|
||||||
|
this.show = true
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
reSet() {
|
||||||
|
this.stm = Number(moment(new Date()).add(-1,'days'))
|
||||||
|
this.etm = Number(new Date())
|
||||||
|
this.check1 = ['0','30']
|
||||||
|
this.check2 = ['6','5']
|
||||||
|
},
|
||||||
|
async submit() {
|
||||||
|
if(!moment(this.stm).isBefore(this.etm)){
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "开始时间需小于结束时间",
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
try{
|
||||||
|
const params = {
|
||||||
|
stm:moment(this.stm).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
etm:moment(this.etm).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
warnstatusids:this.check1,
|
||||||
|
warngradeids:this.check2
|
||||||
|
}
|
||||||
|
const res = await uni.$http.post('/gunshiApp/xfflood/current/situation/app/flood/warn',params)
|
||||||
|
this.list = res.data.data
|
||||||
|
this.close()
|
||||||
|
}catch(e){
|
||||||
|
//TODO handle the exception
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请求失败",
|
||||||
|
})
|
||||||
|
setTimeout(()=>{
|
||||||
|
this.close()
|
||||||
|
},1000)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
toSh(record) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/forewarning/shInformation/shInformation?obj='+JSON.stringify(record) // 跳转到对应路径的页面
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.submit()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.tabBody{
|
||||||
|
background-color: rgba(247, 247, 247, 1);
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.searchBox{
|
||||||
|
height: 62px;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.tableHead{
|
||||||
|
width: 97%;
|
||||||
|
margin-top: 5px;
|
||||||
|
height: 50px;
|
||||||
|
background-color: #e4f2fe;
|
||||||
|
display: flex;
|
||||||
|
color: #208FEE;
|
||||||
|
}
|
||||||
|
.tableBody{
|
||||||
|
width: 97%;
|
||||||
|
height: calc( 100vh - 214px );
|
||||||
|
background-color: #f7f7f7;//#ffffff;
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
||||||
|
.tableRow{
|
||||||
|
width: 100%;
|
||||||
|
height: 46px;
|
||||||
|
display: flex;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.td{
|
||||||
|
text-align: center;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
.t1{
|
||||||
|
width: 25%;
|
||||||
|
color: #208FEE;
|
||||||
|
}
|
||||||
|
.t2{
|
||||||
|
width: 37%;
|
||||||
|
}
|
||||||
|
.t3{
|
||||||
|
width: 18%;
|
||||||
|
}
|
||||||
|
.t4{
|
||||||
|
width: 20%;
|
||||||
|
}
|
||||||
|
.searchBox_left{
|
||||||
|
width: 82%;
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
.searchBox_right{
|
||||||
|
width: 18%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.searchBox_right_btn{
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.is-hover{
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
.title{
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.checkItem{
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.tmPicker{
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
border: 1px solid rgba(240, 240, 240, 1);
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
// padding-left: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,119 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
title="山洪预警详情"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<div class="bodyBg">
|
||||||
|
<div class="mybody">
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">乡镇:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="xz"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">危险等级:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="wxdj"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">预警依据:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--textarea
|
||||||
|
v-model="yjyj"
|
||||||
|
:disabled='true'
|
||||||
|
height=300
|
||||||
|
></u--textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">预警时间:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="yjsj"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
xz:'',
|
||||||
|
wxdj:'',
|
||||||
|
yjyj:'',
|
||||||
|
yjsj:'',
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
},
|
||||||
|
onLoad(props){
|
||||||
|
const record = JSON.parse(props.obj)
|
||||||
|
this.xz = record.adnm
|
||||||
|
this.wxdj = {'5':'准备转移','6':'立即转移'}[record.warngradeid]
|
||||||
|
this.yjyj = record.warndesc
|
||||||
|
this.yjsj = record.warnstm
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.bodyBg{
|
||||||
|
background-color: rgba(247, 247, 247, 1);
|
||||||
|
height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.mybody{
|
||||||
|
margin-top: 50px;
|
||||||
|
padding-top: 10px;
|
||||||
|
width: 97%;
|
||||||
|
height: 92%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
.row{
|
||||||
|
display: flex;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
.lf{
|
||||||
|
width: 25%;
|
||||||
|
min-height: 40px;
|
||||||
|
text-align: right;
|
||||||
|
line-height: 38px;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
.rf{
|
||||||
|
width: 75%;
|
||||||
|
min-height: 40px;
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-top: 1px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,262 @@
|
||||||
|
<template>
|
||||||
|
<view class="tabBody">
|
||||||
|
<div class="searchBox">
|
||||||
|
<div class="searchBox_left">
|
||||||
|
<u-search
|
||||||
|
shape="square"
|
||||||
|
:clearabled="true"
|
||||||
|
:showAction=false
|
||||||
|
v-model="searchVal"
|
||||||
|
placeholder='请输入站名'
|
||||||
|
height=40
|
||||||
|
>
|
||||||
|
</u-search>
|
||||||
|
</div>
|
||||||
|
<div class="searchBox_right">
|
||||||
|
<view
|
||||||
|
hover-class="is-hover"
|
||||||
|
class="searchBox_right_btn"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="myShow"
|
||||||
|
>
|
||||||
|
<u--image :src="'../../static/images/filter.png'" width="22px" height="22px"></u--image>
|
||||||
|
</view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="tableHead">
|
||||||
|
<div class="td t1">站名</div>
|
||||||
|
<div class="td t2">水位(m)</div>
|
||||||
|
<div class="td t3">类型</div>
|
||||||
|
<div class="td t4">预警类型</div>
|
||||||
|
</div>
|
||||||
|
<div class="tableBody">
|
||||||
|
<div v-for="(item,index) in getSearchVal" class="tableRow">
|
||||||
|
<div class="td t1" @click="toSh(item)">{{item.stnm}}</div>
|
||||||
|
<div class="td t2">{{Number(item.rz).toFixed(2)}}({{Number(item.calState===1?(item.rz-item.calFloodLev):item.desState===1?(item.rz-item.desFloodLev):(item.afsltdz)).toFixed(2)}})</div>
|
||||||
|
<div class="td t3">{{sttp[item.sttp]}}</div>
|
||||||
|
<div class="td t4">{{item.calState===1?'超校核水位':item.desState===1?'超设计水位':item.flState===1?'超汛限水位':'-'}}</div>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'80px'}">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<u-popup
|
||||||
|
:show="show"
|
||||||
|
mode="right"
|
||||||
|
:safeAreaInsetTop='true'
|
||||||
|
:closeOnClickOverlay='false'
|
||||||
|
@close="close"
|
||||||
|
@open="myShow">
|
||||||
|
<view :style="{padding:'10px',width:'250px'}">
|
||||||
|
<u-toast ref="uToast"></u-toast>
|
||||||
|
<text class="title">按类型</text>
|
||||||
|
<u-checkbox-group
|
||||||
|
placement="row"
|
||||||
|
v-model="check1"
|
||||||
|
:style="{padding:'10px 0px 20px 0px'}"
|
||||||
|
>
|
||||||
|
<u-checkbox name="SK" label="水库" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="SW" label="水文" class="checkItem"></u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
<text class="title">按预警类型</text>
|
||||||
|
<u-checkbox-group
|
||||||
|
placement="col"
|
||||||
|
v-model="check2"
|
||||||
|
:style="{padding:'10px 0px 20px 0px'}"
|
||||||
|
>
|
||||||
|
<u-checkbox name="1" label="超校核洪水位" :style="{marginTop:'5px'}" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="2" label="超设计洪水位" :style="{marginTop:'5px'}" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="3" label="超汛限水位" :style="{marginTop:'5px'}" class="checkItem"></u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
<div :style="{position:'absolute',bottom:'20px',right:'20px',display:'flex'}">
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px',marginRight:'10px'}"
|
||||||
|
text="重置"
|
||||||
|
@click="reSet"
|
||||||
|
></u-button>
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px'}"
|
||||||
|
color="rgba(217, 0, 27, 1)"
|
||||||
|
type="primary"
|
||||||
|
text="确定"
|
||||||
|
@click="submit"
|
||||||
|
></u-button>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
const sttp = {
|
||||||
|
RR:'水库水文站',
|
||||||
|
ZQ:'河道水文站',
|
||||||
|
ZP:'河道水文站',
|
||||||
|
}
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
sttp:sttp,
|
||||||
|
show:false,
|
||||||
|
searchVal:'',
|
||||||
|
check1:['SK','SW'],
|
||||||
|
check2:['1','2','3'],
|
||||||
|
list:[]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getSearchVal() {
|
||||||
|
if(this.searchVal){
|
||||||
|
return this.list.filter(o => o.adnm && o.adnm?.indexOf(this.searchVal)>-1)
|
||||||
|
}else{
|
||||||
|
return this.list
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
myShow() {
|
||||||
|
this.show = true
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
reSet() {
|
||||||
|
this.check1 = ['SK','SW']
|
||||||
|
this.check2 = ['1','2','3']
|
||||||
|
},
|
||||||
|
async submit() {
|
||||||
|
|
||||||
|
try{
|
||||||
|
const params = {
|
||||||
|
sources:this.check1,
|
||||||
|
types:this.check2
|
||||||
|
}
|
||||||
|
const res = await uni.$http.post('/gunshiApp/xfflood/current/situation/app/res/warn',params)
|
||||||
|
console.log(res)
|
||||||
|
this.list = res.data.data
|
||||||
|
this.close()
|
||||||
|
}catch(e){
|
||||||
|
//TODO handle the exception
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请求失败",
|
||||||
|
})
|
||||||
|
setTimeout(()=>{
|
||||||
|
this.close()
|
||||||
|
},1000)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
toSh(params) {
|
||||||
|
console.log(`/pages/skDetail/skDetail?stcd=${params.stcd}&stnm=${params.stnm}&source=${params.source}&afsltdz=${params.afsltdz}&flLowLimLev=${params.flLowLimLev}&desFloodLev=${params.desFloodLev}&calFloodLev=${params.calFloodLev}&resCode=${params.resCode}`)
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pages/skDetail/skDetail?stcd=${params.stcd}&stnm=${params.stnm}&source=${params.source}&afsltdz=${params.afsltdz}&flLowLimLev=${params.flLowLimLev}&desFloodLev=${params.desFloodLev}&calFloodLev=${params.calFloodLev}&resCode=${params.resCode}`
|
||||||
|
})
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.submit()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.tabBody{
|
||||||
|
background-color: rgba(247, 247, 247, 1);
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.searchBox{
|
||||||
|
height: 62px;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.tableHead{
|
||||||
|
width: 97%;
|
||||||
|
margin-top: 5px;
|
||||||
|
height: 50px;
|
||||||
|
background-color: #e4f2fe;
|
||||||
|
display: flex;
|
||||||
|
color: #208FEE;
|
||||||
|
}
|
||||||
|
.tableBody{
|
||||||
|
width: 97%;
|
||||||
|
height: calc( 100vh - 214px );
|
||||||
|
background-color: #f7f7f7;//#ffffff;
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
||||||
|
.tableRow{
|
||||||
|
width: 100%;
|
||||||
|
height: 46px;
|
||||||
|
display: flex;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.td{
|
||||||
|
text-align: center;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
.t1{
|
||||||
|
width: 25%;
|
||||||
|
color: #208FEE;
|
||||||
|
}
|
||||||
|
.t2{
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
.t3{
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
.t4{
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
.searchBox_left{
|
||||||
|
width: 82%;
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
.searchBox_right{
|
||||||
|
width: 18%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.searchBox_right_btn{
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.is-hover{
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
.title{
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.checkItem{
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.tmPicker{
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
border: 1px solid rgba(240, 240, 240, 1);
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
// padding-left: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,306 @@
|
||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="nav_bar">
|
||||||
|
<!-- <u-navbar title="查看" @rightClick="rightClick" :autoBack="true">
|
||||||
|
</u-navbar> -->
|
||||||
|
<u-icon
|
||||||
|
name="arrow-left"
|
||||||
|
@click="rightClick"
|
||||||
|
color="#2979ff"
|
||||||
|
size="28"
|
||||||
|
></u-icon>
|
||||||
|
<view class="nav_bar_tit"> 查看 </view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 上一条下一条 -->
|
||||||
|
<view class="tabs_h">
|
||||||
|
<div
|
||||||
|
class="leftTab"
|
||||||
|
:class="{ activetextTypeTab: showTextTypeTab == 1 }"
|
||||||
|
@click="perClick(1)"
|
||||||
|
>
|
||||||
|
上一条
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="rightTab"
|
||||||
|
:class="{ activetextTypeTab: showTextTypeTab == 2 }"
|
||||||
|
@click="nextClick(2)"
|
||||||
|
>
|
||||||
|
下一条
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- info -->
|
||||||
|
<view class="info">
|
||||||
|
<u-form
|
||||||
|
labelPosition="left"
|
||||||
|
:model="infoForm"
|
||||||
|
ref="infoForm"
|
||||||
|
labelWidth="100"
|
||||||
|
>
|
||||||
|
<u-form-item
|
||||||
|
label="工程类型"
|
||||||
|
prop="projectType"
|
||||||
|
borderBottom
|
||||||
|
ref="item3"
|
||||||
|
>
|
||||||
|
<u--input
|
||||||
|
v-model="infoForm.projectType"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
border="surround"
|
||||||
|
disabled
|
||||||
|
></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 工程名称 -->
|
||||||
|
<u-form-item
|
||||||
|
label="工程名称"
|
||||||
|
prop="projectName"
|
||||||
|
borderBottom
|
||||||
|
ref="item3"
|
||||||
|
>
|
||||||
|
<u--input
|
||||||
|
v-model="infoForm.projectName"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
border="surround"
|
||||||
|
disabled
|
||||||
|
></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 是否发电 -->
|
||||||
|
<u-form-item
|
||||||
|
label="是否发电"
|
||||||
|
prop="isPowerGeneration"
|
||||||
|
borderBottom
|
||||||
|
ref="item3"
|
||||||
|
>
|
||||||
|
<u--input
|
||||||
|
v-model="infoForm.isPowerGeneration"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
border="surround"
|
||||||
|
disabled
|
||||||
|
></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 是否泄洪 -->
|
||||||
|
<u-form-item
|
||||||
|
label="是否泄洪"
|
||||||
|
prop="isFloodRelease"
|
||||||
|
borderBottom
|
||||||
|
ref="item3"
|
||||||
|
>
|
||||||
|
<u--input
|
||||||
|
v-model="infoForm.isFloodRelease"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
border="surround"
|
||||||
|
disabled
|
||||||
|
></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 水位(m) -->
|
||||||
|
<u-form-item label="水位(m)" prop="waterLevel" borderBottom ref="item3">
|
||||||
|
<u--input
|
||||||
|
v-model="infoForm.waterLevel"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
border="surround"
|
||||||
|
disabled
|
||||||
|
></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 入库流量 (m³/s)： -->
|
||||||
|
<u-form-item
|
||||||
|
label="入库流量(m³/s)"
|
||||||
|
prop="inflowVolume"
|
||||||
|
borderBottom
|
||||||
|
ref="item3"
|
||||||
|
>
|
||||||
|
<u--input
|
||||||
|
v-model="infoForm.inflowVolume"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
border="surround"
|
||||||
|
disabled
|
||||||
|
></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<!-- 出库流量 (m³/s)： -->
|
||||||
|
<u-form-item
|
||||||
|
label="出库流量(m³/s)"
|
||||||
|
prop="outflowVolume"
|
||||||
|
borderBottom
|
||||||
|
ref="item3"
|
||||||
|
>
|
||||||
|
<u--input
|
||||||
|
v-model="infoForm.outflowVolume"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
border="surround"
|
||||||
|
disabled
|
||||||
|
></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 其他运行情况 -->
|
||||||
|
<u-form-item
|
||||||
|
label="其他运行情况"
|
||||||
|
prop="remark"
|
||||||
|
borderBottom
|
||||||
|
ref="item3"
|
||||||
|
>
|
||||||
|
<u--textarea
|
||||||
|
v-model="infoForm.remark"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
disabled
|
||||||
|
></u--textarea>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 上报人 -->
|
||||||
|
<u-form-item label="上报人" prop="reporter" borderBottom ref="item3">
|
||||||
|
<u--input
|
||||||
|
v-model="infoForm.reporter"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
border="surround"
|
||||||
|
disabled
|
||||||
|
></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 上报单位 -->
|
||||||
|
<u-form-item
|
||||||
|
label="上报单位"
|
||||||
|
prop="reportUnit"
|
||||||
|
borderBottom
|
||||||
|
ref="item3"
|
||||||
|
>
|
||||||
|
<u--input
|
||||||
|
v-model="infoForm.reportUnit"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
border="surround"
|
||||||
|
disabled
|
||||||
|
></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 上报时间 -->
|
||||||
|
<u-form-item
|
||||||
|
label="上报时间"
|
||||||
|
prop="reportTime"
|
||||||
|
borderBottom
|
||||||
|
ref="item3"
|
||||||
|
>
|
||||||
|
<u--input
|
||||||
|
v-model="infoForm.reportTime"
|
||||||
|
placeholder="请输入内容"
|
||||||
|
border="surround"
|
||||||
|
disabled
|
||||||
|
></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 附件 -->
|
||||||
|
<u-form-item
|
||||||
|
label="附件"
|
||||||
|
prop="checkboxValue1"
|
||||||
|
borderBottom
|
||||||
|
ref="item3"
|
||||||
|
>
|
||||||
|
<image
|
||||||
|
:showLoading="true"
|
||||||
|
:src="src"
|
||||||
|
width="80px"
|
||||||
|
height="80px"
|
||||||
|
mode="aspectFit"
|
||||||
|
@click="toggleZoom"
|
||||||
|
:style="{ transform: `scale(${zoomed ? 2 : 1})` }"
|
||||||
|
></image>
|
||||||
|
</u-form-item>
|
||||||
|
</u-form>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
export default {
|
||||||
|
props: ['info'],
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
showTextTypeTab: 0,
|
||||||
|
src: '../../../static/tabs/bigImg.png',
|
||||||
|
infoForm: {
|
||||||
|
checkboxValue1: '水库',
|
||||||
|
reporter: '' // 上报人
|
||||||
|
},
|
||||||
|
zoomed: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
mounted () {
|
||||||
|
console.log('info', this.info)
|
||||||
|
this.infoForm = this.info
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 切换图片放大状态的方法
|
||||||
|
toggleZoom () {
|
||||||
|
this.zoomed = !this.zoomed
|
||||||
|
},
|
||||||
|
perClick (val) {
|
||||||
|
this.showTextTypeTab = val
|
||||||
|
},
|
||||||
|
nextClick (val) {
|
||||||
|
this.showTextTypeTab = val
|
||||||
|
},
|
||||||
|
// 返回按钮
|
||||||
|
rightClick () {
|
||||||
|
console.log('rightClick')
|
||||||
|
this.$emit('rightClick', false)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.container {
|
||||||
|
font-size: 14px;
|
||||||
|
background-color: #f3f5f8;
|
||||||
|
}
|
||||||
|
.tabs_h {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
height: 56rpx;
|
||||||
|
line-height: 88rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.leftTab {
|
||||||
|
width: 80px;
|
||||||
|
}
|
||||||
|
.rightTab {
|
||||||
|
width: 80px;
|
||||||
|
}
|
||||||
|
.activetextTypeTab,
|
||||||
|
.activetextTypeTab:hover {
|
||||||
|
// border-bottom: 3rpx solid #2286f6;
|
||||||
|
color: #026be0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nav_bar {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 30px;
|
||||||
|
padding-top: 20px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
box-shadow: 0 5px 10px -8px #dfdfdf inset;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
}
|
||||||
|
.nav_bar_tit {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.info {
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
// text-align: right;
|
||||||
|
padding: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fl {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: left;
|
||||||
|
}
|
||||||
|
.flsb {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.u-image {
|
||||||
|
width: 100%; /* 或者其他尺寸 */
|
||||||
|
transition: transform 0.3s; /* 平滑的放大效果 */
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,521 @@
|
||||||
|
<template>
|
||||||
|
<view class="container" v-if="isdetail">
|
||||||
|
<view class="nav_bar">
|
||||||
|
<!-- <u-icon name="arrow_left" color="#000" size="28"></u-icon> -->
|
||||||
|
<view class="nav_bar_tit"> 工情信息 </view>
|
||||||
|
</view>
|
||||||
|
<!-- tabs -->
|
||||||
|
<view class="table_h">
|
||||||
|
<div
|
||||||
|
class="leftTab"
|
||||||
|
:class="{ activetextTypeTab: showTextTypeTab == 1 }"
|
||||||
|
@click="tabChange(1)"
|
||||||
|
>
|
||||||
|
运行情况
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="rightTab"
|
||||||
|
:class="{ activetextTypeTab: showTextTypeTab == 2 }"
|
||||||
|
@click="tabChange(2)"
|
||||||
|
>
|
||||||
|
工程险情
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<!-- 搜索区域 -->
|
||||||
|
<view class="search">
|
||||||
|
<view class="search_sear">
|
||||||
|
<input
|
||||||
|
class="searchInput"
|
||||||
|
confirm-type="search"
|
||||||
|
placeholder-style="color:#bbb"
|
||||||
|
v-model="saerchValue"
|
||||||
|
placeholder="请输入工程名称/上报人"
|
||||||
|
@input="myinput"
|
||||||
|
@confirm="myconfirm"
|
||||||
|
/>
|
||||||
|
<icon class="icon-small" type="search" size="14"></icon>
|
||||||
|
|
||||||
|
<icon
|
||||||
|
v-if="saerchValue.length > 0"
|
||||||
|
class="clear-icon"
|
||||||
|
type="clear"
|
||||||
|
size="16"
|
||||||
|
@click="clearnClick"
|
||||||
|
></icon>
|
||||||
|
</view>
|
||||||
|
<view class="more">
|
||||||
|
<image
|
||||||
|
style="width: 20px; height: 20px; margin-right: 10px"
|
||||||
|
src="../../static/images/filter.png"
|
||||||
|
@click="openpop"
|
||||||
|
></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 列表区域 -->
|
||||||
|
<view class="table_info" v-if="list.length > 0">
|
||||||
|
<p class="p" v-if="total > 0">共{{ total }}条信息</p>
|
||||||
|
<view v-for="(item, index) in list" :key="index">
|
||||||
|
<view class="table_Page" @tap="toDetail(item)">
|
||||||
|
<view class="info">
|
||||||
|
<h4>{{ item.projectName }}</h4>
|
||||||
|
<p class="info_P">
|
||||||
|
<span class="info_n">{{ item.reporter }}</span>
|
||||||
|
<span>{{ item.reportTime }}</span>
|
||||||
|
</p>
|
||||||
|
</view>
|
||||||
|
<view v-if="item.isRead == 0" class="badge"
|
||||||
|
><u-badge :isDot="true"></u-badge
|
||||||
|
></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 无数据 -->
|
||||||
|
<view class="table_info" v-if="list.length == 0">
|
||||||
|
<view class="table_Page" @tap="toDetail('item')">
|
||||||
|
<view class="info">
|
||||||
|
<h4>朝阳寺水库</h4>
|
||||||
|
<p class="info_P">
|
||||||
|
<span class="info_n">刘明</span>
|
||||||
|
<span>2024-03-06 13:50:47</span>
|
||||||
|
</p>
|
||||||
|
</view>
|
||||||
|
<view class="badge"><u-badge :isDot="true"></u-badge></view> </view
|
||||||
|
></view>
|
||||||
|
|
||||||
|
<!-- 筛选抽屉 -->
|
||||||
|
<view class="popup" v-if="popupOpen">
|
||||||
|
<u-popup
|
||||||
|
:show="popupOpen"
|
||||||
|
mode="bottom"
|
||||||
|
@close="() => (this.popupOpen = false)"
|
||||||
|
>
|
||||||
|
<view style="padding: 30px 20px">
|
||||||
|
<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
|
||||||
|
<u-form
|
||||||
|
labelPosition="left"
|
||||||
|
:model="model1"
|
||||||
|
ref="uForm"
|
||||||
|
labelWidth="100"
|
||||||
|
>
|
||||||
|
<u-form-item
|
||||||
|
label="工程类型"
|
||||||
|
prop="checkboxValue1"
|
||||||
|
borderBottom
|
||||||
|
labelWidth="80"
|
||||||
|
ref="item3"
|
||||||
|
>
|
||||||
|
<u-checkbox-group
|
||||||
|
v-model="model1.userInfo.checkboxValue1"
|
||||||
|
shape="square"
|
||||||
|
>
|
||||||
|
<u-checkbox
|
||||||
|
:customStyle="{ marginRight: '16px' }"
|
||||||
|
v-for="(item, index) in checkboxList1"
|
||||||
|
:key="index"
|
||||||
|
:label="item.name"
|
||||||
|
:name="item.name"
|
||||||
|
>
|
||||||
|
</u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 时间 -->
|
||||||
|
<u-form-item
|
||||||
|
label="上报开始时间"
|
||||||
|
prop="userInfo.start"
|
||||||
|
borderBottom
|
||||||
|
@click="
|
||||||
|
isTime = true
|
||||||
|
hideKeyboard()
|
||||||
|
"
|
||||||
|
ref="item1"
|
||||||
|
>
|
||||||
|
<u-input
|
||||||
|
v-model="model1.userInfo.start"
|
||||||
|
border="none"
|
||||||
|
disabled
|
||||||
|
disabledColor="#ffffff"
|
||||||
|
placeholder="请选择上报开始时间"
|
||||||
|
></u-input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item
|
||||||
|
label="上报结束时间"
|
||||||
|
prop="userInfo.end"
|
||||||
|
borderBottom
|
||||||
|
@click="isTime2 = true"
|
||||||
|
ref="item1"
|
||||||
|
>
|
||||||
|
<u--input
|
||||||
|
v-model="model1.userInfo.end"
|
||||||
|
border="none"
|
||||||
|
disabled
|
||||||
|
disabledColor="#ffffff"
|
||||||
|
placeholder="请选择上报结束时间"
|
||||||
|
></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
</u-form>
|
||||||
|
<view class="bottom">
|
||||||
|
<u-button
|
||||||
|
text="重置"
|
||||||
|
customStyle="margin: 10px"
|
||||||
|
@click="reset"
|
||||||
|
></u-button>
|
||||||
|
<u-button
|
||||||
|
type="primary"
|
||||||
|
text="确认"
|
||||||
|
customStyle="margin: 10px"
|
||||||
|
@click="submit"
|
||||||
|
></u-button>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="isTime"
|
||||||
|
v-model="valueTime"
|
||||||
|
mode="datetime"
|
||||||
|
@confirm="confirm"
|
||||||
|
@cancel="cancel"
|
||||||
|
></u-datetime-picker>
|
||||||
|
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="isTime2"
|
||||||
|
v-model="valueTime2"
|
||||||
|
mode="datetime"
|
||||||
|
@confirm="confirm2"
|
||||||
|
@cancel="cancel2"
|
||||||
|
></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="container" v-else>
|
||||||
|
<detail :info="detailInfo" @rightClick="rightClick"></detail>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
import detail from './detail/index.vue'
|
||||||
|
export default {
|
||||||
|
components: { detail },
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
isdetail: true,
|
||||||
|
detailInfo: {},
|
||||||
|
showTextTypeTab: 1,
|
||||||
|
saerchValue: '',
|
||||||
|
popupOpen: false, //抽屉打开,
|
||||||
|
// 基本案列数据
|
||||||
|
checkboxList1: [
|
||||||
|
{
|
||||||
|
name: '水库',
|
||||||
|
disabled: false,
|
||||||
|
key: 'sk'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '水电站',
|
||||||
|
disabled: false,
|
||||||
|
key: 'sdz'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
isTime: false,
|
||||||
|
valueTime: Number(moment()),
|
||||||
|
valueTime2: Number(moment()),
|
||||||
|
isTime2: false,
|
||||||
|
model1: {
|
||||||
|
userInfo: {
|
||||||
|
start: '',
|
||||||
|
end: '',
|
||||||
|
checkboxValue1: ['水库', '水电站']
|
||||||
|
}
|
||||||
|
},
|
||||||
|
list: {},
|
||||||
|
total: '',
|
||||||
|
isfixed: false,
|
||||||
|
params: {
|
||||||
|
pageSo: { pageSize: 10, pageNumber: 0 },
|
||||||
|
isRead: 0,
|
||||||
|
projectName: this.saerchValue
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad () {
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
// 页面滚动时，固定头部
|
||||||
|
onPageScroll () {
|
||||||
|
this.isfixed = true
|
||||||
|
},
|
||||||
|
// 下拉刷新
|
||||||
|
onPullDownRefresh () {
|
||||||
|
uni.showToast({
|
||||||
|
title: '努力加载中...'
|
||||||
|
})
|
||||||
|
this.params.pageSo.pageNumber = 0
|
||||||
|
this.list = []
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
// 上拉加载
|
||||||
|
onReachBottom () {
|
||||||
|
if (this.list.length >= this.total) {
|
||||||
|
uni.showToast({
|
||||||
|
title: '没有更多的数据了1'
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
rightClick (val) {
|
||||||
|
this.isdetail = true
|
||||||
|
},
|
||||||
|
toDetail (item) {
|
||||||
|
console.log('item', item)
|
||||||
|
this.detailInfo = item
|
||||||
|
this.isdetail = false
|
||||||
|
// uni.navigateTo({
|
||||||
|
// url: './detail/index'
|
||||||
|
// })
|
||||||
|
},
|
||||||
|
async getData () {
|
||||||
|
let obj = this.params
|
||||||
|
this.params.pageSo.pageNumber++
|
||||||
|
if (this.model1.userInfo.start != '' && this.model1.userInfo.end != '') {
|
||||||
|
obj.timeSo = {
|
||||||
|
start: this.model1.userInfo.start,
|
||||||
|
end: this.model1.userInfo.end
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
this.list = []
|
||||||
|
try {
|
||||||
|
if (this.showTextTypeTab === 1) {
|
||||||
|
let res = await uni.$http.post(
|
||||||
|
'/gunshiApp/xfflood/xfProjectRun/queryPage',
|
||||||
|
obj
|
||||||
|
)
|
||||||
|
|
||||||
|
let res2 = await uni.$http.post(
|
||||||
|
'/gunshiApp/xfflood/xfProjectRun/queryPage',
|
||||||
|
{ ...obj, isRead: 1 }
|
||||||
|
)
|
||||||
|
this.total = res.data.data.total + res2.data.data.total
|
||||||
|
|
||||||
|
this.list = res.data.data.records.concat(res2.data.data.records)
|
||||||
|
console.log('--1-', res.data.data, res.data.data.records)
|
||||||
|
console.log('--2-', res2.data.data, this.total, this.list)
|
||||||
|
} else {
|
||||||
|
let res = await uni.$http.post(
|
||||||
|
'/gunshiApp/xfflood/xfProjectIncident/queryPage',
|
||||||
|
obj
|
||||||
|
)
|
||||||
|
let res2 = await uni.$http.post(
|
||||||
|
'/gunshiApp/xfflood/xfProjectIncident/queryPage',
|
||||||
|
{ ...obj, isRead: 1 }
|
||||||
|
)
|
||||||
|
this.total = res.data.data.total + res2.data.data.total
|
||||||
|
this.list = res.data.data.records.concat(res2.data.data.records)
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
tabChange (val) {
|
||||||
|
console.log('tabChange0', val)
|
||||||
|
this.showTextTypeTab = val
|
||||||
|
this.params.pageSo.pageNumber = 0
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
submit () {
|
||||||
|
this.popupOpen = false
|
||||||
|
console.log('res', this.$refs.uForm)
|
||||||
|
// 如果有错误，会在catch中返回报错信息数组，校验通过则在then中返回true
|
||||||
|
// this.$refs.uForm
|
||||||
|
// .validate()
|
||||||
|
// .then(res => {
|
||||||
|
// uni.$u.toast('校验通过')
|
||||||
|
// this.popupOpen = false
|
||||||
|
// })
|
||||||
|
// .catch(errors => {
|
||||||
|
// uni.$u.toast('校验失败')
|
||||||
|
// })
|
||||||
|
},
|
||||||
|
reset () {
|
||||||
|
const validateList = [
|
||||||
|
'userInfo.start',
|
||||||
|
'userInfo.end',
|
||||||
|
'userInfo.checkboxValue1'
|
||||||
|
]
|
||||||
|
this.$refs.uForm.resetFields()
|
||||||
|
this.$refs.uForm.clearValidate()
|
||||||
|
setTimeout(() => {
|
||||||
|
this.$refs.uForm.clearValidate(validateList)
|
||||||
|
// 或者使用 this.$refs.uForm.clearValidate()
|
||||||
|
}, 10)
|
||||||
|
this.model1 = {
|
||||||
|
userInfo: {
|
||||||
|
start: '',
|
||||||
|
end: '',
|
||||||
|
checkboxValue1: ['水库', '水电站']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
confirm (val) {
|
||||||
|
console.log(
|
||||||
|
'点击确定按钮时触发',
|
||||||
|
val.value,
|
||||||
|
moment(val.value).format('YYYY-MM-DD HH:mm')
|
||||||
|
)
|
||||||
|
this.valueTime = Number(val)
|
||||||
|
this.model1.userInfo.start = moment(val.value).format('YYYY-MM-DD HH:mm')
|
||||||
|
this.isTime = false
|
||||||
|
},
|
||||||
|
cancel () {
|
||||||
|
console.log('取消')
|
||||||
|
this.isTime = false
|
||||||
|
},
|
||||||
|
confirm2 (val) {
|
||||||
|
console.log(
|
||||||
|
'点击确定按钮时触发',
|
||||||
|
val.value,
|
||||||
|
moment(val.value).format('YYYY-MM-DD HH:mm')
|
||||||
|
)
|
||||||
|
this.valueTime2 = Number(val)
|
||||||
|
this.model1.userInfo.end = moment(val.value).format('YYYY-MM-DD HH:mm')
|
||||||
|
this.isTime2 = false
|
||||||
|
this.params.timeSo.end = this.model1.userInfo.end
|
||||||
|
},
|
||||||
|
cancel2 () {
|
||||||
|
console.log('取消')
|
||||||
|
this.isTime2 = false
|
||||||
|
},
|
||||||
|
|
||||||
|
openpop () {
|
||||||
|
this.popupOpen = true
|
||||||
|
},
|
||||||
|
myinput () {},
|
||||||
|
myconfirm () {},
|
||||||
|
clearnClick () {
|
||||||
|
console.log('打印了clearnClick', this.saerchValue)
|
||||||
|
this.saerchValue = ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.container {
|
||||||
|
font-size: 14px;
|
||||||
|
background-color: #f3f5f8;
|
||||||
|
}
|
||||||
|
.table_info {
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
padding: 20px;
|
||||||
|
.p {
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.table_Page {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
margin-top: 12rpx;
|
||||||
|
padding-bottom: 12rpx;
|
||||||
|
|
||||||
|
.info_P {
|
||||||
|
color: #a2a2a2;
|
||||||
|
font-size: 24rpx;
|
||||||
|
.info_n {
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.table_h {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
height: 56rpx;
|
||||||
|
line-height: 88rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.leftTab {
|
||||||
|
width: 80px;
|
||||||
|
}
|
||||||
|
.rightTab {
|
||||||
|
width: 80px;
|
||||||
|
}
|
||||||
|
.activetextTypeTab,
|
||||||
|
.activetextTypeTab:hover {
|
||||||
|
// border-bottom: 3rpx solid #2286f6;
|
||||||
|
color: #026be0;
|
||||||
|
}
|
||||||
|
.nav_bar {
|
||||||
|
// display: flex;
|
||||||
|
// justify-content: space-between;
|
||||||
|
// align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 30px;
|
||||||
|
padding-top: 20px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
box-shadow: 0 5px 10px -8px #dfdfdf inset;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
}
|
||||||
|
.nav_bar_tit {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding-right: 20px;
|
||||||
|
}
|
||||||
|
.fl {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: left;
|
||||||
|
}
|
||||||
|
.bottom {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.search_sear {
|
||||||
|
// background-color: #eee;
|
||||||
|
width: 100%;
|
||||||
|
padding: 30rpx 16rpx;
|
||||||
|
position: relative;
|
||||||
|
box-sizing: border-box;
|
||||||
|
z-index: 999;
|
||||||
|
|
||||||
|
.searchInput {
|
||||||
|
background-color: #eee;
|
||||||
|
height: 60rpx;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
color: #bbb;
|
||||||
|
padding-left: 60rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-small {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 36rpx;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
.clear-icon {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
right: 36rpx;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
icon {
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,87 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
title="工情信息"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<u-tabs
|
||||||
|
:list="tabsOptions"
|
||||||
|
@click="tabsChange"
|
||||||
|
:scrollable=false
|
||||||
|
class="tabsClass"
|
||||||
|
:activeStyle="{color: 'rgb(37, 157, 255)',fontSize: '16px'}"
|
||||||
|
:inactiveStyle="{color: '#606266',fontSize: '16px'}"
|
||||||
|
lineColor="transparent"
|
||||||
|
itemStyle="height: 44px"
|
||||||
|
>
|
||||||
|
</u-tabs>
|
||||||
|
<uniQk v-if="tabsVal==='uniQk'" ref="childRef1"></uniQk>
|
||||||
|
<uniXq v-if="tabsVal==='uniXq'" ref="childRef2"></uniXq>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
import uniQk from './qk.vue';
|
||||||
|
import uniXq from './xq.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: { uniQk, uniXq },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tabsOptions:[
|
||||||
|
{
|
||||||
|
name:'运行情况',
|
||||||
|
components:'uniQk'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name:'工程险情',
|
||||||
|
components:'uniXq'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
tabsVal:'uniQk'
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
tabsChange(item) {
|
||||||
|
this.tabsVal = item.components
|
||||||
|
console.log(this.tabsVal);
|
||||||
|
},
|
||||||
|
refresh(fun) {
|
||||||
|
console.log('执行刷新')
|
||||||
|
fun()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
if(this.tabsVal==='uniQk'){
|
||||||
|
this.$refs.childRef1.submit();
|
||||||
|
}else{
|
||||||
|
this.$refs.childRef2.submit();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.myTitleStyle{
|
||||||
|
font-size: 30px;
|
||||||
|
background-color: red;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
.tabsClass{
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 40px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,316 @@
|
||||||
|
<template>
|
||||||
|
<view class="tabBody">
|
||||||
|
<div class="searchBox">
|
||||||
|
<div class="searchBox_left">
|
||||||
|
<u-search
|
||||||
|
shape="square"
|
||||||
|
:clearabled="true"
|
||||||
|
:showAction=false
|
||||||
|
v-model="searchVal"
|
||||||
|
placeholder='请输入工程名称/上报人'
|
||||||
|
height=40
|
||||||
|
>
|
||||||
|
</u-search>
|
||||||
|
</div>
|
||||||
|
<div class="searchBox_right">
|
||||||
|
<view
|
||||||
|
hover-class="is-hover"
|
||||||
|
class="searchBox_right_btn"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="myShow"
|
||||||
|
>
|
||||||
|
<u--image :src="'../../../static/images/filter.png'" width="22px" height="22px"></u--image>
|
||||||
|
</view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="mybody">
|
||||||
|
<div class="countNum"><text>共{{getSearchVal.length}}条信息</text></div>
|
||||||
|
<div v-for="(item,index) in getSearchVal" class="listItem" @click="toForm(index)">
|
||||||
|
<div>
|
||||||
|
<div class="row1"><text>{{item.projectName}}</text></div>
|
||||||
|
<div class="row2">
|
||||||
|
<div>
|
||||||
|
<text :style="{marginRight:'5px'}">{{item.reporter}}</text>
|
||||||
|
<text>{{item.reportTime}}</text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="icon" v-show="item.isRead===0"></div>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'100px'}"></div>
|
||||||
|
</div>
|
||||||
|
<u-popup
|
||||||
|
:show="show"
|
||||||
|
mode="right"
|
||||||
|
:safeAreaInsetTop='true'
|
||||||
|
:closeOnClickOverlay='false'
|
||||||
|
@close="close"
|
||||||
|
@open="myShow">
|
||||||
|
<view :style="{padding:'10px',width:'250px'}">
|
||||||
|
<u-toast ref="uToast"></u-toast>
|
||||||
|
<text class="title">按工程类型</text>
|
||||||
|
<u-checkbox-group
|
||||||
|
placement="row"
|
||||||
|
v-model="check1"
|
||||||
|
:style="{padding:'10px 0px 20px 0px'}"
|
||||||
|
>
|
||||||
|
<u-checkbox name="1" label="水库" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="2" label="水电站" class="checkItem"></u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
<div :style="{display:'flex',alignItems:'center'}">
|
||||||
|
<text class="title">按上报时间</text>
|
||||||
|
<u-switch v-model="isTime" size="20" :style="{margin:'2px 0 0 10px'}"></u-switch>
|
||||||
|
</div>
|
||||||
|
<div :style="{display:'flex',marginTop:'10px'}" v-if="isTime">
|
||||||
|
<view
|
||||||
|
class="tmPicker"
|
||||||
|
@click="showStmPicker = true"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
>{{getStmStr}}<u-icon name="calendar" size="18" color="#909399"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text :style="{width:'20%',lineHeight:'32px',textAlign:'center'}">至</text>
|
||||||
|
</div>
|
||||||
|
<div :style="{display:'flex',marginTop:'10px'}" v-if="isTime">
|
||||||
|
<view
|
||||||
|
class="tmPicker"
|
||||||
|
@click="showEtmPicker = true"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
>{{getEtmStr}}<u-icon name="calendar" size="18" color="#909399"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text :style="{width:'20%'}"></text>
|
||||||
|
</div>
|
||||||
|
<div :style="{position:'absolute',bottom:'20px',right:'20px',display:'flex'}">
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px',marginRight:'10px'}"
|
||||||
|
text="重置"
|
||||||
|
@click="reSet"
|
||||||
|
></u-button>
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px'}"
|
||||||
|
color="rgba(217, 0, 27, 1)"
|
||||||
|
type="primary"
|
||||||
|
text="确定"
|
||||||
|
@click="submit"
|
||||||
|
></u-button>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showStmPicker"
|
||||||
|
v-model="stm"
|
||||||
|
mode="datetime"
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="showStmPicker = false"
|
||||||
|
@cancel="showStmPicker = false"
|
||||||
|
@close="showStmPicker = false"
|
||||||
|
>
|
||||||
|
</u-datetime-picker>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showEtmPicker"
|
||||||
|
v-model="etm"
|
||||||
|
mode="datetime"
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="showEtmPicker = false"
|
||||||
|
@cancel="showEtmPicker = false"
|
||||||
|
@close="showEtmPicker = false"
|
||||||
|
>
|
||||||
|
</u-datetime-picker>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
show:false,
|
||||||
|
showStmPicker:false,
|
||||||
|
showEtmPicker:false,
|
||||||
|
searchVal:'',
|
||||||
|
stm:Number(moment(new Date()).add(-7,'days')),
|
||||||
|
etm:Number(new Date()),
|
||||||
|
isTime:false,
|
||||||
|
check1:['1','2'],
|
||||||
|
list:[]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getStmStr() {
|
||||||
|
return moment(this.stm).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
},
|
||||||
|
getEtmStr() {
|
||||||
|
return moment(this.etm).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
},
|
||||||
|
getSearchVal() {
|
||||||
|
if(this.searchVal){
|
||||||
|
return this.list.filter(o => (o.projectName?.indexOf(this.searchVal)>-1 || o.reporter?.indexOf(this.searchVal)>-1))
|
||||||
|
}else{
|
||||||
|
return this.list
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
myShow() {
|
||||||
|
this.show = true
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
reSet() {
|
||||||
|
this.isTime = false
|
||||||
|
this.stm = Number(moment(new Date()).add(-7,'days'))
|
||||||
|
this.etm = Number(new Date())
|
||||||
|
this.check1 = ['1','2']
|
||||||
|
},
|
||||||
|
async submit() {
|
||||||
|
if(!moment(this.stm).isBefore(this.etm)){
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "开始时间需小于结束时间",
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
try{
|
||||||
|
const params = {
|
||||||
|
projectTypes:this.check1.length===0?['999']:this.check1,
|
||||||
|
}
|
||||||
|
if(this.isTime){
|
||||||
|
params.timeSo = {
|
||||||
|
start:moment(this.stm).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
end:moment(this.etm).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.log('params',this.check1==[])
|
||||||
|
const res = await uni.$http.post('/gunshiApp/xfflood/xfProjectRun/list',params)
|
||||||
|
console.log('res',res)
|
||||||
|
this.list = res.data.data
|
||||||
|
this.close()
|
||||||
|
}catch(e){
|
||||||
|
//TODO handle the exception
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请求失败",
|
||||||
|
})
|
||||||
|
setTimeout(()=>{
|
||||||
|
this.close()
|
||||||
|
},1000)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
toForm(myIndex) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/gqzq/gqxx/qkForm?obj='+JSON.stringify({list:this.getSearchVal,myIndex:myIndex}) // 跳转到对应路径的页面
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.submit()
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.tabBody{
|
||||||
|
background-color: rgba(247, 247, 247, 1);
|
||||||
|
height: 100%;
|
||||||
|
// display: flex;
|
||||||
|
// flex-direction: column;
|
||||||
|
// align-items: center;
|
||||||
|
}
|
||||||
|
.searchBox{
|
||||||
|
height: 62px;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mybody{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin: 5px 5px;
|
||||||
|
padding: 5px 20px;
|
||||||
|
height: calc( 100vh - 100px );
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
.countNum{
|
||||||
|
width: 100%;
|
||||||
|
text-align: right;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
.listItem{
|
||||||
|
width: 100%;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
padding: 10px 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.row1{
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #333333;
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
}
|
||||||
|
.row2{
|
||||||
|
font-size: 12px;
|
||||||
|
color: #999999;
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.icon{
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
border-radius: 5px;
|
||||||
|
background-color: red;
|
||||||
|
}
|
||||||
|
.searchBox_left{
|
||||||
|
width: 82%;
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
.searchBox_right{
|
||||||
|
width: 18%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.searchBox_right_btn{
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.is-hover{
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
.title{
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.checkItem{
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.tmPicker{
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
border: 1px solid rgba(240, 240, 240, 1);
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
// padding-left: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,301 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{backgroundColor: 'rgba(247, 247, 247, 1)',height:'100vh',overflow:'hidden'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
title="查看"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<div class="bodyBg">
|
||||||
|
<div class="mybody">
|
||||||
|
<div class="myHead" v-if="list.length>1">
|
||||||
|
<div class="paging">
|
||||||
|
<view
|
||||||
|
class="paging_left"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="changePage(false)"
|
||||||
|
>{{index===0?'返回':'上一条'}}</view>
|
||||||
|
<view
|
||||||
|
class="paging_right"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="changePage(true)"
|
||||||
|
>{{index===list.length-1?'返回':'下一条'}}</view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="myscroll">
|
||||||
|
<div :style="{height:'10px'}"></div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">上报时间:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.reportTime"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">工程类型:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="{'1':'水库','2':'水电站'}[getRecord.projectType]"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf"><text :style="{color:'red'}">*</text>工程名称:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.projectName"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">是否发电:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="{'0':'否','1':'是'}[getRecord.isPowerGeneration]"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">是否泄洪:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="{'0':'否','1':'是'}[getRecord.isFloodRelease]"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">水位(m):</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.waterLevel"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">入库流量(m³/s):</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.inflowVolume"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">出库流量(m³/s):</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.outflowVolume"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">其他运行情况:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--textarea
|
||||||
|
v-model="getRecord.remark"
|
||||||
|
:disabled='true'
|
||||||
|
height=300
|
||||||
|
></u--textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">上报人:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.reporter"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">上报单位:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.reportUnit"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">附件:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<text v-if="imgList.length===0">{{getRecord.fileIds || '暂无数据'}}</text>
|
||||||
|
<u-image
|
||||||
|
:style="{marginTop:'10px'}"
|
||||||
|
v-for="item in imgList"
|
||||||
|
:src="'http://223.75.53.141:9102/test.by-lyf.tmp'+item.filePath"
|
||||||
|
width="100%"
|
||||||
|
mode="aspectFit"
|
||||||
|
@click="previewImage(0,'http://223.75.53.141:9102/test.by-lyf.tmp'+item.filePath)"
|
||||||
|
></u-image>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'20vh'}"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
record:{},
|
||||||
|
list:[],
|
||||||
|
index:0,
|
||||||
|
cs:'',
|
||||||
|
imgList:[]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getState()
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getRecord() {
|
||||||
|
return this.list[this.index] || {}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getState() {
|
||||||
|
try{
|
||||||
|
const id = this.getRecord.id
|
||||||
|
console.log('id',id)
|
||||||
|
const res = await uni.$http.get('/gunshiApp/xfflood/xfProjectRun/detail?id='+id)
|
||||||
|
this.imgList = res.data.data
|
||||||
|
console.log('res2',res.data.data)
|
||||||
|
}catch(e){
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请求失败",
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
changePage(flag) {
|
||||||
|
if(flag){
|
||||||
|
if(this.index===this.list.length-1){
|
||||||
|
uni.navigateBack()
|
||||||
|
}else{
|
||||||
|
this.index = this.index+1
|
||||||
|
this.getState()
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
if(this.index===0){
|
||||||
|
uni.navigateBack()
|
||||||
|
}else{
|
||||||
|
this.index = this.index-1
|
||||||
|
this.getState()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
previewImage(index,url) {
|
||||||
|
// 使用uni.previewImage预览图片
|
||||||
|
uni.previewImage({
|
||||||
|
current: index,
|
||||||
|
urls: [url]
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(props){
|
||||||
|
const record = JSON.parse(props.obj)
|
||||||
|
this.index = record.myIndex
|
||||||
|
this.list= record.list
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.bodyBg{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.mybody{
|
||||||
|
margin-top: 50px;
|
||||||
|
padding-top: 10px;
|
||||||
|
width: 97%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
.row{
|
||||||
|
display: flex;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
.lf{
|
||||||
|
// width: 30%;
|
||||||
|
width: 6.5rem;
|
||||||
|
min-height: 40px;
|
||||||
|
text-align: right;
|
||||||
|
line-height: 38px;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
.rf{
|
||||||
|
flex: 1;
|
||||||
|
// width: 70%;
|
||||||
|
min-height: 40px;
|
||||||
|
line-height: 36px;
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-top: 1px;
|
||||||
|
}
|
||||||
|
.paging{
|
||||||
|
position: relative;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
margin: 5px 50px 15px 50px;
|
||||||
|
display: flex;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.paging_left{
|
||||||
|
width: 50%;
|
||||||
|
height: 100%;
|
||||||
|
border: 1px solid #dadbde;
|
||||||
|
border-right: 0;
|
||||||
|
background: rgb(245, 247, 250);
|
||||||
|
border-radius: 8px 0 0 8px;
|
||||||
|
}
|
||||||
|
.paging_right{
|
||||||
|
width: 50%;
|
||||||
|
height: 100%;
|
||||||
|
border: 1px solid #dadbde;
|
||||||
|
background: rgb(245, 247, 250);
|
||||||
|
border-radius: 0 8px 8px 0;
|
||||||
|
}
|
||||||
|
.is-hover{
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
.myHead{
|
||||||
|
margin-bottom: 0px;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.myscroll{
|
||||||
|
height: 90vh;
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,332 @@
|
||||||
|
<template>
|
||||||
|
<view class="tabBody">
|
||||||
|
<div class="searchBox">
|
||||||
|
<div class="searchBox_left">
|
||||||
|
<u-search
|
||||||
|
shape="square"
|
||||||
|
:clearabled="true"
|
||||||
|
:showAction=false
|
||||||
|
v-model="searchVal"
|
||||||
|
placeholder='请输入工程名称/上报人'
|
||||||
|
height=40
|
||||||
|
>
|
||||||
|
</u-search>
|
||||||
|
</div>
|
||||||
|
<div class="searchBox_right">
|
||||||
|
<view
|
||||||
|
hover-class="is-hover"
|
||||||
|
class="searchBox_right_btn"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="myShow"
|
||||||
|
>
|
||||||
|
<u--image :src="'../../../static/images/filter.png'" width="22px" height="22px"></u--image>
|
||||||
|
</view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="mybody">
|
||||||
|
<div class="countNum"><text>共{{getSearchVal.length}}条信息</text></div>
|
||||||
|
<div v-for="(item,index) in getSearchVal" class="listItem" @click="toForm(index)">
|
||||||
|
<div>
|
||||||
|
<div class="row1"><text>{{item.projectName}}</text></div>
|
||||||
|
<div class="row2">
|
||||||
|
<div>
|
||||||
|
<text :style="{marginRight:'5px'}">{{item.reporter}}</text>
|
||||||
|
<text>{{item.reportTime}}</text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="icon" v-show="item.isRead===0"></div>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'100px'}"></div>
|
||||||
|
</div>
|
||||||
|
<u-popup
|
||||||
|
:show="show"
|
||||||
|
mode="right"
|
||||||
|
:safeAreaInsetTop='true'
|
||||||
|
:closeOnClickOverlay='false'
|
||||||
|
@close="close"
|
||||||
|
@open="myShow">
|
||||||
|
<view :style="{padding:'10px',width:'250px'}">
|
||||||
|
<u-toast ref="uToast"></u-toast>
|
||||||
|
<text class="title">按严重程度</text>
|
||||||
|
<u-checkbox-group
|
||||||
|
placement="col"
|
||||||
|
v-model="check1"
|
||||||
|
:style="{padding:'10px 0px 20px 0px'}"
|
||||||
|
>
|
||||||
|
<u-checkbox name="1" label="一般险情" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="2" label="较大险情" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="3" label="重大险情" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="4" label="特别重大险情" class="checkItem"></u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
<text class="title">按工程类型</text>
|
||||||
|
<u-checkbox-group
|
||||||
|
placement="row"
|
||||||
|
v-model="check2"
|
||||||
|
:style="{padding:'10px 0px 20px 0px'}"
|
||||||
|
>
|
||||||
|
<u-checkbox name="1" label="水库" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="2" label="水电站" class="checkItem"></u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
<div :style="{display:'flex',alignItems:'center'}">
|
||||||
|
<text class="title">按上报时间</text>
|
||||||
|
<u-switch v-model="isTime" size="20" :style="{margin:'2px 0 0 10px'}"></u-switch>
|
||||||
|
</div>
|
||||||
|
<div :style="{display:'flex',marginTop:'10px'}" v-if="isTime">
|
||||||
|
<view
|
||||||
|
class="tmPicker"
|
||||||
|
@click="showStmPicker = true"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
>{{getStmStr}}<u-icon name="calendar" size="18" color="#909399"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text :style="{width:'20%',lineHeight:'32px',textAlign:'center'}">至</text>
|
||||||
|
</div>
|
||||||
|
<div :style="{display:'flex',marginTop:'10px'}" v-if="isTime">
|
||||||
|
<view
|
||||||
|
class="tmPicker"
|
||||||
|
@click="showEtmPicker = true"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
>{{getEtmStr}}<u-icon name="calendar" size="18" color="#909399"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text :style="{width:'20%'}"></text>
|
||||||
|
</div>
|
||||||
|
<div :style="{position:'absolute',bottom:'20px',right:'20px',display:'flex'}">
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px',marginRight:'10px'}"
|
||||||
|
text="重置"
|
||||||
|
@click="reSet"
|
||||||
|
></u-button>
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px'}"
|
||||||
|
color="rgba(217, 0, 27, 1)"
|
||||||
|
type="primary"
|
||||||
|
text="确定"
|
||||||
|
@click="submit"
|
||||||
|
></u-button>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showStmPicker"
|
||||||
|
v-model="stm"
|
||||||
|
mode="datetime"
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="showStmPicker = false"
|
||||||
|
@cancel="showStmPicker = false"
|
||||||
|
@close="showStmPicker = false"
|
||||||
|
>
|
||||||
|
</u-datetime-picker>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showEtmPicker"
|
||||||
|
v-model="etm"
|
||||||
|
mode="datetime"
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="showEtmPicker = false"
|
||||||
|
@cancel="showEtmPicker = false"
|
||||||
|
@close="showEtmPicker = false"
|
||||||
|
>
|
||||||
|
</u-datetime-picker>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
show:false,
|
||||||
|
showStmPicker:false,
|
||||||
|
showEtmPicker:false,
|
||||||
|
searchVal:'',
|
||||||
|
stm:Number(moment(new Date()).add(-7,'days')),
|
||||||
|
etm:Number(new Date()),
|
||||||
|
isTime:false,
|
||||||
|
check1:['1','2','3','4'],
|
||||||
|
check2:['1','2'],
|
||||||
|
list:[]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getStmStr() {
|
||||||
|
return moment(this.stm).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
},
|
||||||
|
getEtmStr() {
|
||||||
|
return moment(this.etm).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
},
|
||||||
|
getSearchVal() {
|
||||||
|
if(this.searchVal){
|
||||||
|
return this.list.filter(o => (o.projectName?.indexOf(this.searchVal)>-1 || o.reporter?.indexOf(this.searchVal)>-1))
|
||||||
|
}else{
|
||||||
|
return this.list
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
myShow() {
|
||||||
|
this.show = true
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
reSet() {
|
||||||
|
this.isTime = false
|
||||||
|
this.stm = Number(moment(new Date()).add(-7,'days'))
|
||||||
|
this.etm = Number(new Date())
|
||||||
|
this.check1 = ['1','2','3','4']
|
||||||
|
this.check2 = ['1','2']
|
||||||
|
},
|
||||||
|
async submit() {
|
||||||
|
if(!moment(this.stm).isBefore(this.etm)){
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "开始时间需小于结束时间",
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
try{
|
||||||
|
const params = {
|
||||||
|
severitys:this.check1.length===0?['999']:this.check1,
|
||||||
|
projectTypes:this.check2.length===0?['999']:this.check2,
|
||||||
|
}
|
||||||
|
if(this.isTime){
|
||||||
|
params.timeSo = {
|
||||||
|
start:moment(this.stm).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
end:moment(this.etm).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log('params',params)
|
||||||
|
const res = await uni.$http.post('/gunshiApp/xfflood/xfProjectIncident/list',params)
|
||||||
|
console.log('res',res)
|
||||||
|
this.list = res.data.data
|
||||||
|
this.close()
|
||||||
|
}catch(e){
|
||||||
|
//TODO handle the exception
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请求失败",
|
||||||
|
})
|
||||||
|
setTimeout(()=>{
|
||||||
|
this.close()
|
||||||
|
},1000)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
toForm(myIndex) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/gqzq/gqxx/xqForm?obj='+JSON.stringify({list:this.getSearchVal,myIndex:myIndex}) // 跳转到对应路径的页面
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.submit()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.tabBody{
|
||||||
|
background-color: rgba(247, 247, 247, 1);
|
||||||
|
height: 100%;
|
||||||
|
// display: flex;
|
||||||
|
// flex-direction: column;
|
||||||
|
// align-items: center;
|
||||||
|
}
|
||||||
|
.searchBox{
|
||||||
|
height: 62px;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mybody{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin: 5px 5px;
|
||||||
|
padding: 5px 20px;
|
||||||
|
height: calc( 100vh - 100px );
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
.countNum{
|
||||||
|
width: 100%;
|
||||||
|
text-align: right;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
.listItem{
|
||||||
|
width: 100%;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
padding: 10px 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.row1{
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #333333;
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
}
|
||||||
|
.row2{
|
||||||
|
font-size: 12px;
|
||||||
|
color: #999999;
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.icon{
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
border-radius: 5px;
|
||||||
|
background-color: red;
|
||||||
|
}
|
||||||
|
.searchBox_left{
|
||||||
|
width: 82%;
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
.searchBox_right{
|
||||||
|
width: 18%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.searchBox_right_btn{
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.is-hover{
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
.title{
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.checkItem{
|
||||||
|
margin-right: 10px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.tmPicker{
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
border: 1px solid rgba(240, 240, 240, 1);
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
// padding-left: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,311 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{backgroundColor: 'rgba(247, 247, 247, 1)',height:'100vh',overflow:'hidden'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
title="查看"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<div class="bodyBg">
|
||||||
|
<div class="mybody">
|
||||||
|
<div class="myHead" v-if="list.length>1">
|
||||||
|
<div class="paging">
|
||||||
|
<view
|
||||||
|
class="paging_left"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="changePage(false)"
|
||||||
|
>{{index===0?'返回':'上一条'}}</view>
|
||||||
|
<view
|
||||||
|
class="paging_right"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="changePage(true)"
|
||||||
|
>{{index===list.length-1?'返回':'下一条'}}</view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="myscroll">
|
||||||
|
<div :style="{height:'10px'}"></div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">上报时间:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.reportTime"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">工程类型:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="{'1':'水库','2':'水电站'}[getRecord.projectType]"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf"><text :style="{color:'red'}">*</text>工程名称:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.projectName"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">严重程度:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="{'1':'一般险情','2':'较大险情','3':'重大险情','4':'特别重大险情'}[getRecord.severity]"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">是否已管控:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="{'0':'否','1':'是'}[getRecord.isControlled]"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">险情描述:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--textarea
|
||||||
|
v-model="getRecord.incidentDescription"
|
||||||
|
:disabled='true'
|
||||||
|
height=300
|
||||||
|
></u--textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">管控责任人:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.controlResponsiblePerson"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">联系电话:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.responsiblePersonPhone"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">其他运行情况:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--textarea
|
||||||
|
v-model="getRecord.remark"
|
||||||
|
:disabled='true'
|
||||||
|
height=300
|
||||||
|
></u--textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">上报人:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.reporter"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">上报单位:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.reportUnit"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">上报时间:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.reportTime"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">附件:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<text v-if="imgList.length===0">{{getRecord.fileIds || '暂无数据'}}</text>
|
||||||
|
<u-image
|
||||||
|
:style="{marginTop:'10px'}"
|
||||||
|
v-for="item in imgList"
|
||||||
|
:src="'http://223.75.53.141:9102/test.by-lyf.tmp'+item.filePath"
|
||||||
|
width="100%"
|
||||||
|
mode="aspectFit"
|
||||||
|
@click="previewImage(0,'http://223.75.53.141:9102/test.by-lyf.tmp'+item.filePath)"
|
||||||
|
></u-image>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'20vh'}"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
record:{},
|
||||||
|
list:[],
|
||||||
|
index:0,
|
||||||
|
cs:'',
|
||||||
|
imgList:[]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getState()
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getRecord() {
|
||||||
|
return this.list[this.index] || {}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getState() {
|
||||||
|
try{
|
||||||
|
const id = this.getRecord.id
|
||||||
|
console.log('id',id)
|
||||||
|
const res = await uni.$http.get('/gunshiApp/xfflood/xfProjectIncident/detail?id='+id)
|
||||||
|
this.imgList = res.data.data
|
||||||
|
console.log('res',res)
|
||||||
|
}catch(e){
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请求失败",
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
changePage(flag) {
|
||||||
|
if(flag){
|
||||||
|
if(this.index===this.list.length-1){
|
||||||
|
uni.navigateBack()
|
||||||
|
}else{
|
||||||
|
this.index = this.index+1
|
||||||
|
this.getState()
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
if(this.index===0){
|
||||||
|
uni.navigateBack()
|
||||||
|
}else{
|
||||||
|
this.index = this.index-1
|
||||||
|
this.getState()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
previewImage(index,url) {
|
||||||
|
// 使用uni.previewImage预览图片
|
||||||
|
uni.previewImage({
|
||||||
|
current: index,
|
||||||
|
urls: [url]
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(props){
|
||||||
|
const record = JSON.parse(props.obj)
|
||||||
|
this.index = record.myIndex
|
||||||
|
this.list= record.list
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.bodyBg{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.mybody{
|
||||||
|
margin-top: 50px;
|
||||||
|
padding-top: 10px;
|
||||||
|
width: 97%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
.row{
|
||||||
|
display: flex;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
.lf{
|
||||||
|
// width: 30%;
|
||||||
|
width: 6rem;
|
||||||
|
min-height: 40px;
|
||||||
|
text-align: right;
|
||||||
|
line-height: 38px;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
.rf{
|
||||||
|
// width: 70%;
|
||||||
|
flex: 1;
|
||||||
|
min-height: 40px;
|
||||||
|
line-height: 36px;
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-top: 1px;
|
||||||
|
}
|
||||||
|
.paging{
|
||||||
|
position: relative;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
margin: 5px 50px 15px 50px;
|
||||||
|
display: flex;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.paging_left{
|
||||||
|
width: 50%;
|
||||||
|
height: 100%;
|
||||||
|
border: 1px solid #dadbde;
|
||||||
|
border-right: 0;
|
||||||
|
background: rgb(245, 247, 250);
|
||||||
|
border-radius: 8px 0 0 8px;
|
||||||
|
}
|
||||||
|
.paging_right{
|
||||||
|
width: 50%;
|
||||||
|
height: 100%;
|
||||||
|
border: 1px solid #dadbde;
|
||||||
|
background: rgb(245, 247, 250);
|
||||||
|
border-radius: 0 8px 8px 0;
|
||||||
|
}
|
||||||
|
.is-hover{
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
.myHead{
|
||||||
|
margin-bottom: 0px;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.myscroll{
|
||||||
|
height: 90vh;
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,122 @@
|
||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
title="工情灾情"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<view class="info">
|
||||||
|
<div class="ul_list" @click="todetail(1)">
|
||||||
|
<div class="left">工情信息</div>
|
||||||
|
<div class="left" :style="{display:'flex',alignItems:'center'}">
|
||||||
|
<div class="redDot" v-show="gq"></div>
|
||||||
|
<text>></text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="ul_list" @click="todetail(2)">
|
||||||
|
<div class="left">灾情信息</div>
|
||||||
|
<div class="left" :style="{display:'flex',alignItems:'center'}">
|
||||||
|
<div class="redDot" v-show="zq"></div>
|
||||||
|
<text>></text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
gq:false,
|
||||||
|
zq:false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
todetail (val) {
|
||||||
|
console.log('val', val)
|
||||||
|
if (val == 1) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/gqzq/gqxx/gqxx'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
if (val == 2) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/gqzq/zqxx/zqxx'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async getData() {
|
||||||
|
try{
|
||||||
|
const res = await uni.$http.get("/gunshiApp/xfflood/xfProjectRun/has/read")
|
||||||
|
const data = res.data.data
|
||||||
|
if(data){
|
||||||
|
console.log(data['1'],data['2'],data['3'])
|
||||||
|
this.gq = (data['1']||data['2'])?true:false
|
||||||
|
this.zq = data['3']?true:false
|
||||||
|
}
|
||||||
|
console.log('res',res)
|
||||||
|
}catch(e){
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请求失败",
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.container {
|
||||||
|
font-size: 14px;
|
||||||
|
background-color: #f3f5f8;
|
||||||
|
}
|
||||||
|
.nav_bar {
|
||||||
|
// display: flex;
|
||||||
|
// justify-content: space-between;
|
||||||
|
// align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 30px;
|
||||||
|
padding-top: 20px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
box-shadow: 0 5px 10px -8px #dfdfdf inset;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
}
|
||||||
|
.nav_bar_tit {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.info {
|
||||||
|
padding: 20px;
|
||||||
|
padding-top: 0;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-top: 44px;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
}
|
||||||
|
.ul_list {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
height: 48px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
.redDot{
|
||||||
|
margin-right: 10px;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
background-color: red;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,392 @@
|
||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="nav_bar">
|
||||||
|
<!-- <u-icon name="arrow_left" color="#000" size="28"></u-icon> -->
|
||||||
|
<view class="nav_bar_tit"> 灾情信息 </view>
|
||||||
|
</view>
|
||||||
|
<view class="search">
|
||||||
|
<!-- 搜索区域 -->
|
||||||
|
<view class="search_sear">
|
||||||
|
<input
|
||||||
|
class="searchInput"
|
||||||
|
confirm-type="search"
|
||||||
|
placeholder-style="color:#bbb"
|
||||||
|
v-model="saerchValue"
|
||||||
|
placeholder="请输入"
|
||||||
|
@input="myinput"
|
||||||
|
@confirm="myconfirm"
|
||||||
|
/>
|
||||||
|
<icon class="icon-small" type="search" size="14"></icon>
|
||||||
|
|
||||||
|
<icon
|
||||||
|
v-if="saerchValue.length > 0"
|
||||||
|
class="clear-icon"
|
||||||
|
type="clear"
|
||||||
|
size="16"
|
||||||
|
@click="clearnClick"
|
||||||
|
></icon>
|
||||||
|
<!-- </view> -->
|
||||||
|
</view>
|
||||||
|
<view class="more">
|
||||||
|
<image
|
||||||
|
style="width: 20px; height: 20px; margin-right: 10px"
|
||||||
|
src="../../static/images/filter.png"
|
||||||
|
@click="openpop"
|
||||||
|
></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- table_info -->
|
||||||
|
<view class="table_info">
|
||||||
|
<p class="p">共4条信息</p>
|
||||||
|
<view>
|
||||||
|
<view class="table_Page">
|
||||||
|
<view class="info">
|
||||||
|
<h4>朝阳寺水库</h4>
|
||||||
|
<p class="info_P">
|
||||||
|
<span class="info_n">刘明</span>
|
||||||
|
<span>2024-03-06 13:50:47</span>
|
||||||
|
</p>
|
||||||
|
</view>
|
||||||
|
<view class="badge"><u-badge :isDot="true"></u-badge></view>
|
||||||
|
</view>
|
||||||
|
<view class="table_Page">
|
||||||
|
<view class="info">
|
||||||
|
<h4>朝阳寺水库</h4>
|
||||||
|
<p class="info_P">
|
||||||
|
<span class="info_n">刘明</span>
|
||||||
|
<span>2024-03-06 13:50:47</span>
|
||||||
|
</p>
|
||||||
|
</view>
|
||||||
|
<view class="badge"><u-badge :isDot="true"></u-badge></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 抽屉 -->
|
||||||
|
<view class="popup" v-if="popupOpen">
|
||||||
|
<u-popup
|
||||||
|
:show="popupOpen"
|
||||||
|
mode="bottom"
|
||||||
|
@close="() => (this.popupOpen = false)"
|
||||||
|
>
|
||||||
|
<view style="padding: 30px 20px">
|
||||||
|
<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
|
||||||
|
<u-form
|
||||||
|
labelPosition="left"
|
||||||
|
:model="model1"
|
||||||
|
ref="uForm"
|
||||||
|
labelWidth="100"
|
||||||
|
>
|
||||||
|
<u-form-item
|
||||||
|
label="工程类型"
|
||||||
|
prop="checkboxValue1"
|
||||||
|
borderBottom
|
||||||
|
ref="item3"
|
||||||
|
:customStyle="{ height: '55px' }"
|
||||||
|
>
|
||||||
|
<u-checkbox-group
|
||||||
|
v-model="model1.userInfo.checkboxValue1"
|
||||||
|
placement="row"
|
||||||
|
@change="checkboxChange"
|
||||||
|
style="flex-wrap: wrap; position: absolute"
|
||||||
|
>
|
||||||
|
<u-checkbox
|
||||||
|
:customStyle="{ marginRight: '16px', margin: '5px' }"
|
||||||
|
v-for="(item, index) in checkboxList1"
|
||||||
|
:key="index"
|
||||||
|
:label="item.name"
|
||||||
|
:name="item.name"
|
||||||
|
>
|
||||||
|
</u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
</u-form-item>
|
||||||
|
<!-- 时间 -->
|
||||||
|
<u-form-item
|
||||||
|
label="上报开始时间"
|
||||||
|
prop="userInfo.start"
|
||||||
|
borderBottom
|
||||||
|
@click="
|
||||||
|
isTime = true
|
||||||
|
hideKeyboard()
|
||||||
|
"
|
||||||
|
ref="item1"
|
||||||
|
>
|
||||||
|
<u-input
|
||||||
|
v-model="model1.userInfo.start"
|
||||||
|
border="none"
|
||||||
|
disabled
|
||||||
|
disabledColor="#ffffff"
|
||||||
|
placeholder="请选择上报开始时间"
|
||||||
|
></u-input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
<u-form-item
|
||||||
|
label="上报结束时间"
|
||||||
|
prop="userInfo.end"
|
||||||
|
borderBottom
|
||||||
|
@click="isTime2 = true"
|
||||||
|
ref="item1"
|
||||||
|
>
|
||||||
|
<u--input
|
||||||
|
v-model="model1.userInfo.end"
|
||||||
|
border="none"
|
||||||
|
disabled
|
||||||
|
disabledColor="#ffffff"
|
||||||
|
placeholder="请选择上报结束时间"
|
||||||
|
></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
</u-form>
|
||||||
|
<view class="bottom">
|
||||||
|
<u-button
|
||||||
|
text="重置"
|
||||||
|
customStyle="margin: 10px"
|
||||||
|
@click="reset"
|
||||||
|
></u-button>
|
||||||
|
<u-button
|
||||||
|
type="primary"
|
||||||
|
text="确认"
|
||||||
|
customStyle="margin: 10px"
|
||||||
|
@click="submit"
|
||||||
|
></u-button>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="isTime"
|
||||||
|
v-model="valueTime"
|
||||||
|
mode="datetime"
|
||||||
|
@confirm="confirm"
|
||||||
|
@cancel="cancel"
|
||||||
|
></u-datetime-picker>
|
||||||
|
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="isTime2"
|
||||||
|
v-model="valueTime2"
|
||||||
|
mode="datetime"
|
||||||
|
@confirm="confirm2"
|
||||||
|
@cancel="cancel2"
|
||||||
|
></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
export default {
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
saerchValue: '',
|
||||||
|
popupOpen: false, //抽屉打开,
|
||||||
|
// 基本案列数据
|
||||||
|
checkboxList1: [
|
||||||
|
{
|
||||||
|
name: '一般险情',
|
||||||
|
disabled: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '较大险情',
|
||||||
|
disabled: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '重大险情',
|
||||||
|
disabled: false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '特别重大险情',
|
||||||
|
disabled: false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
isTime: false,
|
||||||
|
valueTime: Number(moment()),
|
||||||
|
valueTime2: Number(moment()),
|
||||||
|
isTime2: false,
|
||||||
|
model1: {
|
||||||
|
userInfo: {
|
||||||
|
start: '',
|
||||||
|
end: '',
|
||||||
|
checkboxValue1: ['一般险情', '较大险情', '重大险情', '特别重大险情']
|
||||||
|
}
|
||||||
|
},
|
||||||
|
params: {
|
||||||
|
pageSo: { pageSize: 10, pageNumber: 0 },
|
||||||
|
isRead: 0,
|
||||||
|
projectName: this.saerchValue
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
submit () {
|
||||||
|
this.popupOpen = false
|
||||||
|
// 如果有错误，会在catch中返回报错信息数组，校验通过则在then中返回true
|
||||||
|
// this.$refs.uForm
|
||||||
|
// .validate()
|
||||||
|
// .then(res => {
|
||||||
|
// // uni.$u.toast('校验通过')
|
||||||
|
// })
|
||||||
|
// .catch(errors => {
|
||||||
|
// // uni.$u.toast('校验失败')
|
||||||
|
// })
|
||||||
|
},
|
||||||
|
reset () {
|
||||||
|
const validateList = [
|
||||||
|
'userInfo.start',
|
||||||
|
'userInfo.end',
|
||||||
|
'userInfo.checkboxValue1'
|
||||||
|
]
|
||||||
|
this.$refs.uForm.resetFields()
|
||||||
|
this.$refs.uForm.clearValidate()
|
||||||
|
setTimeout(() => {
|
||||||
|
this.$refs.uForm.clearValidate(validateList)
|
||||||
|
// 或者使用 this.$refs.uForm.clearValidate()
|
||||||
|
}, 10)
|
||||||
|
|
||||||
|
this.model1 = {
|
||||||
|
userInfo: {
|
||||||
|
start: '',
|
||||||
|
end: '',
|
||||||
|
checkboxValue1: ['一般险情', '较大险情', '重大险情', '特别重大险情']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
confirm (val) {
|
||||||
|
console.log(
|
||||||
|
'点击确定按钮时触发',
|
||||||
|
val.value,
|
||||||
|
moment(val.value).format('YYYY-MM-DD HH:mm')
|
||||||
|
)
|
||||||
|
this.valueTime = Number(val)
|
||||||
|
this.model1.userInfo.start = moment(val.value).format('YYYY-MM-DD HH:mm')
|
||||||
|
this.isTime = false
|
||||||
|
},
|
||||||
|
cancel () {
|
||||||
|
console.log('取消')
|
||||||
|
this.isTime = false
|
||||||
|
},
|
||||||
|
confirm2 (val) {
|
||||||
|
console.log(
|
||||||
|
'点击确定按钮时触发',
|
||||||
|
val.value,
|
||||||
|
moment(val.value).format('YYYY-MM-DD HH:mm')
|
||||||
|
)
|
||||||
|
this.valueTime2 = Number(val)
|
||||||
|
this.model1.userInfo.end = moment(val.value).format('YYYY-MM-DD HH:mm')
|
||||||
|
this.isTime2 = false
|
||||||
|
},
|
||||||
|
cancel2 () {
|
||||||
|
console.log('取消')
|
||||||
|
this.isTime2 = false
|
||||||
|
},
|
||||||
|
checkboxChange (n) {
|
||||||
|
console.log('change', n)
|
||||||
|
// this.model1.userInfo.checkboxValue1 = e.name
|
||||||
|
},
|
||||||
|
openpop () {
|
||||||
|
this.popupOpen = true
|
||||||
|
},
|
||||||
|
myinput () {},
|
||||||
|
myconfirm () {},
|
||||||
|
clearnClick () {
|
||||||
|
console.log('打印了clearnClick', this.saerchValue)
|
||||||
|
this.saerchValue = ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.container {
|
||||||
|
font-size: 14px;
|
||||||
|
background-color: #f3f5f8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_info {
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
padding: 20px;
|
||||||
|
.p {
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.table_Page {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
margin-top: 12rpx;
|
||||||
|
padding-bottom: 12rpx;
|
||||||
|
|
||||||
|
.info_P {
|
||||||
|
color: #a2a2a2;
|
||||||
|
font-size: 24rpx;
|
||||||
|
.info_n {
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.nav_bar {
|
||||||
|
// display: flex;
|
||||||
|
// justify-content: space-between;
|
||||||
|
// align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 30px;
|
||||||
|
padding-top: 20px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
box-shadow: 0 5px 10px -8px #dfdfdf inset;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
}
|
||||||
|
.nav_bar_tit {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
background-color: #fff;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding-right: 20px;
|
||||||
|
}
|
||||||
|
.fl {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: left;
|
||||||
|
}
|
||||||
|
.bottom {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.search_sear {
|
||||||
|
// background-color: #eee;
|
||||||
|
width: 100%;
|
||||||
|
padding: 30rpx 16rpx;
|
||||||
|
position: relative;
|
||||||
|
box-sizing: border-box;
|
||||||
|
z-index: 999;
|
||||||
|
|
||||||
|
.searchInput {
|
||||||
|
background-color: #eee;
|
||||||
|
height: 60rpx;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
color: #bbb;
|
||||||
|
padding-left: 60rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-small {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 36rpx;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
.clear-icon {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
right: 36rpx;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
icon {
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,352 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{backgroundColor: 'rgba(247, 247, 247, 1)',height:'100vh',overflow:'hidden'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
title="查看"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<div class="bodyBg">
|
||||||
|
<div class="mybody">
|
||||||
|
<div class="myHead" v-if="list.length>1">
|
||||||
|
<div class="paging">
|
||||||
|
<view
|
||||||
|
class="paging_left"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="changePage(false)"
|
||||||
|
>{{index===0?'返回':'上一条'}}</view>
|
||||||
|
<view
|
||||||
|
class="paging_right"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="changePage(true)"
|
||||||
|
>{{index===list.length-1?'返回':'下一条'}}</view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="myscroll">
|
||||||
|
<div :style="{height:'10px'}"></div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf"><text :style="{color:'red'}">*</text>灾害发生时间:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.otime"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf"><text :style="{color:'red'}">*</text>严重程度:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="{'1':'一般险情','2':'较大险情','3':'重大险情','4':'特别重大险情'}[getRecord.severity]"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf"><text :style="{color:'red'}">*</text>灾害发生地点:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.address"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">经度:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.lgtd"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">纬度:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.lttd"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf"><text :style="{color:'red'}">*</text>灾情描述:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--textarea
|
||||||
|
v-model="getRecord.ddscrib"
|
||||||
|
:disabled='true'
|
||||||
|
height=300
|
||||||
|
></u--textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">伤亡人数:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.dpcount"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">失踪人数:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.mpcount"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">转移人数:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.spcount"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">损毁房屋(间):</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.chcount"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">直接经济损失(万元):</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.elose"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">过程降雨量(mm):</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.pfrain"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">其他运行情况:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--textarea
|
||||||
|
v-model="getRecord.remark"
|
||||||
|
:disabled='true'
|
||||||
|
height=300
|
||||||
|
></u--textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">上报人:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.reporter"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">上报单位:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.reportUnit"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">上报时间:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="getRecord.reportTime"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">附件:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<text v-if="imgList.length===0">{{getRecord.fileIds || '暂无数据'}}</text>
|
||||||
|
<u-image
|
||||||
|
:style="{marginTop:'10px'}"
|
||||||
|
v-for="item in imgList"
|
||||||
|
:src="'http://223.75.53.141:9102/test.by-lyf.tmp'+item.filePath"
|
||||||
|
width="100%"
|
||||||
|
mode="aspectFit"
|
||||||
|
@click="previewImage(0,'http://223.75.53.141:9102/test.by-lyf.tmp'+item.filePath)"
|
||||||
|
></u-image>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'20vh'}"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
record:{},
|
||||||
|
list:[],
|
||||||
|
index:0,
|
||||||
|
cs:'',
|
||||||
|
imgList:[]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getState()
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getRecord() {
|
||||||
|
return this.list[this.index] || {}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getState() {
|
||||||
|
try{
|
||||||
|
const mtcd = this.getRecord.mtcd
|
||||||
|
console.log('mtcd',mtcd)
|
||||||
|
const res = await uni.$http.get('/gunshiApp/xfflood/iaCHsfwater/detail?mtcd='+mtcd)
|
||||||
|
this.imgList = res.data.data
|
||||||
|
console.log('res',res)
|
||||||
|
}catch(e){
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请求失败",
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
changePage(flag) {
|
||||||
|
if(flag){
|
||||||
|
if(this.index===this.list.length-1){
|
||||||
|
uni.navigateBack()
|
||||||
|
}else{
|
||||||
|
this.index = this.index+1
|
||||||
|
this.getState()
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
if(this.index===0){
|
||||||
|
uni.navigateBack()
|
||||||
|
}else{
|
||||||
|
this.index = this.index-1
|
||||||
|
this.getState()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
previewImage(index,url) {
|
||||||
|
// 使用uni.previewImage预览图片
|
||||||
|
uni.previewImage({
|
||||||
|
current: index,
|
||||||
|
urls: [url]
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(props){
|
||||||
|
const record = JSON.parse(props.obj)
|
||||||
|
this.index = record.myIndex
|
||||||
|
this.list= record.list
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.bodyBg{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.mybody{
|
||||||
|
margin-top: 50px;
|
||||||
|
padding-top: 10px;
|
||||||
|
width: 97%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
.row{
|
||||||
|
display: flex;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
.lf{
|
||||||
|
// width: 30%;
|
||||||
|
width: 8rem;
|
||||||
|
min-height: 40px;
|
||||||
|
text-align: right;
|
||||||
|
line-height: 38px;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
.rf{
|
||||||
|
// width: 70%;
|
||||||
|
flex: 1;
|
||||||
|
min-height: 40px;
|
||||||
|
line-height: 36px;
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-top: 1px;
|
||||||
|
}
|
||||||
|
.paging{
|
||||||
|
position: relative;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
margin: 5px 50px 15px 50px;
|
||||||
|
display: flex;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.paging_left{
|
||||||
|
width: 50%;
|
||||||
|
height: 100%;
|
||||||
|
border: 1px solid #dadbde;
|
||||||
|
border-right: 0;
|
||||||
|
background: rgb(245, 247, 250);
|
||||||
|
border-radius: 8px 0 0 8px;
|
||||||
|
}
|
||||||
|
.paging_right{
|
||||||
|
width: 50%;
|
||||||
|
height: 100%;
|
||||||
|
border: 1px solid #dadbde;
|
||||||
|
background: rgb(245, 247, 250);
|
||||||
|
border-radius: 0 8px 8px 0;
|
||||||
|
}
|
||||||
|
.is-hover{
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
.myHead{
|
||||||
|
margin-bottom: 0px;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.myscroll{
|
||||||
|
height: 90vh;
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,320 @@
|
||||||
|
<template>
|
||||||
|
<view class="tabBody">
|
||||||
|
<div class="searchBox">
|
||||||
|
<div class="searchBox_left">
|
||||||
|
<u-search
|
||||||
|
shape="square"
|
||||||
|
:clearabled="true"
|
||||||
|
:showAction=false
|
||||||
|
v-model="searchVal"
|
||||||
|
placeholder='请输入灾害发生地点/上报人'
|
||||||
|
height=40
|
||||||
|
>
|
||||||
|
</u-search>
|
||||||
|
</div>
|
||||||
|
<div class="searchBox_right">
|
||||||
|
<view
|
||||||
|
hover-class="is-hover"
|
||||||
|
class="searchBox_right_btn"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="myShow"
|
||||||
|
>
|
||||||
|
<u--image :src="'../../../static/images/filter.png'" width="22px" height="22px"></u--image>
|
||||||
|
</view>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="mybody">
|
||||||
|
<div class="countNum"><text>共{{getSearchVal.length}}条信息</text></div>
|
||||||
|
<div v-for="(item,index) in getSearchVal" class="listItem" @click="toForm(index)">
|
||||||
|
<div>
|
||||||
|
<div class="row1"><text>{{item.address+'('+{'1':'一般险情','2':'较大险情','3':'重大险情','4':'特别重大险情'}[item.severity]+')'}}</text></div>
|
||||||
|
<div class="row2">
|
||||||
|
<div>
|
||||||
|
<text :style="{marginRight:'5px'}">{{item.reporter}}</text>
|
||||||
|
<text>{{item.reportTime}}</text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="icon" v-show="item.isRead===0"></div>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'100px'}"></div>
|
||||||
|
</div>
|
||||||
|
<u-popup
|
||||||
|
:show="show"
|
||||||
|
mode="right"
|
||||||
|
:safeAreaInsetTop='true'
|
||||||
|
:closeOnClickOverlay='false'
|
||||||
|
@close="close"
|
||||||
|
@open="myShow">
|
||||||
|
<view :style="{padding:'10px',width:'250px'}">
|
||||||
|
<u-toast ref="uToast"></u-toast>
|
||||||
|
<text class="title">按严重程度</text>
|
||||||
|
<u-checkbox-group
|
||||||
|
placement="col"
|
||||||
|
v-model="check1"
|
||||||
|
:style="{padding:'10px 0px 20px 0px'}"
|
||||||
|
>
|
||||||
|
<u-checkbox name="1" label="一般险情" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="2" label="较大险情" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="3" label="重大险情" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="4" label="特别重大险情" class="checkItem"></u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
<div :style="{display:'flex',alignItems:'center'}">
|
||||||
|
<text class="title">按上报时间</text>
|
||||||
|
<u-switch v-model="isTime" size="20" :style="{margin:'2px 0 0 10px'}"></u-switch>
|
||||||
|
</div>
|
||||||
|
<div :style="{display:'flex',marginTop:'10px'}" v-if="isTime">
|
||||||
|
<view
|
||||||
|
class="tmPicker"
|
||||||
|
@click="showStmPicker = true"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
>{{getStmStr}}<u-icon name="calendar" size="18" color="#909399"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text :style="{width:'20%',lineHeight:'32px',textAlign:'center'}">至</text>
|
||||||
|
</div>
|
||||||
|
<div :style="{display:'flex',marginTop:'10px'}" v-if="isTime">
|
||||||
|
<view
|
||||||
|
class="tmPicker"
|
||||||
|
@click="showEtmPicker = true"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
>{{getEtmStr}}<u-icon name="calendar" size="18" color="#909399"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text :style="{width:'20%'}"></text>
|
||||||
|
</div>
|
||||||
|
<div :style="{position:'absolute',bottom:'20px',right:'20px',display:'flex'}">
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px',marginRight:'10px'}"
|
||||||
|
text="重置"
|
||||||
|
@click="reSet"
|
||||||
|
></u-button>
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px'}"
|
||||||
|
color="rgba(217, 0, 27, 1)"
|
||||||
|
type="primary"
|
||||||
|
text="确定"
|
||||||
|
@click="submit"
|
||||||
|
></u-button>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showStmPicker"
|
||||||
|
v-model="stm"
|
||||||
|
mode="datetime"
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="showStmPicker = false"
|
||||||
|
@cancel="showStmPicker = false"
|
||||||
|
@close="showStmPicker = false"
|
||||||
|
>
|
||||||
|
</u-datetime-picker>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showEtmPicker"
|
||||||
|
v-model="etm"
|
||||||
|
mode="datetime"
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="showEtmPicker = false"
|
||||||
|
@cancel="showEtmPicker = false"
|
||||||
|
@close="showEtmPicker = false"
|
||||||
|
>
|
||||||
|
</u-datetime-picker>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
show:false,
|
||||||
|
showStmPicker:false,
|
||||||
|
showEtmPicker:false,
|
||||||
|
searchVal:'',
|
||||||
|
stm:Number(moment(new Date()).add(-7,'days')),
|
||||||
|
etm:Number(new Date()),
|
||||||
|
isTime:false,
|
||||||
|
check1:['1','2','3','4'],
|
||||||
|
list:[]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getStmStr() {
|
||||||
|
return moment(this.stm).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
},
|
||||||
|
getEtmStr() {
|
||||||
|
return moment(this.etm).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
},
|
||||||
|
getSearchVal() {
|
||||||
|
if(this.searchVal){
|
||||||
|
return this.list.filter(o => (o.reporter?.indexOf(this.searchVal)>-1 || o.address?.indexOf(this.searchVal)>-1))
|
||||||
|
}else{
|
||||||
|
return this.list
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
myShow() {
|
||||||
|
this.show = true
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
reSet() {
|
||||||
|
this.isTime = false
|
||||||
|
this.stm = Number(moment(new Date()).add(-7,'days'))
|
||||||
|
this.etm = Number(new Date())
|
||||||
|
this.check1 = ['1','2','3','4']
|
||||||
|
},
|
||||||
|
async submit() {
|
||||||
|
if(!moment(this.stm).isBefore(this.etm)){
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "开始时间需小于结束时间",
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
try{
|
||||||
|
const params = {
|
||||||
|
severitys:this.check1.length===0?['999']:this.check1,
|
||||||
|
}
|
||||||
|
if(this.isTime){
|
||||||
|
params.timeSo = {
|
||||||
|
start:moment(this.stm).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
end:moment(this.etm).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.log('params',params)
|
||||||
|
const res = await uni.$http.post('/gunshiApp/xfflood/iaCHsfwater/queryList',params)
|
||||||
|
console.log('res',res)
|
||||||
|
this.list = res.data.data
|
||||||
|
this.close()
|
||||||
|
}catch(e){
|
||||||
|
//TODO handle the exception
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请求失败",
|
||||||
|
})
|
||||||
|
setTimeout(()=>{
|
||||||
|
this.close()
|
||||||
|
},1000)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
toForm(myIndex) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/gqzq/zqxx/form?obj='+JSON.stringify({list:this.getSearchVal,myIndex:myIndex}) // 跳转到对应路径的页面
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.submit()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.tabBody{
|
||||||
|
margin-top: 44px;
|
||||||
|
background-color: rgba(247, 247, 247, 1);
|
||||||
|
height: 100%;
|
||||||
|
// display: flex;
|
||||||
|
// flex-direction: column;
|
||||||
|
// align-items: center;
|
||||||
|
}
|
||||||
|
.searchBox{
|
||||||
|
height: 62px;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mybody{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin: 5px 5px;
|
||||||
|
padding: 5px 20px;
|
||||||
|
height: calc( 100vh - 100px );
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
.countNum{
|
||||||
|
width: 100%;
|
||||||
|
text-align: right;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
.listItem{
|
||||||
|
width: 100%;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
padding: 10px 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.row1{
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #333333;
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
}
|
||||||
|
.row2{
|
||||||
|
font-size: 12px;
|
||||||
|
color: #999999;
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.icon{
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
border-radius: 5px;
|
||||||
|
background-color: red;
|
||||||
|
}
|
||||||
|
.searchBox_left{
|
||||||
|
width: 82%;
|
||||||
|
padding-left: 15px;
|
||||||
|
}
|
||||||
|
.searchBox_right{
|
||||||
|
width: 18%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.searchBox_right_btn{
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.is-hover{
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
.title{
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
.checkItem{
|
||||||
|
margin-right: 10px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.tmPicker{
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
border: 1px solid rgba(240, 240, 240, 1);
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
// padding-left: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,51 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
title="灾情信息"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<uniTable ref="childRef"></uniTable>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
import uniTable from './table.vue';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: { uniTable },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
this.$refs.childRef.submit();
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.myTitleStyle{
|
||||||
|
font-size: 30px;
|
||||||
|
background-color: red;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
.tabsClass{
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 40px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,113 @@
|
||||||
|
<template>
|
||||||
|
<view class="rain-detail-box">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<view class="nav-bar">
|
||||||
|
<u-icon name="arrow-left" color="#000" size="20" @click="backTo" style="margin-left:10px"></u-icon>
|
||||||
|
<view class="title">
|
||||||
|
{{stnm}}
|
||||||
|
<text style="font-size:12px;margin-left:5px">{{sta}}({{rain}})</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="tab-bar" >
|
||||||
|
<view class="jcsj" @click="activeOne = 0" :class="{'active':activeOne == 0}">
|
||||||
|
监测数据
|
||||||
|
</view>
|
||||||
|
<view class="tjsj" @click="activeOne = 1" :class="{'active':activeOne == 1}">
|
||||||
|
统计数据
|
||||||
|
</view>
|
||||||
|
<view class="spjk" @click="activeOne = 3" :class="{'active':activeOne == 3}">
|
||||||
|
视频监控
|
||||||
|
</view>
|
||||||
|
<view class="zbyq" @click="activeOne = 2" :class="{'active':activeOne == 2}">
|
||||||
|
周边雨情
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="rain-detail-content">
|
||||||
|
<Jcsj :stcd="stcd" :source="source" :grz="grz" :wrz="wrz" v-if="activeOne == 0"/>
|
||||||
|
<Tjsj :stcd="stcd" :source="source" v-else-if="activeOne == 1"/>
|
||||||
|
<Spjk :stcd="stcd" :source="source" v-else-if="activeOne == 3"/>
|
||||||
|
<Zbyq :stcd="stcd" v-else-if="activeOne == 2"/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Jcsj from "./jcsj/jcsj.vue"
|
||||||
|
import Tjsj from "./tjsj/tjsj.vue"
|
||||||
|
import Zbyq from "./zbyq/zbyq.vue"
|
||||||
|
import Spjk from "./spjk/spjk.vue"
|
||||||
|
const staType = {
|
||||||
|
MM: '气象站',PP: '雨量站',RR: '水库水文站',ZZ: '河道水位站',ZQ:"河道水文站"
|
||||||
|
}
|
||||||
|
const rainType = {'SH':'山洪','SW':'水文','QX':'气象','SK':'水库'}
|
||||||
|
export default {
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
activeOne:0,
|
||||||
|
stcd:'',
|
||||||
|
stnm:'',
|
||||||
|
source:'',
|
||||||
|
wrz:'',
|
||||||
|
grz:''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
Jcsj,
|
||||||
|
Tjsj,
|
||||||
|
Zbyq,
|
||||||
|
Spjk,
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
backTo(){
|
||||||
|
uni.navigateBack({delta:1})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(option) {
|
||||||
|
this.stcd = option.stcd;
|
||||||
|
this.stnm = option.stnm;
|
||||||
|
this.source = option.source;
|
||||||
|
this.grz = option.grz;
|
||||||
|
this.wrz = option.wrz;
|
||||||
|
this.sta = staType[option.sttp];
|
||||||
|
this.rain = rainType[option.source];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.rain-detail-box{
|
||||||
|
height: 100vh;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
.nav-bar{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 44px;
|
||||||
|
// margin-top: 30px;
|
||||||
|
// padding-top: 20px;
|
||||||
|
// padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
// box-shadow: 0 5px 10px -8px #dfdfdf inset;
|
||||||
|
}
|
||||||
|
.title{
|
||||||
|
flex:1;
|
||||||
|
text-align: center;
|
||||||
|
margin-right: 18px;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
.tab-bar{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 10px 30px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
.active{
|
||||||
|
color: #39a6ff;
|
||||||
|
}
|
||||||
|
.rain-detail-content{
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,242 @@
|
||||||
|
|
||||||
|
import echarts from 'echarts/lib/echarts';
|
||||||
|
|
||||||
|
export default function DrpOption(data=[],wrz,grz) {
|
||||||
|
const maxVal = Math.max(...data.map(obj => obj.drp))
|
||||||
|
const maxSw = Math.max(...data.map(obj => obj.z))
|
||||||
|
const minSw = Math.min(...data.map(obj => obj.z))
|
||||||
|
const maxLl = Math.max(...data.map(obj => obj.tq))
|
||||||
|
const minLl = Math.min(...data.map(obj => obj.tq))
|
||||||
|
console.log("maxLl",wrz,grz);
|
||||||
|
let eopts = {
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis',
|
||||||
|
},
|
||||||
|
grid: [
|
||||||
|
{
|
||||||
|
top: "13%",
|
||||||
|
left: "10%",
|
||||||
|
right: "8%",
|
||||||
|
width: '80%',
|
||||||
|
height: '35%'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
bottom: "5%",
|
||||||
|
left: "10%",
|
||||||
|
right: "8%",
|
||||||
|
width: '80%',
|
||||||
|
height: '35%'
|
||||||
|
},
|
||||||
|
],
|
||||||
|
legend: {
|
||||||
|
// 显示图例
|
||||||
|
show: true,
|
||||||
|
// 图例的位置
|
||||||
|
data: ['警戒水位', '危险水位', "降雨量", "水位", "转换流量"],
|
||||||
|
left:3,
|
||||||
|
right:0,
|
||||||
|
itemWidth:16,
|
||||||
|
},
|
||||||
|
xAxis: [
|
||||||
|
{
|
||||||
|
gridIndex: 0,
|
||||||
|
type: 'category',
|
||||||
|
data: data.map(o => o.tm).reverse(),
|
||||||
|
splitLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
show:false,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.5,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
gridIndex: 1,
|
||||||
|
type: 'category',
|
||||||
|
data: data.map(o => o.tm.substr("2020-".length,11)),
|
||||||
|
inverse: true,
|
||||||
|
splitLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
formatter: val => val.substr('2020-'.length, 11)
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.5,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
],
|
||||||
|
yAxis: [
|
||||||
|
{
|
||||||
|
inverse: true,
|
||||||
|
gridIndex: 0,
|
||||||
|
type: 'value',
|
||||||
|
position: 'left',
|
||||||
|
name: "降雨量(mm)",
|
||||||
|
nameLocation: "start",
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dotted'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
min: 0,
|
||||||
|
max: maxVal
|
||||||
|
},
|
||||||
|
{
|
||||||
|
gridIndex: 1,
|
||||||
|
type: 'value',
|
||||||
|
position: 'left',
|
||||||
|
name: "水位(m)",
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dotted'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
min: minSw,
|
||||||
|
max: maxSw
|
||||||
|
},
|
||||||
|
{
|
||||||
|
gridIndex: 1,
|
||||||
|
type: 'value',
|
||||||
|
position: 'right',
|
||||||
|
name: "流量(m³/s)",
|
||||||
|
splitLine: {
|
||||||
|
show: false,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dotted'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
min: minLl,
|
||||||
|
max: maxLl
|
||||||
|
}
|
||||||
|
],
|
||||||
|
}
|
||||||
|
let chartData = {
|
||||||
|
series: [
|
||||||
|
|
||||||
|
{
|
||||||
|
xAxisIndex: 1,
|
||||||
|
yAxisIndex: 1,
|
||||||
|
name: '危险水位',
|
||||||
|
type: 'line',
|
||||||
|
color: "#D9001B",
|
||||||
|
lineStyle: {
|
||||||
|
type: "dashed"
|
||||||
|
},
|
||||||
|
data: data.map(o => grz),
|
||||||
|
symbol: 'none' // 设置标记点为'none'，即去掉圆点
|
||||||
|
},
|
||||||
|
{
|
||||||
|
xAxisIndex: 1,
|
||||||
|
yAxisIndex: 1,
|
||||||
|
name: '警戒水位',
|
||||||
|
type: 'line',
|
||||||
|
color: "#F59A23",
|
||||||
|
barWidth: '60%',
|
||||||
|
data: data.map(o => wrz),
|
||||||
|
lineStyle: {
|
||||||
|
type: "dashed"
|
||||||
|
},
|
||||||
|
symbol: 'none' // 设置标记点为'none'，即去掉圆点
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '降雨量',
|
||||||
|
type: 'bar',
|
||||||
|
barWidth: '60%',
|
||||||
|
data: data.map(o => o.drp).reverse(),
|
||||||
|
itemStyle: {
|
||||||
|
color: "#007AFD",
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
{
|
||||||
|
xAxisIndex: 1,
|
||||||
|
yAxisIndex: 1,
|
||||||
|
name: '水位',
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
color: "#0AE0B5",
|
||||||
|
label: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
data: data.map(o => o.z ? o.z.toFixed(2) : null),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
xAxisIndex: 1,
|
||||||
|
yAxisIndex: 2,
|
||||||
|
name: '转换流量',
|
||||||
|
type: 'line',
|
||||||
|
color: "#007AFD",
|
||||||
|
symbol: 'none',
|
||||||
|
showSymbol: false,
|
||||||
|
label: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
data: data.map(o => o.tq),
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
eopts,
|
||||||
|
chartData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,151 @@
|
||||||
|
<template>
|
||||||
|
<view class="jcsj-box">
|
||||||
|
<view class="time-ranger">
|
||||||
|
<view class="start-time">
|
||||||
|
<text>开始时间</text>
|
||||||
|
<text @click="showTime=true" style="margin-left:10%;color:#3399ef">{{stm}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="end-time">
|
||||||
|
<text>结束时间</text>
|
||||||
|
<text @click="showTime1=true" style="margin:0 10%;color:#3399ef">{{etm}}</text>
|
||||||
|
<view class="search-btn" @click="searchHandle">
|
||||||
|
搜索
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- <uni-datetime-picker type="datetimerange" v-model="tm" @change="handleRanger"></uni-datetime-picker>
|
||||||
|
<view class="search-btn" @click="searchHandle">
|
||||||
|
搜索
|
||||||
|
</view> -->
|
||||||
|
</view>
|
||||||
|
<!-- <view class="" style="width: 100%; height: 3px; background-color: #dfdfdf; margin-bottom: 2px;">
|
||||||
|
|
||||||
|
" </view> -->
|
||||||
|
<view style="text-align: right; margin-bottom: -15px;">
|
||||||
|
<text :class="{'active':selactOne == 0}" @click="selactOne = 0" style="display: inline-block; padding: 2px 20px; text-align: center; border: 1px solid #dfdfdf;">图</text>
|
||||||
|
<text :class="{'active':selactOne == 1}" @click="selactOne = 1" style="display: inline-block; padding: 2px 20px; text-align: center; border: 1px solid #dfdfdf;">表</text>
|
||||||
|
</view>
|
||||||
|
<view class="jcsj-content">
|
||||||
|
<view class="jcsj-charts" v-if="selactOne == 0">
|
||||||
|
<qiun-data-charts :chartData="chartData.chartData" :echartsApp="true" :eopts="chartData.eopts" />
|
||||||
|
</view>
|
||||||
|
<view style="margin-top: 20px;" v-if="selactOne == 1">
|
||||||
|
<JcsjTable :tableData="tableData" />
|
||||||
|
</view>
|
||||||
|
<view style="height:300px" v-if="selactOne == 0"></view>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showTime"
|
||||||
|
v-model="startTime"
|
||||||
|
mode="datetime"
|
||||||
|
@confirm="handleStartTime"
|
||||||
|
@cancel="showTime=false"
|
||||||
|
></u-datetime-picker>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showTime1"
|
||||||
|
v-model="endTime"
|
||||||
|
mode="datetime"
|
||||||
|
@confirm="handleEndTime"
|
||||||
|
@cancel="showTime1=false"
|
||||||
|
></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
import JcsjTable from "./jcsjTable"
|
||||||
|
import drpOption from "./chartOption.js"
|
||||||
|
const stm = moment().subtract(7, 'days').add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm");
|
||||||
|
const etm = moment().add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm");
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
stcd:String,
|
||||||
|
source:String,
|
||||||
|
wrz:String,
|
||||||
|
grz:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
startTime:stm,
|
||||||
|
endTime:etm,
|
||||||
|
stm,
|
||||||
|
etm,
|
||||||
|
showTime:false,
|
||||||
|
showTime1:false,
|
||||||
|
tableData:[],
|
||||||
|
chartData: {},
|
||||||
|
rainChartData:[],
|
||||||
|
selactOne:0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
JcsjTable
|
||||||
|
},
|
||||||
|
watch:{
|
||||||
|
rainChartData(newV, oldV){
|
||||||
|
this.chartData = {...drpOption(newV,this.wrz,this.grz)}
|
||||||
|
this.tableData = [...newV]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleStartTime(e){
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
this.stm = time
|
||||||
|
this.showTime = false
|
||||||
|
},
|
||||||
|
handleEndTime(e){
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
this.etm = time;
|
||||||
|
this.showTime1 = false
|
||||||
|
},
|
||||||
|
handleRanger(e){
|
||||||
|
console.log(e);
|
||||||
|
this.tm = [...e]
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
async getJcsjData(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.post(
|
||||||
|
"/gunshiApp/xfflood/river/water/monitor/data",
|
||||||
|
{
|
||||||
|
stcd:this.stcd,
|
||||||
|
stm:moment(this.stm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
etm:moment(this.etm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
source:this.source
|
||||||
|
})
|
||||||
|
if(data.code == 200){
|
||||||
|
this.rainChartData = [...data.data];
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
searchHandle(){
|
||||||
|
this.getJcsjData();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getJcsjData();
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.jcsj-box{
|
||||||
|
.jcsj-content{
|
||||||
|
max-height:100vh;
|
||||||
|
overflow-y:auto
|
||||||
|
}
|
||||||
|
.jcsj-charts{
|
||||||
|
width:100%;
|
||||||
|
height: 500px;
|
||||||
|
margin-top: 20px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
.active{
|
||||||
|
border-color: #68bbff !important;
|
||||||
|
color: #68bbff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,110 @@
|
||||||
|
<template>
|
||||||
|
<div class="table_div">
|
||||||
|
<div class="table_cur">
|
||||||
|
<table style="width:100%;display:block">
|
||||||
|
<tr>
|
||||||
|
<th style="width: 40px;">
|
||||||
|
序号
|
||||||
|
</th>
|
||||||
|
<th style="width: 80px">时间</th>
|
||||||
|
<th style="width: 80px;">
|
||||||
|
雨量(mm)
|
||||||
|
</th>
|
||||||
|
<th style="width: 90px;">
|
||||||
|
水位(m)
|
||||||
|
</th>
|
||||||
|
<th style="width: 80px; position: relative;">
|
||||||
|
<view>
|
||||||
|
转换流量<br>
|
||||||
|
<text style="position: absolute; bottom:-10px; left: 20px;">(m³/s)</text>
|
||||||
|
</view>
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
<!-- style="max-height: 480px; overflow-y: auto" -->
|
||||||
|
<div class="scroll-table">
|
||||||
|
<tr v-for="(item, index) in newList" :key="index">
|
||||||
|
<td style="width: 30px">{{ index + 1 }}</td>
|
||||||
|
<td style="width: 80px;">{{ item.tm }}</td>
|
||||||
|
<td style="width: 80px">{{ item.drp }}</td>
|
||||||
|
<td style="width: 100px">{{ item.z ? item.z.toFixed(2) : "-" }}</td>
|
||||||
|
<td style="width: 80px">{{ item.tq ? item.tq : "-" }}</td>
|
||||||
|
</tr>
|
||||||
|
<div style="height:180px"></div>
|
||||||
|
</div>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
tableData:{
|
||||||
|
type:Array,
|
||||||
|
default:[],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed:{
|
||||||
|
newList(){
|
||||||
|
if(this.tableData.length){
|
||||||
|
return this.tableData.map(item => ({...item,tm:moment(item.tm).format("MM-DD HH:mm")}))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.table_div {
|
||||||
|
height: 100%;
|
||||||
|
max-width: calc(100% - 0px);
|
||||||
|
max-height: calc(100vh);
|
||||||
|
flex: 1;
|
||||||
|
padding-top: 0px;
|
||||||
|
overflow-x: scroll;
|
||||||
|
}
|
||||||
|
/*table样式*/
|
||||||
|
.table_cur {
|
||||||
|
width: 100%;
|
||||||
|
empty-cells: show;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.scroll-table{
|
||||||
|
height: calc(100vh - 180px);
|
||||||
|
overflow-y: auto;
|
||||||
|
width:'100%'
|
||||||
|
}
|
||||||
|
.table_cur tr {
|
||||||
|
display: flex;
|
||||||
|
line-height: 75rpx;
|
||||||
|
}
|
||||||
|
.table_cur th {
|
||||||
|
height: 85rpx;
|
||||||
|
color: #3399ef;
|
||||||
|
background: #e1f3ff;
|
||||||
|
font-size: 14px;
|
||||||
|
// font-weight: bold;
|
||||||
|
padding: 0px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur td {
|
||||||
|
height: 65rpx;
|
||||||
|
// border-bottom: 1px solid #d8ddeb;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #2f4056;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
/*table样式 end*/
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,127 @@
|
||||||
|
<template>
|
||||||
|
<view class="spjk-box">
|
||||||
|
<view class="select-bar">
|
||||||
|
<uni-data-select
|
||||||
|
v-model="value"
|
||||||
|
:localdata="list"
|
||||||
|
@change="change"
|
||||||
|
:clear="false"
|
||||||
|
>
|
||||||
|
</uni-data-select>
|
||||||
|
</view>
|
||||||
|
<view class="video-box" v-if="this.list.length">
|
||||||
|
<!-- <web-view :src="webURL" style="height: 400px;"></web-view> -->
|
||||||
|
<iframe :src="webURL" :class="{'normal': show == 0,'active': show == 1}" frameborder="0" ref="videoFrame" :allowfullscreen="true"></iframe>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default{
|
||||||
|
props:{
|
||||||
|
stcd:String,
|
||||||
|
source:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
value: "",
|
||||||
|
list:[],
|
||||||
|
webURL:'',
|
||||||
|
show:0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
receiveRenderData(e){
|
||||||
|
this.show = e.data
|
||||||
|
},
|
||||||
|
async getList(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.get(
|
||||||
|
`/gunshiApp/xfflood/stbprp/cctv/listByStcd/${this.stcd}`)
|
||||||
|
if(data.code == 200){
|
||||||
|
let newData;
|
||||||
|
console.log("23",data.data);
|
||||||
|
if(data.data.length > 0){
|
||||||
|
newData = data.data.map(item => ({...item,value:item.camId,text:item.name}))
|
||||||
|
this.list = [...newData];
|
||||||
|
this.value = newData[0].value
|
||||||
|
this.getVideoSrc(newData[0].camId)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async getVideoSrc(id){
|
||||||
|
console.log(id);
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.get(
|
||||||
|
`/gunshiApp/xfflood/xfCctvB/preview/${id}`)
|
||||||
|
if(data.code == 200){
|
||||||
|
this.webURL="./static/h5Player/webplayer.html?cameraIndexCode="+id+"&cameraUrl="+data.data
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
change(e) {
|
||||||
|
console.log("e:", e);
|
||||||
|
this.getVideoSrc(e)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getList()
|
||||||
|
// this.creatFlvElement()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script module="renderModal" lang="renderjs">
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
dom: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.dom = document.getElementById('iframe')
|
||||||
|
// 接收iframe传过来的值
|
||||||
|
window.addEventListener('message', (e)=> {
|
||||||
|
var data = e.data;
|
||||||
|
this.emitData(data)
|
||||||
|
});
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
emitData(e) {
|
||||||
|
this.$ownerInstance.callMethod('receiveRenderData',e)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.spjk-box{
|
||||||
|
.select-bar{
|
||||||
|
margin: 10px 15px;
|
||||||
|
}
|
||||||
|
.video-box{
|
||||||
|
|
||||||
|
.normal{
|
||||||
|
position: absolute;
|
||||||
|
// width: 370px;
|
||||||
|
// height: 300px;
|
||||||
|
top: 170px;
|
||||||
|
left: 0;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
.active{
|
||||||
|
position: absolute;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
top: -30px;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,161 @@
|
||||||
|
<template>
|
||||||
|
<view class="tjsj-box">
|
||||||
|
<uni-row class="tjsj-row" :width="700">
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近1h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h1||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近3h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h3||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近6h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h6||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近12h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h12||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近24h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h24||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近48h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h48||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">今日雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.today||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">昨日雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.yesterdayDrp||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">本月雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.monthDrp||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">本年雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.yearDrp||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">本年降雨天数</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.yearDrpDay||0}}/{{days}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row" >本年最大日雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row" style="display: flex; justify-content: center;">
|
||||||
|
<text>{{tableData.maxDrp||0}}</text>
|
||||||
|
<text style="color: #E69224;">({{maxDrpTime}})</text>
|
||||||
|
</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">24h水位变幅(m)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.rzDiff > 0 ? "+" :"" }}{{tableData.rzDiff?tableData.rzDiff.toFixed(2) : 0}}</view>
|
||||||
|
</uni-col> <uni-col :span="12">
|
||||||
|
<view class="first-row" style="border-bottom: 1px solid #dfdfdf;">本年最高水位(m)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row" style="border-bottom: 1px solid #dfdfdf;">{{tableData.maxRz ? tableData.maxRz.toFixed(2) :0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
</uni-row>
|
||||||
|
<view style="height:150px"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
stcd:String,
|
||||||
|
source:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tableData:{},
|
||||||
|
days:moment().diff(moment().startOf('year'),'days')+1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed:{
|
||||||
|
maxDrpTime(){
|
||||||
|
if(this.tableData.maxDrpTime){
|
||||||
|
return moment(this.tableData.maxDrpTime).format("YYYY-MM-DD")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getTableData(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.post(
|
||||||
|
`/gunshiApp/xfflood/river/water/detail`,{
|
||||||
|
source:this.source,
|
||||||
|
stcd:this.stcd,
|
||||||
|
type:1
|
||||||
|
}
|
||||||
|
)
|
||||||
|
if(data.code == 200){
|
||||||
|
this.tableData = {...data.data};
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getTableData()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.tjsj-box{
|
||||||
|
max-height: 100vh;
|
||||||
|
overflow-y: auto;
|
||||||
|
.tjsj-row{
|
||||||
|
.first-row{
|
||||||
|
line-height: 40px;
|
||||||
|
text-align: center;
|
||||||
|
border-top: 1px solid #dfdfdf;
|
||||||
|
border-left: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
.second-row{
|
||||||
|
line-height: 40px;
|
||||||
|
text-align: center;
|
||||||
|
border-top: 1px solid #dfdfdf;
|
||||||
|
border-left: 1px solid #dfdfdf;
|
||||||
|
border-right: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,87 @@
|
||||||
|
<template>
|
||||||
|
<view class="list-box">
|
||||||
|
<uni-row class="list-row" >
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row" style="margin-left: 10px;">
|
||||||
|
<text style="display: inline-block; margin-bottom: 10px; font-weight: bold;">{{info.stnm}}</text>
|
||||||
|
<view>
|
||||||
|
<text style="margin-right: 60px; color: #aaaaaa;">{{sttype[info.source]}}</text>
|
||||||
|
<text style="color: #aaaaaa;">{{info.distance ? info.distance.toFixed(2) : 0}}km</text>
|
||||||
|
</view>
|
||||||
|
<text style="color: #aaaaaa;">{{info.tm}}</text>
|
||||||
|
</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12" >
|
||||||
|
<view class="second-row" style="border: 1px solid #dfdfdf; font-size: 12px;border-bottom: 1px solid #dfdfdf;">
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex:0.5; background-color: #e1f3ff; border-right: 1px solid #dfdfdf; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
1h(mm)
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; background-color: #e1f3ff;text-align: center; border-bottom:1px solid #dfdfdf" >
|
||||||
|
3h(mm)
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex: 0.5; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
{{info.h1}}
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
{{info.h3}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex:0.5; background-color: #e1f3ff; border-right: 1px solid #dfdfdf; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
6h(mm)
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; background-color: #e1f3ff;text-align: center; border-bottom:1px solid #dfdfdf" >
|
||||||
|
24h(mm)
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex: 0.5; text-align: center; border-right: 1px solid #dfdfdf;">
|
||||||
|
{{info.h6}}
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; text-align: center; ">
|
||||||
|
{{info.h24}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-col>
|
||||||
|
</uni-row>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
info:Object,
|
||||||
|
default:{}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
sttype: {
|
||||||
|
"SH": '山洪',
|
||||||
|
"SW": '水文',
|
||||||
|
"QX": '气象',
|
||||||
|
"SK": '水库',
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.list-box{
|
||||||
|
.list-row{
|
||||||
|
padding-bottom: 3px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
.second-row{
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,166 @@
|
||||||
|
<template>
|
||||||
|
<view class="zbyq-box">
|
||||||
|
<view class="search-bar">
|
||||||
|
<u-search
|
||||||
|
shape="square"
|
||||||
|
:clearabled="true"
|
||||||
|
:showAction="false"
|
||||||
|
placeholder="请输入站点"
|
||||||
|
height="40px"
|
||||||
|
@change="inputChange"
|
||||||
|
v-model="formData.value"
|
||||||
|
></u-search>
|
||||||
|
<image
|
||||||
|
src="../../../static/images/filter.png"
|
||||||
|
style="width: 20px; height: 20px; margin-right: 10px; margin-left: 10px;"
|
||||||
|
@click="popupOpen = true"
|
||||||
|
>
|
||||||
|
</image>
|
||||||
|
</view>
|
||||||
|
<view class="content">
|
||||||
|
<view v-for="(item,index) in list" :key="index" style="margin-bottom: 5px;">
|
||||||
|
<ResList :info="item" />
|
||||||
|
</view>
|
||||||
|
<view style="height:300px"></view>
|
||||||
|
</view>
|
||||||
|
<u-popup :show="popupOpen" mode="right" @close="popupOpen=false" >
|
||||||
|
<view style="padding: 30px 20px;">
|
||||||
|
<text style="font-weight: bold;">按类型</text>
|
||||||
|
<view style="margin-bottom: 10px; margin-left: -5px;">
|
||||||
|
<u-checkbox-group
|
||||||
|
v-model="formData.sources"
|
||||||
|
@change="checkboxChange"
|
||||||
|
>
|
||||||
|
<u-checkbox
|
||||||
|
:customStyle="{margin: '7px'}"
|
||||||
|
v-for="(item, index) in checkboxList1"
|
||||||
|
:key="index"
|
||||||
|
:label="item.name"
|
||||||
|
:name="item.value"
|
||||||
|
>
|
||||||
|
</u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
</view>
|
||||||
|
<text style="font-weight: bold; margin-bottom: 5px;">按距离</text>
|
||||||
|
<view style="display: flex; align-items: center;">
|
||||||
|
<u--input
|
||||||
|
placeholder="请输入"
|
||||||
|
border="surround"
|
||||||
|
type="number"
|
||||||
|
v-model="formData.distance"
|
||||||
|
style="width: 50%; margin-top: 5px; margin-right: 10px;"
|
||||||
|
></u--input>
|
||||||
|
<text>(km)</text>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex; position:absolute;bottom:20px;right:20px">
|
||||||
|
<u-button text="重置" class="bottom-btn1"
|
||||||
|
@click="formData = {...formData,sources,distance:1}"></u-button>
|
||||||
|
<u-button text="确认" color="#d9001b" class="bottom-btn2" @click="popConfirm"></u-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import ResList from "./resList.vue"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
stcd:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
popupOpen:false,
|
||||||
|
sources:["SH","SW","QX","SK"],
|
||||||
|
checkboxList1: [{
|
||||||
|
name: '山洪',
|
||||||
|
value: "SH"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '水文',
|
||||||
|
value: "SW"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '气象',
|
||||||
|
value: "QX"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '水库',
|
||||||
|
value: "SK"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
formData:{
|
||||||
|
value:'',
|
||||||
|
sources:["SH","SW","QX","SK"],
|
||||||
|
distance:1,
|
||||||
|
stcd:this.stcd
|
||||||
|
},
|
||||||
|
list:[], //搜索结果
|
||||||
|
saveList:[] //保存搜索结果
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
ResList
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
inputChange(e){
|
||||||
|
console.log("e",e);
|
||||||
|
if(!e) this.list = this.saveList;
|
||||||
|
this.formData={...this.formData,value:e}
|
||||||
|
let filterData = this.list.filter(item => item.stnm.indexOf(e) > -1);
|
||||||
|
this.list = filterData;
|
||||||
|
},
|
||||||
|
checkboxChange(n) {
|
||||||
|
console.log('change', n);
|
||||||
|
this.formData = {...this.formData,sources:n};
|
||||||
|
},
|
||||||
|
popConfirm(){
|
||||||
|
this.popupOpen = false
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
async getList(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.post(
|
||||||
|
"/gunshiApp/xfflood/attResBase/rainBasinDivision/queryNearbyRainStations",{...this.formData}
|
||||||
|
)
|
||||||
|
console.log("data",data);
|
||||||
|
if(data.code == 200){
|
||||||
|
this.list = [...data.data]
|
||||||
|
this.saveList = [...data.data]
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getList()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.zbyq-box{
|
||||||
|
.search-bar{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.content{
|
||||||
|
margin-top: 10px;
|
||||||
|
max-height: 100vh;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottom-btn1{
|
||||||
|
width: 100px;
|
||||||
|
margin-left: 70px;
|
||||||
|
}
|
||||||
|
.bottom-btn2{
|
||||||
|
width: 100px;
|
||||||
|
margin-right: -12px;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,100 @@
|
||||||
|
|
||||||
|
import echarts from 'echarts/lib/echarts';
|
||||||
|
import moment from 'moment';
|
||||||
|
|
||||||
|
export default function DrpOption(data=[]) {
|
||||||
|
const maxY = Math.max(...data.map(item => item.sumDrp))
|
||||||
|
let eopts = {
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis',
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
x: 18,
|
||||||
|
y: 24,
|
||||||
|
x2: 28,
|
||||||
|
y2: 36,
|
||||||
|
borderWidth: 0,
|
||||||
|
bottom: '10%',
|
||||||
|
left: '8%',
|
||||||
|
width: '90%',
|
||||||
|
},
|
||||||
|
calculable: true,
|
||||||
|
xAxis: [
|
||||||
|
{
|
||||||
|
type: 'category',
|
||||||
|
data: data.map(o => moment(o.time).format("HH:mm")),
|
||||||
|
splitLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#bbb',
|
||||||
|
fontSize: 14,
|
||||||
|
overflow: 'truncate',
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#dfdfdf',
|
||||||
|
width: 0.5
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
yAxis: [
|
||||||
|
{
|
||||||
|
type: 'value',
|
||||||
|
position: 'left',
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dashed'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#bbb',
|
||||||
|
fontSize: 10,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
min: 0,
|
||||||
|
max:maxY
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// dataZoom: [
|
||||||
|
// {
|
||||||
|
// type: 'slider', // 设置为滑动条类型
|
||||||
|
// xAxisIndex: 0, // 指定控制第一个 x 轴
|
||||||
|
// start: 0, // 初始窗口的起始位置（百分比）
|
||||||
|
// end: 100, // 初始窗口的结束位置（百分比）
|
||||||
|
|
||||||
|
// }
|
||||||
|
// ],
|
||||||
|
}
|
||||||
|
let chartData = {
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '面雨量(mm)',
|
||||||
|
type: 'bar',
|
||||||
|
barWidth: '60%',
|
||||||
|
data: data.map(o => o.sumDrp),
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
color: "#6395f9"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
eopts,
|
||||||
|
chartData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,424 @@
|
||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<!-- 个人信息 -->
|
||||||
|
<view class="info">
|
||||||
|
<div class="left">
|
||||||
|
<div class="icon">
|
||||||
|
<image style="width: 100%; height: 100%; border-radius: 50%" :src="default_src" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
</div>
|
||||||
|
<div class="info_name">
|
||||||
|
<div v-if="userList.userName">{{ userList.nickName }}</div>
|
||||||
|
<div v-if="userList.dept">
|
||||||
|
{{ userList.dept.deptName || '' }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="right">
|
||||||
|
<u-icon name="bell-fill" size="30" color="#fff" @click="todetailmessgae()">
|
||||||
|
|
||||||
|
</u-icon>
|
||||||
|
<u-badge bgColor=" #de2433" :offset='[25,20]' :value="messagelist.length" :absolute='true'></u-badge>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<!-- nav -->
|
||||||
|
<view class="navBar" style="display: flex;flex-wrap: wrap;">
|
||||||
|
<div class="navList" v-for="(item, index) in getNavList" :key="index">
|
||||||
|
<div @click="myNavigateTo(item.url,item.value)"
|
||||||
|
style="display:flex;flex-direction: column;align-items: center;">
|
||||||
|
<div class="navIcon">
|
||||||
|
<image style="width: 100%; height: 100%" :src="item.icon" mode="aspectFit"></image>
|
||||||
|
<div class="readStatus" v-show="
|
||||||
|
(warnStatus && item.key == 2)
|
||||||
|
"></div>
|
||||||
|
</div>
|
||||||
|
<div class="navTxt">{{ item.value }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<view class="warn">
|
||||||
|
<sk-info />
|
||||||
|
</view>
|
||||||
|
<view class="warn1" v-for="item in Ylzlist" :key="item.stnm">
|
||||||
|
<ylz-list :item='item' />
|
||||||
|
</view>
|
||||||
|
<view class="warn1" v-for="item in swzList" :key="item.stcd">
|
||||||
|
<SwzList :item='item'/>
|
||||||
|
</view>
|
||||||
|
<view class="info_24"
|
||||||
|
:style="{display:'flex',justifyContent:'center',alignItems:'center',padding:'5px 0',margin:'0'}">
|
||||||
|
<image :style="{width:'20px',height:'20px',marginRight:'10px'}" src="../../static/logoc.png"></image>
|
||||||
|
<div>技术支持: 湖北鲧石物联科技有限公司</div>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
const warnStm = moment().subtract(1, "days").format("YYYY-MM-DD HH:mm:ss")
|
||||||
|
const warnetm = moment().format("YYYY-MM-DD HH:mm:ss")
|
||||||
|
import SkInfo from '../skInfo/index.vue'
|
||||||
|
import YlzList from '../ylzList/index.vue'
|
||||||
|
import SwzList from "../sws/index.vue"
|
||||||
|
let timer = null;
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
SkInfo,
|
||||||
|
YlzList,
|
||||||
|
SwzList
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
Ylzlist: [],
|
||||||
|
userList: uni.getStorageSync('value'),
|
||||||
|
default_src: uni.getStorageSync('avatar'),
|
||||||
|
messagelist: [],
|
||||||
|
ylzList: [],
|
||||||
|
swzList:[],
|
||||||
|
warnStatus: false, //预警
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
this.getYjData();
|
||||||
|
uni.$showMsg("刷新成功");
|
||||||
|
setTimeout(function () {
|
||||||
|
uni.stopPullDownRefresh();
|
||||||
|
}, 1000);
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getNavList() {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
value: '综合监视',
|
||||||
|
key: 1,
|
||||||
|
icon: '../../static/tabs/zhjs.png',
|
||||||
|
url: '/pages/zhjs/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '预警',
|
||||||
|
key: 2,
|
||||||
|
icon: '../../static/tabs/yujing_icon@2x2.png',
|
||||||
|
url: '/pages/yj/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '视频监控',
|
||||||
|
key: 3,
|
||||||
|
icon: '../../static/tabs/spjk.png',
|
||||||
|
url: '/pages/spjk/index'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: '安全监测',
|
||||||
|
key: 4,
|
||||||
|
icon: '../../static/tabs/aqjc.png',
|
||||||
|
url: '/pages/aqjc/index'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getYlzList() {
|
||||||
|
uni.$http.post('/gunshiApp/tsg/stPptnRReal/list').then(res => {
|
||||||
|
if (res.data.code == 200) {
|
||||||
|
this.Ylzlist = res.data.data
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getList() {
|
||||||
|
uni.$http.post('/gunshiApp/tsg/messageCenter/list', {
|
||||||
|
start: '',
|
||||||
|
end: ''
|
||||||
|
}).then(res => {
|
||||||
|
if (res.data.code == 200) {
|
||||||
|
this.messagelist = res.data.data
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getSwList(){
|
||||||
|
uni.$http.post('/gunshiApp/tsg/reservoir/water/list').then(res=>{
|
||||||
|
this.swzList=res.data.data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
todetailmessgae() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/messageList/index'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
async setInsert(menu2) {
|
||||||
|
try {
|
||||||
|
const params = {
|
||||||
|
createId: uni.getStorageSync('value').userId,
|
||||||
|
loginType: 1,
|
||||||
|
menu1: '首页',
|
||||||
|
menu2: menu2 || '首页',
|
||||||
|
}
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post('/gunshiApp/tsg/visitMenuLog/insert', params)
|
||||||
|
} catch (error) {}
|
||||||
|
},
|
||||||
|
myNavigateTo(url, menu2) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: url // 跳转到对应路径的页面
|
||||||
|
})
|
||||||
|
this.setInsert(menu2)
|
||||||
|
},
|
||||||
|
// 预警
|
||||||
|
async getYjData() {
|
||||||
|
const params = {
|
||||||
|
start: warnStm,
|
||||||
|
end: warnetm
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
const res = await uni.$http.post("/gunshiApp/tsg/stQxWarnR/home/warn", params)
|
||||||
|
const {
|
||||||
|
flowWarn,
|
||||||
|
pressWarn,
|
||||||
|
qxWarn,
|
||||||
|
shiftWarn
|
||||||
|
} = res.data.data
|
||||||
|
const arr = [...flowWarn, ...pressWarn, ...qxWarn, ...shiftWarn]
|
||||||
|
if (arr.length > 0) {
|
||||||
|
this.warnStatus = true
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
onLoad() {
|
||||||
|
this.getYlzList();
|
||||||
|
},
|
||||||
|
|
||||||
|
onShow() {
|
||||||
|
var that = this;
|
||||||
|
that.getList();
|
||||||
|
timer = setInterval(function () {
|
||||||
|
that.getList();
|
||||||
|
}, 10000);
|
||||||
|
|
||||||
|
this.setInsert()
|
||||||
|
this.getYjData();
|
||||||
|
this.getSwList()
|
||||||
|
},
|
||||||
|
onHide() {
|
||||||
|
clearInterval(timer)
|
||||||
|
timer = null;
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.container {
|
||||||
|
position: relative;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 24px;
|
||||||
|
background-color: #f3f5f8;
|
||||||
|
height: 100%;
|
||||||
|
overflow: auto;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.info {
|
||||||
|
height: 100rpx;
|
||||||
|
background-color: #007afd;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 20px;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
color: #007afd;
|
||||||
|
line-height: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info_name {
|
||||||
|
margin-left: 16rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navBar {
|
||||||
|
padding: 13px;
|
||||||
|
padding-bottom: 0;
|
||||||
|
/* text-align: center; */
|
||||||
|
display: flex;
|
||||||
|
background-color: #fff;
|
||||||
|
// justify-content: center;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navList {
|
||||||
|
text-align: center;
|
||||||
|
margin-right: 0px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.navIcon {
|
||||||
|
position: relative;
|
||||||
|
width: 82px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.readStatus {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 17px;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: #de2433;
|
||||||
|
}
|
||||||
|
|
||||||
|
.warn {
|
||||||
|
padding: 18rpx 20rpx;
|
||||||
|
text-align: left;
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.warn1 {
|
||||||
|
padding: 18rpx 20rpx;
|
||||||
|
text-align: left;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info_24 {
|
||||||
|
width: 100%;
|
||||||
|
// position: fixed;
|
||||||
|
// padding: 15px;
|
||||||
|
background-color: #fff;
|
||||||
|
// margin-bottom: 12rpx;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title .line {
|
||||||
|
border: 2px solid #3380ff;
|
||||||
|
border-radius: 3rpx;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title .h4 {
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #121b3d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.time {
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #a2a2a2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.g1 {
|
||||||
|
color: #545556;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ye {
|
||||||
|
color: #ff1717;
|
||||||
|
/* font-weight: 600; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.b1 {
|
||||||
|
color: #3380ff;
|
||||||
|
padding: 0 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.uni-group {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 表格 */
|
||||||
|
.tableBox {
|
||||||
|
width: 100%;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.leftTab {
|
||||||
|
width: 80px;
|
||||||
|
/* border-bottom: 1px solid #ccc; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.rightTab {
|
||||||
|
width: 80px;
|
||||||
|
/* border: 1px solid #ccc;
|
||||||
|
border-radius: 0 3px 3px 0;
|
||||||
|
border-left: 0; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.activetextTypeTab,
|
||||||
|
.activetextTypeTab:hover {
|
||||||
|
border-bottom: 3rpx solid #2286f6;
|
||||||
|
color: #026be0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_div {
|
||||||
|
widows: 100%;
|
||||||
|
height: 100%;
|
||||||
|
max-width: calc(100% - 0px);
|
||||||
|
max-height: calc(100vh - 24px);
|
||||||
|
flex: 1;
|
||||||
|
padding-top: 30px;
|
||||||
|
overflow-x: scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*table样式*/
|
||||||
|
.table_cur {
|
||||||
|
width: 100%;
|
||||||
|
empty-cells: show;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur tr {
|
||||||
|
display: flex;
|
||||||
|
line-height: 56rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur th {
|
||||||
|
height: 56rpx;
|
||||||
|
color: #2f4056;
|
||||||
|
background: #f5f6f8;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur td {
|
||||||
|
height: 56rpx;
|
||||||
|
border-bottom: 1px solid #e5e9f2;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #2f4056;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*table样式 end*/
|
||||||
|
.noData {
|
||||||
|
width: 100px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,231 @@
|
||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<div class="img">
|
||||||
|
<image style="width: 100%; height: 100%" src="../../static/images/bg_img.png" mode="scaleToFill"></image>
|
||||||
|
</div>
|
||||||
|
<view class="user-title">
|
||||||
|
<text class="sub">用户登录</text>
|
||||||
|
<text class="line"></text>
|
||||||
|
</view>
|
||||||
|
<uni-forms :modelValue="formData" class="form">
|
||||||
|
<uni-forms-item>
|
||||||
|
<uni-easyinput type="text" v-model="formData.username" placeholder="请输入用户名" />
|
||||||
|
</uni-forms-item>
|
||||||
|
<uni-forms-item>
|
||||||
|
<uni-easyinput type="password" v-model="formData.password" placeholder="请输入密码" />
|
||||||
|
</uni-forms-item>
|
||||||
|
<uni-forms-item>
|
||||||
|
<checkbox :checked="formData.checked" @click="handleChange(formData)" /><text>记住用户名和密码</text>
|
||||||
|
</uni-forms-item>
|
||||||
|
<button type="primary" class="button" @click="login(formData)">
|
||||||
|
登录
|
||||||
|
</button>
|
||||||
|
</uni-forms>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import CryptoJS from 'crypto-js'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
formData: {
|
||||||
|
username: '',
|
||||||
|
password: '',
|
||||||
|
checked: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
if (uni.getStorageSync('loginChecked') === true) {
|
||||||
|
this.formData = {
|
||||||
|
username: uni.getStorageSync('username'),
|
||||||
|
password: uni.getStorageSync('password'),
|
||||||
|
checked: true,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 更新版本
|
||||||
|
init() {
|
||||||
|
this.checkVersion();
|
||||||
|
},
|
||||||
|
// 检查版本更新情况
|
||||||
|
async checkVersion() {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.get("/gunshiApp/tsg/appVersionRecord/latest");
|
||||||
|
if (data.code == 200) {
|
||||||
|
const selfVersionCode = uni.getSystemInfoSync().appWgtVersion //当前App版本号
|
||||||
|
const newVersionCode = data.data.version; //线上最新版本号
|
||||||
|
if (selfVersionCode != newVersionCode) {
|
||||||
|
let platform = uni.getSystemInfoSync().platform //手机平台
|
||||||
|
//安卓手机弹窗升级
|
||||||
|
if (platform === 'android') {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/upgrade/index?info=${encodeURIComponent(JSON.stringify(data.data))}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
//IOS无法在线升级提示到商店下载
|
||||||
|
else {
|
||||||
|
uni.showModal({
|
||||||
|
title: '发现新版本 ' + 'V' + newVersionCode,
|
||||||
|
content: '请到App store进行升级',
|
||||||
|
showCancel: false
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
// uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
handleChange(formData) {
|
||||||
|
formData.checked = !formData.checked
|
||||||
|
},
|
||||||
|
login(formData) {
|
||||||
|
//loading
|
||||||
|
uni.showLoading({
|
||||||
|
title: '努力登录中...',
|
||||||
|
mask: true
|
||||||
|
});
|
||||||
|
|
||||||
|
//MD5加密
|
||||||
|
const encryptData = data => {
|
||||||
|
const encryptedData = CryptoJS.MD5(data).toString()
|
||||||
|
return encryptedData
|
||||||
|
}
|
||||||
|
|
||||||
|
//创建提交表单
|
||||||
|
let postForm = {
|
||||||
|
username: formData.username,
|
||||||
|
password: formData.password
|
||||||
|
}
|
||||||
|
|
||||||
|
//记住密码功能
|
||||||
|
if (formData.checked === true) {
|
||||||
|
uni.setStorageSync('loginChecked', true)
|
||||||
|
uni.setStorageSync('username', postForm.username)
|
||||||
|
uni.setStorageSync('password', formData.password)
|
||||||
|
uni.setStorageSync('secretKey', postForm.secretKey)
|
||||||
|
} else {
|
||||||
|
uni.setStorageSync('loginChecked', false)
|
||||||
|
uni.removeStorageSync('username')
|
||||||
|
uni.removeStorageSync('secretKey')
|
||||||
|
uni.removeStorageSync('password')
|
||||||
|
this.formData.username = ''
|
||||||
|
this.formData.password = ''
|
||||||
|
}
|
||||||
|
|
||||||
|
//提交表单
|
||||||
|
uni.$http.post('/gunshiApp/tsg/login', postForm).then(res => {
|
||||||
|
uni.showLoading({
|
||||||
|
title: '努力登录中...',
|
||||||
|
mask: true
|
||||||
|
})
|
||||||
|
if (res.data.code === 200) {
|
||||||
|
//localStorage保存token
|
||||||
|
|
||||||
|
if (res.data.token) {
|
||||||
|
uni.setStorageSync('Gs-Token', res.data.token)
|
||||||
|
uni.$http.get('/gunshiApp/tsg/getInfo').then(res => {
|
||||||
|
this.getImgFlow(res.data.user.avatar)
|
||||||
|
uni.setStorageSync('value', res.data.user)
|
||||||
|
setTimeout(function () {
|
||||||
|
uni.hideLoading()
|
||||||
|
uni.reLaunch({
|
||||||
|
url: '/pages/homeIndex/index'
|
||||||
|
})
|
||||||
|
}, 1000)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
setTimeout(function () {
|
||||||
|
uni.hideLoading()
|
||||||
|
uni.showToast({
|
||||||
|
title: res.data.description,
|
||||||
|
icon: 'none',
|
||||||
|
duration: 2000
|
||||||
|
})
|
||||||
|
}, 1000)
|
||||||
|
clearTimeout()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getImgFlow(imgUrl) {
|
||||||
|
if (imgUrl) {
|
||||||
|
uni.request({
|
||||||
|
url: 'http://local.gunshiiot.com:18083' +
|
||||||
|
`/gunshiApp/tsg/common/download/resource?resource=${imgUrl}`,
|
||||||
|
responseType: 'arraybuffer',
|
||||||
|
success: (res) => {
|
||||||
|
// 将arraybuffer转换为Base64编码
|
||||||
|
let base64 = uni.arrayBufferToBase64(res.data);
|
||||||
|
const p = 'data:image/png;base64,' + base64;
|
||||||
|
uni.setStorageSync("avatar", p)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
uni.setStorageSync('avatar', "../../static/tabs/touxiang.png")
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.init();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.container {
|
||||||
|
display: flex;
|
||||||
|
flex: 1;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
align-items: center;
|
||||||
|
background-color: #f3f5f8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.img {
|
||||||
|
|
||||||
|
width: 100vw;
|
||||||
|
height: 40vh;
|
||||||
|
margin-top: 0vh;
|
||||||
|
/* background-color: red; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.form {
|
||||||
|
margin-top: 10vh;
|
||||||
|
width: 80%;
|
||||||
|
height: 8vh;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-title {
|
||||||
|
position: relative;
|
||||||
|
padding: 4px;
|
||||||
|
text-align: center;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.sub {
|
||||||
|
font-size: 28px;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.line {
|
||||||
|
position: absolute;
|
||||||
|
width: 80px;
|
||||||
|
height: 5px;
|
||||||
|
left: 20px;
|
||||||
|
bottom: -10px;
|
||||||
|
background-color: #00a8ff;
|
||||||
|
border-radius: 15%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,146 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden',backgroundColor: '#f0f0f0',}">
|
||||||
|
<u-navbar title="消息中心" :autoBack="true" :titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}" :height='44' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
|
||||||
|
</u-navbar>
|
||||||
|
<view class="" style="margin-top: 44px;background-color: #f0f0f0;border-top: 1px solid #f0f0f0;">
|
||||||
|
<view class="" v-for="item in list" style="margin: 10px;background-color: #fff;padding: 10px;">
|
||||||
|
|
||||||
|
<view class="contentItem">
|
||||||
|
|
||||||
|
<view class="itemC">
|
||||||
|
<text>标题</text>
|
||||||
|
<text>{{item.title}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>发布时间</text>
|
||||||
|
<text>{{item.publishTime}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>发布人</text>
|
||||||
|
<text>{{item.publishUserName}}</text>
|
||||||
|
</view>
|
||||||
|
<!-- <view class="itemC">
|
||||||
|
<text>优先级</text>
|
||||||
|
<text>{{item.xjx}}</text>
|
||||||
|
</view> -->
|
||||||
|
|
||||||
|
<view class="itemNo" style="flex-direction: column;">
|
||||||
|
<text>消息内容</text>
|
||||||
|
<u--textarea v-model="item.content" placeholder="请输入内容" disabled ></u--textarea>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<u-calendar :show="show" mode="range" @confirm="confirm" @cancel='cancel'></u-calendar>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
show: false,
|
||||||
|
model: {
|
||||||
|
stm: '',
|
||||||
|
etm: ''
|
||||||
|
},
|
||||||
|
list: [
|
||||||
|
]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad(options){
|
||||||
|
this.list.push(JSON.parse(options.item))
|
||||||
|
this.yd(JSON.parse(options.item))
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
yd(item){
|
||||||
|
uni.$http.post('/gunshiApp/tsg/messageCenter/update',{...item,status:1})
|
||||||
|
},
|
||||||
|
confirm(e) {
|
||||||
|
console.log(e);
|
||||||
|
this.model.stm = e[0]
|
||||||
|
this.model.etm = e[1]
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
cancel() {
|
||||||
|
this.show = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.myTitleStyle {
|
||||||
|
font-size: 30px;
|
||||||
|
background-color: red;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabsClass {
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 40px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
|
||||||
|
padding-bottom: 10px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
// justify-content: space-between;
|
||||||
|
.blueTiao{
|
||||||
|
background-color: #007aff;
|
||||||
|
width: 5px;
|
||||||
|
height: 16px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.title {
|
||||||
|
border-width: 0px;
|
||||||
|
font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #666666
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleRight {
|
||||||
|
display: flex;
|
||||||
|
.border {
|
||||||
|
border-width: 0px;
|
||||||
|
background-color: rgba(236, 245, 255, 1);
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: rgba(187, 220, 255, 1);
|
||||||
|
border-radius: 5px;
|
||||||
|
box-shadow: none;
|
||||||
|
width: 58px;
|
||||||
|
height: 25px;
|
||||||
|
color: #689FFF;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.contentItem{
|
||||||
|
.itemC{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
display: flex;
|
||||||
|
color: #666666;
|
||||||
|
padding: 10px;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
.itemNo{
|
||||||
|
color: #666666;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,219 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden',backgroundColor: '#f0f0f0'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar title="消息中心" :autoBack="true" :titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
|
||||||
|
}" rightText="一键已读" @rightClick='rightClick' :height='44' :safeAreaInsetTop=true leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'>
|
||||||
|
</u-navbar>
|
||||||
|
<view class="" style="margin-top: 44px;;background-color: #f0f0f0;border-top: 1px solid #f0f0f0;">
|
||||||
|
<view style="padding:0 10px,backgroundColor:#fff">
|
||||||
|
<view class="time-ranger" style="padding:10px;background-color: #fff;">
|
||||||
|
<view class="start-time">
|
||||||
|
<text>开始时间</text>
|
||||||
|
<text @click="showTime=true" style="margin-left:10%;color:#3399ef">{{startTime}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="end-time">
|
||||||
|
<text>结束时间</text>
|
||||||
|
<text @click="showTime1=true" style="margin:0 10%;color:#3399ef">{{endTime}}</text>
|
||||||
|
<view class="search-btn" @click="searchTm">
|
||||||
|
搜索
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="height:calc(100vh - 180px); overflow-y:auto;" v-if="list.length !== 0">
|
||||||
|
<view class="" v-for="(item,index) in list" :key="index" style="margin: 10px;background-color: #fff;padding: 10px;" @click="toDetail(item)">
|
||||||
|
<view class="item">
|
||||||
|
<view class="align-center">
|
||||||
|
<view class="blueTiao">
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="title">
|
||||||
|
{{item.title}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="titleRight" >
|
||||||
|
{{item.publishTime}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="contentItem">
|
||||||
|
<view class="itemC">
|
||||||
|
{{item.content}}
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
style="height:calc(100vh - 150px);display: flex;align-items: center;justify-content: center;background-color: #fff;"
|
||||||
|
v-else>
|
||||||
|
<image src="../../static/empty.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker :show="showTime" v-model="stm" mode="datetime" @confirm="showTime=false"
|
||||||
|
:minDate="minDate"
|
||||||
|
:maxDate="maxDate"
|
||||||
|
@cancel="showTime=false"></u-datetime-picker>
|
||||||
|
<u-datetime-picker :show="showTime1" v-model="etm" mode="datetime" @confirm="showTime1=false"
|
||||||
|
:minDate="minDate"
|
||||||
|
:maxDate="maxDate"
|
||||||
|
@cancel="showTime1=false"></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
minDate:moment().startOf('year').valueOf(),
|
||||||
|
maxDate:moment().valueOf(),
|
||||||
|
show: false,
|
||||||
|
showTime:false,
|
||||||
|
showTime1:false,
|
||||||
|
start: '请选择开始时间',
|
||||||
|
end: '请选择结束时间',
|
||||||
|
stm:'',
|
||||||
|
etm:'',
|
||||||
|
userList: uni.getStorageSync('value').data,
|
||||||
|
list: []
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onShow(options) {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
|
||||||
|
computed:{
|
||||||
|
startTime:function (){
|
||||||
|
return this.stm?moment(this.stm).format('YYYY-MM-DD HH:mm:ss'):this.start
|
||||||
|
},
|
||||||
|
endTime:function (){
|
||||||
|
return this.etm?moment(this.etm).format('YYYY-MM-DD HH:mm:ss'):this.end
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
rightClick() {
|
||||||
|
uni.$http.get('/gunshiApp/tsg/messageCenter/all/read', {
|
||||||
|
receiveUserId: uni.getStorageSync('value').userId
|
||||||
|
}).then(res => {
|
||||||
|
|
||||||
|
if (res.data.code == 200) {
|
||||||
|
this.getList()
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
searchTm() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
getList() {
|
||||||
|
console.log(111);
|
||||||
|
uni.$http.post('/gunshiApp/tsg/messageCenter/list', {
|
||||||
|
start:this.stm?moment(this.stm).format('YYYY-MM-DD HH:mm:ss'):'',
|
||||||
|
end:this.etm?moment(this.etm).format('YYYY-MM-DD HH:mm:ss'):''
|
||||||
|
}).then(res => {
|
||||||
|
|
||||||
|
if (res.data.code == 200) {
|
||||||
|
this.list = res.data.data
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
confirm(e) {
|
||||||
|
console.log(e);
|
||||||
|
this.model.start = e[0]
|
||||||
|
this.model.end = e[1]
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
cancel() {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
toDetail(item) {
|
||||||
|
console.log(item);
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/messageList/detail/index?item=' + JSON.stringify(item),
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
|
.uni-input-placeholder {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.myTitleStyle {
|
||||||
|
font-size: 30px;
|
||||||
|
background-color: red;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabsClass {
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 40px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
// border-bottom: 1px solid #f0f0f0;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.blueTiao {
|
||||||
|
background-color: #2a7efa;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
border-width: 0px;
|
||||||
|
font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #666666
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleRight {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.border {
|
||||||
|
border-width: 0px;
|
||||||
|
background-color: rgba(236, 245, 255, 1);
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: rgba(187, 220, 255, 1);
|
||||||
|
border-radius: 5px;
|
||||||
|
box-shadow: none;
|
||||||
|
width: 58px;
|
||||||
|
height: 25px;
|
||||||
|
color: #689FFF;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.contentItem {
|
||||||
|
.itemC {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
display: flex;
|
||||||
|
color: #666666;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,148 @@
|
||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<div class="userinfo">
|
||||||
|
<div class="icon" @click="goBack">
|
||||||
|
<uni-icons type="back" size="25" color="white"></uni-icons>
|
||||||
|
</div>
|
||||||
|
<div class="Header">
|
||||||
|
<span>修改密码</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="info">
|
||||||
|
<uni-forms :modelValue="formData" >
|
||||||
|
<uni-forms-item label="原密码" :required="true" class="form">
|
||||||
|
<uni-easyinput type="password" v-model="formData.oldPassword" placeholder="请输入原密码" class="password"/>
|
||||||
|
</uni-forms-item>
|
||||||
|
<uni-forms-item label="新密码" :required="true" class="form">
|
||||||
|
<uni-easyinput type="password" v-model="formData.newPassword" placeholder="请输入新密码" class="password"/>
|
||||||
|
</uni-forms-item>
|
||||||
|
<!-- <uni-forms-item label="再次输入新密码" label-width="120px" :required="true" class="form">
|
||||||
|
<uni-easyinput type="password" v-model="formData.newPassword" placeholder="请再次输入新密码" class="password"/>
|
||||||
|
</uni-forms-item> -->
|
||||||
|
<button type="primary" class="button" @click="save(formData)">保存</button>
|
||||||
|
</uni-forms>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
import CryptoJS from 'crypto-js'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// formData: {
|
||||||
|
// oldSecretKey: '',
|
||||||
|
// newSecretKey: '',
|
||||||
|
// secondSecretKey: '',
|
||||||
|
// },
|
||||||
|
formData: {
|
||||||
|
oldPassword: '',
|
||||||
|
newPassword: '',
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
goBack(){
|
||||||
|
uni.navigateBack()
|
||||||
|
},
|
||||||
|
save(formData){
|
||||||
|
|
||||||
|
// let new_params = {
|
||||||
|
// userId: '' ,
|
||||||
|
// oldSecretKey: '',
|
||||||
|
// newSecretKey: '',
|
||||||
|
// secondSecretKey: '',
|
||||||
|
// }
|
||||||
|
|
||||||
|
// new_params.oldSecretKey = CryptoJS.MD5(formData.oldSecretKey).toString()
|
||||||
|
// new_params.newSecretKey = CryptoJS.MD5(formData.newSecretKey).toString()
|
||||||
|
// new_params.secondSecretKey = CryptoJS.MD5(formData.secondSecretKey).toString()
|
||||||
|
// new_params.userId = uni.getStorageSync('value').userId
|
||||||
|
// console.log(formData)
|
||||||
|
|
||||||
|
uni.$http.put(`/gunshiApp/tsg/system/user/profile/updatePwd?oldPassword=${formData.oldPassword}&newPassword=${formData.newPassword}`).then(res=>{
|
||||||
|
console.log(res);
|
||||||
|
if (res.data.code === 200) {
|
||||||
|
uni.showToast({
|
||||||
|
title: "修改成功，即将重新登录",
|
||||||
|
icon:'none',
|
||||||
|
duration: 2000
|
||||||
|
})
|
||||||
|
setTimeout(() => {
|
||||||
|
uni.reLaunch({
|
||||||
|
url: '/pages/login/login'
|
||||||
|
// url:'/pages/homeIndex/index'
|
||||||
|
})
|
||||||
|
},2500)
|
||||||
|
} else {
|
||||||
|
uni.showToast({
|
||||||
|
title: res.data.description,
|
||||||
|
icon:'none',
|
||||||
|
duration: 2000
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// uni.navigateBack()
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.userinfo{
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
margin-top: 5vh;
|
||||||
|
margin-left: 2vw;
|
||||||
|
margin-bottom: 2vh;
|
||||||
|
align-items: center;
|
||||||
|
width: 95%;
|
||||||
|
height: 6vh;
|
||||||
|
background-color: #007afd;
|
||||||
|
|
||||||
|
}
|
||||||
|
.icon{
|
||||||
|
width: 6vw;
|
||||||
|
height: 6vh;
|
||||||
|
align-items: center;
|
||||||
|
line-height: 6vh;
|
||||||
|
}
|
||||||
|
.Header{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex: 0.95;
|
||||||
|
justify-content: center;
|
||||||
|
color: white;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
.form{
|
||||||
|
height: 50px;
|
||||||
|
width: 95%;
|
||||||
|
/* background-color: red; */
|
||||||
|
margin-left: 1vw;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.password{
|
||||||
|
font-size: 20px;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
.button{
|
||||||
|
border-radius: 10px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column-reverse;
|
||||||
|
margin-top: 50vh;
|
||||||
|
width: 92%;
|
||||||
|
height: 6vh;
|
||||||
|
font-size: 20px;
|
||||||
|
color: white;
|
||||||
|
background-color: #007afd;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,231 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'auto'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar title="问题处理" :autoBack="true" :titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}" :height='44' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
|
||||||
|
</u-navbar>
|
||||||
|
<view class="" style="margin-top: 44px;;background-color: #f0f0f0;border-top: 1px solid #f0f0f0;">
|
||||||
|
<view style="margin: 10px;background-color: #fff;padding: 10px;">
|
||||||
|
<view class="item">
|
||||||
|
<view class="blueTiao">
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="title">
|
||||||
|
巡检问题信息
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="contentItem">
|
||||||
|
|
||||||
|
<view class="itemC">
|
||||||
|
<text>巡查人</text>
|
||||||
|
<text>{{queItem.inspectUserName}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>巡查时间</text>
|
||||||
|
<text>{{queItem.finishTime}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>任务标题</text>
|
||||||
|
<text>{{queItem.taskTitle}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>巡检点</text>
|
||||||
|
<text>{{queItem.name}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>巡检项</text>
|
||||||
|
<text>{{queItem.itemDesc}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemNo" style="flex-direction: column;">
|
||||||
|
<text>巡检问题描述</text>
|
||||||
|
<u--textarea v-model="queItem.problemDesc" placeholder="请输入内容" disabled ></u--textarea>
|
||||||
|
</view>
|
||||||
|
<view class="itemNo" style="flex-direction: column;">
|
||||||
|
<text>巡检图片</text>
|
||||||
|
<view class="" v-for="item in queItem.inspectPics">
|
||||||
|
<image :src="item.url" style="width: 80px;height: 80px;margin: 5px;" @click="previewImage(item)"></image>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="itemNo" style="flex-direction: column;">
|
||||||
|
<text>巡检视频</text>
|
||||||
|
<view class="" v-for="item in queItem.inspectVideos">
|
||||||
|
<video :src="item.url" style="width: 80px;height: 80px;margin: 5px;" show-fullscreen-btn></video>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="margin: 10px;background-color: #fff;padding: 10px;" class="">
|
||||||
|
<u--form labelPosition="left" :model="o" ref="uForm" label-width='80px'>
|
||||||
|
<view class="itemCc">
|
||||||
|
<u-form-item label="处理人" prop="handleUserName" borderBottom required >
|
||||||
|
<u--input v-model="queItem.handleUserName" disabled disabledColor="#ffffff"
|
||||||
|
placeholder="" border="none"></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="处理时间" prop="handleTime" borderBottom required>
|
||||||
|
<u--input v-model="queItem.handleTime" disabled disabledColor="#ffffff"
|
||||||
|
placeholder="" border="none"></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="处理内容" prop="handleDesc" borderBottom required labelPosition='top'>
|
||||||
|
<u--textarea v-model="queItem.handleDesc" disabled placeholder="请输入内容" ></u--textarea>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="处理图片" prop="handlePics" borderBottom required labelPosition='top'>
|
||||||
|
<u-upload accept="image" :fileList="queItem.handlePics || []" disabled
|
||||||
|
name="handlePics" multiple
|
||||||
|
:maxCount="10"></u-upload>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="处理视频" prop="handleVideos" borderBottom labelPosition='top'>
|
||||||
|
<u-upload accept="video" :fileList="queItem.handleVideos" disabled
|
||||||
|
name="handleVideos" multiple
|
||||||
|
:maxCount="10"></u-upload>
|
||||||
|
</u-form-item>
|
||||||
|
</view>
|
||||||
|
</u--form>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
show: false,
|
||||||
|
model: {
|
||||||
|
stm: '',
|
||||||
|
etm: ''
|
||||||
|
},
|
||||||
|
customStyle: {
|
||||||
|
background: '#000'
|
||||||
|
},
|
||||||
|
queItem:{},
|
||||||
|
list: [
|
||||||
|
]
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad(options) {
|
||||||
|
this.queItem = JSON.parse(options.item)
|
||||||
|
|
||||||
|
this.queItem.handleVideos?.map(item1=>{
|
||||||
|
item1.url ='http://223.75.53.141:9102/test.by-lyf.tmp' + item1.filePath
|
||||||
|
return item1
|
||||||
|
})
|
||||||
|
this.queItem.handlePics?.map(item1=>{
|
||||||
|
item1.url ='http://223.75.53.141:9102/test.by-lyf.tmp' + item1.filePath
|
||||||
|
return item1
|
||||||
|
})
|
||||||
|
this.queItem.inspectVideos?.map(item1=>{
|
||||||
|
item1.url ='http://223.75.53.141:9102/test.by-lyf.tmp' + item1.filePath
|
||||||
|
return item1
|
||||||
|
})
|
||||||
|
this.queItem.inspectPics?.map(item1=>{
|
||||||
|
item1.url ='http://223.75.53.141:9102/test.by-lyf.tmp' + item1.filePath
|
||||||
|
return item1
|
||||||
|
})
|
||||||
|
console.log(this.queItem);
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
previewImage(item){
|
||||||
|
uni.previewImage({
|
||||||
|
urls: [item.url],
|
||||||
|
longPressActions: {
|
||||||
|
itemList: ['发送给朋友', '保存图片', '收藏'],
|
||||||
|
success: function(data) {
|
||||||
|
console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
|
||||||
|
},
|
||||||
|
fail: function(err) {
|
||||||
|
console.log(err.errMsg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.myTitleStyle {
|
||||||
|
font-size: 30px;
|
||||||
|
background-color: red;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabsClass {
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 40px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
|
||||||
|
padding-bottom: 10px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
// justify-content: space-between;
|
||||||
|
.blueTiao{
|
||||||
|
background-color: #007aff;
|
||||||
|
width: 5px;
|
||||||
|
height: 16px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.title {
|
||||||
|
border-width: 0px;
|
||||||
|
font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #666666
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleRight {
|
||||||
|
display: flex;
|
||||||
|
.border {
|
||||||
|
border-width: 0px;
|
||||||
|
background-color: rgba(236, 245, 255, 1);
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: rgba(187, 220, 255, 1);
|
||||||
|
border-radius: 5px;
|
||||||
|
box-shadow: none;
|
||||||
|
width: 58px;
|
||||||
|
height: 25px;
|
||||||
|
color: #689FFF;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.itemCc{
|
||||||
|
// display: flex;
|
||||||
|
// justify-content: space-between;
|
||||||
|
// display: flex;
|
||||||
|
|
||||||
|
padding: 10px;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.contentItem{
|
||||||
|
.itemC{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
display: flex;
|
||||||
|
color: #303133;;
|
||||||
|
padding: 10px;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
.itemNo{
|
||||||
|
color: #303133;;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,201 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar title="问题处理" :autoBack="true" :titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}" :height='44' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
|
||||||
|
</u-navbar>
|
||||||
|
<view class=""
|
||||||
|
style="margin-top: 50px;;background-color: #f0f0f0;border-top: 1px solid #f0f0f0;overflow: auto;">
|
||||||
|
<view style="padding:0 10px;backgroundColor:#fff">
|
||||||
|
<view class="time-ranger">
|
||||||
|
<view class="start-time">
|
||||||
|
<text>开始时间</text>
|
||||||
|
<text @click="showTime=true" style="margin-left:10%;color:#3399ef">{{startTime}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="end-time">
|
||||||
|
<text>结束时间</text>
|
||||||
|
<text @click="showTime1=true" style="margin:0 10%;color:#3399ef">{{endTime}}</text>
|
||||||
|
<view class="search-btn" @click="searchTm">
|
||||||
|
搜索
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="height:calc(100vh - 150px);overflow: auto;" v-if='list.length !== 0'>
|
||||||
|
<view class="" v-for="(item,index) in list" :key="index" @click="toDetail(item)"
|
||||||
|
style="margin:10px;background-color: #fff;padding: 10px;">
|
||||||
|
<view class="item">
|
||||||
|
<!-- {{item.title}} -->
|
||||||
|
<view class="title">
|
||||||
|
{{item.taskTitle}}
|
||||||
|
</view>
|
||||||
|
<view class="titleRight" >
|
||||||
|
<view class="border">
|
||||||
|
{{item.isHandle==1?'已处理':'待处理'}}
|
||||||
|
</view>
|
||||||
|
<u-icon name="arrow-right" size="20"></u-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="contentItem">
|
||||||
|
<view class="itemC">
|
||||||
|
<text>巡检项</text>
|
||||||
|
<text>{{item.itemDesc}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>巡查人</text>
|
||||||
|
<text>{{item.inspectUserName}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>巡查时间</text>
|
||||||
|
<text>{{item.finishTime}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="height:calc(100vh - 150px);display: flex;align-items: center;justify-content: center;background-color: #fff;" v-else>
|
||||||
|
<image src="../../../../static/empty.png" mode="" ></image>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker :show="showTime" v-model="stm" mode="datetime" @confirm="showTime=false"
|
||||||
|
@cancel="showTime=false"></u-datetime-picker>
|
||||||
|
<u-datetime-picker :show="showTime1" v-model="etm" mode="datetime" @confirm="showTime1=false"
|
||||||
|
@cancel="showTime1=false"></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
show: false,
|
||||||
|
showTime: false,
|
||||||
|
showTime1: false,
|
||||||
|
minDate:moment().startOf('year').valueOf(),
|
||||||
|
maxDate:moment().valueOf(),
|
||||||
|
start: '请选择开始时间',
|
||||||
|
end: '请选择结束时间',
|
||||||
|
stm:moment().startOf('year').format('YYYY-MM-DD'),
|
||||||
|
etm:moment().format('YYYY-MM-DD'),
|
||||||
|
customStyle: {
|
||||||
|
background: '#000'
|
||||||
|
},
|
||||||
|
list: []
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
startTime: function () {
|
||||||
|
|
||||||
|
return this.stm ? moment(this.stm).format('YYYY-MM-DD') : this.start
|
||||||
|
},
|
||||||
|
endTime: function () {
|
||||||
|
return this.etm ? moment(this.etm).format('YYYY-MM-DD') : this.end
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
searchTm() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
getList() {
|
||||||
|
console.log(uni.getStorageSync('value'));
|
||||||
|
let params = {
|
||||||
|
"pageSo": {
|
||||||
|
"pageSize": 999,
|
||||||
|
"pageNumber": 1
|
||||||
|
},
|
||||||
|
"dateTimeRangeSo": {
|
||||||
|
start:this.stm?moment(this.stm).format('YYYY-MM-DD 00:00:00'):'',
|
||||||
|
end:this.etm?moment(this.etm).format('YYYY-MM-DD 23:59:59'):''
|
||||||
|
},
|
||||||
|
"isHandle": 1,
|
||||||
|
"handleUserId": uni.getStorageSync('value').userId
|
||||||
|
}
|
||||||
|
uni.$http.post('/gunshiApp/tsg/inspect/detail/page', params).then(res => {
|
||||||
|
this.list = res.data.data.records
|
||||||
|
})
|
||||||
|
},
|
||||||
|
confirm(e) {
|
||||||
|
console.log(e);
|
||||||
|
this.model.start = e[0]
|
||||||
|
this.model.end = e[1]
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
cancel() {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
toDetail(item) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/mypage/compents/wtcl/detail/index?item=' + JSON.stringify(item)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.myTitleStyle {
|
||||||
|
font-size: 30px;
|
||||||
|
background-color: red;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabsClass {
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 40px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
border-width: 0px;
|
||||||
|
font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #666666
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleRight {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.border {
|
||||||
|
border-width: 0px;
|
||||||
|
background-color: rgba(236, 245, 255, 1);
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: rgba(187, 220, 255, 1);
|
||||||
|
border-radius: 5px;
|
||||||
|
box-shadow: none;
|
||||||
|
width: 58px;
|
||||||
|
height: 25px;
|
||||||
|
color: #689FFF;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.contentItem {
|
||||||
|
.itemC {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
display: flex;
|
||||||
|
color: #666666;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,95 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
|
||||||
|
<u--form labelPosition="left" :model="model1" ref="uForm" >
|
||||||
|
<u-form-item label="管护类型" prop="maintainType" borderBottom ref="item1"
|
||||||
|
required
|
||||||
|
labelPosition='top'
|
||||||
|
labelWidth="100px">
|
||||||
|
<u--input v-model="model1.maintainName" disabled disabledColor="#ffffff" placeholder="请选择管护类型"
|
||||||
|
border="none" ></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="内容说明" prop="maintainContent" borderBottom labelPosition='top' required labelWidth="100px">
|
||||||
|
<u--textarea v-model="model1.maintainContent" placeholder="请输入内容" disabled></u--textarea>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="现场图片" prop="pics" borderBottom labelPosition='top' labelWidth="100px">
|
||||||
|
<u-upload :fileList="model1.pics" name="pics" multiple disabled
|
||||||
|
multiple accept='image' :maxCount="10"></u-upload>
|
||||||
|
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="现场视频" prop="videos" borderBottom labelPosition='top' labelWidth="100px">
|
||||||
|
<u-upload :fileList="model1.videos" name="videos" multiple disabled
|
||||||
|
multiple accept='video' :maxCount="10"></u-upload>
|
||||||
|
|
||||||
|
</u-form-item>
|
||||||
|
</u--form>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
formData:Object
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
showSex: false,
|
||||||
|
fileListpics: [],
|
||||||
|
fileListvideos: [],
|
||||||
|
model1: {
|
||||||
|
maintainContent: "",
|
||||||
|
maintainType: '',
|
||||||
|
pics: [],
|
||||||
|
videos: []
|
||||||
|
},
|
||||||
|
actions: [{
|
||||||
|
value: 1,
|
||||||
|
name: "溢洪道清障"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 2,
|
||||||
|
name: "除草除杂"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 3,
|
||||||
|
name: "设备养护"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 4,
|
||||||
|
name: "环境清洁"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 5,
|
||||||
|
name: "危险提示"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 6,
|
||||||
|
name: "其他"
|
||||||
|
},
|
||||||
|
],
|
||||||
|
radio: '',
|
||||||
|
switchVal: false
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.model1 = this.formData
|
||||||
|
this.model1.maintainName = this.actions.find(item=>item.value == this.formData.maintainType).name
|
||||||
|
this.model1.pics?.map(item1=>{
|
||||||
|
item1.url ='http://223.75.53.141:9102/test.by-lyf.tmp' + item1.filePath
|
||||||
|
return item1
|
||||||
|
})
|
||||||
|
this.model1.videos?.map(item1=>{
|
||||||
|
item1.url ='http://223.75.53.141:9102/test.by-lyf.tmp' + item1.filePath
|
||||||
|
return item1
|
||||||
|
})
|
||||||
|
console.log(this.model1,'83498943r80432',this.formData);
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
|
||||||
|
this.$refs.uForm.setRules(this.rules)
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,38 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
|
||||||
|
<u--form labelPosition="left" :model="formData" label-width='80px'>
|
||||||
|
<u-form-item label="上报人" prop="reportUserName" borderBottom ref="item1">
|
||||||
|
<u--input v-model="formData.reportUserName" border="none" disabled></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="上报时间" prop="reportTime" borderBottom ref="item1">
|
||||||
|
<u--input v-model="formData.reportTime" border="none" disabled></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
</u--form>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment';
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
formData:Object
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
// formData: {
|
||||||
|
// reportUserName:uni.getStorageSync('value').userName,
|
||||||
|
// reportTime:moment().format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
// userId:uni.getStorageSync('value').userId
|
||||||
|
// },
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
// debugger;
|
||||||
|
// const userList=uni.getStorageSync('value')
|
||||||
|
// console.log(userList,'3456789045678945678');
|
||||||
|
// this.formData.reportUserName = uni.getStorageSync('value').userName
|
||||||
|
// this.formData.userId = uni.getStorageSync('value').userId
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,75 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<u-navbar
|
||||||
|
title="维修养护"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<view
|
||||||
|
style="background-color: #f0f0f0;padding: 10px;overflow: auto;margin-top: 44px;">
|
||||||
|
<view class="content">
|
||||||
|
<formTop labelWidth="150rpx" :formData="formData"/>
|
||||||
|
</view>
|
||||||
|
<view class="content" style="margin-top: 10px;">
|
||||||
|
<formBottom labelWidth="150rpx" @submitForm='submitForm' :formData="formData"/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- <button @click="submitForm">Submit</button> -->
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import formTop from './formTop.vue'
|
||||||
|
import formBottom from './formBottom.vue'
|
||||||
|
import moment from 'moment'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: { formTop,formBottom },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
formData: {
|
||||||
|
reportUserName:'',
|
||||||
|
reportTime:moment().format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
userId:''
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(options) {
|
||||||
|
this.formData=JSON.parse(options.item)
|
||||||
|
console.log(this.formData,JSON.parse(options.item));
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
submitForm(params) {
|
||||||
|
//
|
||||||
|
console.log({...params,...this.formData});
|
||||||
|
uni.$http.post('/gunshiApp/tsg/maintain/service/insert',{...params,...this.formData}).then(res=>{
|
||||||
|
if(res.data.code == 200){
|
||||||
|
uni.$u.toast('新增成功')
|
||||||
|
uni.navigateBack()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
goBack() {
|
||||||
|
console.log(12121);
|
||||||
|
|
||||||
|
uni.navigateBack()
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.content {
|
||||||
|
/* margin: 10px; */
|
||||||
|
padding: 10px;
|
||||||
|
/* width: 95%; */
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,178 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<u-navbar title="维修养护" :autoBack="true" :titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}" :height='44' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
|
||||||
|
</u-navbar>
|
||||||
|
<view style="background-color: #f0f0f0;padding: 10px;margin-top: 60px;">
|
||||||
|
<!-- <view style="padding:0 10px;backgroundColor:#fff"> -->
|
||||||
|
<view class="time-ranger">
|
||||||
|
<view class="start-time">
|
||||||
|
<text>开始时间</text>
|
||||||
|
<text @click="showTime=true" style="margin-left:10%;color:#3399ef">{{startTime}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="end-time">
|
||||||
|
<text>结束时间</text>
|
||||||
|
<text @click="showTime1=true" style="margin:0 10%;color:#3399ef">{{endTime}}</text>
|
||||||
|
<view class="search-btn" @click="searchTm">
|
||||||
|
搜索
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- </view> -->
|
||||||
|
<view class="" style="height:calc(100vh - 150px);overflow: auto;" v-if="dataList.length !== 0">
|
||||||
|
<view class="" v-for="item in dataList" class="contentItemWx" @click="toDetail(item)">
|
||||||
|
<view class="contentItem">
|
||||||
|
<view class="itemWxyhT">
|
||||||
|
<text>{{type[item.maintainType]}}</text>
|
||||||
|
<uni-icons type="right"></uni-icons>
|
||||||
|
</view>
|
||||||
|
<view class="itemWxyhB">
|
||||||
|
<text>{{item.reportTime}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="height:calc(100vh - 150px);display: flex;align-items: center;justify-content: center;background-color: #fff;" v-else>
|
||||||
|
<image src="../../../../static/empty.png" mode="" ></image>
|
||||||
|
</view>
|
||||||
|
<!-- <view class="content">
|
||||||
|
<formTop labelWidth="150rpx" />
|
||||||
|
</view> -->
|
||||||
|
<!-- <view class="content" style="margin-top: 10px;">
|
||||||
|
<formBottom labelWidth="150rpx" @submitForm='submitForm'/>
|
||||||
|
</view> -->
|
||||||
|
</view>
|
||||||
|
<!-- <button @click="submitForm">Submit</button> -->
|
||||||
|
<u-datetime-picker :show="showTime" v-model="stm" mode="date" @confirm="showTime=false"
|
||||||
|
@cancel="showTime=false"></u-datetime-picker>
|
||||||
|
<u-datetime-picker :show="showTime1" v-model="etm" mode="date" @confirm="showTime1=false"
|
||||||
|
@cancel="showTime1=false"></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import formTop from './formZdy/formTop.vue'
|
||||||
|
import formBottom from './formZdy/formBottom.vue'
|
||||||
|
import moment from 'moment'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
formTop,
|
||||||
|
formBottom
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
formData: {
|
||||||
|
reportUserName: '',
|
||||||
|
reportTime: moment().format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
userId: ''
|
||||||
|
},
|
||||||
|
showTime: false,
|
||||||
|
showTime1: false,
|
||||||
|
start: '请选择开始时间',
|
||||||
|
end: '请选择结束时间',
|
||||||
|
stm:moment().startOf('year').format('YYYY-MM-DD'),
|
||||||
|
etm:moment().format('YYYY-MM-DD'),
|
||||||
|
dataList: [],
|
||||||
|
type: {
|
||||||
|
1: "溢洪道清障",
|
||||||
|
2: "除草除杂",
|
||||||
|
3: "设备养护",
|
||||||
|
4: "环境清洁",
|
||||||
|
5: "危险提示",
|
||||||
|
6: "其他",
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
startTime: function () {
|
||||||
|
|
||||||
|
return this.stm ? moment(this.stm).format('YYYY-MM-DD') : this.start
|
||||||
|
},
|
||||||
|
endTime: function () {
|
||||||
|
return this.etm ? moment(this.etm).format('YYYY-MM-DD') : this.end
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
searchTm(){
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
toDetail(item){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:'/pages/mypage/compents/wxyh/formZdy/index?item='+JSON.stringify(item)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getList() {
|
||||||
|
let params = {
|
||||||
|
"pageSo": {
|
||||||
|
"pageSize": 999,
|
||||||
|
"pageNumber": 1
|
||||||
|
},
|
||||||
|
"dateTimeSo": {
|
||||||
|
start:this.stm?moment(this.stm).format('YYYY-MM-DD 00:00:00'):'',
|
||||||
|
end:this.etm?moment(this.etm).format('YYYY-MM-DD 23:59:59'):''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
uni.$http.post('/gunshiApp/tsg/maintain/service/page', params).then(res => {
|
||||||
|
this.dataList = res.data.data.records
|
||||||
|
})
|
||||||
|
},
|
||||||
|
submitForm(params) {
|
||||||
|
//
|
||||||
|
console.log({
|
||||||
|
...params,
|
||||||
|
...this.formData
|
||||||
|
});
|
||||||
|
uni.$http.post('/gunshiApp/tsg/maintain/service/insert', {
|
||||||
|
...params,
|
||||||
|
...this.formData
|
||||||
|
}).then(res => {
|
||||||
|
if (res.data.code == 200) {
|
||||||
|
uni.$u.toast('新增成功')
|
||||||
|
uni.navigateBack()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
goBack() {
|
||||||
|
console.log(12121);
|
||||||
|
|
||||||
|
uni.navigateBack()
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.content {
|
||||||
|
/* margin: 10px; */
|
||||||
|
padding: 10px;
|
||||||
|
/* width: 95%; */
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.itemWxyhT {
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
font-family: "微软雅黑 Bold", "微软雅黑 Regular", 微软雅黑, sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 15px;
|
||||||
|
color: rgb(102, 102, 102);
|
||||||
|
padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
.itemWxyhB{
|
||||||
|
color: rgba(127, 127, 127, 0.8);
|
||||||
|
padding-top: 10px;
|
||||||
|
}
|
||||||
|
.contentItemWx{
|
||||||
|
background-color: rgba(255, 255, 255, 1);
|
||||||
|
padding: 10px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,305 @@
|
||||||
|
<template>
|
||||||
|
<view class="contentItem">
|
||||||
|
<uni-collapse>
|
||||||
|
|
||||||
|
<uni-collapse-item title-border="none" v-for="(item,index) in listData" :key="index" :border="false"
|
||||||
|
:show-animation="true">
|
||||||
|
<template v-slot:title>
|
||||||
|
<view style="display: flex;align-items: center;">
|
||||||
|
<text class="yuandian"></text>
|
||||||
|
<text>{{item.name}}</text>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<view class="xj-content">
|
||||||
|
<view class="xj-text" v-for="(o,i) in item.children" :key="i">
|
||||||
|
<view style="display: flex;align-items: center;">
|
||||||
|
<text>{{o.itemDesc}}</text>
|
||||||
|
<text>（{{o.isNormal == 0?'异常':'正常'}}{{o.isNormal == 0?o.isHandle?'已处理':'未处理':''}})</text>
|
||||||
|
<!-- <text></text> -->
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="" v-if="o.isNormal == 0">
|
||||||
|
<view class="itemEve">
|
||||||
|
<text>现场图片:</text>
|
||||||
|
<view class="" v-for="item in o.inspectPics">
|
||||||
|
<image :src="item.url" style="width: 80px;height: 80px;margin: 5px;" @click="previewImage(item)"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="o.inspectVideos.length" class="itemEve">
|
||||||
|
<text>现场视频:</text>
|
||||||
|
<view class="" v-for="item in o.inspectVideos">
|
||||||
|
<video :src="item.url" style="width: 80px;height: 80px;margin: 5px;" show-fullscreen-btn :show-progress='false'></video>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;" class="itemEve">
|
||||||
|
<text>问题描述:</text>
|
||||||
|
<text>{{o.problemDesc}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="" v-if="o.isHandle == 1">
|
||||||
|
<view style="" class="itemEve" v-if="o.handlePics.length">
|
||||||
|
<text>处理图片:</text>
|
||||||
|
<view class="" v-for="item in o.handlePics">
|
||||||
|
<image :src="item.url" style="width: 80px;height: 80px;margin: 5px;" @click="previewImage(item)"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="" v-if="o.handleVideos.length" class="itemEve">
|
||||||
|
<text>处理视频:</text>
|
||||||
|
<view class="" v-for="item in o.handleVideos">
|
||||||
|
|
||||||
|
<video :src="item.url" style="width: 80px;height: 80px;margin: 5px;" show-fullscreen-btn></video>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;" class="itemEve">
|
||||||
|
<text>处理描述:</text <text>{{o.handleDesc}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view style="display: flex;" v-if="o.isHandle == 0" class="itemEve">
|
||||||
|
<text>责任人</text>
|
||||||
|
<text>{{o.handleUserName}}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="subsectioin">
|
||||||
|
<!-- <u--form labelPosition="left" :model="o" ref="uForm">
|
||||||
|
<u-form-item label="状态" prop="isNormal" borderBottom required>
|
||||||
|
<u-subsection :list="list" :current="getNormal(o.isNormal)" mode="subsection" disabled
|
||||||
|
@change="(e)=>change(e,o,index,i,'isNormal')"
|
||||||
|
style="width:200px;margin-left: 10px"></u-subsection>
|
||||||
|
</u-form-item>
|
||||||
|
<view class="" v-if="o.isNormal">
|
||||||
|
<u-form-item label="现场图片" prop="inspectPics" borderBottom required>
|
||||||
|
<u-upload accept="image" :fileList="o.inspectPics" disabled
|
||||||
|
@afterRead="(e)=>afterRead(e,o,index,i)"
|
||||||
|
@delete="(e)=>deletePic(e,o,index,i)" name="inspectPics" multiple
|
||||||
|
:maxCount="10"></u-upload>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="现场视频" prop="inspectVideos" borderBottom>
|
||||||
|
<u-upload accept="video" :fileList="o.inspectVideos" disabled
|
||||||
|
@afterRead="(e)=>afterRead(e,o,index,i)"
|
||||||
|
@delete="(e)=>deletePic(e,o,index,i)" name="inspectVideos" multiple
|
||||||
|
:maxCount="10"></u-upload>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="问题描述" prop="itemProblemDesc" borderBottom required>
|
||||||
|
<u--textarea v-model="o.itemProblemDesc" placeholder="请输入内容" disabled></u--textarea>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="处理状态" prop="isHandle" borderBottom required>
|
||||||
|
<u-subsection :list="listStatus" :current="getHandle(o.isHandle)" disabled
|
||||||
|
mode="subsection" @change="(e)=>change(e,o,index,i,'isHandle')"
|
||||||
|
style="width:200px;margin-left: 10px"></u-subsection>
|
||||||
|
</u-form-item>
|
||||||
|
<view class="" v-if="o.isHandle !== 0">
|
||||||
|
<u-form-item label="处理图片" prop="handlePics" borderBottom required>
|
||||||
|
<u-upload accept="image" :fileList="o.handlePics" disabled
|
||||||
|
@afterRead="(e)=>afterRead(e,o,index,i)"
|
||||||
|
@delete="(e)=>deletePic(e,o,index,i)" name="handlePics" multiple
|
||||||
|
:maxCount="10"></u-upload>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="处理视频" prop="handleVideos" borderBottom>
|
||||||
|
<u-upload accept="video" :fileList="o.handleVideos" disabled
|
||||||
|
@afterRead="(e)=>afterRead(e,o,index,i)"
|
||||||
|
@delete="(e)=>deletePic(e,o,index,i)" name="handleVideos" multiple
|
||||||
|
:maxCount="10"></u-upload>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="问题描述" prop="handleDesc" borderBottom required>
|
||||||
|
<u--textarea v-model="o.handleDesc" placeholder="请输入内容" disabled></u--textarea>
|
||||||
|
</u-form-item>
|
||||||
|
</view>
|
||||||
|
<view class="" v-if="o.isHandle == 0">
|
||||||
|
<u-form-item label="责任人" prop="handleUserId" borderBottom
|
||||||
|
@click="showSex = true; hideKeyboard()" required>
|
||||||
|
<u--input v-model="o.handleUserId" disabled disabledColor="#ffffff"
|
||||||
|
placeholder="请选择性别" border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u--form>
|
||||||
|
<u-action-sheet :show="showSex" :actions="actions" title="请选择性别" description="如果选择保密会报错"
|
||||||
|
@close="showSex = false" @select="sexSelect">
|
||||||
|
</u-action-sheet> -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-collapse-item>
|
||||||
|
|
||||||
|
</uni-collapse>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
xjItem: Array
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
list: ["正常", "异常"],
|
||||||
|
listStatus: ["已处理", "未处理"],
|
||||||
|
current: 0,
|
||||||
|
listData: [],
|
||||||
|
showSex: false,
|
||||||
|
actions: [{
|
||||||
|
name: '男',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '女',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '保密',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
// this.listData = this.xjItem
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
xjItem: function(n, o) {
|
||||||
|
|
||||||
|
this.listData = n.map(item => {
|
||||||
|
item.childen = item.children.map(i => {
|
||||||
|
i.handlePics?.map(item1=>{
|
||||||
|
item1.url ='http://223.75.53.141:9102/test.by-lyf.tmp' + item1.filePath
|
||||||
|
return item1
|
||||||
|
})
|
||||||
|
i.handleVideos?.map(item1=>{
|
||||||
|
item1.url ='http://223.75.53.141:9102/test.by-lyf.tmp' + item1.filePath
|
||||||
|
return item1
|
||||||
|
})
|
||||||
|
i.inspectPics?.map(item1=>{
|
||||||
|
item1.url ='http://223.75.53.141:9102/test.by-lyf.tmp' + item1.filePath
|
||||||
|
return item1
|
||||||
|
})
|
||||||
|
i.inspectVideos?.map(item1=>{
|
||||||
|
item1.url ='http://223.75.53.141:9102/test.by-lyf.tmp' + item1.filePath
|
||||||
|
return item1
|
||||||
|
})
|
||||||
|
if (!i.handlePics) {
|
||||||
|
i.handlePics = []
|
||||||
|
}
|
||||||
|
if (!i.handleVideos) {
|
||||||
|
i.handleVideos = []
|
||||||
|
}
|
||||||
|
if (!i.inspectPics) {
|
||||||
|
i.inspectPics = []
|
||||||
|
}
|
||||||
|
if (!i.inspectVideos) {
|
||||||
|
i.inspectVideos = []
|
||||||
|
}
|
||||||
|
return i
|
||||||
|
})
|
||||||
|
return item
|
||||||
|
})
|
||||||
|
console.log(n, this.listData, 'this.listData ');
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
previewImage(item){
|
||||||
|
uni.previewImage({
|
||||||
|
urls: [item.url],
|
||||||
|
longPressActions: {
|
||||||
|
itemList: ['发送给朋友', '保存图片', '收藏'],
|
||||||
|
success: function(data) {
|
||||||
|
console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
|
||||||
|
},
|
||||||
|
fail: function(err) {
|
||||||
|
console.log(err.errMsg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getIsItem(arr) {
|
||||||
|
return arr.filter(item1 => item1.isNormal !== 1 && item1.isNormal !== 0).length
|
||||||
|
},
|
||||||
|
getNormal(isNormal) {
|
||||||
|
if (isNormal == 0) {
|
||||||
|
return 0
|
||||||
|
}
|
||||||
|
if (isNormal == 1) {
|
||||||
|
return 1
|
||||||
|
}
|
||||||
|
if (isNormal == null) {
|
||||||
|
return 3
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getHandle(isHandle) {
|
||||||
|
if (isHandle == 0) {
|
||||||
|
return 0
|
||||||
|
}
|
||||||
|
if (isHandle == 1) {
|
||||||
|
return 1
|
||||||
|
}
|
||||||
|
if (isHandle == null) {
|
||||||
|
return 3
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.contentItem {
|
||||||
|
height: 100%;
|
||||||
|
// overflow: auto;
|
||||||
|
overflow: auto;
|
||||||
|
|
||||||
|
.itemC {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
display: flex;
|
||||||
|
color: #666666;
|
||||||
|
padding: 10px;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.itemNo {
|
||||||
|
color: #666666;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle-btn {
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
background-color: #007aff;
|
||||||
|
border-radius: 50%;
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 120px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.yuandian {
|
||||||
|
display: inline-block;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
background-color: #409eff;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xj-content {
|
||||||
|
// height: 300px;
|
||||||
|
// overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xj-text {
|
||||||
|
margin-left: 10%;
|
||||||
|
margin-top: 2%;
|
||||||
|
font-size: 16px;
|
||||||
|
border-bottom:1px solid #f0f0f0 ;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subsectioin {
|
||||||
|
display: flex;
|
||||||
|
column-gap: 10px;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
.itemEve{
|
||||||
|
margin: 10px 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,147 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
|
||||||
|
<u--form labelPosition="left" :model="model1" :rules="rules" ref="uForm">
|
||||||
|
<u-form-item label="姓名" prop="userInfo.name" borderBottom ref="item1">
|
||||||
|
<u--input v-model="model1.userInfo.name" border="none"></u--input>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="性别" prop="userInfo.sex" borderBottom @click="showSex = true; hideKeyboard()"
|
||||||
|
ref="item1">
|
||||||
|
<u--input v-model="model1.userInfo.sex" disabled disabledColor="#ffffff" placeholder="请选择性别"
|
||||||
|
border="none"></u--input>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="内容" prop="userInfo.sex" borderBottom @click="showSex = true; hideKeyboard()"
|
||||||
|
ref="item1">
|
||||||
|
<u--textarea v-model="model1.userInfo.namevalue1" placeholder="请输入内容"></u--textarea>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="内容" prop="userInfo.sex" borderBottom @click="showSex = true; hideKeyboard()"
|
||||||
|
ref="item1">
|
||||||
|
<u-upload :fileList="fileList" @afterRead="afterRead" @delete="deletePic" name="1" multiple
|
||||||
|
:maxCount="10"></u-upload>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
<u-form-item label="内容" prop="userInfo.sex" borderBottom @click="showSex = true; hideKeyboard()"
|
||||||
|
ref="item1">
|
||||||
|
<u-upload :fileList="fileList" @afterRead="afterRead" @delete="deletePic" name="1" multiple
|
||||||
|
:maxCount="10"></u-upload>
|
||||||
|
<u-icon slot="right" name="arrow-right"></u-icon>
|
||||||
|
</u-form-item>
|
||||||
|
</u--form>
|
||||||
|
<u-action-sheet :show="showSex" :actions="actions" title="请选择性别" description="如果选择保密会报错"
|
||||||
|
@close="showSex = false" @select="sexSelect">
|
||||||
|
</u-action-sheet>
|
||||||
|
<button @click="submit">11</button>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
showSex: false,
|
||||||
|
model1: {
|
||||||
|
userInfo: {
|
||||||
|
name: 'uView UI',
|
||||||
|
sex: '',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
actions: [{
|
||||||
|
name: '男',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '女',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '保密',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
rules: {
|
||||||
|
'userInfo.name': {
|
||||||
|
type: 'string',
|
||||||
|
required: true,
|
||||||
|
message: '请填写姓名',
|
||||||
|
trigger: ['blur', 'change']
|
||||||
|
},
|
||||||
|
'userInfo.sex': {
|
||||||
|
type: 'string',
|
||||||
|
max: 1,
|
||||||
|
required: true,
|
||||||
|
message: '请选择男或女',
|
||||||
|
trigger: ['blur', 'change']
|
||||||
|
},
|
||||||
|
},
|
||||||
|
radio: '',
|
||||||
|
switchVal: false
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 删除图片
|
||||||
|
deletePic(event) {
|
||||||
|
this[`fileList${event.name}`].splice(event.index, 1)
|
||||||
|
},
|
||||||
|
// 新增图片
|
||||||
|
async afterRead(event) {
|
||||||
|
// 当设置 multiple 为 true 时, file 为数组格式，否则为对象格式
|
||||||
|
let lists = [].concat(event.file)
|
||||||
|
let fileListLen = this[`fileList${event.name}`].length
|
||||||
|
lists.map((item) => {
|
||||||
|
this[`fileList${event.name}`].push({
|
||||||
|
...item,
|
||||||
|
status: 'uploading',
|
||||||
|
message: '上传中'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
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,name) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
let a = uni.uploadFile({
|
||||||
|
url: 'http://local.gunshiiot.com:18083/gunshiApp/tsg/maintain/service/file/upload/singleSimple', // 仅为示例，非真实的接口地址
|
||||||
|
filePath: url,
|
||||||
|
name: 'file',
|
||||||
|
formData: {
|
||||||
|
user: 'test'
|
||||||
|
},
|
||||||
|
success: (res) => {
|
||||||
|
setTimeout(() => {
|
||||||
|
// const obj = this.model1[name].find(item=>item.fileId==res.data.data.fileId)
|
||||||
|
// if(obj){
|
||||||
|
|
||||||
|
// }
|
||||||
|
console.log(JSON.parse(res.data),this.model1,name);
|
||||||
|
this.model1[name].push({fileId:JSON.parse(res.data).data.fileId})
|
||||||
|
resolve(res.data.data)
|
||||||
|
}, 1000)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})
|
||||||
|
},
|
||||||
|
sexSelect(e) {
|
||||||
|
this.model1.userInfo.sex = e.name
|
||||||
|
this.$refs.uForm.validateField('userInfo.sex')
|
||||||
|
},
|
||||||
|
submit() {
|
||||||
|
this.$refs.uForm.validate().then(res => {
|
||||||
|
uni.$u.toast('校验通过')
|
||||||
|
}).catch(errors => {
|
||||||
|
uni.$u.toast('校验失败')
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
|
||||||
|
this.$refs.uForm.setRules(this.rules)
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,231 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar :title="taskTitle" :autoBack="true" :titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}" :height='44' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
|
||||||
|
</u-navbar>
|
||||||
|
<!-- <view class=""
|
||||||
|
style="margin-top: 44px;;background-color: #f0f0f0;border-top: 1px solid #f0f0f0; height:calc(100vh - 44px)">
|
||||||
|
<view style="margin: 10px;background-color: #fff;padding: 10px;">
|
||||||
|
<!-- <view class="item">
|
||||||
|
<view class="blueTiao"></view>
|
||||||
|
<view class="title">
|
||||||
|
基本信息
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="contentItem">
|
||||||
|
<view class="itemC">
|
||||||
|
<text>任务标题1</text>
|
||||||
|
<text>{{taskTitle}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>任务类型11</text>
|
||||||
|
<text>{{taskType == 1 ? "日常巡查" : taskType == 2 ? "特别检查" : taskType == 3 ? "汛前巡检" : '' }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>任务内容</text>
|
||||||
|
<text>{{taskContent ? taskContent : ''}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>开始日期</text>
|
||||||
|
<text>{{startDate}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>结束日期</text>
|
||||||
|
<text>{{endDate}}</text>
|
||||||
|
</view>
|
||||||
|
</view> -->
|
||||||
|
|
||||||
|
<!-- </view> -->
|
||||||
|
|
||||||
|
<view style="margin: 10px;background-color: #fff;padding: 10px; height:calc(100vh - 50px);margin-top: 50px;">
|
||||||
|
<view class="item">
|
||||||
|
<view class="blueTiao"></view>
|
||||||
|
<view class="title">
|
||||||
|
巡检项
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="contentItem" style="height: calc(100% - 50px);">
|
||||||
|
<db-form :xjItem="xjItem"></db-form>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
import DbForm from './dbForm.vue'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
DbForm
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
taskTitle: '',
|
||||||
|
taskType: '',
|
||||||
|
taskContent: '',
|
||||||
|
startDate: '',
|
||||||
|
endDate: '',
|
||||||
|
status: '',
|
||||||
|
id: '',
|
||||||
|
btnStatus: 0,
|
||||||
|
xjItem: [],
|
||||||
|
list: ["正常", "异常"],
|
||||||
|
current: 3
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.startXc()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 开始巡查
|
||||||
|
async startXc() {
|
||||||
|
try {
|
||||||
|
this.btnStatus = 1;
|
||||||
|
this.getXjItem(this.id)
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取巡查项
|
||||||
|
async getXjItem(id) {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.get(`/gunshiApp/tsg/inspect/detail/info?taskId=${this.id}`)
|
||||||
|
if (data.code == 200) {
|
||||||
|
this.xjItem = data.data
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
change(e) {
|
||||||
|
this.current = e;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(option) {
|
||||||
|
this.taskTitle = option.taskTitle
|
||||||
|
this.taskType = option.taskType
|
||||||
|
this.taskContent = option.taskContent == "null" ? null : option.taskContent
|
||||||
|
this.startDate = (option.startDate)
|
||||||
|
this.endDate = option.endDate == "null" ? "" : option.endDate
|
||||||
|
this.status = option.status
|
||||||
|
this.id = option.id
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.myTitleStyle {
|
||||||
|
font-size: 30px;
|
||||||
|
background-color: red;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabsClass {
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 40px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
|
||||||
|
padding-bottom: 10px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
// justify-content: space-between;
|
||||||
|
.blueTiao {
|
||||||
|
background-color: #007aff;
|
||||||
|
width: 5px;
|
||||||
|
height: 16px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
border-width: 0px;
|
||||||
|
font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #666666
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleRight {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.border {
|
||||||
|
border-width: 0px;
|
||||||
|
background-color: rgba(236, 245, 255, 1);
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: rgba(187, 220, 255, 1);
|
||||||
|
border-radius: 5px;
|
||||||
|
box-shadow: none;
|
||||||
|
width: 58px;
|
||||||
|
height: 25px;
|
||||||
|
color: #689FFF;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.contentItem {
|
||||||
|
.itemC {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
display: flex;
|
||||||
|
color: #666666;
|
||||||
|
padding: 10px;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.itemNo {
|
||||||
|
color: #666666;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle-btn {
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
background-color: #007aff;
|
||||||
|
border-radius: 50%;
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 120px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.yuandian {
|
||||||
|
display: inline-block;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
background-color: #409eff;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xj-content {
|
||||||
|
height: 300px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.xj-text {
|
||||||
|
margin-left: 10%;
|
||||||
|
margin-top: 2%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.subsectioin {
|
||||||
|
display: flex;
|
||||||
|
column-gap: 10px;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,199 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar title="巡查任务" :autoBack="true" :titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}" :height='44' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
|
||||||
|
</u-navbar>
|
||||||
|
<view style="padding:0 10px; margin-top:50px">
|
||||||
|
<view class="time-ranger" >
|
||||||
|
<view class="start-time">
|
||||||
|
<text>开始时间</text>
|
||||||
|
<text @click="showTime=true" style="margin-left:10%;color:#3399ef">{{stm}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="end-time">
|
||||||
|
<text>结束时间</text>
|
||||||
|
<text @click="showTime1=true" style="margin:0 10%;color:#3399ef">{{etm}}</text>
|
||||||
|
<view class="search-btn" @click="searchHandle">
|
||||||
|
搜索
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="" style='overflow: auto;max-height:calc(100vh - 180px)' v-if="list.length !== 0">
|
||||||
|
<view class="" v-for="(item,i) in list" :key="i" @click="toDetail(item)" style="background-color: #fff;margin-top:10px;padding: 10px;">
|
||||||
|
<view class="item">
|
||||||
|
<!-- {{item.title}} -->
|
||||||
|
<view class="title">
|
||||||
|
{{item.taskTitle}}
|
||||||
|
</view>
|
||||||
|
<view class="titleRight" >
|
||||||
|
<view class="border">
|
||||||
|
{{status[item.status]}}
|
||||||
|
</view>
|
||||||
|
<u-icon name="arrow-right" size="20"></u-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="contentItem">
|
||||||
|
<view class="itemC">
|
||||||
|
<text>接收时间</text>
|
||||||
|
<text>{{item.receiveTime}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="itemC">
|
||||||
|
<text>完成时间</text>
|
||||||
|
<text>{{item.finishTime}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="height:calc(100vh - 150px);display: flex;align-items: center;justify-content: center;background-color: #fff;" v-else>
|
||||||
|
<image src="../../../../static/empty.png" mode="" ></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showTime"
|
||||||
|
v-model="startTime"
|
||||||
|
mode="date"
|
||||||
|
@confirm="handleStartTime"
|
||||||
|
@cancel="showTime=false"
|
||||||
|
:minDate="minDate"
|
||||||
|
:maxDate="maxDate"
|
||||||
|
></u-datetime-picker>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showTime1"
|
||||||
|
v-model="endTime"
|
||||||
|
mode="date"
|
||||||
|
@confirm="handleEndTime"
|
||||||
|
@cancel="showTime1=false"
|
||||||
|
:minDate="minDate"
|
||||||
|
:maxDate="maxDate"
|
||||||
|
></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
const stm = moment().startOf('year').set({minute: 0, second: 0}).format("YYYY-MM-DD");
|
||||||
|
const etm = moment().set({minute: 0, second: 0}).format("YYYY-MM-DD");
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
status:{
|
||||||
|
0:'开始任务',
|
||||||
|
1:'继续任务',
|
||||||
|
2:'已完成'
|
||||||
|
},
|
||||||
|
minDate:moment().startOf('year').valueOf(),
|
||||||
|
maxDate:moment().valueOf(),
|
||||||
|
startTime:stm,
|
||||||
|
endTime:etm,
|
||||||
|
stm,
|
||||||
|
etm,
|
||||||
|
showTime:false,
|
||||||
|
showTime1:false,
|
||||||
|
list: []
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
searchHandle(){
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
handleStartTime(e){
|
||||||
|
let time = moment(e.value).format("YYYY-MM-D")
|
||||||
|
this.stm = time;
|
||||||
|
this.showTime = false
|
||||||
|
},
|
||||||
|
handleEndTime(e){
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD")
|
||||||
|
this.etm = time;
|
||||||
|
this.showTime1 = false
|
||||||
|
},
|
||||||
|
|
||||||
|
async getData(){
|
||||||
|
const userId = uni.getStorageSync('value')?.userId
|
||||||
|
const params = {
|
||||||
|
dateRangeSo:{
|
||||||
|
start:moment(this.stm).format("YYYY-MM-DD 00:00:00"),
|
||||||
|
end:moment(this.etm).format("YYYY-MM-DD 23:59:59"),
|
||||||
|
},
|
||||||
|
inspectUserId:userId,
|
||||||
|
statusList:[2]
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
const res = await uni.$http.post("/gunshiApp/tsg/inspect/task/list",params)
|
||||||
|
this.list = [...res.data.data];
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
toDetail(record){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pages/mypage/compents/xcrw/detail/index?taskTitle=${record.taskTitle}&taskType=${record.taskType}&taskContent=${record.taskContent}&startDate=${record.startDate}&endDate=${record.endDate}&status=${record.status}&id=${record.id}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.myTitleStyle {
|
||||||
|
font-size: 30px;
|
||||||
|
background-color: red;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabsClass {
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 40px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item {
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
border-width: 0px;
|
||||||
|
font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 15px;
|
||||||
|
color: #666666
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleRight {
|
||||||
|
display: flex;
|
||||||
|
.border {
|
||||||
|
border-width: 0px;
|
||||||
|
background-color: rgba(236, 245, 255, 1);
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-width: 1px;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: rgba(187, 220, 255, 1);
|
||||||
|
border-radius: 5px;
|
||||||
|
box-shadow: none;
|
||||||
|
width: 75px;
|
||||||
|
height: 25px;
|
||||||
|
color: #689FFF;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.contentItem{
|
||||||
|
.itemC{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
display: flex;
|
||||||
|
color: #666666;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,230 @@
|
||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<view class="userInfo">
|
||||||
|
<div class="icon">
|
||||||
|
<image class="image-left" style="width: 100%; height: 100%" :src="default_src" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
</div>
|
||||||
|
<div class="user">
|
||||||
|
<div class="username">{{this.userList.nickName}}</div>
|
||||||
|
<div class="userresponse">{{this.userList.dept.deptName}}</div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<view class="funcBar">
|
||||||
|
<div class="funcList" v-for="(item, index) in func" :key="index">
|
||||||
|
<div @click="navigateToSubPage(func,index)">
|
||||||
|
<div class="funcIcon" style="width:30px:;height:30px">
|
||||||
|
<image class="icon-left" style="width: 100%; height: 100%" :src="item.img" mode="aspectFit">
|
||||||
|
</image>
|
||||||
|
</div>
|
||||||
|
<div class="funcTxt">{{ item.name }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<view class="version">
|
||||||
|
<div class="content">
|
||||||
|
<div class="left" style="display:flex">
|
||||||
|
<uni-icons type="info" size="25" class="icon-left"></uni-icons>
|
||||||
|
版本号
|
||||||
|
</div>
|
||||||
|
<div class="mid"></div>
|
||||||
|
<div class="right">{{version}}</div>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<view class="null"></view>
|
||||||
|
<button type="primary" class="button" @click="logout">退出账号</button>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const func = [{
|
||||||
|
img: '../../static/images/info.png',
|
||||||
|
name: '个人信息',
|
||||||
|
url: '/pages/personInfo/personInfo'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
img: '../../static/images/password.png',
|
||||||
|
name: '修改密码',
|
||||||
|
url: '/pages/modifyPassword/modifyPassword'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
userList: uni.getStorageSync('value'),
|
||||||
|
username: '',
|
||||||
|
userresponse: '防汛办',
|
||||||
|
version: uni.getSystemInfoSync().appWgtVersion,
|
||||||
|
func: func,
|
||||||
|
default_src: uni.getStorageSync('avatar'),
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
navigateToSubPage(item,index) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: item[index].url,
|
||||||
|
animationType:'pop-in',
|
||||||
|
})
|
||||||
|
},
|
||||||
|
logout() {
|
||||||
|
if (uni.getStorageSync('loginChecked') === true) {
|
||||||
|
uni.redirectTo({
|
||||||
|
url: '/pages/login/login'
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
uni.removeStorageSync('loginName')
|
||||||
|
uni.removeStorageSync('secretKey')
|
||||||
|
uni.removeStorageSync('Gs-Token')
|
||||||
|
uni.removeStorageSync('value')
|
||||||
|
uni.removeStorageSync('password')
|
||||||
|
uni.removeStorageSync('avatar')
|
||||||
|
uni.redirectTo({
|
||||||
|
url: '/pages/login/login'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
background-color: #f3f5f8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.userInfo {
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 5vh;
|
||||||
|
margin-left: 2vw;
|
||||||
|
margin-bottom: 2vh;
|
||||||
|
width: 95%;
|
||||||
|
height: 15vh;
|
||||||
|
/* background-color: #fff; */
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
border-radius: 50%;
|
||||||
|
margin-left: 2vw;
|
||||||
|
background-color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
color: #007afd;
|
||||||
|
line-height: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.image-left {
|
||||||
|
width: 80px;
|
||||||
|
height: 80px;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin-left: 6vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.username {
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-bottom: 1vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.funcIcon {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin-left: 4px;
|
||||||
|
margin-bottom: 1vh;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.funcBar {
|
||||||
|
border-radius: 5px;
|
||||||
|
margin-bottom: 2vh;
|
||||||
|
margin-left: 2vw;
|
||||||
|
display: flex;
|
||||||
|
justify-content: row;
|
||||||
|
align-items: center;
|
||||||
|
width: 95%;
|
||||||
|
height: 15vh;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.funcList {
|
||||||
|
text-align: center;
|
||||||
|
font-size: 14px;
|
||||||
|
margin: 2vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.version {
|
||||||
|
margin-left: 2vw;
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 95%;
|
||||||
|
height: 8vh;
|
||||||
|
background-color: #fff;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
width: 100px;
|
||||||
|
text-align: start;
|
||||||
|
margin-left: 1vw;
|
||||||
|
line-height: 8vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-left {
|
||||||
|
align-items: center;
|
||||||
|
width: 30px;
|
||||||
|
/* background-color: red; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.mid {
|
||||||
|
flex: 1;
|
||||||
|
line-height: 8vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
width: 100px;
|
||||||
|
text-align: end;
|
||||||
|
line-height: 8vh;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.null {
|
||||||
|
height: 45vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
border-radius: 10px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column-reverse;
|
||||||
|
width: 92%;
|
||||||
|
height: 8vh;
|
||||||
|
font-size: 20px;
|
||||||
|
color: white;
|
||||||
|
background-color: #007afd;
|
||||||
|
margin-bottom: 55px;
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,175 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'99%',position:'relative'}">
|
||||||
|
<u-toast ref="uToast"></u-toast>
|
||||||
|
<div class="row" v-if="!record.isDisabled">
|
||||||
|
<text class="lf">指令内容:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--textarea
|
||||||
|
v-model="value"
|
||||||
|
height=100
|
||||||
|
></u--textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div :style="{margin:'0 10px'}"><u-divider></u-divider></div>
|
||||||
|
<div class="mybody">
|
||||||
|
<div class="row2" v-for="(item,index) in list">
|
||||||
|
<text>{{item.tm+' '+item.content}}</text>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div :style="{width:'100%',position:'absolute',bottom:'40px'}" v-if="!record.isDisabled">
|
||||||
|
<u-button
|
||||||
|
type="primary"
|
||||||
|
text="反馈"
|
||||||
|
customStyle="margin-top: 20px"
|
||||||
|
@click="show1 = true"
|
||||||
|
></u-button>
|
||||||
|
<u-button
|
||||||
|
type="primary"
|
||||||
|
text="反馈并结束"
|
||||||
|
customStyle="margin-top: 10px"
|
||||||
|
@click="show2 = true"
|
||||||
|
></u-button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<u-modal
|
||||||
|
width="250"
|
||||||
|
:show="show1"
|
||||||
|
showCancelButton
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="submit1"
|
||||||
|
@cancel="() => show1 = false"
|
||||||
|
@close="() => show1 = false"
|
||||||
|
>
|
||||||
|
<view class="slot-content">
|
||||||
|
<rich-text :nodes="'确认反馈?'" :style="{fontSize:'16px'}"></rich-text>
|
||||||
|
</view>
|
||||||
|
</u-modal>
|
||||||
|
<u-modal
|
||||||
|
width="250"
|
||||||
|
:show="show2"
|
||||||
|
showCancelButton
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="submit2"
|
||||||
|
@cancel="() => show2 = false"
|
||||||
|
@close="() => show2 = false"
|
||||||
|
>
|
||||||
|
<view class="slot-content">
|
||||||
|
<rich-text :nodes="'确认反馈并结束?'" :style="{fontSize:'16px'}"></rich-text>
|
||||||
|
</view>
|
||||||
|
</u-modal>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
record:{
|
||||||
|
type: Object,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
value:'',
|
||||||
|
list:[],
|
||||||
|
show1:false,
|
||||||
|
show2:false
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getData()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
tabsChange(item) {
|
||||||
|
},
|
||||||
|
async getData() {
|
||||||
|
try{
|
||||||
|
const res = await uni.$http.get('/gunshiApp/xfflood/xfEmerDispatchR/getFeedbackById/'+this.record.id)
|
||||||
|
console.log('res',res)
|
||||||
|
this.list = res.data.data
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async submit1() {
|
||||||
|
this.show1 = false
|
||||||
|
try{
|
||||||
|
if(!this.value){
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请输入指令内容",
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const params = {
|
||||||
|
dispatchId:this.record.id,
|
||||||
|
content:this.value,
|
||||||
|
}
|
||||||
|
console.log('params',params)
|
||||||
|
const res = await uni.$http.post('/gunshiApp/xfflood/xfEmerDispatchR/feedback',params)
|
||||||
|
console.log('res',res)
|
||||||
|
this.value = ''
|
||||||
|
this.getData()
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async submit2() {
|
||||||
|
this.show2 = false
|
||||||
|
try{
|
||||||
|
if(!this.value){
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请输入指令内容",
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const params = {
|
||||||
|
dispatchId:this.record.id,
|
||||||
|
content:this.value,
|
||||||
|
}
|
||||||
|
const res = await uni.$http.post('/gunshiApp/xfflood/xfEmerDispatchR/feedbackAndEnd',params)
|
||||||
|
uni.navigateBack()
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.row{
|
||||||
|
display: flex;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
.lf{
|
||||||
|
width: 25%;
|
||||||
|
min-height: 40px;
|
||||||
|
text-align: right;
|
||||||
|
line-height: 38px;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
.rf{
|
||||||
|
width: 75%;
|
||||||
|
min-height: 40px;
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-top: 1px;
|
||||||
|
}
|
||||||
|
.mybody{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin: 5px 5px;
|
||||||
|
padding: 5px 10px;
|
||||||
|
height: calc( 100vh - 410px );
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
.row2{
|
||||||
|
background-color: rgba(217, 217, 217, 1);
|
||||||
|
margin: 10px 0;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,314 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden',background:'#f7f7f7'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
title="调令反馈"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
<view
|
||||||
|
slot="right"
|
||||||
|
hover-class="is-hover"
|
||||||
|
class="searchBox_right_btn"
|
||||||
|
hover-stay-time=100
|
||||||
|
@click="myShow"
|
||||||
|
>
|
||||||
|
<u--image :src="'../../static/images/filter.png'" width="20px" height="20px"></u--image>
|
||||||
|
</view>
|
||||||
|
</u-navbar>
|
||||||
|
<u-tabs
|
||||||
|
:list="tabsOptions"
|
||||||
|
@click="tabsChange"
|
||||||
|
:scrollable=false
|
||||||
|
class="tabsClass"
|
||||||
|
:activeStyle="{color: 'rgb(37, 157, 255)',fontSize: '16px'}"
|
||||||
|
:inactiveStyle="{color: '#606266',fontSize: '16px'}"
|
||||||
|
lineColor="transparent"
|
||||||
|
itemStyle="height: 44px"
|
||||||
|
>
|
||||||
|
</u-tabs>
|
||||||
|
<div class="mybody">
|
||||||
|
<div class="countNum"><text>共{{list.length}}条信息</text></div>
|
||||||
|
<div v-for="(item,index) in list" class="listItem" @click="myNavigateTo(item)">
|
||||||
|
<div class="row1"><text>{{item.year+'年度调令第'+item.serial+'号'}}</text></div>
|
||||||
|
<div class="row2">
|
||||||
|
<div>
|
||||||
|
<text :style="{marginRight:'5px'}">{{item.createUserName}}</text>
|
||||||
|
<text>{{item.createTm}}</text>
|
||||||
|
</div>
|
||||||
|
<div><text>{{myType[item.dispatchType]}}</text></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'100px'}"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<u-popup
|
||||||
|
:show="show"
|
||||||
|
mode="right"
|
||||||
|
:safeAreaInsetTop='true'
|
||||||
|
:closeOnClickOverlay='false'
|
||||||
|
@close="close"
|
||||||
|
@open="myShow">
|
||||||
|
<view :style="{padding:'10px',width:'250px'}">
|
||||||
|
<u-toast ref="uToast"></u-toast>
|
||||||
|
<text class="title">按类型</text>
|
||||||
|
<u-checkbox-group
|
||||||
|
placement="row"
|
||||||
|
v-model="check"
|
||||||
|
:style="{padding:'10px 0px 20px 0px'}"
|
||||||
|
>
|
||||||
|
<u-checkbox name="0" label="水库调洪" class="checkItem"></u-checkbox>
|
||||||
|
<u-checkbox name="1" label="人员转移" class="checkItem"></u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
<div :style="{display:'flex',alignItems:'center'}">
|
||||||
|
<text class="title">按时间</text>
|
||||||
|
<u-switch v-model="isTime" size="20" :style="{margin:'2px 0 0 10px'}"></u-switch>
|
||||||
|
</div>
|
||||||
|
<div :style="{display:'flex',marginTop:'10px'}" v-if="isTime">
|
||||||
|
<view
|
||||||
|
class="tmPicker"
|
||||||
|
@click="showStmPicker = true"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
>{{getStmStr}}<u-icon name="calendar" size="18" color="#909399"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text :style="{width:'20%',lineHeight:'32px',textAlign:'center'}">至</text>
|
||||||
|
</div>
|
||||||
|
<div :style="{display:'flex',marginTop:'10px'}" v-if="isTime">
|
||||||
|
<view
|
||||||
|
class="tmPicker"
|
||||||
|
@click="showEtmPicker = true"
|
||||||
|
hover-class="is-hover"
|
||||||
|
hover-stay-time=100
|
||||||
|
>{{getEtmStr}}<u-icon name="calendar" size="18" color="#909399"></u-icon>
|
||||||
|
</view>
|
||||||
|
<text :style="{width:'20%'}"></text>
|
||||||
|
</div>
|
||||||
|
<div :style="{position:'absolute',bottom:'20px',right:'20px',display:'flex'}">
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px',marginRight:'10px'}"
|
||||||
|
text="重置"
|
||||||
|
@click="reSet"
|
||||||
|
></u-button>
|
||||||
|
<u-button
|
||||||
|
:style="{width:'80px'}"
|
||||||
|
color="rgba(217, 0, 27, 1)"
|
||||||
|
type="primary"
|
||||||
|
text="确定"
|
||||||
|
@click="submit"
|
||||||
|
></u-button>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showStmPicker"
|
||||||
|
v-model="stm"
|
||||||
|
mode="datetime"
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="showStmPicker = false"
|
||||||
|
@cancel="showStmPicker = false"
|
||||||
|
@close="showStmPicker = false"
|
||||||
|
>
|
||||||
|
</u-datetime-picker>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showEtmPicker"
|
||||||
|
v-model="etm"
|
||||||
|
mode="datetime"
|
||||||
|
closeOnClickOverlay
|
||||||
|
@confirm="showEtmPicker = false"
|
||||||
|
@cancel="showEtmPicker = false"
|
||||||
|
@close="showEtmPicker = false"
|
||||||
|
>
|
||||||
|
</u-datetime-picker>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
const tabsOptions = [
|
||||||
|
{
|
||||||
|
name:'执行中',
|
||||||
|
value:1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name:'完成',
|
||||||
|
value:2
|
||||||
|
},
|
||||||
|
]
|
||||||
|
const myType = {
|
||||||
|
0:'水库调洪',
|
||||||
|
1:'人员转移'
|
||||||
|
}
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tabsOptions:tabsOptions,
|
||||||
|
myType:myType,
|
||||||
|
show:false,
|
||||||
|
tabVal:1,
|
||||||
|
check:['0','1'],
|
||||||
|
showStmPicker:false,
|
||||||
|
showEtmPicker:false,
|
||||||
|
stm:Number(moment(new Date()).add(-7,'days')),
|
||||||
|
etm:Number(new Date()),
|
||||||
|
isTime:false,
|
||||||
|
list:[],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
getStmStr() {
|
||||||
|
return moment(this.stm).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
},
|
||||||
|
getEtmStr() {
|
||||||
|
return moment(this.etm).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
},
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
tabsChange(item) {
|
||||||
|
this.tabVal = item.value
|
||||||
|
this.submit()
|
||||||
|
},
|
||||||
|
myShow() {
|
||||||
|
this.show = true
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
reSet() {
|
||||||
|
this.isTime = false
|
||||||
|
this.stm = Number(moment(new Date()).add(-7,'days'))
|
||||||
|
this.etm = Number(new Date())
|
||||||
|
this.check = ['0','1']
|
||||||
|
},
|
||||||
|
async submit() {
|
||||||
|
try{
|
||||||
|
const params = {
|
||||||
|
status:this.tabVal,
|
||||||
|
dispatchTypeList:this.check,
|
||||||
|
}
|
||||||
|
if(this.check.length===0){
|
||||||
|
params.dispatchTypeList = ['不可能存在的值']
|
||||||
|
}
|
||||||
|
if(this.isTime){
|
||||||
|
params.dateTimeRangeSo = {
|
||||||
|
start:moment(this.stm).format('YYYY-MM-DD HH:mm:sss'),
|
||||||
|
end:moment(this.etm).format('YYYY-MM-DD HH:mm:sss')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.log('params',params)
|
||||||
|
const res = await uni.$http.post('/gunshiApp/xfflood/xfEmerDispatchR/app/list',params)
|
||||||
|
console.log('res',res)
|
||||||
|
this.list = res.data.data
|
||||||
|
this.close()
|
||||||
|
}catch(e){
|
||||||
|
//TODO handle the exception
|
||||||
|
this.$refs.uToast.show({
|
||||||
|
type: 'error',
|
||||||
|
title: '失败主题',
|
||||||
|
message: "请求失败",
|
||||||
|
})
|
||||||
|
setTimeout(()=>{
|
||||||
|
this.close()
|
||||||
|
},1000)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
myNavigateTo (record) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/orderFeedback/orderInformation?obj='+JSON.stringify({...record,isDisabled:this.tabVal===1?false:true}) // 跳转到对应路径的页面
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.submit()
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
this.submit()
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.myTitleStyle{
|
||||||
|
font-size: 30px;
|
||||||
|
background-color: red;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
.tabsClass{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 40px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.searchBox_right_btn{
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.is-hover{
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
.checkItem{
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.tmPicker{
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
border: 1px solid rgba(240, 240, 240, 1);
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
// padding-left: 10px;
|
||||||
|
}
|
||||||
|
.mybody{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin: 5px 5px;
|
||||||
|
padding: 5px 20px;
|
||||||
|
height: calc( 100vh - 100px );
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
.countNum{
|
||||||
|
width: 100%;
|
||||||
|
text-align: right;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
.listItem{
|
||||||
|
width: 100%;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
padding: 10px 0;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
.row1{
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #333333;
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
}
|
||||||
|
.row2{
|
||||||
|
font-size: 12px;
|
||||||
|
color: #999999;
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,146 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'hidden',background:'#f7f7f7'}">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<u-navbar
|
||||||
|
:title="record.year+'年度调令第'+record.serial+'号'"
|
||||||
|
:autoBack="true"
|
||||||
|
:titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}"
|
||||||
|
:height='44'
|
||||||
|
:safeAreaInsetTop=true
|
||||||
|
leftIconSize='20'
|
||||||
|
leftIconColor='rgb(153, 153, 153)'
|
||||||
|
>
|
||||||
|
</u-navbar>
|
||||||
|
<u-tabs
|
||||||
|
:list="tabsOptions"
|
||||||
|
@click="tabsChange"
|
||||||
|
:scrollable=false
|
||||||
|
class="tabsClass"
|
||||||
|
:activeStyle="{color: 'rgb(37, 157, 255)',fontSize: '16px'}"
|
||||||
|
:inactiveStyle="{color: '#606266',fontSize: '16px'}"
|
||||||
|
lineColor="transparent"
|
||||||
|
itemStyle="height: 44px"
|
||||||
|
>
|
||||||
|
</u-tabs>
|
||||||
|
<div class="mybody">
|
||||||
|
<uniZl v-if="tabsVal==='uniZl'" :record="record"></uniZl>
|
||||||
|
<uniFk v-if="tabsVal==='uniFk'" :record="record"></uniFk>
|
||||||
|
</div>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
import uniZl from './zl.vue';
|
||||||
|
import uniFk from './fk.vue'
|
||||||
|
const tabsOptions = [
|
||||||
|
{
|
||||||
|
name:'调度指令',
|
||||||
|
components:'uniZl'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name:'执行反馈',
|
||||||
|
components:'uniFk'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: { uniZl, uniFk },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tabsOptions:tabsOptions,
|
||||||
|
tabsVal:'uniZl',
|
||||||
|
record:{}
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad(props){
|
||||||
|
const myRecord = JSON.parse(props.obj)
|
||||||
|
this.record = myRecord
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
tabsChange(item) {
|
||||||
|
this.tabsVal = item.components
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.myTitleStyle{
|
||||||
|
font-size: 30px;
|
||||||
|
background-color: red;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
.tabsClass{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin-top: 44px;
|
||||||
|
height: 44px;
|
||||||
|
padding: 0 40px;
|
||||||
|
border-top: 1px solid #eee;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
}
|
||||||
|
.searchBox_right_btn{
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
.is-hover{
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
|
.checkItem{
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
.tmPicker{
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
border: 1px solid rgba(240, 240, 240, 1);
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 10px;
|
||||||
|
font-size: 14px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
align-items: center;
|
||||||
|
// padding-left: 10px;
|
||||||
|
}
|
||||||
|
.mybody{
|
||||||
|
background-color: #ffffff;
|
||||||
|
margin: 5px 5px;
|
||||||
|
// padding: 5px 20px;
|
||||||
|
height: calc( 100vh - 100px );
|
||||||
|
overflow: scroll;
|
||||||
|
}
|
||||||
|
.countNum{
|
||||||
|
width: 100%;
|
||||||
|
text-align: right;
|
||||||
|
font-size: 13px;
|
||||||
|
}
|
||||||
|
.listItem{
|
||||||
|
width: 100%;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
padding: 10px 0;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
.row1{
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 700;
|
||||||
|
color: #333333;
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
line-height: 30px;
|
||||||
|
}
|
||||||
|
.row2{
|
||||||
|
font-size: 12px;
|
||||||
|
color: #999999;
|
||||||
|
width: 100%;
|
||||||
|
height: 30px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,151 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf"><text :style="{color:'red'}">*</text>调度令编号:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="record.serial"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf"><text :style="{color:'red'}">*</text>调度令年度:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="record.year"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf"><text :style="{color:'red'}">*</text>执行单位:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="record.executeOrgName"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf"><text :style="{color:'red'}">*</text>调度类型:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="myType[record.dispatchType]"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">抄送单位:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="record.forwardOrgName"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf"><text :style="{color:'red'}">*</text>计划执行时间:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="record.startTm"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">计划结束时间:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="record.endTm"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">指令内容:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--textarea
|
||||||
|
v-model="record.content"
|
||||||
|
:disabled='true'
|
||||||
|
height=200
|
||||||
|
></u--textarea>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">指令日期:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="record.createTm"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="row">
|
||||||
|
<text class="lf">指令发起人:</text>
|
||||||
|
<div class="rf">
|
||||||
|
<u--input
|
||||||
|
border="surround"
|
||||||
|
v-model="record.createUserName"
|
||||||
|
:disabled='true'
|
||||||
|
></u--input>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div :style="{height:'100px'}"></div>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
const myType = {
|
||||||
|
0:'水库调洪',
|
||||||
|
1:'人员转移'
|
||||||
|
}
|
||||||
|
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
record:{
|
||||||
|
type: Object,
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
myType:myType
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
tabsChange(item) {
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.row{
|
||||||
|
display: flex;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
.lf{
|
||||||
|
width: 35%;
|
||||||
|
min-height: 40px;
|
||||||
|
text-align: right;
|
||||||
|
line-height: 38px;
|
||||||
|
padding-right: 10px;
|
||||||
|
}
|
||||||
|
.rf{
|
||||||
|
width: 65%;
|
||||||
|
min-height: 40px;
|
||||||
|
padding-right: 20px;
|
||||||
|
padding-top: 1px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,235 @@
|
||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<div class="userinfo">
|
||||||
|
<div class="icon" @click="goBack">
|
||||||
|
<uni-icons type="back" size="25" color="white"></uni-icons>
|
||||||
|
</div>
|
||||||
|
<div class="Header">
|
||||||
|
<span>个人信息</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<uni-list class="info">
|
||||||
|
<uni-list-item title="头像" show-arrow="true" clickable class="listContainer" @click="showActionSheet(default_src)">
|
||||||
|
<template v-slot:footer>
|
||||||
|
<image class="slot-image" :src="default_src" mode="aspectFill"></image>
|
||||||
|
</template>
|
||||||
|
</uni-list-item>
|
||||||
|
<uni-list-item v-for="(item, index) in userListShow" :key="index" clickable :title="item.name"
|
||||||
|
class="listContainer" @click="modifyValue(item)">
|
||||||
|
<template v-slot:footer>
|
||||||
|
<div class="item" @click.stop="changeItemInfo(item,index)">
|
||||||
|
<text>{{item.info}}</text>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</uni-list-item>
|
||||||
|
</uni-list>
|
||||||
|
<button type="primary" class="button" @click="save">保存</button>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
let modify = false
|
||||||
|
//访问数据
|
||||||
|
const userList = uni.getStorageSync('value')
|
||||||
|
let userListShow = [{
|
||||||
|
name: '手机号码',
|
||||||
|
info: userList.phonenumber
|
||||||
|
}, ]
|
||||||
|
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
userList: userList,
|
||||||
|
userListShow: userListShow,
|
||||||
|
modify: modify,
|
||||||
|
default_src: uni.getStorageSync('avatar'),
|
||||||
|
phone: userList.phonenumber,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() { //挂载时重新获取一次Storage数据
|
||||||
|
this.userList = uni.getStorageSync('value')
|
||||||
|
this.userListShow[0].info = this.userList.phonenumber
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
goBack() {
|
||||||
|
uni.navigateBack()
|
||||||
|
},
|
||||||
|
showActionSheet(default_src) { //修改头像
|
||||||
|
uni.showActionSheet({
|
||||||
|
itemList: ['拍照/上传照片'],
|
||||||
|
success: (res) => {
|
||||||
|
console.log('选择了第' + (res.tapIndex + 1) + '个选项');
|
||||||
|
if (res.tapIndex === 0) { //拍照上传照片
|
||||||
|
uni.chooseImage({
|
||||||
|
count: 1,
|
||||||
|
sizeType: ['origin', 'compressed'],
|
||||||
|
sourceType: ['camera', 'album'],
|
||||||
|
success: (res) => {
|
||||||
|
const tempFilePaths = res.tempFilePaths;
|
||||||
|
console.log('--------拍照上传照片--------', res);
|
||||||
|
this.default_src = tempFilePaths[0]
|
||||||
|
uni.uploadFile({
|
||||||
|
url: uni.$http.baseUrl + '/gunshiApp/tsg/system/user/profile/avatar',
|
||||||
|
fileType: 'image',
|
||||||
|
filePath: tempFilePaths[0],
|
||||||
|
name: 'avatarfile',
|
||||||
|
header: {
|
||||||
|
'Authorization': 'Bearer ' + uni.getStorageSync('Gs-Token')
|
||||||
|
},
|
||||||
|
success: (res) => {
|
||||||
|
const imgUrl = JSON.parse(res.data).imgUrl;
|
||||||
|
this.getImgFlow(imgUrl)
|
||||||
|
// uni.setStorageSync("imgUrl",imgUrl)
|
||||||
|
uni.$showMsg("上传成功")
|
||||||
|
},
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
console.log('弹窗取消');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
getImgFlow(imgUrl) {
|
||||||
|
uni.request({
|
||||||
|
url: 'http://local.gunshiiot.com:18083' +
|
||||||
|
`/gunshiApp/tsg/common/download/resource?resource=${imgUrl}`,
|
||||||
|
responseType: 'arraybuffer',
|
||||||
|
success: (res) => {
|
||||||
|
// 将arraybuffer转换为Base64编码
|
||||||
|
let base64 = uni.arrayBufferToBase64(res.data);
|
||||||
|
const p = 'data:image/png;base64,' + base64;
|
||||||
|
uni.setStorageSync("avatar",p)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
modifyValue(item) {
|
||||||
|
console.log(item);
|
||||||
|
|
||||||
|
},
|
||||||
|
changeItemInfo(item, index) { //修改电话
|
||||||
|
uni.showModal({
|
||||||
|
title: "修改" + item.name,
|
||||||
|
editable: true,
|
||||||
|
placeholderText: item.info,
|
||||||
|
confirmText: "确认",
|
||||||
|
cancelText: "取消",
|
||||||
|
success: (res) => {
|
||||||
|
const phoneReg = /^[1][3-9]\d{9}$/;
|
||||||
|
if (res.confirm) {
|
||||||
|
if (phoneReg.test(res.content)) {
|
||||||
|
this.userListShow[index].info = res.content
|
||||||
|
this.phone = res.content
|
||||||
|
uni.showToast({
|
||||||
|
title: "修改成功，请保存",
|
||||||
|
icon: "none",
|
||||||
|
duration: 1000,
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
uni.showToast({
|
||||||
|
title: "请输入正确手机号码",
|
||||||
|
icon: "none",
|
||||||
|
duration: 1000,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
console.log('取消');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
async save() {
|
||||||
|
try {
|
||||||
|
let new_userList = uni.getStorageSync('value')
|
||||||
|
new_userList.phonenumber = this.phone;
|
||||||
|
const
|
||||||
|
{data}
|
||||||
|
=await uni.$http.put('/gunshiApp/tsg/system/user/profile', new_userList);
|
||||||
|
if (data.code == 200) {
|
||||||
|
uni.setStorageSync('value', new_userList)
|
||||||
|
uni.reLaunch({
|
||||||
|
url: '/pages/mypage/mypage'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
uni.$showMsg("保存成功")
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
.userinfo {
|
||||||
|
border-radius: 5px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
margin-top: 5vh;
|
||||||
|
margin-left: 2vw;
|
||||||
|
margin-bottom: 2vh;
|
||||||
|
align-items: center;
|
||||||
|
width: 95%;
|
||||||
|
height: 6vh;
|
||||||
|
background-color: #007afd;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 6vw;
|
||||||
|
height: 6vh;
|
||||||
|
align-items: center;
|
||||||
|
line-height: 6vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.Header {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex: 0.95;
|
||||||
|
justify-content: center;
|
||||||
|
color: white;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info {
|
||||||
|
margin: 1vh;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.listContainer {
|
||||||
|
height: 6vh;
|
||||||
|
line-height: 8vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
margin-top: 60vh;
|
||||||
|
border-radius: 10px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column-reverse;
|
||||||
|
width: 92%;
|
||||||
|
height: 6vh;
|
||||||
|
font-size: 20px;
|
||||||
|
color: white;
|
||||||
|
background-color: #007afd;
|
||||||
|
}
|
||||||
|
|
||||||
|
.slot-image {
|
||||||
|
margin-top: 12px;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,114 @@
|
||||||
|
<template>
|
||||||
|
<div class="table_div">
|
||||||
|
<div class="table_cur">
|
||||||
|
<table style="width:100%;display:block">
|
||||||
|
<tr>
|
||||||
|
<th style="width: 11%;">
|
||||||
|
<div style="margin-top: 6px;">序号</div>
|
||||||
|
</th>
|
||||||
|
<th style="width: 27%">
|
||||||
|
<div style="margin-top: 6px;">站名</div></th>
|
||||||
|
<th style="width: 20%;">
|
||||||
|
<div>时段雨量</div>
|
||||||
|
<div style="margin-top: -12px;">(mm)</div>
|
||||||
|
</th>
|
||||||
|
<th style="width: 20%;" >
|
||||||
|
<div>昨日降雨</div>
|
||||||
|
<div style="margin-top: -12px;">(mm)</div>
|
||||||
|
</th>
|
||||||
|
<th style="width: 22%">
|
||||||
|
<div style="margin-top: 6px;">所属政区</div></th>
|
||||||
|
</tr>
|
||||||
|
<!-- :style="{'max-height':height + 'px', 'overflow-y': 'auto',width:'100%'}" -->
|
||||||
|
<div class="scroll-table">
|
||||||
|
<tr v-for="(item, index) in list" :key="index" style="width:100%">
|
||||||
|
<td style="width: 11%;">{{ index + 1 }}</td>
|
||||||
|
<td style="width: 27%; color: #3399ef; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;" @click="jumpDetail(item)">
|
||||||
|
{{ item.stnm }}</td>
|
||||||
|
<td style="width: 20%">{{ item.drp ? item.drp : item.drp == 0 ? 0 : '-' }}</td>
|
||||||
|
<td style="width: 20%">{{ item.yesDrp ? item.yesDrp : item.yesDrp == 0 ? 0 : '-' }}</td>
|
||||||
|
<td style="width:23%;">{{ item.adnm }}</td>
|
||||||
|
</tr>
|
||||||
|
<div style="height:160px"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
list:{
|
||||||
|
type:Array,
|
||||||
|
default:[],
|
||||||
|
},
|
||||||
|
height:{
|
||||||
|
type:Number,
|
||||||
|
default:0,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
methods:{
|
||||||
|
jumpDetail(params){
|
||||||
|
console.log(123)
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pages/rainDetail/rainDetail?stcd=${params.stcd}&stnm=${params.stnm}&sttp=${params.sttp}&source=${params.source}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.table_div {
|
||||||
|
height: 100%;
|
||||||
|
max-width: calc(100% - 0px);
|
||||||
|
max-height: calc(100vh);
|
||||||
|
flex: 1;
|
||||||
|
padding-top: 0px;
|
||||||
|
overflow-x: scroll;
|
||||||
|
padding: 0 10px;
|
||||||
|
}
|
||||||
|
/*table样式*/
|
||||||
|
.table_cur {
|
||||||
|
width: 100%;
|
||||||
|
empty-cells: show;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.table_cur tr {
|
||||||
|
display: flex;
|
||||||
|
line-height: 56rpx;
|
||||||
|
}
|
||||||
|
.table_cur th {
|
||||||
|
height: 80rpx;
|
||||||
|
color: #3399ef;
|
||||||
|
background: #e1f3ff;
|
||||||
|
font-size: 14px;
|
||||||
|
// font-weight: bold;
|
||||||
|
padding: 0px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
.scroll-table{
|
||||||
|
height: calc(100vh - 160px);
|
||||||
|
overflow-y: auto;
|
||||||
|
width:'100%'
|
||||||
|
}
|
||||||
|
.table_cur td {
|
||||||
|
height: 65rpx;
|
||||||
|
// border-bottom: 1px solid #d8ddeb;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #2f4056;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
/*table样式 end*/
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,550 @@
|
||||||
|
<template>
|
||||||
|
<view class="rain-box" style="overflow:hidden;height:100vh">
|
||||||
|
<u-status-bar ></u-status-bar>
|
||||||
|
<!-- <view style="height: var(--status-bar-height); width: 100%;"></view> -->
|
||||||
|
<view class="nav-bar">
|
||||||
|
<u-icon name="arrow-left" color="#000" size="20" @click="backTo" style="margin-left:10px"></u-icon>
|
||||||
|
<view style="font-size:18px">
|
||||||
|
雨情
|
||||||
|
</view>
|
||||||
|
<!-- <u-icon name="arrow-right" color="#000" size="28"></u-icon> -->
|
||||||
|
<view @click="popupOpen = true" style="margin-right:10px">
|
||||||
|
<image
|
||||||
|
src="../../static/images/filter.png"
|
||||||
|
style="width: 20px; height: 20px; "
|
||||||
|
|
||||||
|
>
|
||||||
|
</image>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 搜索以及多级下拉 -->
|
||||||
|
<view class="search-box">
|
||||||
|
<view class="search-item">
|
||||||
|
<view style="display:flex" v-show="limit == 1">
|
||||||
|
<view class="" @click="handleClick" >
|
||||||
|
{{selecetItem.adnm == "全部" ? "咸丰县" : selecetItem.adnm || columns[0][0].adnm}}
|
||||||
|
</view>
|
||||||
|
<u-icon name="arrow-down-fill" color="#000" size="20" v-show="switchIcon"></u-icon>
|
||||||
|
<u-icon name="arrow-up-fill" color="#000" size="20" v-show="!switchIcon"></u-icon>
|
||||||
|
</view>
|
||||||
|
<view class="rain-input" style="width: 50%;">
|
||||||
|
<u-input
|
||||||
|
placeholder="请输入站点"
|
||||||
|
prefixIcon="search"
|
||||||
|
prefixIconStyle="font-size: 22px;color: #909399"
|
||||||
|
@change="changeForm"
|
||||||
|
:value="formData.stArg"
|
||||||
|
></u-input>
|
||||||
|
</view>
|
||||||
|
<view style="display:flex" v-show="limit == 1">
|
||||||
|
<view class="" @click="handleClick1" >
|
||||||
|
{{selecetItem1.basName == "全部" ? "流域" : selecetItem1.basName || "流域"}}
|
||||||
|
</view>
|
||||||
|
<u-icon name="arrow-down-fill" color="#000" size="20" v-show="switchIcon1"></u-icon>
|
||||||
|
<u-icon name="arrow-up-fill" color="#000" size="20" v-show="!switchIcon1"></u-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 单纯下拉 -->
|
||||||
|
<view class="time-select">
|
||||||
|
<view :class="{'jiangyu':true,'noClick':rainTime}" @click="handleJiangyu" >
|
||||||
|
<text>{{formData.orderType ? "按昨日降雨降序" :"按时段降雨降序"}}</text>
|
||||||
|
<u-icon name="arrow-down-fill" color="#000" size="20" v-show="!jiangyu"></u-icon>
|
||||||
|
<u-icon name="arrow-up-fill" color="#000" size="20" v-show="jiangyu"></u-icon>
|
||||||
|
<view class="jiangyu-dropdown" v-show="this.jiangyu">
|
||||||
|
<view :class="{'active': formData.orderType == 0,'no_f':true}" @click="rainsort(0)" style="border-top: 1px solid #dfdfdf;">
|
||||||
|
<text >按时段降雨降序</text>
|
||||||
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.orderType == 0"></u-icon>
|
||||||
|
</view>
|
||||||
|
<view :class="{'active':formData.orderType == 1,'no_f':true}" @click="rainsort(1)" >
|
||||||
|
<text>按昨日降雨降序</text>
|
||||||
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.orderType == 1"></u-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="rain-time" @click="handleTime">
|
||||||
|
<text>{{formData.timeType == 1 ? "1h" :
|
||||||
|
formData.timeType == 3 ? "3h" :
|
||||||
|
formData.timeType == 6 ? "6h" :
|
||||||
|
formData.timeType == 12 ? "12h" :
|
||||||
|
formData.timeType == 24 ? "24h" : ''
|
||||||
|
|
||||||
|
}}</text>
|
||||||
|
<u-icon name="arrow-down-fill" color="#000" size="20" v-show="!rainTime"></u-icon>
|
||||||
|
<u-icon name="arrow-up-fill" color="#000" size="20" v-show="rainTime"></u-icon>
|
||||||
|
<view class="rain-time-dropdown" v-show="rainTime">
|
||||||
|
<view :class="{'active': formData.timeType == 1,'no_f':true}" @click="timesort(1)" style="border-top: 1px solid #dfdfdf;">
|
||||||
|
<text >1h</text>
|
||||||
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.timeType == 1"></u-icon>
|
||||||
|
</view>
|
||||||
|
<view :class="{'active': formData.timeType == 3,'no_f':true}" @click="timesort(3)" >
|
||||||
|
<text >3h</text>
|
||||||
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.timeType == 3"></u-icon>
|
||||||
|
</view>
|
||||||
|
<view :class="{'active': formData.timeType == 6,'no_f':true}" @click="timesort(6)" >
|
||||||
|
<text >6h</text>
|
||||||
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.timeType == 6"></u-icon>
|
||||||
|
</view>
|
||||||
|
<view :class="{'active': formData.timeType == 12,'no_f':true}" @click="timesort(12)" >
|
||||||
|
<text >12h</text>
|
||||||
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.timeType == 12"></u-icon>
|
||||||
|
</view>
|
||||||
|
<view :class="{'active': formData.timeType == 24,'no_f':true}" @click="timesort(24)" >
|
||||||
|
<text>24h</text>
|
||||||
|
<u-icon name="checkmark" color="#02a7f0" size="20" v-show="formData.timeType == 24"></u-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<!-- 内容部分 -->
|
||||||
|
<view style="width: 100%; height: 10px; background-color: #f7f7f7;">
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<!-- 时间段 -->
|
||||||
|
<view style="padding: 1% 0%;width:100vw; text-align: center; color: #f7b156;">
|
||||||
|
统计时段:{{tm.stm}}至{{tm.etm}}
|
||||||
|
</view>
|
||||||
|
<view style="width:100%">
|
||||||
|
<Table :list="rainList" :height='tableHeight'/>
|
||||||
|
</view>
|
||||||
|
<u-picker
|
||||||
|
:show="show"
|
||||||
|
ref="uPicker"
|
||||||
|
:columns="columns"
|
||||||
|
@confirm="confirm"
|
||||||
|
@change="changeHandler"
|
||||||
|
@cancel="cancel"
|
||||||
|
keyName="adnm"
|
||||||
|
>
|
||||||
|
</u-picker>
|
||||||
|
<u-picker
|
||||||
|
:show="show1"
|
||||||
|
ref="uPicker1"
|
||||||
|
:columns="columns1"
|
||||||
|
@confirm="confirm1"
|
||||||
|
@cancel="cancel1"
|
||||||
|
keyName="basName"
|
||||||
|
>
|
||||||
|
</u-picker>
|
||||||
|
<u-popup :show="popupOpen" mode="right" @close="popupOpen=false" >
|
||||||
|
<view style="padding: 30px 20px; ">
|
||||||
|
<text style="font-weight: bold;">按类型</text>
|
||||||
|
<view style="margin-bottom: 10px; margin-left: -5px;">
|
||||||
|
<u-checkbox-group
|
||||||
|
v-model="formData.source"
|
||||||
|
@change="checkboxChange"
|
||||||
|
>
|
||||||
|
<u-checkbox
|
||||||
|
:customStyle="{margin: '7px'}"
|
||||||
|
v-for="(item, index) in checkboxList1"
|
||||||
|
:key="index"
|
||||||
|
:label="item.name"
|
||||||
|
:name="item.value"
|
||||||
|
>
|
||||||
|
</u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- <text style="font-weight: bold;">按时间</text>
|
||||||
|
<view class="example-body" style="display: flex; align-items: center; margin-bottom: 10px; margin-top: 10px;">
|
||||||
|
<uni-datetime-picker type="datetime" v-model="stm" @change="(e) => this.stm = e" />
|
||||||
|
<text style="margin-left: 10px;">至</text>
|
||||||
|
</view>
|
||||||
|
<view class="example-body" style="width: 92%;">
|
||||||
|
<uni-datetime-picker type="datetime" v-model="etm" @change="(e) => this.etm = e" />
|
||||||
|
</view>
|
||||||
|
<view style="display: flex; margin-top: 10px;">
|
||||||
|
<u-button class="first-btn" text="昨日08:00~当前时间"></u-button>
|
||||||
|
<u-button class="second-btn" text="今天08:00~当前时间"></u-button>
|
||||||
|
</view> -->
|
||||||
|
<view style="display: flex; position:absolute;bottom:20px;right:20px">
|
||||||
|
<u-button text="重置" class="bottom-btn1"
|
||||||
|
@click="formData = {...formData,source}"></u-button>
|
||||||
|
<u-button text="确认" color="#d9001b" class="bottom-btn2" @click="popupOpen = false"></u-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Table from "./Table"
|
||||||
|
import filter from "../../static/images/filter.png"
|
||||||
|
import moment from "moment"
|
||||||
|
import {disType} from "../utils/dicType.js"
|
||||||
|
const adcd = uni.getStorageSync('value').adcd
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
show: false,
|
||||||
|
show1:false,
|
||||||
|
switchIcon:true,
|
||||||
|
switchIcon1:true,
|
||||||
|
rainList:[],//雨情数据
|
||||||
|
selecetItem:{},
|
||||||
|
selecetItem1:{},
|
||||||
|
jiangyu:false, //显示下拉
|
||||||
|
rainTime:false, //显示下拉，
|
||||||
|
selectJyOne:1,//选中降雨最后一个元素，
|
||||||
|
selectTimeOne:4, //选中时间的最有一个元素
|
||||||
|
popupOpen:false, //抽屉打开
|
||||||
|
source:["SH","SW","QX","SK"],
|
||||||
|
// checkboxValue1:["SH","SW","QX","SK"],
|
||||||
|
// 基本案列数据
|
||||||
|
checkboxList1: [{
|
||||||
|
name: '山洪',
|
||||||
|
value: "SH"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '水文',
|
||||||
|
value: "SW"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '气象',
|
||||||
|
value: "QX"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '水库',
|
||||||
|
value: "SK"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
stm: '', //开始时间，
|
||||||
|
etm:"",//结束时间
|
||||||
|
columns: //政区下拉
|
||||||
|
[
|
||||||
|
[{"adnm": "咸丰县", "adcd":adcd }],[]
|
||||||
|
],
|
||||||
|
columnData: [[]],
|
||||||
|
columns1:[[]], //流域选择,
|
||||||
|
formData:{ //表单数据
|
||||||
|
timeType:24,
|
||||||
|
orderType:1,
|
||||||
|
basCode:'',
|
||||||
|
source:["SH","SW","QX","SK"],
|
||||||
|
stArg:'',
|
||||||
|
adcd:disType(uni.getStorageSync('value').adcd) == 1 ? undefined :uni.getStorageSync('value').adcd,
|
||||||
|
etm:moment().format("YYYY-MM-DD HH:mm"),
|
||||||
|
stm:moment().subtract(1, 'day').format("YYYY-MM-DD HH:mm")
|
||||||
|
// etm:moment().set({ hour: 8, minute: 0, second: 0, millisecond: 0 }).format("YYYY-MM-DD HH:mm"),
|
||||||
|
// stm:moment().subtract(1, 'day').set({ hour: 8, minute: 0, second: 0, millisecond: 0 }).format("YYYY-MM-DD HH:mm")
|
||||||
|
},
|
||||||
|
tableHeight:0,
|
||||||
|
limit:disType(uni.getStorageSync('value').adcd)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
Table
|
||||||
|
},
|
||||||
|
computed:{
|
||||||
|
tm(){
|
||||||
|
return {
|
||||||
|
stm:moment().subtract(this.formData.timeType, 'hours').format("YYYY-MM-DD HH:mm"),
|
||||||
|
etm:moment().format("YYYY-MM-DD HH:mm")
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
watch:{
|
||||||
|
formData(newV, oldV){
|
||||||
|
console.log("www",newV)
|
||||||
|
this.getRainList()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
changeForm(e){
|
||||||
|
this.formData = {...this.formData,stArg:e}
|
||||||
|
},
|
||||||
|
handleJiangyu(e){
|
||||||
|
if(this.rainTime){
|
||||||
|
e.stopPropagation();
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.jiangyu = !this.jiangyu
|
||||||
|
},
|
||||||
|
handleTime(e){
|
||||||
|
if(this.jiangyu){
|
||||||
|
e.stopPropagation();
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.rainTime = !this.rainTime
|
||||||
|
},
|
||||||
|
//按昨日降雨排序
|
||||||
|
rainsort(e){
|
||||||
|
this.formData = {...this.formData,orderType: e ? 1 : 0}
|
||||||
|
},
|
||||||
|
// 按小时排序
|
||||||
|
timesort(e){
|
||||||
|
this.formData = {
|
||||||
|
...this.formData,
|
||||||
|
stm:moment().subtract(e, 'hours').format("YYYY-MM-DD HH:mm"),
|
||||||
|
etm:moment().format("YYYY-MM-DD HH:mm"),
|
||||||
|
timeType:e
|
||||||
|
}
|
||||||
|
},
|
||||||
|
changeHandler(e) {
|
||||||
|
const {
|
||||||
|
columnIndex,
|
||||||
|
value,
|
||||||
|
values, // values为当前变化列的数组内容
|
||||||
|
index,
|
||||||
|
// 微信小程序无法将picker实例传出来，只能通过ref操作
|
||||||
|
picker = this.$refs.uPicker
|
||||||
|
} = e
|
||||||
|
// 当第一列值发生变化时，变化第二列(后一列)对应的选项
|
||||||
|
if (columnIndex === 0) {
|
||||||
|
// picker为选择器this实例，变化第二列对应的选项
|
||||||
|
picker.setColumnValues(1, this.columnData[index])
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 回调参数为包含columnIndex、value、values
|
||||||
|
confirm(e) {
|
||||||
|
console.log('confirm', e)
|
||||||
|
this.show = false
|
||||||
|
this.switchIcon=true;
|
||||||
|
this.selecetItem = e.value[1];
|
||||||
|
// this.formData.adcd = e.value[1].adcd;
|
||||||
|
this.formData = {...this.formData,adcd:e.value[1].adcd}
|
||||||
|
},
|
||||||
|
cancel(e) {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
changeHandler1(e) {
|
||||||
|
const {
|
||||||
|
columnIndex,
|
||||||
|
value,
|
||||||
|
values, // values为当前变化列的数组内容
|
||||||
|
index,
|
||||||
|
// 微信小程序无法将picker实例传出来，只能通过ref操作
|
||||||
|
picker = this.$refs.uPicker1
|
||||||
|
} = e
|
||||||
|
// 当第一列值发生变化时，变化第二列(后一列)对应的选项
|
||||||
|
if (columnIndex === 0) {
|
||||||
|
// picker为选择器this实例，变化第二列对应的选项
|
||||||
|
picker.setColumnValues(1, this.columnData[index])
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 回调参数为包含columnIndex、value、values
|
||||||
|
confirm1(e) {
|
||||||
|
console.log('confirm', e)
|
||||||
|
this.show1 = false
|
||||||
|
this.switchIcon1=true;
|
||||||
|
this.selecetItem1 = e.value[0];
|
||||||
|
this.formData = {...this.formData,basCode:e.value[0].basCode};
|
||||||
|
},
|
||||||
|
cancel1(e) {
|
||||||
|
this.show1 = false
|
||||||
|
},
|
||||||
|
handleClick(e){
|
||||||
|
if(this.selecetItem1.basName && this.selecetItem1.basName != "全部"){
|
||||||
|
e.stopPropagation();
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.show = true;
|
||||||
|
this.switchIcon = !this.switchIcon
|
||||||
|
},
|
||||||
|
handleClick1(e){
|
||||||
|
if(this.selecetItem.adnm&&this.selecetItem.adnm != "全部"){
|
||||||
|
e.stopPropagation();
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.show1 = true;
|
||||||
|
this.switchIcon1 = !this.switchIcon1
|
||||||
|
},
|
||||||
|
checkboxChange(n) {
|
||||||
|
console.log('change', n);
|
||||||
|
this.formData = {...this.formData,source:n};
|
||||||
|
},
|
||||||
|
changeLog(e) {
|
||||||
|
console.log('change事件:', e);
|
||||||
|
},
|
||||||
|
// 获取行政区域选择
|
||||||
|
async adnmList(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.get(
|
||||||
|
"/gunshiApp/xfflood/real/rain/adnmList"
|
||||||
|
)
|
||||||
|
if(data.code == 200){
|
||||||
|
|
||||||
|
const all = {
|
||||||
|
adnm:'全部',
|
||||||
|
adcd:''
|
||||||
|
}
|
||||||
|
this.columns = [[...this.columns[0]],[all,...data.data]];
|
||||||
|
this.columnData = [[all,...data.data]];
|
||||||
|
}
|
||||||
|
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取流域
|
||||||
|
async basNameList(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.get(
|
||||||
|
"/gunshiApp/xfflood/real/rain/basNameList"
|
||||||
|
)
|
||||||
|
if(data.code == 200){
|
||||||
|
const all = {
|
||||||
|
basName:'全部',
|
||||||
|
basCode:''
|
||||||
|
}
|
||||||
|
this.columns1 = [[all,...data.data]];
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取雨情列表
|
||||||
|
async getRainList(){
|
||||||
|
let obj = {
|
||||||
|
...this.formData,
|
||||||
|
timeType:undefined
|
||||||
|
}
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.post(
|
||||||
|
"/gunshiApp/xfflood/real/rain/app/list",obj
|
||||||
|
)
|
||||||
|
if(data.code == 200){
|
||||||
|
this.rainList = [...data.data];
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
backTo(){
|
||||||
|
uni.navigateBack({delta:1})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.adnmList();
|
||||||
|
this.basNameList()
|
||||||
|
this.getRainList()
|
||||||
|
},
|
||||||
|
onReady(){
|
||||||
|
let that = this
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success: (res) => {
|
||||||
|
that.tableHeight = res.windowHeight - 280;
|
||||||
|
console.log("this.tableHeight", that.tableHeight);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.nav-bar{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 44px;
|
||||||
|
// margin-top: 30px;
|
||||||
|
// padding-top: 40px;
|
||||||
|
// padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
// box-shadow: 0 5px 10px -8px #dfdfdf inset;
|
||||||
|
}
|
||||||
|
.search-box{
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
.search-item{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 20px;
|
||||||
|
width: 90%;
|
||||||
|
padding: 5px;
|
||||||
|
height: 30px;
|
||||||
|
background-color: #dddddd;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.time-select{
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 20px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
.noClick{
|
||||||
|
pointer-events: initial;
|
||||||
|
}
|
||||||
|
.jiangyu,.rain-time{
|
||||||
|
display: flex;
|
||||||
|
column-gap: 5px;
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
.jiangyu{
|
||||||
|
// position: relative;
|
||||||
|
.jiangyu-dropdown{
|
||||||
|
position: absolute;
|
||||||
|
background-color: #fff;
|
||||||
|
width: 100vw;
|
||||||
|
left: 0;
|
||||||
|
top: 35px;
|
||||||
|
.active{
|
||||||
|
color:#02a7f0
|
||||||
|
}
|
||||||
|
text{
|
||||||
|
margin-right: 58%;
|
||||||
|
}
|
||||||
|
.no_f{
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
// border-top: 1px solid #dfdfdf;
|
||||||
|
padding: 10px 15px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
// justify-content: space-around;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.rain-time{
|
||||||
|
// position: relative;
|
||||||
|
.rain-time-dropdown{
|
||||||
|
position: absolute;
|
||||||
|
background-color: #fff;
|
||||||
|
width: 100vw;
|
||||||
|
// left: -10%;
|
||||||
|
left: 0;
|
||||||
|
top: 35px;
|
||||||
|
.active{
|
||||||
|
color:#02a7f0;
|
||||||
|
text{
|
||||||
|
margin-right: 80%;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.no_f{
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
// border-top: 1px solid #dfdfdf;
|
||||||
|
padding: 10px 15px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
// justify-content: space-around;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.first-btn{
|
||||||
|
margin-right: 5px;
|
||||||
|
background-color: #f2f2f2;
|
||||||
|
}
|
||||||
|
.second-btn{
|
||||||
|
background-color: #f2f2f2;
|
||||||
|
}
|
||||||
|
.bottom-btn1,.bottom-btn2{
|
||||||
|
width: 100px;
|
||||||
|
}
|
||||||
|
.bottom-btn1{
|
||||||
|
margin-left: 70px;
|
||||||
|
}
|
||||||
|
.bottom-btn2{
|
||||||
|
margin-right: -12px;
|
||||||
|
margin-left: 10px;
|
||||||
|
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,181 @@
|
||||||
|
|
||||||
|
import echarts from 'echarts/lib/echarts';
|
||||||
|
|
||||||
|
export default function DrpOption(echartData) {
|
||||||
|
let totalDrp = 0;
|
||||||
|
const DRPLEVEL = [10, 20, 50, 100, 250];
|
||||||
|
const maxVal = DRPLEVEL.find(o => o > totalDrp);
|
||||||
|
const xMaxVal = echartData?.actual ? DRPLEVEL.find(o => {
|
||||||
|
let max = Math.max(...echartData?.actual || [])
|
||||||
|
return o > max
|
||||||
|
}):maxVal
|
||||||
|
// const xMaxVal = Math.ceil(Math.max(...echartData.actual)) + 2
|
||||||
|
const yMaxVal = echartData?.actual ? DRPLEVEL.find(o => {
|
||||||
|
let max = Math.max(...echartData?.total)
|
||||||
|
return o > max
|
||||||
|
}): maxVal
|
||||||
|
let eopts = {
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis'
|
||||||
|
},
|
||||||
|
grid:{
|
||||||
|
x: 40,
|
||||||
|
y: 30,
|
||||||
|
x2: 30,
|
||||||
|
y2: 28,
|
||||||
|
borderWidth: 0
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
// 显示图例
|
||||||
|
show: true,
|
||||||
|
// 图例的位置
|
||||||
|
data: ['实测', '累计']
|
||||||
|
},
|
||||||
|
calculable: true,
|
||||||
|
xAxis: [
|
||||||
|
{
|
||||||
|
type: 'category',
|
||||||
|
// data: echartData?.time.map(item => item.substr('2020--'.length)),
|
||||||
|
data: echartData?.time,
|
||||||
|
splitLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
format: 'xAxisFormat'
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.5,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
],
|
||||||
|
yAxis: [
|
||||||
|
{
|
||||||
|
type: 'value',
|
||||||
|
position: 'left',
|
||||||
|
name:"雨量mm",
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dashed'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
min: 0,
|
||||||
|
max: xMaxVal
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'value',
|
||||||
|
position: 'right',
|
||||||
|
name:"累计mm",
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dashed'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
min: 0,
|
||||||
|
max: yMaxVal
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
let chartData = {
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '实测',
|
||||||
|
type: 'bar',
|
||||||
|
barWidth: '60%',
|
||||||
|
data: echartData?.actual,
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
barBorderRadius: [3, 3, 0, 0],
|
||||||
|
color: new echarts.graphic.LinearGradient(
|
||||||
|
0, 0, 0, 1,
|
||||||
|
[
|
||||||
|
{ offset: 0, color: '#3876cd' },
|
||||||
|
{ offset: 0.5, color: '#45b4e7' },
|
||||||
|
{ offset: 1, color: '#54ffff' }
|
||||||
|
]
|
||||||
|
),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
markPoint: {
|
||||||
|
data: [
|
||||||
|
{ type: 'max', name: '最大值', symbol: 'circle', symbolSize: 1, symbolOffset: [0, -12] },
|
||||||
|
]
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
yAxisIndex: 1,
|
||||||
|
name: '累计',
|
||||||
|
type: 'line',
|
||||||
|
showSymbol: false,
|
||||||
|
label: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
data: echartData?.total,
|
||||||
|
lineStyle: {
|
||||||
|
normal: {
|
||||||
|
width: 1,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
areaStyle: {
|
||||||
|
normal: {
|
||||||
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
|
||||||
|
offset: 0,
|
||||||
|
color: 'rgba(3, 194, 236, 0.3)'
|
||||||
|
}, {
|
||||||
|
offset: 0.8,
|
||||||
|
color: 'rgba(3, 194, 236, 0)'
|
||||||
|
}
|
||||||
|
], false),
|
||||||
|
shadowColor: 'rgba(0, 0, 0, 0.1)',
|
||||||
|
shadowBlur: 10
|
||||||
|
}
|
||||||
|
},
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
color: '#03C2EC'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
eopts,
|
||||||
|
chartData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,156 @@
|
||||||
|
<template>
|
||||||
|
<view class="jcsj-box">
|
||||||
|
<view class="time-ranger">
|
||||||
|
<view class="start-time">
|
||||||
|
<text>开始时间</text>
|
||||||
|
<text @click="showTime=true" style="margin-left:10%;color:#3399ef">{{stm}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="end-time">
|
||||||
|
<text>结束时间</text>
|
||||||
|
<text @click="showTime1=true" style="margin:0 10%;color:#3399ef">{{etm}}</text>
|
||||||
|
<view class="search-btn" @click="searchHandle">
|
||||||
|
搜索
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- <uni-datetime-picker type="datetimerange" v-model="tm" @change="handleRanger"></uni-datetime-picker>
|
||||||
|
<view class="search-btn" @click="searchHandle">
|
||||||
|
搜索
|
||||||
|
</view> -->
|
||||||
|
</view>
|
||||||
|
<!-- <view class="" style="width: 100%; height: 3px; background-color: #dfdfdf; margin-bottom: 2px;">
|
||||||
|
|
||||||
|
</view> -->
|
||||||
|
<view class="jcsj-content">
|
||||||
|
<view class="jcsj-charts">
|
||||||
|
<qiun-data-charts :chartData="chartData.chartData" :echartsApp="true" :eopts="chartData.eopts" />
|
||||||
|
</view>
|
||||||
|
<view class="jcsj-table">
|
||||||
|
<JcsjTable :tableData="tableData" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showTime"
|
||||||
|
v-model="startTime"
|
||||||
|
mode="datetime"
|
||||||
|
@confirm="handleStartTime"
|
||||||
|
@cancel="showTime=false"
|
||||||
|
></u-datetime-picker>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showTime1"
|
||||||
|
v-model="endTime"
|
||||||
|
mode="datetime"
|
||||||
|
@confirm="handleEndTime"
|
||||||
|
@cancel="showTime1=false"
|
||||||
|
></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
import JcsjTable from "./jcsjTable"
|
||||||
|
import drpOption from "./chartOption.js"
|
||||||
|
const stm = moment().subtract(7, 'days').add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm");
|
||||||
|
const etm = moment().add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm");
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
stcd:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
startTime:stm,
|
||||||
|
endTime:etm,
|
||||||
|
stm,
|
||||||
|
etm,
|
||||||
|
tableData:[],
|
||||||
|
chartData: {chartData:{},eopts:{}},
|
||||||
|
rainChartData:{},
|
||||||
|
showTime:false,
|
||||||
|
showTime1:false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
JcsjTable
|
||||||
|
},
|
||||||
|
watch:{
|
||||||
|
rainChartData:{
|
||||||
|
handler(newV){
|
||||||
|
this.chartData = {...drpOption(newV)}
|
||||||
|
},
|
||||||
|
deep:true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleStartTime(e){
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
this.stm = time
|
||||||
|
this.showTime = false
|
||||||
|
},
|
||||||
|
handleEndTime(e){
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
this.etm = time;
|
||||||
|
this.showTime1 = false
|
||||||
|
},
|
||||||
|
handleRanger(e){
|
||||||
|
console.log(e);
|
||||||
|
this.tm = [...e]
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
async getJcsjData(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.post(
|
||||||
|
"/gunshiApp/xfflood/attResBase/rainBasinDivision/queryStStbprpPerHour/StcdAndStartTimeAndEndTime",
|
||||||
|
{
|
||||||
|
stcd:this.stcd,
|
||||||
|
startTime:moment(this.stm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
endTime:moment(this.etm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
})
|
||||||
|
if(data.code == 200){
|
||||||
|
this.tableData = [...data.data]
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取图表数据
|
||||||
|
async getRainChartData(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.post(
|
||||||
|
"/gunshiApp/xfflood/attResBase/rainBasinDivision/queryStStbprpPerHourChart/StcdAndStartTimeAndEndTime",
|
||||||
|
{
|
||||||
|
stcd:this.stcd,
|
||||||
|
startTime:moment(this.stm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
endTime:moment(this.etm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
})
|
||||||
|
if(data.code == 200){
|
||||||
|
this.rainChartData = {...data.data}
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
searchHandle(){
|
||||||
|
this.getJcsjData();
|
||||||
|
this.getRainChartData()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getJcsjData()
|
||||||
|
this.getRainChartData()
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.jcsj-box{
|
||||||
|
.jcsj-content{
|
||||||
|
max-height:calc(100vh - 89px - 43px - 45px);
|
||||||
|
overflow-y:auto
|
||||||
|
}
|
||||||
|
.jcsj-charts{
|
||||||
|
width:100%;
|
||||||
|
height: 300px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,91 @@
|
||||||
|
<template>
|
||||||
|
<div class="table_div">
|
||||||
|
<div class="table_cur">
|
||||||
|
<table style="width:100%;display:block">
|
||||||
|
<tr>
|
||||||
|
<th style="width: 50px;">
|
||||||
|
序号
|
||||||
|
</th>
|
||||||
|
<th style="width: 200px">时间</th>
|
||||||
|
<th style="width: 150px;">
|
||||||
|
小时雨量(mm)
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
<!-- style="max-height: 320px; overflow-y: auto" -->
|
||||||
|
<div style="max-height: 250px; overflow-y: auto">
|
||||||
|
<tr v-for="(item, index) in tableData" :key="index">
|
||||||
|
<td style="width: 50px">{{ index + 1 }}</td>
|
||||||
|
<td style="width: 200px;">{{ item.time }}</td>
|
||||||
|
<td style="width: 150px">{{ item.sumDrp }}</td>
|
||||||
|
</tr>
|
||||||
|
<div style="height:155px"></div>
|
||||||
|
</div>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
tableData:{
|
||||||
|
type:Array,
|
||||||
|
default:[],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.table_div {
|
||||||
|
height: 100%;
|
||||||
|
max-width: calc(100% - 0px);
|
||||||
|
max-height: calc(100vh);
|
||||||
|
flex: 1;
|
||||||
|
padding-top: 0px;
|
||||||
|
overflow-x: scroll;
|
||||||
|
}
|
||||||
|
/*table样式*/
|
||||||
|
.table_cur {
|
||||||
|
width: 100%;
|
||||||
|
empty-cells: show;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.table_cur tr {
|
||||||
|
display: flex;
|
||||||
|
line-height: 65rpx;
|
||||||
|
}
|
||||||
|
.table_cur th {
|
||||||
|
height: 65rpx;
|
||||||
|
color: #3399ef;
|
||||||
|
background: #e1f3ff;
|
||||||
|
font-size: 14px;
|
||||||
|
// font-weight: bold;
|
||||||
|
padding: 0px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
.scroll-table{
|
||||||
|
height: calc(100vh - 145px);
|
||||||
|
overflow-y: auto;
|
||||||
|
width:'100%'
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur td {
|
||||||
|
height: 65rpx;
|
||||||
|
// border-bottom: 1px solid #d8ddeb;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #2f4056;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
/*table样式 end*/
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,102 @@
|
||||||
|
<template>
|
||||||
|
<view class="rain-detail-box">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<view class="nav-bar">
|
||||||
|
<u-icon name="arrow-left" color="#000" size="20" @click="backTo" style="margin-left:10px"></u-icon>
|
||||||
|
<view class="title">
|
||||||
|
{{stnm}}
|
||||||
|
<text style="font-size:12px;margin-left:5px">{{sta}}({{rain}})</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="tab-bar" >
|
||||||
|
<view class="jcsj" @click="activeOne = 0" :class="{'active':activeOne == 0}">
|
||||||
|
监测数据
|
||||||
|
</view>
|
||||||
|
<view class="tjsj" @click="activeOne = 1" :class="{'active':activeOne == 1}">
|
||||||
|
统计数据
|
||||||
|
</view>
|
||||||
|
<view class="zbyq" @click="activeOne = 2" :class="{'active':activeOne == 2}">
|
||||||
|
周边雨情
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="rain-detail-content">
|
||||||
|
<Jcsj :stcd="stcd" v-if="activeOne == 0"/>
|
||||||
|
<Tjsj :stcd="stcd" v-else-if="activeOne == 1"/>
|
||||||
|
<Zbyq :stcd="stcd" v-else-if="activeOne == 2"/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Jcsj from "./jcsj/jcsj.vue"
|
||||||
|
import Tjsj from "./tjsj/tjsj.vue"
|
||||||
|
import Zbyq from "./zbyq/zbyq.vue"
|
||||||
|
const staType = {
|
||||||
|
MM: '气象站',PP: '雨量站',RR: '水库水文站',ZZ: '河道水位站',ZQ:"河道水文站"
|
||||||
|
}
|
||||||
|
const rainType = {'SH':'山洪','SW':'水文','QX':'气象','SK':'水库'}
|
||||||
|
export default {
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
activeOne:0,
|
||||||
|
stcd:'',
|
||||||
|
stnm:'',
|
||||||
|
rainType:rainType,
|
||||||
|
staType:staType,
|
||||||
|
// sta:staType[sttp]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
Jcsj,
|
||||||
|
Tjsj,
|
||||||
|
Zbyq
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
backTo(){
|
||||||
|
uni.navigateBack({delta:1})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(option) {
|
||||||
|
this.stcd = option.stcd;
|
||||||
|
this.stnm = option.stnm;
|
||||||
|
this.sta = staType[option.sttp];
|
||||||
|
this.rain = rainType[option.source];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.rain-detail-box{
|
||||||
|
height: 100vh;
|
||||||
|
overflow: hidden;
|
||||||
|
.nav-bar{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 44px;
|
||||||
|
// margin-top: 30px;
|
||||||
|
// padding-top: 20px;
|
||||||
|
// padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
// box-shadow: 0 5px 10px -8px #dfdfdf inset;
|
||||||
|
}
|
||||||
|
.title{
|
||||||
|
flex:1;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
.tab-bar{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 10px 30px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
.active{
|
||||||
|
color: #39a6ff;
|
||||||
|
}
|
||||||
|
.rain-detail-content{
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,144 @@
|
||||||
|
<template>
|
||||||
|
<view class="tjsj-box">
|
||||||
|
<uni-row class="tjsj-row" :width="700">
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近1h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h1||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近3h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h3||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近6h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h6||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近12h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h12||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近24h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h24||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近48h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h48||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">今日雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.today||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">昨日雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.yesterdayDrp||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">本月雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.monthDrp||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">本年雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.yearDrp||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">本年降雨天数</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.yearDrpDay||0}}/{{days}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row" style="border-bottom: 1px solid #dfdfdf;">本年最大日雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row" style="display: flex; justify-content: center; border-bottom: 1px solid #dfdfdf;">
|
||||||
|
<text>{{tableData.maxDrp||0}}</text>
|
||||||
|
<text style="color: #E69224;">({{maxDrpTime}})</text>
|
||||||
|
</view>
|
||||||
|
</uni-col>
|
||||||
|
|
||||||
|
</uni-row>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
stcd:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tableData:{},
|
||||||
|
days:moment().diff(moment().startOf('year'),'days')+1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed:{
|
||||||
|
maxDrpTime(){
|
||||||
|
if(this.tableData.maxDrpTime){
|
||||||
|
return moment(this.tableData.maxDrpTime).format("YYYY-MM-DD")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getTableData(){
|
||||||
|
console.log(this.stcd);
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.get(
|
||||||
|
`/gunshiApp/xfflood/attResBase/rainBasinDivision/queryStPptnDetails/stcd?stcd=${this.stcd}`
|
||||||
|
)
|
||||||
|
if(data.code == 200){
|
||||||
|
this.tableData = {...data.data};
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getTableData()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.tjsj-box{
|
||||||
|
.tjsj-row{
|
||||||
|
.first-row{
|
||||||
|
line-height: 40px;
|
||||||
|
text-align: center;
|
||||||
|
border-top: 1px solid #dfdfdf;
|
||||||
|
border-left: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
.second-row{
|
||||||
|
line-height: 40px;
|
||||||
|
text-align: center;
|
||||||
|
border-top: 1px solid #dfdfdf;
|
||||||
|
border-left: 1px solid #dfdfdf;
|
||||||
|
border-right: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,87 @@
|
||||||
|
<template>
|
||||||
|
<view class="list-box">
|
||||||
|
<uni-row class="list-row" >
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row" style="margin-left: 10px;">
|
||||||
|
<text style="display: inline-block; margin-bottom: 10px; font-weight: bold;">{{info.stnm}}</text>
|
||||||
|
<view>
|
||||||
|
<text style="margin-right: 60px; color: #aaaaaa;">{{sttype[info.source]}}</text>
|
||||||
|
<text style="color: #aaaaaa;">{{info.distance ? info.distance.toFixed(2) : 0}}km</text>
|
||||||
|
</view>
|
||||||
|
<text style="color: #aaaaaa;">{{info.tm}}</text>
|
||||||
|
</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12" >
|
||||||
|
<view class="second-row" style="border: 1px solid #dfdfdf; font-size: 12px;border-bottom: 1px solid #dfdfdf;">
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex:0.5; background-color: #e1f3ff; border-right: 1px solid #dfdfdf; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
1h(mm)
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; background-color: #e1f3ff;text-align: center; border-bottom:1px solid #dfdfdf" >
|
||||||
|
3h(mm)
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex: 0.5; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
{{info.h1}}
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
{{info.h3}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex:0.5; background-color: #e1f3ff; border-right: 1px solid #dfdfdf; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
6h(mm)
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; background-color: #e1f3ff;text-align: center; border-bottom:1px solid #dfdfdf" >
|
||||||
|
24h(mm)
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex: 0.5; text-align: center; border-right: 1px solid #dfdfdf;">
|
||||||
|
{{info.h6}}
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; text-align: center; ">
|
||||||
|
{{info.h24}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-col>
|
||||||
|
</uni-row>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
info:Object,
|
||||||
|
default:{}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
sttype: {
|
||||||
|
"SH": '山洪',
|
||||||
|
"SW": '水文',
|
||||||
|
"QX": '气象',
|
||||||
|
"SK": '水库',
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.list-box{
|
||||||
|
.list-row{
|
||||||
|
padding-bottom: 3px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
.second-row{
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,166 @@
|
||||||
|
<template>
|
||||||
|
<view class="zbyq-box">
|
||||||
|
<view class="search-bar">
|
||||||
|
<u-search
|
||||||
|
shape="square"
|
||||||
|
:clearabled="true"
|
||||||
|
:showAction="false"
|
||||||
|
placeholder="请输入站点"
|
||||||
|
height="40px"
|
||||||
|
@change="inputChange"
|
||||||
|
v-model="formData.value"
|
||||||
|
></u-search>
|
||||||
|
<image
|
||||||
|
src="../../../static/images/filter.png"
|
||||||
|
style="width: 20px; height: 20px; margin-right: 10px; margin-left: 10px;"
|
||||||
|
@click="popupOpen = true"
|
||||||
|
>
|
||||||
|
</image>
|
||||||
|
</view>
|
||||||
|
<view class="content">
|
||||||
|
<view v-for="(item,index) in list" :key="index" style="margin-bottom: 5px;">
|
||||||
|
<ResList :info="item" />
|
||||||
|
</view>
|
||||||
|
<view style="height:300px"></view>
|
||||||
|
</view>
|
||||||
|
<u-popup :show="popupOpen" mode="right" @close="popupOpen=false" >
|
||||||
|
<view style="padding: 30px 20px;">
|
||||||
|
<text style="font-weight: bold;">按类型</text>
|
||||||
|
<view style="margin-bottom: 10px; margin-left: -5px;">
|
||||||
|
<u-checkbox-group
|
||||||
|
v-model="formData.sources"
|
||||||
|
@change="checkboxChange"
|
||||||
|
>
|
||||||
|
<u-checkbox
|
||||||
|
:customStyle="{margin: '7px'}"
|
||||||
|
v-for="(item, index) in checkboxList1"
|
||||||
|
:key="index"
|
||||||
|
:label="item.name"
|
||||||
|
:name="item.value"
|
||||||
|
>
|
||||||
|
</u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
</view>
|
||||||
|
<text style="font-weight: bold; margin-bottom: 5px;">按距离</text>
|
||||||
|
<view style="display: flex; align-items: center;">
|
||||||
|
<u--input
|
||||||
|
placeholder="请输入"
|
||||||
|
border="surround"
|
||||||
|
type="number"
|
||||||
|
v-model="formData.distance"
|
||||||
|
style="width: 50%; margin-top: 5px; margin-right: 10px;"
|
||||||
|
></u--input>
|
||||||
|
<text>(km)</text>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex; position:absolute;bottom:20px;right:20px">
|
||||||
|
<u-button text="重置" class="bottom-btn1"
|
||||||
|
@click="formData = {...formData,sources,distance:1}"></u-button>
|
||||||
|
<u-button text="确认" color="#d9001b" class="bottom-btn2" @click="popConfirm"></u-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import ResList from "./resList.vue"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
stcd:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
popupOpen:false,
|
||||||
|
sources:["SH","SW","QX","SK"],
|
||||||
|
checkboxList1: [{
|
||||||
|
name: '山洪',
|
||||||
|
value: "SH"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '水文',
|
||||||
|
value: "SW"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '气象',
|
||||||
|
value: "QX"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '水库',
|
||||||
|
value: "SK"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
formData:{
|
||||||
|
value:'',
|
||||||
|
sources:["SH","SW","QX","SK"],
|
||||||
|
distance:1,
|
||||||
|
stcd:this.stcd
|
||||||
|
},
|
||||||
|
list:[], //搜索结果
|
||||||
|
saveList:[] //保存搜索结果
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
ResList
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
inputChange(e){
|
||||||
|
console.log("e",e);
|
||||||
|
if(!e) this.list = this.saveList;
|
||||||
|
this.formData={...this.formData,value:e}
|
||||||
|
let filterData = this.list.filter(item => item.stnm.indexOf(e) > -1);
|
||||||
|
this.list = filterData;
|
||||||
|
},
|
||||||
|
checkboxChange(n) {
|
||||||
|
console.log('change', n);
|
||||||
|
this.formData = {...this.formData,sources:n};
|
||||||
|
},
|
||||||
|
popConfirm(){
|
||||||
|
this.popupOpen = false
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
async getList(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.post(
|
||||||
|
"/gunshiApp/xfflood/attResBase/rainBasinDivision/queryNearbyRainStations",{...this.formData}
|
||||||
|
)
|
||||||
|
console.log("data",data);
|
||||||
|
if(data.code == 200){
|
||||||
|
this.list = [...data.data]
|
||||||
|
this.saveList = [...data.data]
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getList()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.zbyq-box{
|
||||||
|
.search-bar{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.content{
|
||||||
|
margin-top: 10px;
|
||||||
|
max-height: 100vh;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottom-btn1{
|
||||||
|
width: 100px;
|
||||||
|
margin-left: 70px;
|
||||||
|
}
|
||||||
|
.bottom-btn2{
|
||||||
|
width: 100px;
|
||||||
|
margin-right: -12px;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,80 @@
|
||||||
|
<template>
|
||||||
|
<view class="container">
|
||||||
|
<u-navbar :title="name" :autoBack="true" :titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}" :height='44' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
|
||||||
|
</u-navbar>
|
||||||
|
<view style="margin-top: 70px; padding: 10px;">
|
||||||
|
<SlTable :tableData="slData" v-if="name == '渗流监测'"></SlTable>
|
||||||
|
<ZwyTable :tableData="zwyData" v-else-if="name == '主坝位移监测'"></ZwyTable>
|
||||||
|
<ZwyTable :tableData="zwyData" v-else-if="name == '溢洪道位移监测'"></ZwyTable>
|
||||||
|
<ZwyTable :tableData="zwyData" v-else-if="name == '副坝位移监测'"></ZwyTable>
|
||||||
|
<ZsyTable :tableData="zsyData" v-else-if="name == '主坝渗压监测'"></ZsyTable>
|
||||||
|
<ZsyTable :tableData="zsyData" v-else-if="name == '灌溉发电洞渗压监测'"></ZsyTable>
|
||||||
|
<ZwyTable :tableData="zwyData" v-else-if="name == '灌溉发电洞变型监测'"></ZwyTable>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import SlTable from "./slTable.vue"
|
||||||
|
import ZwyTable from "./zwyTable.vue"
|
||||||
|
import ZsyTable from "./zsyTable.vue"
|
||||||
|
export default {
|
||||||
|
components:{
|
||||||
|
SlTable,
|
||||||
|
ZwyTable,
|
||||||
|
ZsyTable
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
slData:[], //渗流监测
|
||||||
|
zwyData:[],//主坝位移监测
|
||||||
|
zsyData:[],//主坝渗压监测
|
||||||
|
name:'',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getSlData(){
|
||||||
|
try {
|
||||||
|
const {data} = await uni.$http.get('/gunshiApp/tsg/osmoticPressR/list/value?type=2')
|
||||||
|
if(data.code == 200){
|
||||||
|
this.slData = data.data;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async getZwyData(){
|
||||||
|
try {
|
||||||
|
const {data} = await uni.$http.get('/gunshiApp/tsg/osmoticShiftR/list/value')
|
||||||
|
if(data.code == 200){
|
||||||
|
this.zwyData = data.data;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async getzsyData(){
|
||||||
|
try {
|
||||||
|
const {data} = await uni.$http.get('/gunshiApp/tsg/osmoticPressR/list/value?type=1')
|
||||||
|
if(data.code == 200){
|
||||||
|
this.zsyData = data.data;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getSlData();
|
||||||
|
this.getZwyData();
|
||||||
|
this.getzsyData();
|
||||||
|
},
|
||||||
|
onLoad(options) {
|
||||||
|
this.name=options.name
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,94 @@
|
||||||
|
<template>
|
||||||
|
<div class="table_div">
|
||||||
|
<div class="table_cur">
|
||||||
|
<table style="width:100%;display:block">
|
||||||
|
<tr>
|
||||||
|
<th style="width: 30%;">
|
||||||
|
监测点
|
||||||
|
</th>
|
||||||
|
<th style="width: 40%;">
|
||||||
|
监测时间
|
||||||
|
</th>
|
||||||
|
<th style="width: 30%;">渗流量(L/s)</th>
|
||||||
|
</tr>
|
||||||
|
<!-- style="max-height: 480px; overflow-y: auto" -->
|
||||||
|
<div class="scroll-table">
|
||||||
|
<tr v-for="(item, index) in tableData" :key="index">
|
||||||
|
<td style="width: 30%;">{{item.stationCode}}</td>
|
||||||
|
<td style="width: 40%;">{{simpleData(item.tm)}}</td>
|
||||||
|
<td style="width:30%;">{{ item.value }}</td>
|
||||||
|
</tr>
|
||||||
|
<div style="height:180px"></div>
|
||||||
|
</div>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
tableData:{
|
||||||
|
type:Array,
|
||||||
|
default:[],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
simpleData(tm){
|
||||||
|
return moment(tm).format("MM-DD HH:mm")
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.table_div {
|
||||||
|
height: 100%;
|
||||||
|
max-width: calc(100% - 0px);
|
||||||
|
// max-height: calc(80vh);
|
||||||
|
flex: 1;
|
||||||
|
padding-top: 0px;
|
||||||
|
// overflow-x: scroll;
|
||||||
|
}
|
||||||
|
/*table样式*/
|
||||||
|
.table_cur {
|
||||||
|
width: 100%;
|
||||||
|
empty-cells: show;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.scroll-table{
|
||||||
|
height: calc(55vh - 180px);
|
||||||
|
overflow-y: auto;
|
||||||
|
width:'100%'
|
||||||
|
}
|
||||||
|
.table_cur tr {
|
||||||
|
display: flex;
|
||||||
|
line-height: 75rpx;
|
||||||
|
}
|
||||||
|
.table_cur th {
|
||||||
|
height: 85rpx;
|
||||||
|
color: #3399ef;
|
||||||
|
background: #e1f3ff;
|
||||||
|
font-size: 14px;
|
||||||
|
// font-weight: bold;
|
||||||
|
padding: 0px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur td {
|
||||||
|
height: 65rpx;
|
||||||
|
// border-bottom: 1px solid #d8ddeb;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #2f4056;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
/*table样式 end*/
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,97 @@
|
||||||
|
<template>
|
||||||
|
<div class="table_div">
|
||||||
|
<div class="table_cur">
|
||||||
|
<table style="width:100%;display:block">
|
||||||
|
<tr>
|
||||||
|
<th style="width: 19%;">
|
||||||
|
监测点
|
||||||
|
</th>
|
||||||
|
<th style="width: 30%;">所属断面</th>
|
||||||
|
<th style="width: 26%;">
|
||||||
|
监测时间
|
||||||
|
</th>
|
||||||
|
<th style="width: 25%;">管水位(m)</th>
|
||||||
|
</tr>
|
||||||
|
<!-- style="max-height: 480px; overflow-y: auto" -->
|
||||||
|
<div class="scroll-table">
|
||||||
|
<tr v-for="(item, index) in tableData" :key="index">
|
||||||
|
<td style="width: 19%;">{{item.stationCode}}</td>
|
||||||
|
<td style="width:30%;">{{ item.profileName }}</td>
|
||||||
|
<td style="width: 26%;text-align: center;">{{simpleData(item.tm)}}</td>
|
||||||
|
<td style="width:25%;">{{ item.value }}</td>
|
||||||
|
</tr>
|
||||||
|
<div style="height:180px"></div>
|
||||||
|
</div>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
tableData:{
|
||||||
|
type:Array,
|
||||||
|
default:[],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
simpleData(tm){
|
||||||
|
if(!tm) return ''
|
||||||
|
return moment(tm).format("MM-DD HH:mm")
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.table_div {
|
||||||
|
height: 100%;
|
||||||
|
max-width: calc(100% - 0px);
|
||||||
|
// max-height: calc(80vh);
|
||||||
|
flex: 1;
|
||||||
|
padding-top: 0px;
|
||||||
|
// overflow-x: scroll;
|
||||||
|
}
|
||||||
|
/*table样式*/
|
||||||
|
.table_cur {
|
||||||
|
width: 100%;
|
||||||
|
empty-cells: show;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.scroll-table{
|
||||||
|
height: calc(100vh - 180px);
|
||||||
|
overflow-y: auto;
|
||||||
|
width:'100%'
|
||||||
|
}
|
||||||
|
.table_cur tr {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.table_cur th {
|
||||||
|
height: 50px;
|
||||||
|
color: #3399ef;
|
||||||
|
background: #e1f3ff;
|
||||||
|
font-size: 14px;
|
||||||
|
padding: 0px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: wrap;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
// text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur td {
|
||||||
|
height: 75rpx;
|
||||||
|
// border-bottom: 1px solid #d8ddeb;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #2f4056;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: wrap;
|
||||||
|
// text-align: center !important;
|
||||||
|
}
|
||||||
|
/*table样式 end*/
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,98 @@
|
||||||
|
<template>
|
||||||
|
<div class="table_div">
|
||||||
|
<div class="table_cur">
|
||||||
|
<table style="width:100%;display:block">
|
||||||
|
<tr>
|
||||||
|
<th style="width: 20%;">
|
||||||
|
监测点
|
||||||
|
</th>
|
||||||
|
<th style="width: 20%;">
|
||||||
|
监测时间
|
||||||
|
</th>
|
||||||
|
<th style="width: 20%;">X方向(mm)</th>
|
||||||
|
<th style="width: 20%;">Y方向(mm)</th>
|
||||||
|
<th style="width: 20%;">H方向(mm)</th>
|
||||||
|
</tr>
|
||||||
|
<!-- style="max-height: 480px; overflow-y: auto" -->
|
||||||
|
<div class="scroll-table">
|
||||||
|
<tr v-for="(item, index) in tableData" :key="index">
|
||||||
|
<td style="width: 20%;">{{item.stationCode}}</td>
|
||||||
|
<td style="width: 20%;">{{simpleData(item.tm)}}</td>
|
||||||
|
<td style="width:20%;">{{ item.x }}</td>
|
||||||
|
<td style="width:20%;">{{ item.y }}</td>
|
||||||
|
<td style="width:20%;">{{ item.h }}</td>
|
||||||
|
</tr>
|
||||||
|
<div style="height:180px"></div>
|
||||||
|
</div>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
tableData:{
|
||||||
|
type:Array,
|
||||||
|
default:[],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
simpleData(tm){
|
||||||
|
if(!tm) return ''
|
||||||
|
return moment(tm).format("MM-DD HH:mm")
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.table_div {
|
||||||
|
height: 100%;
|
||||||
|
max-width: calc(100% - 0px);
|
||||||
|
// max-height: calc(80vh);
|
||||||
|
flex: 1;
|
||||||
|
padding-top: 0px;
|
||||||
|
// overflow-x: scroll;
|
||||||
|
}
|
||||||
|
/*table样式*/
|
||||||
|
.table_cur {
|
||||||
|
width: 100%;
|
||||||
|
empty-cells: show;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.scroll-table{
|
||||||
|
height: calc(100vh - 180px);
|
||||||
|
overflow-y: auto;
|
||||||
|
width:'100%'
|
||||||
|
}
|
||||||
|
.table_cur tr {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.table_cur th {
|
||||||
|
color: #3399ef;
|
||||||
|
background: #e1f3ff;
|
||||||
|
font-size: 14px;
|
||||||
|
padding: 0px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: wrap;
|
||||||
|
text-align: center !important;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur td {
|
||||||
|
height: 75rpx;
|
||||||
|
// border-bottom: 1px solid #d8ddeb;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #2f4056;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: wrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
/*table样式 end*/
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,261 @@
|
||||||
|
|
||||||
|
import echarts from 'echarts/lib/echarts';
|
||||||
|
|
||||||
|
export default function DrpOption(
|
||||||
|
data,
|
||||||
|
afsltdz,
|
||||||
|
flLowLimLev,
|
||||||
|
desFloodLev,
|
||||||
|
calFloodLev) {
|
||||||
|
const maxVal = Math.max(...data.map(obj => obj.drp))
|
||||||
|
const maxSw = Math.ceil(Math.max(...data.map(obj => obj.rz)))
|
||||||
|
const minSw = Math.floor(Math.min(...data.map(obj => obj.rz)))
|
||||||
|
const maxKr = Math.max(...data.map(obj => obj.w))
|
||||||
|
const minKr = Math.min(...data.map(obj => obj.w))
|
||||||
|
console.log('desFloodLev',desFloodLev);
|
||||||
|
let eopts = {
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis',
|
||||||
|
},
|
||||||
|
grid: [
|
||||||
|
{
|
||||||
|
top: "13%",
|
||||||
|
left: "10%",
|
||||||
|
right: "8%",
|
||||||
|
width: '80%',
|
||||||
|
height: '35%'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
bottom: "5%",
|
||||||
|
left: "10%",
|
||||||
|
right: "8%",
|
||||||
|
width: '80%',
|
||||||
|
height: '35%'
|
||||||
|
},
|
||||||
|
],
|
||||||
|
legend: {
|
||||||
|
// 显示图例
|
||||||
|
show: true,
|
||||||
|
// 图例的位置
|
||||||
|
data: ["校核水位", '设计水位', '汛限水位', '降雨量', '水位', '库容'],
|
||||||
|
left:0,
|
||||||
|
right:0,
|
||||||
|
itemWidth:10,
|
||||||
|
padding:0
|
||||||
|
},
|
||||||
|
xAxis: [
|
||||||
|
{
|
||||||
|
gridIndex: 0,
|
||||||
|
type: 'category',
|
||||||
|
data: data.map(o => o.tm).reverse(),
|
||||||
|
|
||||||
|
splitLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.5
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
gridIndex: 1,
|
||||||
|
type: 'category',
|
||||||
|
data: data.map(o => o.tm.substr("2020-".length,11)),
|
||||||
|
inverse: true,
|
||||||
|
splitLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
formatter: val => val.substr('2020-'.length, 11)
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.5
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
yAxis: [
|
||||||
|
{
|
||||||
|
inverse: true,
|
||||||
|
gridIndex: 0,
|
||||||
|
type: 'value',
|
||||||
|
position: 'left',
|
||||||
|
name: '降雨量(mm)',
|
||||||
|
nameLocation: 'start',
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dotted'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
min: 0,
|
||||||
|
max: maxVal
|
||||||
|
},
|
||||||
|
{
|
||||||
|
gridIndex: 1,
|
||||||
|
type: 'value',
|
||||||
|
position: 'left',
|
||||||
|
name: '水位(m)',
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dotted'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
min: minSw,
|
||||||
|
max: maxSw
|
||||||
|
},
|
||||||
|
{
|
||||||
|
gridIndex: 1,
|
||||||
|
type: 'value',
|
||||||
|
position: 'right',
|
||||||
|
name: '库容(万m³)',
|
||||||
|
splitLine: {
|
||||||
|
show: false,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dotted'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
min: minKr,
|
||||||
|
max: maxKr
|
||||||
|
}
|
||||||
|
],
|
||||||
|
}
|
||||||
|
let chartData = {
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
xAxisIndex: 1,
|
||||||
|
yAxisIndex: 1,
|
||||||
|
name: '校核水位',
|
||||||
|
type: 'line',
|
||||||
|
color: '#D9001B',
|
||||||
|
lineStyle: {
|
||||||
|
type: 'dashed'
|
||||||
|
},
|
||||||
|
data: data.map(o => calFloodLev),
|
||||||
|
symbol: 'none' // 设置标记点为'none'，即去掉圆点
|
||||||
|
},
|
||||||
|
{
|
||||||
|
xAxisIndex: 1,
|
||||||
|
yAxisIndex: 1,
|
||||||
|
name: '设计水位',
|
||||||
|
type: 'line',
|
||||||
|
color: '#F59A23',
|
||||||
|
data: data.map(o => desFloodLev),
|
||||||
|
lineStyle: {
|
||||||
|
type: 'dashed'
|
||||||
|
},
|
||||||
|
symbol: 'none' // 设置标记点为'none'，即去掉圆点
|
||||||
|
},
|
||||||
|
{
|
||||||
|
xAxisIndex: 1,
|
||||||
|
yAxisIndex: 1,
|
||||||
|
name: '汛限水位',
|
||||||
|
type: 'line',
|
||||||
|
color: '#FDDC9F',
|
||||||
|
data: data.map(o => {
|
||||||
|
return flLowLimLev
|
||||||
|
}),
|
||||||
|
lineStyle: {
|
||||||
|
type: 'dashed'
|
||||||
|
},
|
||||||
|
symbol: 'none' // 设置标记点为'none'，即去掉圆点
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '降雨量',
|
||||||
|
type: 'bar',
|
||||||
|
barWidth: '60%',
|
||||||
|
data: data.map(o => o.drp).reverse(),
|
||||||
|
itemStyle: {
|
||||||
|
color: '#007AFD'
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
show: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
xAxisIndex: 1,
|
||||||
|
yAxisIndex: 1,
|
||||||
|
name: '水位',
|
||||||
|
type: 'line',
|
||||||
|
symbol: 'none',
|
||||||
|
color: '#0AE0B5',
|
||||||
|
label: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
data: data.map(o => o.rz ? o.rz.toFixed(2):null )
|
||||||
|
},
|
||||||
|
{
|
||||||
|
xAxisIndex: 1,
|
||||||
|
yAxisIndex: 2,
|
||||||
|
name: '库容',
|
||||||
|
type: 'line',
|
||||||
|
color: '#007AFD',
|
||||||
|
symbol: 'none',
|
||||||
|
showSymbol: false,
|
||||||
|
label: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
data: data.map(o => o.w)
|
||||||
|
}
|
||||||
|
],
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
eopts,
|
||||||
|
chartData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -0,0 +1,157 @@
|
||||||
|
<template>
|
||||||
|
<view class="jcsj-box">
|
||||||
|
<view class="time-ranger">
|
||||||
|
<view class="start-time">
|
||||||
|
<text>开始时间</text>
|
||||||
|
<text @click="showTime=true" style="margin-left:10%;color:#3399ef">{{stm}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="end-time">
|
||||||
|
<text>结束时间</text>
|
||||||
|
<text @click="showTime1=true" style="margin:0 10%;color:#3399ef">{{etm}}</text>
|
||||||
|
<view class="search-btn" @click="searchHandle">
|
||||||
|
搜索
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- <uni-datetime-picker type="datetimerange" v-model="tm" @change="handleRanger"></uni-datetime-picker>
|
||||||
|
<view class="search-btn" @click="searchHandle">
|
||||||
|
搜索
|
||||||
|
</view> -->
|
||||||
|
</view>
|
||||||
|
<!-- <view class="" style="width: 100%; height: 3px; background-color: #dfdfdf; margin-bottom: 2px;">
|
||||||
|
|
||||||
|
" </view> -->
|
||||||
|
<view style="text-align: right; margin-bottom: -15px;">
|
||||||
|
<text :class="{'active':selactOne == 0}" @click="selactOne = 0" style="display: inline-block; padding: 2px 20px; text-align: center; border: 1px solid #dfdfdf;">图</text>
|
||||||
|
<text :class="{'active':selactOne == 1}" @click="selactOne = 1" style="display: inline-block; padding: 2px 20px; text-align: center; border: 1px solid #dfdfdf;">表</text>
|
||||||
|
</view>
|
||||||
|
<view class="jcsj-content">
|
||||||
|
<view class="jcsj-charts" v-if="selactOne == 0">
|
||||||
|
<qiun-data-charts :chartData="chartData.chartData" :echartsApp="true" :eopts="chartData.eopts" />
|
||||||
|
</view>
|
||||||
|
<view style="margin-top: 20px;" v-if="selactOne == 1">
|
||||||
|
<JcsjTable :tableData="tableData" />
|
||||||
|
</view>
|
||||||
|
<view style="height:300px" v-if="selactOne == 0"></view>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showTime"
|
||||||
|
v-model="startTime"
|
||||||
|
mode="datetime"
|
||||||
|
@confirm="handleStartTime"
|
||||||
|
@cancel="showTime=false"
|
||||||
|
></u-datetime-picker>
|
||||||
|
<u-datetime-picker
|
||||||
|
:show="showTime1"
|
||||||
|
v-model="endTime"
|
||||||
|
mode="datetime"
|
||||||
|
@confirm="handleEndTime"
|
||||||
|
@cancel="showTime1=false"
|
||||||
|
></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
import JcsjTable from "./jcsjTable"
|
||||||
|
import drpOption from "./chartOption.js"
|
||||||
|
const stm = moment().subtract(7, 'days').add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm");
|
||||||
|
const etm = moment().add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm");
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
stcd:String,
|
||||||
|
source:String,
|
||||||
|
wrz:String,
|
||||||
|
grz:String,
|
||||||
|
afsltdz:String,
|
||||||
|
flLowLimLev:String,
|
||||||
|
desFloodLev:String,
|
||||||
|
calFloodLev:String,
|
||||||
|
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
startTime:stm,
|
||||||
|
endTime:etm,
|
||||||
|
stm,
|
||||||
|
etm,
|
||||||
|
showTime:false,
|
||||||
|
showTime1:false,
|
||||||
|
tableData:[],
|
||||||
|
chartData: {},
|
||||||
|
rainChartData:[],
|
||||||
|
selactOne:0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
JcsjTable
|
||||||
|
},
|
||||||
|
watch:{
|
||||||
|
rainChartData(newV, oldV){
|
||||||
|
this.chartData = {...drpOption(newV,this.afsltdz,this.flLowLimLev,this.desFloodLev,this.calFloodLev)}
|
||||||
|
this.tableData = [...newV]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleStartTime(e){
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
this.stm = time
|
||||||
|
this.showTime = false
|
||||||
|
},
|
||||||
|
handleEndTime(e){
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
this.etm = time;
|
||||||
|
this.showTime1 = false
|
||||||
|
},
|
||||||
|
handleRanger(e){
|
||||||
|
console.log(e);
|
||||||
|
this.tm = [...e]
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
async getJcsjData(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.post(
|
||||||
|
"/gunshiApp/xfflood/reservoir/water/monitor/data",
|
||||||
|
{
|
||||||
|
stcd:this.stcd,
|
||||||
|
stm:moment(this.stm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
etm:moment(this.etm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
source:this.source
|
||||||
|
})
|
||||||
|
if(data.code == 200){
|
||||||
|
this.rainChartData = [...data.data];
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
searchHandle(){
|
||||||
|
this.getJcsjData();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getJcsjData();
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.jcsj-box{
|
||||||
|
.jcsj-content{
|
||||||
|
max-height:100vh;
|
||||||
|
width: 100%;
|
||||||
|
overflow-y:auto
|
||||||
|
}
|
||||||
|
.jcsj-charts{
|
||||||
|
// width:103vw;
|
||||||
|
height: 500px;
|
||||||
|
overflow-y: auto;
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
.active{
|
||||||
|
border-color: #68bbff !important;
|
||||||
|
color: #68bbff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,126 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
|
||||||
|
<div class="table_div" v-if="tableData.length !=0">
|
||||||
|
<div class="table_cur">
|
||||||
|
<table style="width:100%;display:block">
|
||||||
|
<tr>
|
||||||
|
<th style="width: 40px;">
|
||||||
|
序号
|
||||||
|
</th>
|
||||||
|
<th style="width: 80px">时间</th>
|
||||||
|
<th style="width: 80px;">
|
||||||
|
雨量(mm)
|
||||||
|
</th>
|
||||||
|
<th style="width: 90px;">
|
||||||
|
水位(m)
|
||||||
|
</th>
|
||||||
|
<th style="width: 90px; position: relative;">
|
||||||
|
<view>
|
||||||
|
库容(万m³)
|
||||||
|
<!-- <text style="position: absolute; bottom:-10px; left: 20px;">(m³/s)</text> -->
|
||||||
|
</view>
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
<!-- style="max-height: 480px; overflow-y: auto" -->
|
||||||
|
<div class="scroll-table">
|
||||||
|
<tr v-for="(item, index) in newList" :key="index">
|
||||||
|
<td style="width: 30px">{{ index + 1 }}</td>
|
||||||
|
<td style="width: 80px;">{{ item.tm }}</td>
|
||||||
|
<td style="width: 80px">{{ item.drp }}</td>
|
||||||
|
<td style="width: 100px">{{ item.rz ? item.rz.toFixed(2) : "-" }}</td>
|
||||||
|
<td style="width: 80px">{{ item.w ? item.w : "-" }}</td>
|
||||||
|
</tr>
|
||||||
|
<div style="height:180px"></div>
|
||||||
|
</div>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<view
|
||||||
|
style="display: flex;align-items: center;justify-content: center;background-color: #fff;"
|
||||||
|
v-else>
|
||||||
|
<image src="../../../static/empty.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
tableData: {
|
||||||
|
type: Array,
|
||||||
|
default: [],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
newList() {
|
||||||
|
if (this.tableData.length) {
|
||||||
|
return this.tableData.map(item => ({
|
||||||
|
...item,
|
||||||
|
tm: moment(item.tm).format("MM-DD HH:mm")
|
||||||
|
}))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.table_div {
|
||||||
|
height: 100%;
|
||||||
|
max-width: calc(100% - 0px);
|
||||||
|
max-height: calc(100vh);
|
||||||
|
flex: 1;
|
||||||
|
padding-top: 0px;
|
||||||
|
overflow-x: scroll;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*table样式*/
|
||||||
|
.table_cur {
|
||||||
|
width: 100%;
|
||||||
|
empty-cells: show;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scroll-table {
|
||||||
|
height: calc(100vh - 180px);
|
||||||
|
overflow-y: auto;
|
||||||
|
width: '100%'
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur tr {
|
||||||
|
display: flex;
|
||||||
|
line-height: 75rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur th {
|
||||||
|
height: 85rpx;
|
||||||
|
color: #3399ef;
|
||||||
|
background: #e1f3ff;
|
||||||
|
font-size: 14px;
|
||||||
|
// font-weight: bold;
|
||||||
|
padding: 0px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur td {
|
||||||
|
height: 65rpx;
|
||||||
|
// border-bottom: 1px solid #d8ddeb;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #2f4056;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*table样式 end*/
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,161 @@
|
||||||
|
<template>
|
||||||
|
<view class="rain-detail-box">
|
||||||
|
<u-status-bar></u-status-bar>
|
||||||
|
<view class="nav-bar">
|
||||||
|
<u-icon name="arrow-left" color="#000" size="20" @click="backTo" style="margin-left:10px"></u-icon>
|
||||||
|
<view class="title">
|
||||||
|
{{stnm}}
|
||||||
|
<text style="font-size:12px;margin-left:5px">{{sta}}({{rain}})</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="tab-bar">
|
||||||
|
<uni-swiper-dot :info="Array(2).fill(0)" :current="current" field="content" :dotsStyles="dotsStyles">
|
||||||
|
<swiper class="swiper-box" style="height: 30px;" @change="change">
|
||||||
|
<swiper-item >
|
||||||
|
<view style="display: flex;justify-content: space-between;">
|
||||||
|
<view class="jcsj" @click="activeOne = 0" :class="{'active':activeOne == 0}">
|
||||||
|
监测数据
|
||||||
|
</view>
|
||||||
|
<!-- style="margin: 0 25px;" -->
|
||||||
|
<view class="tjsj" @click="activeOne = 1" :class="{'active':activeOne == 1}" style="margin: 0 4%">
|
||||||
|
统计数据
|
||||||
|
</view>
|
||||||
|
<!-- style="margin: 0 25px 0 0;" -->
|
||||||
|
<view class="zrtx" @click="activeOne = 2" :class="{'active':activeOne == 2}" >
|
||||||
|
责任体系
|
||||||
|
</view>
|
||||||
|
<view class="txjc" @click="activeOne = 3" :class="{'active':activeOne == 3}" style="margin-left:4%">
|
||||||
|
图像监测
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
<swiper-item >
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view class="spjk" @click="activeOne = 4" :class="{'active':activeOne == 4}" style="margin:0 4%">
|
||||||
|
视频监控
|
||||||
|
</view>
|
||||||
|
<view class="zbyq" @click="activeOne = 5" :class="{'active':activeOne == 5}" >
|
||||||
|
周边雨情
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</swiper>
|
||||||
|
</uni-swiper-dot>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="rain-detail-content">
|
||||||
|
<Jcsj :stcd="stcd" :source="source" :afsltdz="afsltdz" :flLowLimLev="flLowLimLev" :desFloodLev="desFloodLev" :calFloodLev="calFloodLev" v-if="activeOne == 0"/>
|
||||||
|
<Tjsj :stcd="stcd" :source="source" v-else-if="activeOne == 1"/>
|
||||||
|
<Zrtx :stcd="stcd" :source="source" :resCode="resCode" v-else-if="activeOne == 2"/>
|
||||||
|
<Txjc :resCode="resCode" :source="source" v-else-if="activeOne == 3"/>
|
||||||
|
<Spjk :stcd="stcd" :source="source" v-else-if="activeOne == 4"/>
|
||||||
|
<Zbyq :stcd="stcd" v-else-if="activeOne == 5"/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Jcsj from "./jcsj/jcsj.vue"
|
||||||
|
import Tjsj from "./tjsj/tjsj.vue"
|
||||||
|
import Zbyq from "./zbyq/zbyq.vue"
|
||||||
|
import Spjk from "./spjk/spjk.vue"
|
||||||
|
import Zrtx from "./zrtx/zrtx.vue"
|
||||||
|
import Txjc from "./txjc/txjc.vue"
|
||||||
|
const staType = {
|
||||||
|
MM: '气象站',PP: '雨量站',RR: '水库水文站',ZZ: '河道水位站',ZQ:"河道水文站"
|
||||||
|
}
|
||||||
|
const rainType = {'SH':'山洪','SW':'水文','QX':'气象','SK':'水库'}
|
||||||
|
export default {
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
activeOne:0,
|
||||||
|
stcd:'',
|
||||||
|
stnm:'',
|
||||||
|
source:'',
|
||||||
|
wrz:'',
|
||||||
|
grz:'',
|
||||||
|
calFloodLev:'',
|
||||||
|
desFloodLev:'',
|
||||||
|
flLowLimLev:'',
|
||||||
|
afsltdz:'',
|
||||||
|
resCode:'',
|
||||||
|
current:0,
|
||||||
|
dotsStyles:{
|
||||||
|
bottom:0,
|
||||||
|
selectedBackgroundColor:"#d9001b"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
Jcsj,
|
||||||
|
Tjsj,
|
||||||
|
Zbyq,
|
||||||
|
Spjk,
|
||||||
|
Zrtx,
|
||||||
|
Txjc
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
backTo(){
|
||||||
|
uni.navigateBack({delta:1})
|
||||||
|
},
|
||||||
|
change(e) {
|
||||||
|
console.log(e.detail.current);
|
||||||
|
this.current = e.detail.current;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(option) {
|
||||||
|
this.stcd = option.stcd;
|
||||||
|
this.stnm = option.stnm;
|
||||||
|
this.source = option.source;
|
||||||
|
this.grz = option.grz;
|
||||||
|
this.wrz = option.wrz;
|
||||||
|
this.afsltdz = option.afsltdz;
|
||||||
|
this.calFloodLev = option.calFloodLev;
|
||||||
|
this.flLowLimLev = option.flLowLimLev;
|
||||||
|
this.desFloodLev = option.desFloodLev;
|
||||||
|
this.resCode = option.resCode;
|
||||||
|
this.sta = staType[option.sttp];
|
||||||
|
this.rain = rainType[option.source];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.rain-detail-box{
|
||||||
|
height: 100vh;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
.nav-bar{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 44px;
|
||||||
|
// margin-top: 30px;
|
||||||
|
// padding-top: 20px;
|
||||||
|
// padding-bottom: 10px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
// box-shadow: 0 5px 10px -8px #dfdfdf inset;
|
||||||
|
}
|
||||||
|
.title{
|
||||||
|
flex:1;
|
||||||
|
text-align: center;
|
||||||
|
margin-right: 18px;
|
||||||
|
font-size: 18px;
|
||||||
|
}
|
||||||
|
.tab-bar{
|
||||||
|
// width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 5px 30px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
// overflow-x: auto;
|
||||||
|
}
|
||||||
|
.active{
|
||||||
|
color: #39a6ff;
|
||||||
|
}
|
||||||
|
.rain-detail-content{
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,131 @@
|
||||||
|
<template>
|
||||||
|
<view class="spjk-box">
|
||||||
|
<view class="select-bar">
|
||||||
|
<uni-data-select
|
||||||
|
v-model="value"
|
||||||
|
:localdata="list"
|
||||||
|
@change="change"
|
||||||
|
:clear="false"
|
||||||
|
>
|
||||||
|
</uni-data-select>
|
||||||
|
</view>
|
||||||
|
<view class="video-box" >
|
||||||
|
<iframe :src="webURL" :class="{'normal': show == 0,'active': show == 1}" frameborder="0" ref="videoFrame" :allowfullscreen="true"></iframe>
|
||||||
|
</view>
|
||||||
|
<!-- <u-overlay :show="show" @click="show = false">
|
||||||
|
<view class="warp" style="position:relative;">
|
||||||
|
<view class="rect" >
|
||||||
|
<iframe :src="webURL" style="height: 100vh;width:100vw" frameborder="0" ref="videoFrame"></iframe>
|
||||||
|
<image src="/static/images/m1.png" style="position:absolute; bottom:0,right:0"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-overlay> -->
|
||||||
|
<!-- <button @click="handler">全屏</button> -->
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
stcd:String,
|
||||||
|
source:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
value: "",
|
||||||
|
list:[],
|
||||||
|
webURL:'',
|
||||||
|
show:0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
receiveRenderData(e){
|
||||||
|
//接收的值
|
||||||
|
console.log("3333",e.data)
|
||||||
|
this.show = e.data
|
||||||
|
},
|
||||||
|
async getList(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.get(
|
||||||
|
`/gunshiApp/xfflood/stbprp/cctv/listByStcd/${this.stcd}`)
|
||||||
|
if(data.code == 200){
|
||||||
|
let newData = data.data.map(item => ({...item,value:item.camId,text:item.name}))
|
||||||
|
this.list = [...newData];
|
||||||
|
this.value = newData[0].value
|
||||||
|
this.getVideoSrc(newData[0].camId)
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
async getVideoSrc(id){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.get(
|
||||||
|
`/gunshiApp/xfflood/xfCctvB/preview/${id}`)
|
||||||
|
if(data.code == 200){
|
||||||
|
this.webURL="./static/h5Player/webplayer.html?cameraIndexCode="+id+"&cameraUrl="+data.data
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
change(e) {
|
||||||
|
console.log("e:", e);
|
||||||
|
this.getVideoSrc(e)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script module="renderModal" lang="renderjs">
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
dom: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.dom = document.getElementById('iframe')
|
||||||
|
// 接收iframe传过来的值
|
||||||
|
window.addEventListener('message', (e)=> {
|
||||||
|
var data = e.data;
|
||||||
|
this.emitData(data)
|
||||||
|
});
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
emitData(e) {
|
||||||
|
this.$ownerInstance.callMethod('receiveRenderData',e)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.spjk-box{
|
||||||
|
.select-bar{
|
||||||
|
margin: 10px 15px;
|
||||||
|
}
|
||||||
|
.video-box{
|
||||||
|
.normal{
|
||||||
|
position: absolute;
|
||||||
|
// width: 370px;
|
||||||
|
// height: 300px;
|
||||||
|
top: 170px;
|
||||||
|
left: 0;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
.active{
|
||||||
|
position: absolute;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
top: -30px;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,149 @@
|
||||||
|
<template>
|
||||||
|
<view class="tjsj-box">
|
||||||
|
<uni-row class="tjsj-row" :width="700">
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近1h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h1||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近3h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h3||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近6h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h6||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近12h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h12||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近24h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h24||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">近48h雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.h48||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">今日雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.today||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">昨日雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.yesterdayDrp||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">本月雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.monthDrp||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">本年雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.yearDrp||0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">本年降雨天数</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.yearDrpDay||0}}/{{days}}</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row" >本年最大日雨量(mm)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row" style="display: flex; justify-content: center;">
|
||||||
|
<text>{{tableData.maxDrp||0}}</text>
|
||||||
|
<text style="color: #E69224;">({{maxDrpTime}})</text>
|
||||||
|
</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row">24h水位变幅(m)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row">{{tableData.rzDiff > 0 ? "+" :"" }}{{tableData.rzDiff?tableData.rzDiff.toFixed(2) : 0}}</view>
|
||||||
|
</uni-col> <uni-col :span="12">
|
||||||
|
<view class="first-row" style="border-bottom: 1px solid #dfdfdf;">本年最高水位(m)</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="second-row" style="border-bottom: 1px solid #dfdfdf;">{{tableData.maxRz ? tableData.maxRz.toFixed(2) :0}}</view>
|
||||||
|
</uni-col>
|
||||||
|
</uni-row>
|
||||||
|
<view style="height:150px"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tableData:{},
|
||||||
|
days:moment().diff(moment().startOf('year'),'days')+1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed:{
|
||||||
|
maxDrpTime(){
|
||||||
|
if(this.tableData.maxDrpTime){
|
||||||
|
return moment(this.tableData.maxDrpTime).format("YYYY-MM-DD")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getTableData(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.get(
|
||||||
|
"/gunshiApp/tsg/reservoir/water/detail?stcd=716164061")
|
||||||
|
if(data.code == 200){
|
||||||
|
this.tableData = {...data.data};
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getTableData()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.tjsj-box{
|
||||||
|
max-height: 100vh;
|
||||||
|
.tjsj-row{
|
||||||
|
.first-row{
|
||||||
|
line-height: 40px;
|
||||||
|
text-align: center;
|
||||||
|
border-top: 1px solid #dfdfdf;
|
||||||
|
border-left: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
.second-row{
|
||||||
|
line-height: 40px;
|
||||||
|
text-align: center;
|
||||||
|
border-top: 1px solid #dfdfdf;
|
||||||
|
border-left: 1px solid #dfdfdf;
|
||||||
|
border-right: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,120 @@
|
||||||
|
<template>
|
||||||
|
<view class="txjc-box">
|
||||||
|
<view class="time-ranger">
|
||||||
|
<uni-datetime-picker type="datetimerange" v-model="tm" @change="handleRanger"></uni-datetime-picker>
|
||||||
|
<view class="search-btn" @click="searchHandle">
|
||||||
|
搜索
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="pic-box" style="margin-top: 20px; position: relative; height: 800px;">
|
||||||
|
<!-- <u-album :urls="list" singleSize="360" rowCount="1"></u-album> -->
|
||||||
|
<u-image :src="list[current]" width="380" height="400" mode="scaleToFill" :lazy-load="true" @click="previewImage"></u-image>
|
||||||
|
<image src="../../../static/images/icon.png" @click="handleLeft" class="icon-left"></image>
|
||||||
|
<image src="../../../static/images/icon.png" @click="handleRight" class="icon-right"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
const stm = moment().subtract(7, 'days').add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm:ss");
|
||||||
|
const etm = moment().add(1, 'hour').set({minute: 0, second: 0}).format("YYYY-MM-DD HH:mm:ss");
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
source:String,
|
||||||
|
resCode:String,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tm:[stm,etm],
|
||||||
|
list:[],
|
||||||
|
current:0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleLeft(){
|
||||||
|
if(this.current > 0){
|
||||||
|
this.current -= 1;
|
||||||
|
}else{
|
||||||
|
uni.$showMsg("已经是第一张图片了")
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleRight(){
|
||||||
|
if(this.list.length > this.current){
|
||||||
|
this.current += 1;
|
||||||
|
}else{
|
||||||
|
uni.$showMsg("已经是最后一张图片了")
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 预览图片
|
||||||
|
previewImage(){
|
||||||
|
uni.previewImage({
|
||||||
|
urls:this.list
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleRanger(e){
|
||||||
|
this.tm = [...e]
|
||||||
|
},
|
||||||
|
// 搜索
|
||||||
|
searchHandle(){
|
||||||
|
this.getData()
|
||||||
|
|
||||||
|
},
|
||||||
|
async getData(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.post(
|
||||||
|
"/gunshiApp/xfflood/river/water/image/info",
|
||||||
|
{
|
||||||
|
source:this.source,
|
||||||
|
resCode:this.resCode,
|
||||||
|
stm:this.tm[0],
|
||||||
|
etm:this.tm[1],
|
||||||
|
"pageSo": {
|
||||||
|
"pageSize": 10,
|
||||||
|
"pageNumber": 1
|
||||||
|
}
|
||||||
|
})
|
||||||
|
if(data.code == 200){
|
||||||
|
let newList = data.data.records.map(item =>item.imgPath)
|
||||||
|
this.list = [...newList]
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getData()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.txjc-box{
|
||||||
|
.time-ranger{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
.search-btn{
|
||||||
|
margin: 3px 0 0 5px;
|
||||||
|
color: #3399ef;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.icon-left{
|
||||||
|
position: absolute;
|
||||||
|
top: 23%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
left: 0;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
.icon-right{
|
||||||
|
position: absolute;
|
||||||
|
top: 23%;
|
||||||
|
transform: translateY(-50%) rotate(-180deg);
|
||||||
|
right: 0;
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,87 @@
|
||||||
|
<template>
|
||||||
|
<view class="list-box">
|
||||||
|
<uni-row class="list-row" >
|
||||||
|
<uni-col :span="12">
|
||||||
|
<view class="first-row" style="margin-left: 10px;">
|
||||||
|
<text style="display: inline-block; margin-bottom: 10px; font-weight: bold;">{{info.stnm}}</text>
|
||||||
|
<view>
|
||||||
|
<text style="margin-right: 60px; color: #aaaaaa;">{{sttype[info.source]}}</text>
|
||||||
|
<text style="color: #aaaaaa;">{{info.distance ? info.distance.toFixed(2) : 0}}km</text>
|
||||||
|
</view>
|
||||||
|
<text style="color: #aaaaaa;">{{info.tm}}</text>
|
||||||
|
</view>
|
||||||
|
</uni-col>
|
||||||
|
<uni-col :span="12" >
|
||||||
|
<view class="second-row" style="border: 1px solid #dfdfdf; font-size: 12px;border-bottom: 1px solid #dfdfdf;">
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex:0.5; background-color: #e1f3ff; border-right: 1px solid #dfdfdf; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
1h(mm)
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; background-color: #e1f3ff;text-align: center; border-bottom:1px solid #dfdfdf" >
|
||||||
|
3h(mm)
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex: 0.5; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
{{info.h1}}
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
{{info.h3}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex:0.5; background-color: #e1f3ff; border-right: 1px solid #dfdfdf; text-align: center; border-bottom:1px solid #dfdfdf">
|
||||||
|
6h(mm)
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; background-color: #e1f3ff;text-align: center; border-bottom:1px solid #dfdfdf" >
|
||||||
|
24h(mm)
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;">
|
||||||
|
<view style="flex: 0.5; text-align: center; border-right: 1px solid #dfdfdf;">
|
||||||
|
{{info.h6}}
|
||||||
|
</view>
|
||||||
|
<view style="flex: 0.5; text-align: center; ">
|
||||||
|
{{info.h24}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-col>
|
||||||
|
</uni-row>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
info:Object,
|
||||||
|
default:{}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
sttype: {
|
||||||
|
"SH": '山洪',
|
||||||
|
"SW": '水文',
|
||||||
|
"QX": '气象',
|
||||||
|
"SK": '水库',
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.list-box{
|
||||||
|
.list-row{
|
||||||
|
padding-bottom: 3px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
.second-row{
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,166 @@
|
||||||
|
<template>
|
||||||
|
<view class="zbyq-box">
|
||||||
|
<view class="search-bar">
|
||||||
|
<u-search
|
||||||
|
shape="square"
|
||||||
|
:clearabled="true"
|
||||||
|
:showAction="false"
|
||||||
|
placeholder="请输入站点"
|
||||||
|
height="40px"
|
||||||
|
@change="inputChange"
|
||||||
|
v-model="formData.value"
|
||||||
|
></u-search>
|
||||||
|
<image
|
||||||
|
src="../../../static/images/filter.png"
|
||||||
|
style="width: 20px; height: 20px; margin-right: 10px; margin-left: 10px;"
|
||||||
|
@click="popupOpen = true"
|
||||||
|
>
|
||||||
|
</image>
|
||||||
|
</view>
|
||||||
|
<view class="content">
|
||||||
|
<view v-for="(item,index) in list" :key="index" style="margin-bottom: 5px;">
|
||||||
|
<ResList :info="item" />
|
||||||
|
</view>
|
||||||
|
<view style="height:300px"></view>
|
||||||
|
</view>
|
||||||
|
<u-popup :show="popupOpen" mode="right" @close="popupOpen=false" >
|
||||||
|
<view style="padding: 30px 20px;">
|
||||||
|
<text style="font-weight: bold;">按类型</text>
|
||||||
|
<view style="margin-bottom: 10px; margin-left: -5px;">
|
||||||
|
<u-checkbox-group
|
||||||
|
v-model="formData.sources"
|
||||||
|
@change="checkboxChange"
|
||||||
|
>
|
||||||
|
<u-checkbox
|
||||||
|
:customStyle="{margin: '7px'}"
|
||||||
|
v-for="(item, index) in checkboxList1"
|
||||||
|
:key="index"
|
||||||
|
:label="item.name"
|
||||||
|
:name="item.value"
|
||||||
|
>
|
||||||
|
</u-checkbox>
|
||||||
|
</u-checkbox-group>
|
||||||
|
</view>
|
||||||
|
<text style="font-weight: bold; margin-bottom: 5px;">按距离</text>
|
||||||
|
<view style="display: flex; align-items: center;">
|
||||||
|
<u--input
|
||||||
|
placeholder="请输入"
|
||||||
|
border="surround"
|
||||||
|
type="number"
|
||||||
|
v-model="formData.distance"
|
||||||
|
style="width: 50%; margin-top: 5px; margin-right: 10px;"
|
||||||
|
></u--input>
|
||||||
|
<text>(km)</text>
|
||||||
|
</view>
|
||||||
|
<view style="display: flex; position:absolute;bottom:20px;right:20px">
|
||||||
|
<u-button text="重置" class="bottom-btn1"
|
||||||
|
@click="formData = {...formData,sources,distance:1}"></u-button>
|
||||||
|
<u-button text="确认" color="#d9001b" class="bottom-btn2" @click="popConfirm"></u-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import ResList from "./resList.vue"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
stcd:String,
|
||||||
|
default:''
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
popupOpen:false,
|
||||||
|
sources:["SH","SW","QX","SK"],
|
||||||
|
checkboxList1: [{
|
||||||
|
name: '山洪',
|
||||||
|
value: "SH"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '水文',
|
||||||
|
value: "SW"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '气象',
|
||||||
|
value: "QX"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '水库',
|
||||||
|
value: "SK"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
formData:{
|
||||||
|
value:'',
|
||||||
|
sources:["SH","SW","QX","SK"],
|
||||||
|
distance:1,
|
||||||
|
stcd:this.stcd
|
||||||
|
},
|
||||||
|
list:[], //搜索结果
|
||||||
|
saveList:[] //保存搜索结果
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
ResList
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
inputChange(e){
|
||||||
|
console.log("e",e);
|
||||||
|
if(!e) this.list = this.saveList;
|
||||||
|
this.formData={...this.formData,value:e}
|
||||||
|
let filterData = this.list.filter(item => item.stnm.indexOf(e) > -1);
|
||||||
|
this.list = filterData;
|
||||||
|
},
|
||||||
|
checkboxChange(n) {
|
||||||
|
console.log('change', n);
|
||||||
|
this.formData = {...this.formData,sources:n};
|
||||||
|
},
|
||||||
|
popConfirm(){
|
||||||
|
this.popupOpen = false
|
||||||
|
this.getList()
|
||||||
|
},
|
||||||
|
async getList(){
|
||||||
|
try{
|
||||||
|
const {data} = await uni.$http.post(
|
||||||
|
"/gunshiApp/xfflood/attResBase/rainBasinDivision/queryNearbyRainStations",{...this.formData}
|
||||||
|
)
|
||||||
|
console.log("data",data);
|
||||||
|
if(data.code == 200){
|
||||||
|
this.list = [...data.data]
|
||||||
|
this.saveList = [...data.data]
|
||||||
|
}
|
||||||
|
}catch(e){
|
||||||
|
uni.$showMsg()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getList()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.zbyq-box{
|
||||||
|
.search-bar{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.content{
|
||||||
|
margin-top: 10px;
|
||||||
|
max-height: 100vh;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottom-btn1{
|
||||||
|
width: 100px;
|
||||||
|
margin-left: 70px;
|
||||||
|
}
|
||||||
|
.bottom-btn2{
|
||||||
|
width: 100px;
|
||||||
|
margin-right: -12px;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,156 @@
|
||||||
|
<template>
|
||||||
|
<view class="zrtx-box">
|
||||||
|
<view class="title" style="text-align: center; font-size: 20px; font-weight: bold;">
|
||||||
|
{{dic}}
|
||||||
|
</view>
|
||||||
|
<view class="table_cur">
|
||||||
|
<table style="width:100%;display:block">
|
||||||
|
<tr>
|
||||||
|
<th style="width: 50px;">
|
||||||
|
姓名
|
||||||
|
</th>
|
||||||
|
<th style="width: 130px">单位</th>
|
||||||
|
<th style="width: 80px;">
|
||||||
|
职务
|
||||||
|
</th>
|
||||||
|
<th style="width: 100px;">
|
||||||
|
联系方式
|
||||||
|
</th>
|
||||||
|
</tr>
|
||||||
|
<!-- style="max-height: 500px; overflow-y: auto" -->
|
||||||
|
<view >
|
||||||
|
<tr>
|
||||||
|
<td style="width: 50px">{{info.personName}}</td>
|
||||||
|
<td style="width: 130px;">{{info.orgName}}</td>
|
||||||
|
<td style="width: 80px">{{info.position}}</td>
|
||||||
|
<td style="width: 100px;color: #62bafa;" @click="show = true">{{info.tel}}</td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<u-action-sheet :actions="list" :title="title" :show="show" :description="info.tel" @select="selectClick" :closeOnClickOverlay="true" :closeOnClickAction="true"></u-action-sheet>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {repDict} from "../../utils/dicType.js"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
info:Object,
|
||||||
|
default:{}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
show:false,
|
||||||
|
title:"",
|
||||||
|
list: [
|
||||||
|
{
|
||||||
|
name:'呼叫'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name:'复制'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name:'取消'
|
||||||
|
},
|
||||||
|
],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed:{
|
||||||
|
dic(){
|
||||||
|
return repDict(this.info.repType)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
selectClick(obj){
|
||||||
|
if(obj.name == "呼叫"){
|
||||||
|
uni.makePhoneCall({
|
||||||
|
phoneNumber: this.info.tel,
|
||||||
|
});
|
||||||
|
this.show = false
|
||||||
|
}else if(obj.name == "复制"){
|
||||||
|
uni.setClipboardData({
|
||||||
|
data:this.info.tel,
|
||||||
|
showToast:true
|
||||||
|
})
|
||||||
|
this.show = false
|
||||||
|
}
|
||||||
|
// else if(obj.name == "保存至手机通讯录"){
|
||||||
|
// uni.addPhoneContact({
|
||||||
|
// lastName: this.info.personName.substr(0,1),
|
||||||
|
// firstName: this.info.personName.substr(1),
|
||||||
|
// mobilePhoneNumber: this.info.tel,
|
||||||
|
// success: function () {
|
||||||
|
// uni.$showMsg("保存成功")
|
||||||
|
// },
|
||||||
|
// fail: function () {
|
||||||
|
// console.log('fail');
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
// }
|
||||||
|
else{
|
||||||
|
this.show = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.zrtx-box{
|
||||||
|
border: 1px solid #c1f2ce;
|
||||||
|
border-radius: 2px;
|
||||||
|
padding:10px 5px 12px 5px;
|
||||||
|
background-color: #ebfbef;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
.table_div {
|
||||||
|
height: 100%;
|
||||||
|
max-width: calc(100% - 0px);
|
||||||
|
max-height: calc(100vh);
|
||||||
|
flex: 1;
|
||||||
|
padding-top: 0px;
|
||||||
|
overflow-x: scroll;
|
||||||
|
}
|
||||||
|
/*table样式*/
|
||||||
|
.table_cur {
|
||||||
|
margin-top: 20px;
|
||||||
|
width: 100%;
|
||||||
|
empty-cells: show;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.scroll-table{
|
||||||
|
height: calc(100vh - 125px);
|
||||||
|
overflow-y: auto;
|
||||||
|
width:'100%'
|
||||||
|
}
|
||||||
|
.table_cur tr {
|
||||||
|
display: flex;
|
||||||
|
// line-height: 65rpx;
|
||||||
|
}
|
||||||
|
.table_cur th {
|
||||||
|
height: 65rpx;
|
||||||
|
font-size: 14px;
|
||||||
|
// font-weight: bold;
|
||||||
|
|
||||||
|
font-weight: 100;
|
||||||
|
padding: 0px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur td {
|
||||||
|
height: 65rpx;
|
||||||
|
// border-bottom: 1px solid #d8ddeb;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #2f4056;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,59 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="scroll-table" v-if="list.length != 0">
|
||||||
|
<view v-for="(item,index) in list" :key="index" style="margin:5px 20px 5px 10px">
|
||||||
|
<Card :info="item" />
|
||||||
|
</view>
|
||||||
|
<view style="height:50px"></view>
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
style="height:calc(100vh - 160px);display: flex;align-items: center;justify-content: center;background-color: #fff;margin-top:10px"
|
||||||
|
v-else>
|
||||||
|
<image src="../../../static/empty.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Card from "./card.vue"
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
Card
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
list: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
async getData() {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post(
|
||||||
|
"/gunshiApp/tsg/resSafePersonB/list", {
|
||||||
|
resCode: "42120250085"
|
||||||
|
})
|
||||||
|
if (data.code == 200) {
|
||||||
|
this.list = [...data.data];
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getData()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.scroll-table {
|
||||||
|
height: calc(100vh - 100px);
|
||||||
|
overflow-y: auto;
|
||||||
|
width: 100%;
|
||||||
|
padding: 10px 5px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,111 @@
|
||||||
|
<template>
|
||||||
|
<view class="project-cotent">
|
||||||
|
<view class="total-des">
|
||||||
|
<view style="opacity:0.5">工程概况：</view>
|
||||||
|
<view>{{skInfo.projOverview}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="project-basic">
|
||||||
|
<view class="project-loc">
|
||||||
|
<text style="opacity:0.5">水库水位定位信息</text>
|
||||||
|
<view class="sk-location">
|
||||||
|
<image src='../../../static/images/loc.png' style="width:20px;height:20px"></image>
|
||||||
|
<text style="margin-left:10px">{{skInfo.resLoc}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view >
|
||||||
|
|
||||||
|
<map style="width: 100%;" id="container" :latitude="lnglat[1]" :longitude="lnglat[0]"
|
||||||
|
:markers="markers" scale="13"></map>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
skInfo: {
|
||||||
|
type: Object,
|
||||||
|
default: {}
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
lnglat: [114.76, 31.52],
|
||||||
|
markers: [{
|
||||||
|
latitude: 31.52,
|
||||||
|
longitude: 114.76,
|
||||||
|
iconPath: '../../../static/tabs/add.png',
|
||||||
|
width: 25,
|
||||||
|
height: 25
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss">
|
||||||
|
.project-cotent {
|
||||||
|
position: absolute;
|
||||||
|
padding: 0px 3px;
|
||||||
|
background-color: #f7f7f7;
|
||||||
|
overflow: hidden;
|
||||||
|
// max-height: calc(100vh - 40px);
|
||||||
|
// overflow-y: auto;
|
||||||
|
.project-basic {
|
||||||
|
// position: relative;
|
||||||
|
background-color: #ffffff;
|
||||||
|
padding: 5px;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-des {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
border: 1px solid #f2f2f2;
|
||||||
|
background-color: #ffffff;
|
||||||
|
padding: 0 10px;
|
||||||
|
|
||||||
|
.circle-dot {
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #409eff;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label-name {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
flex: 1
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.total-des {
|
||||||
|
margin-top: 10px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sk-location {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.sk-map12 {
|
||||||
|
// height: 400px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.amap-logo {
|
||||||
|
opacity: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.amap-copyright {
|
||||||
|
opacity: 0 !important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,106 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'auto',backgroundColor:'#fff'}">
|
||||||
|
<u-navbar :title="skInfo.resName" :autoBack="true" :titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}" :height='44' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
|
||||||
|
</u-navbar>
|
||||||
|
<u-tabs :list="list1" @click="click" :current="tabs" style="background-color: #fff;margin-top: 60px;"></u-tabs>
|
||||||
|
<Skjj v-if="tabs == 0" :skInfo="skInfo"></Skjj>
|
||||||
|
<Jcxx v-if="tabs == 1"></Jcxx>
|
||||||
|
<!-- 基础信息 -->
|
||||||
|
<Tzcs v-if="tabs == 2" :skInfo="skInfo" :value="jumpParams"></Tzcs>
|
||||||
|
<Krqx v-if="tabs == 3"></Krqx>
|
||||||
|
<Zrtx v-if="tabs == 4"></Zrtx>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
import Jcxx from "./jcxx.vue"
|
||||||
|
import Zrtx from "../../skDetail/zrtx/zrtx.vue"
|
||||||
|
import Krqx from "./krqx/index.vue"
|
||||||
|
import Skjj from "./basicInfo.vue"
|
||||||
|
import Tzcs from "./tzcs.vue"
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tabs:0,
|
||||||
|
jumpParams:'',
|
||||||
|
model: {
|
||||||
|
stm: '',
|
||||||
|
etm: ''
|
||||||
|
},
|
||||||
|
|
||||||
|
list1: [ {
|
||||||
|
name: '水库简介',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '监测信息',
|
||||||
|
}, {
|
||||||
|
name: '基础信息',
|
||||||
|
}, {
|
||||||
|
name: '库容曲线'
|
||||||
|
}, {
|
||||||
|
name: '责任人'
|
||||||
|
}],
|
||||||
|
skInfo:{},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
components:{
|
||||||
|
Jcxx,
|
||||||
|
Zrtx,
|
||||||
|
Krqx,
|
||||||
|
Skjj,
|
||||||
|
Tzcs
|
||||||
|
},
|
||||||
|
onLoad(options) {
|
||||||
|
this.getList();
|
||||||
|
this.tabs = options.value || 0;
|
||||||
|
this.jumpParams = options.key || '';
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
click(item) {
|
||||||
|
this.tabs = item.index;
|
||||||
|
},
|
||||||
|
getList(){
|
||||||
|
uni.$http.post('/gunshiApp/tsg/attResBase/list',this.model).then(res=>{
|
||||||
|
console.log(res,'res');
|
||||||
|
this.skInfo = res.data.data[0];
|
||||||
|
})
|
||||||
|
},
|
||||||
|
toDetail() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/wtcl/detail/index'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.swiper-content{
|
||||||
|
position: relative;
|
||||||
|
.num{
|
||||||
|
position: absolute;
|
||||||
|
top: 4px;
|
||||||
|
left: 4px;
|
||||||
|
z-index: 1;
|
||||||
|
background-color: #000;
|
||||||
|
color: #fff;
|
||||||
|
padding: 0 4px;
|
||||||
|
border-radius: 6px;
|
||||||
|
opacity: .4;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
.time{
|
||||||
|
position: absolute;
|
||||||
|
background-color: #000;
|
||||||
|
opacity: .4;
|
||||||
|
color: #fff;
|
||||||
|
bottom: 0;
|
||||||
|
width:100%;
|
||||||
|
padding: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,373 @@
|
||||||
|
<template>
|
||||||
|
<view class="" style="padding: 5px;">
|
||||||
|
<view class="swiper-content" v-if="imgList.length != 0">
|
||||||
|
<text class="num">{{nowNum}}/{{totalNum}}</text>
|
||||||
|
<u-swiper :list="imgList" height='230px' @change="change" imgMode="scaleToFill" keyName="imgPath"></u-swiper>
|
||||||
|
<text class="time">{{imgTime}}</text>
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
style="display: flex;align-items: center;justify-content: center;background-color: #fff;"
|
||||||
|
v-else>
|
||||||
|
<image src="../../../static/empty.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="update-time">
|
||||||
|
<text>更新时间</text>
|
||||||
|
<text>{{info.tm}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="sk-info">
|
||||||
|
<view class="sk-first-row">
|
||||||
|
<view class="first-item">
|
||||||
|
<text>{{info.rz}}米</text>
|
||||||
|
<text>水位</text>
|
||||||
|
</view>
|
||||||
|
<view class="first-item">
|
||||||
|
<text>{{info.nowCap}}万m³</text>
|
||||||
|
<text>蓄水量</text>
|
||||||
|
</view>
|
||||||
|
<view class="first-line"></view>
|
||||||
|
<image style="width: 20px; height: 20px;" src="../../../static/images/first.jpg"></image>
|
||||||
|
</view>
|
||||||
|
<view class="sk-first-row">
|
||||||
|
<view class="first-item">
|
||||||
|
<text>{{info.crestElev}}米</text>
|
||||||
|
<text>坝顶高程</text>
|
||||||
|
</view>
|
||||||
|
<view class="first-item">
|
||||||
|
<text>{{info.flLowLimLev}}万m³</text>
|
||||||
|
<text>汛限水位</text>
|
||||||
|
</view>
|
||||||
|
<view class="first-item">
|
||||||
|
<text>{{info.totCap}}万m³</text>
|
||||||
|
<text>总库容</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- <view class="first-extra-row">
|
||||||
|
<text>坝顶高程{{info.crestElev}}米</text>
|
||||||
|
<text>汛限水位{{info.flLowLimLev}}米</text>
|
||||||
|
<text>总库容{{info.totCap}}万m³</text>
|
||||||
|
|
||||||
|
</view> -->
|
||||||
|
<view class="sk-second-row">
|
||||||
|
<view class="first-item">
|
||||||
|
<text>{{rainInfo.today || '-'}}毫米</text>
|
||||||
|
<text>今日降雨</text>
|
||||||
|
</view>
|
||||||
|
<view class="first-item">
|
||||||
|
<text>{{rainInfo.yesterdayDrp}}毫米</text>
|
||||||
|
<text>昨日降雨</text>
|
||||||
|
</view>
|
||||||
|
<view class="first-line" style="margin-right:17px"></view>
|
||||||
|
<image style="width: 20px; height: 20px;" src="../../../static/images/second.jpg"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="rain-box">
|
||||||
|
<view class="rain-title">
|
||||||
|
<view class="line-icon"></view>
|
||||||
|
<view>水雨情过程线</view>
|
||||||
|
</view>
|
||||||
|
<view class="time-select">
|
||||||
|
<view class="time-ranger">
|
||||||
|
<view class="start-time">
|
||||||
|
<text>开始时间</text>
|
||||||
|
<text @click="showTime=true" style="margin-left:10%;color:#3399ef">{{stm}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="end-time">
|
||||||
|
<text>结束时间</text>
|
||||||
|
<text @click="showTime1=true" style="margin:0 10%;color:#3399ef">{{etm}}</text>
|
||||||
|
<view class="search-btn" @click="searchHandle">
|
||||||
|
搜索
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="switch-btn">
|
||||||
|
<u-subsection :list="subsectionList" :current="curNow" mode="subsection" @change="subsectionChange">
|
||||||
|
</u-subsection>
|
||||||
|
</view>
|
||||||
|
<view class="show-content">
|
||||||
|
<view style=" height: 500px; overflow-y: auto; padding:0" v-if="curNow == 0 && jcTableData.length !=0">
|
||||||
|
<qiun-data-charts :chartData="chartData.chartData" :echartsApp="true" :eopts="chartData.eopts" />
|
||||||
|
</view>
|
||||||
|
<view style="display: flex;align-items: center;justify-content: center;background-color: #fff;" v-if="curNow == 0 &&jcTableData.length ==0">
|
||||||
|
<image src="../../../static/empty.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<JcTable v-if="curNow == 1" :tableData='jcTableData' />
|
||||||
|
<Tjsj v-if="curNow == 2" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<u-datetime-picker :show="showTime" v-model="startTime" mode="datetime" @confirm="handleStartTime"
|
||||||
|
@cancel="showTime=false"></u-datetime-picker>
|
||||||
|
<u-datetime-picker :show="showTime1" v-model="endTime" mode="datetime" @confirm="handleEndTime"
|
||||||
|
@cancel="showTime1=false"></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
import Tjsj from "../../skDetail/tjsj/tjsj.vue"
|
||||||
|
import JcTable from "../../skDetail/jcsj/jcsjTable.vue"
|
||||||
|
import drpOption from "../../skDetail/jcsj/chartOption.js"
|
||||||
|
const stm = moment().subtract(7, 'days').set({
|
||||||
|
minute: 0,
|
||||||
|
second: 0
|
||||||
|
}).format("YYYY-MM-DD HH:mm");
|
||||||
|
const etm = moment().set({
|
||||||
|
minute: 0,
|
||||||
|
second: 0
|
||||||
|
}).format("YYYY-MM-DD HH:mm");
|
||||||
|
const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
Tjsj,
|
||||||
|
JcTable
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
startTime: stm,
|
||||||
|
endTime: etm,
|
||||||
|
imgList: [],
|
||||||
|
nowNum: 1,
|
||||||
|
totalNum: 0,
|
||||||
|
imgTime: '2024-08-12 11:00',
|
||||||
|
info: '',
|
||||||
|
rainInfo: {},
|
||||||
|
stm,
|
||||||
|
etm,
|
||||||
|
showTime: false,
|
||||||
|
showTime1: false,
|
||||||
|
subsectionList: ['图', '表', '统计值'],
|
||||||
|
curNow: 0,
|
||||||
|
jcTableData: [],
|
||||||
|
chartData: {},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
// 获取监测图像
|
||||||
|
async getImgList() {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post(
|
||||||
|
"/gunshiApp/tsg/reservoir/water/real/img", {
|
||||||
|
resCode: "42120250085"
|
||||||
|
})
|
||||||
|
if (data.code == 200) {
|
||||||
|
const newArr = data.data.map(item => ({
|
||||||
|
...item,
|
||||||
|
imgPath: url + item.imgPath
|
||||||
|
}))
|
||||||
|
this.totalNum = newArr.length;
|
||||||
|
this.imgList = [...newArr];
|
||||||
|
this.imgTime = this.imgList[0] ?.tm || "2024-08-12 11:00";
|
||||||
|
this.nowNum = !newArr.length ? 0 : 1;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取水库水情基本信息
|
||||||
|
async getSkinfo() {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post(
|
||||||
|
"/gunshiApp/tsg/reservoir/water/list")
|
||||||
|
if (data.code == 200) {
|
||||||
|
this.info = data.data[0]
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取雨量信息
|
||||||
|
async getrainInfo() {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.get(
|
||||||
|
"/gunshiApp/tsg/reservoir/water/detail?stcd=716164061")
|
||||||
|
if (data.code == 200) {
|
||||||
|
this.rainInfo = data.data;
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 搜索
|
||||||
|
async getJcsjData() {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post(
|
||||||
|
"/gunshiApp/tsg/reservoir/water/monitor/data", {
|
||||||
|
stcd: "716164061",
|
||||||
|
stm: moment(this.stm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
etm: moment(this.etm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
})
|
||||||
|
if (data.code == 200) {
|
||||||
|
this.jcTableData = [...data.data];
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
searchHandle() {
|
||||||
|
this.getJcsjData()
|
||||||
|
},
|
||||||
|
change(e) {
|
||||||
|
this.nowNum = e.current + 1;
|
||||||
|
this.imgTime = this.imgList[e.current].tm
|
||||||
|
},
|
||||||
|
handleStartTime(e) {
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
this.stm = time
|
||||||
|
this.showTime = false
|
||||||
|
},
|
||||||
|
handleEndTime(e) {
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
this.etm = time;
|
||||||
|
this.showTime1 = false
|
||||||
|
},
|
||||||
|
subsectionChange(e) {
|
||||||
|
this.curNow = e
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
jcTableData(newV, oldV) {
|
||||||
|
if (this.info) {
|
||||||
|
this.chartData = {
|
||||||
|
...drpOption(newV, this.info.afsltdz, this.info.flLowLimLev, this.info.desFloodLev, this.info.calFloodLev)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getImgList();
|
||||||
|
this.getSkinfo();
|
||||||
|
this.getrainInfo();
|
||||||
|
this.getJcsjData();
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.swiper-content {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.num {
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
left: 10px;
|
||||||
|
z-index: 1;
|
||||||
|
background-color: #000;
|
||||||
|
color: #fff;
|
||||||
|
padding: 0 4px;
|
||||||
|
border-radius: 6px;
|
||||||
|
opacity: .4;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.time {
|
||||||
|
position: absolute;
|
||||||
|
background-color: #000;
|
||||||
|
opacity: .4;
|
||||||
|
color: #fff;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
padding: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.update-time {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 10px 5px;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sk-info {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 2px 5px;
|
||||||
|
margin: 5px 0;
|
||||||
|
|
||||||
|
.sk-first-row,
|
||||||
|
.sk-second-row {
|
||||||
|
display: flex;
|
||||||
|
padding: 5px 10px;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-around;
|
||||||
|
background-color: #f2fafc;
|
||||||
|
|
||||||
|
.first-line {
|
||||||
|
width: 3px;
|
||||||
|
height: 20px;
|
||||||
|
background-color: #c6eae6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.first-item {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.sk-second-row {
|
||||||
|
margin: 5px 0;
|
||||||
|
background-color: #f2f8ff;
|
||||||
|
padding: 5px 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.first-extra-row {
|
||||||
|
display: flex;
|
||||||
|
padding: 5px;
|
||||||
|
justify-content: space-between;
|
||||||
|
background-color: #f2fafc;
|
||||||
|
}
|
||||||
|
|
||||||
|
.rain-box {
|
||||||
|
padding: 5px 0px;
|
||||||
|
|
||||||
|
.rain-title {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.line-icon {
|
||||||
|
width: 3px;
|
||||||
|
height: 15px;
|
||||||
|
background-color: #0079fe;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.time-ranger {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
|
||||||
|
.start-time,
|
||||||
|
.end-time {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 10px 0;
|
||||||
|
border-bottom: 1px solid #dfdfdf;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.switch-btn {
|
||||||
|
width: 50%;
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.show-content {
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,80 @@
|
||||||
|
import {GetInterval} from "../../../../utils/tools"
|
||||||
|
export default function DrpOption(data) {
|
||||||
|
const maxVal = Math.ceil(Math.max(...data.map(obj => obj.rz)))
|
||||||
|
const minVal = Math.floor(Math.min(...data.map(obj => obj.rz)))
|
||||||
|
const maxValX = Math.max(...data.map(obj => obj.w))
|
||||||
|
const minValX = Math.min(...data.map(obj => obj.w))
|
||||||
|
let arr = []
|
||||||
|
|
||||||
|
data.forEach(item=>{
|
||||||
|
arr.push([item.w,item.rz])
|
||||||
|
})
|
||||||
|
let eopts = {
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis',
|
||||||
|
},
|
||||||
|
grid: [
|
||||||
|
{
|
||||||
|
top: "12%",
|
||||||
|
left: "12%",
|
||||||
|
right: "18%",
|
||||||
|
bottom: "8%"
|
||||||
|
},
|
||||||
|
],
|
||||||
|
xAxis: [
|
||||||
|
{
|
||||||
|
name: "库容(万m³)",
|
||||||
|
nameGap: 5,
|
||||||
|
type: 'value',
|
||||||
|
min:Math.floor(minValX / 5) *5,
|
||||||
|
max:Math.ceil(maxValX / 5) *5,
|
||||||
|
interval:GetInterval(minValX,maxValX),
|
||||||
|
data: data.map(o => o.w),
|
||||||
|
splitLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
}
|
||||||
|
],
|
||||||
|
yAxis: [
|
||||||
|
{
|
||||||
|
type: 'value',
|
||||||
|
name: "库水位(m)",
|
||||||
|
minInterval:1,
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dotted'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: true
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: true,
|
||||||
|
},
|
||||||
|
min: minVal,
|
||||||
|
max: maxVal
|
||||||
|
}
|
||||||
|
],
|
||||||
|
};
|
||||||
|
let chartData = {
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
type: 'line',
|
||||||
|
color: "#007AFD",
|
||||||
|
data: arr,
|
||||||
|
smooth: true
|
||||||
|
},
|
||||||
|
]
|
||||||
|
};
|
||||||
|
return {
|
||||||
|
eopts,
|
||||||
|
chartData
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,68 @@
|
||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view v-if="tableData.length != 0">
|
||||||
|
<view style="height: 250px; ">
|
||||||
|
<qiun-data-charts :chartData="chartData.chartData" :echartsApp="true" :eopts="chartData.eopts" />
|
||||||
|
</view>
|
||||||
|
<view style="margin-top: 20px;">
|
||||||
|
<Table :tableData="tableData" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view
|
||||||
|
style="height:calc(100vh - 160px);display: flex;align-items: center;justify-content: center;background-color: #fff;margin-top:10px"
|
||||||
|
v-else>
|
||||||
|
<image src="../../../../static/empty.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import drpOptions from "./chartOptions.js"
|
||||||
|
import Table from "./jcsjTable.vue"
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
Table
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
show: false,
|
||||||
|
chartData: {},
|
||||||
|
tableData: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async getKrData() {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post(
|
||||||
|
"/gunshiApp/tsg/stZvarlB/list", {
|
||||||
|
stcd: "716164061"
|
||||||
|
})
|
||||||
|
if (data.code == 200) {
|
||||||
|
this.tableData = [...data.data];
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
tableData(n, o) {
|
||||||
|
if (n.length > 0) {
|
||||||
|
this.chartData = {
|
||||||
|
...drpOptions(n)
|
||||||
|
}
|
||||||
|
this.show = true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getKrData()
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss">
|
||||||
|
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,85 @@
|
||||||
|
<template>
|
||||||
|
<div class="table_div">
|
||||||
|
<div class="table_cur">
|
||||||
|
<table style="width:100%;display:block">
|
||||||
|
<tr>
|
||||||
|
<th style="width: 50%;">
|
||||||
|
水位(m)
|
||||||
|
</th>
|
||||||
|
<th style="width: 50%;">库容(万m³)</th>
|
||||||
|
</tr>
|
||||||
|
<!-- style="max-height: 480px; overflow-y: auto" -->
|
||||||
|
<div class="scroll-table">
|
||||||
|
<tr v-for="(item, index) in tableData" :key="index">
|
||||||
|
<td style="width: 50%;">{{ item.rz}}</td>
|
||||||
|
<td style="width:50%;">{{ item.w }}</td>
|
||||||
|
</tr>
|
||||||
|
<div style="height:180px"></div>
|
||||||
|
</div>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from "moment"
|
||||||
|
export default {
|
||||||
|
props:{
|
||||||
|
tableData:{
|
||||||
|
type:Array,
|
||||||
|
default:[],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.table_div {
|
||||||
|
height: 100%;
|
||||||
|
max-width: calc(100% - 0px);
|
||||||
|
max-height: calc(100vh);
|
||||||
|
flex: 1;
|
||||||
|
padding-top: 0px;
|
||||||
|
overflow-x: scroll;
|
||||||
|
}
|
||||||
|
/*table样式*/
|
||||||
|
.table_cur {
|
||||||
|
width: 100%;
|
||||||
|
empty-cells: show;
|
||||||
|
border-collapse: collapse;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
.scroll-table{
|
||||||
|
height: calc(100vh - 180px);
|
||||||
|
overflow-y: auto;
|
||||||
|
width:'100%'
|
||||||
|
}
|
||||||
|
.table_cur tr {
|
||||||
|
display: flex;
|
||||||
|
line-height: 75rpx;
|
||||||
|
}
|
||||||
|
.table_cur th {
|
||||||
|
height: 85rpx;
|
||||||
|
color: #3399ef;
|
||||||
|
background: #e1f3ff;
|
||||||
|
font-size: 14px;
|
||||||
|
// font-weight: bold;
|
||||||
|
padding: 0px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.table_cur td {
|
||||||
|
height: 65rpx;
|
||||||
|
// border-bottom: 1px solid #d8ddeb;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #2f4056;
|
||||||
|
padding: 0 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-align: center !important;
|
||||||
|
}
|
||||||
|
/*table样式 end*/
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,31 @@
|
||||||
|
//MyVideo组件
|
||||||
|
//自行封装一个组件，利用iframe实现
|
||||||
|
<template>
|
||||||
|
<iframe :onload="onloadCode" style="width:100%;height:100%;border:1px solid #fff;background: #000;"></iframe>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
src: {}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
onloadCode: '',
|
||||||
|
lnglat: [114.76, 31.52],
|
||||||
|
markers: [{
|
||||||
|
latitude: 31.52,
|
||||||
|
longitude: 114.76,
|
||||||
|
iconPath: '../../../static/tabs/add.png',
|
||||||
|
width: 25,
|
||||||
|
height: 25
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.onloadCode =
|
||||||
|
`this.contentWindow.document.body.innerHTML = '<map style="width: 100%;" id="container" latitude="${this.lnglat[1]}" longitude="${this.lnglat[0]}" markers="${this.markers}" ></map>';`
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss">
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,232 @@
|
||||||
|
<template>
|
||||||
|
<view class="basic-box">
|
||||||
|
<view class="basic-data-select">
|
||||||
|
<uni-data-select v-model="selectValue" :localdata="range" @change="selectChage" :clear="false">
|
||||||
|
</uni-data-select>
|
||||||
|
</view>
|
||||||
|
<view class="project-des">
|
||||||
|
<view v-for="(item,index) in tableData" :key="index" :style="index % 2 == 0 ? 'width:50%;':'width:50%;'">
|
||||||
|
<view style="display:flex;align-items:center;margin:15px 0px;">
|
||||||
|
<view class="circle-dot"></view>
|
||||||
|
<view class="label-name">
|
||||||
|
<text style="opacity:0.5;text-align: center;">{{item.name}}</text>
|
||||||
|
<text>{{item.value||"-"}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import selectData from "../../staticData"
|
||||||
|
const gmObj = {
|
||||||
|
"1": "大 (1)型",
|
||||||
|
"2": "大 (2)型",
|
||||||
|
"3": "中型",
|
||||||
|
"4": "小 (1)型",
|
||||||
|
"5": "小 (2)型",
|
||||||
|
"9": "其他",
|
||||||
|
}
|
||||||
|
|
||||||
|
const qdObj = {
|
||||||
|
1: "Ⅰ",
|
||||||
|
2: "Ⅱ",
|
||||||
|
3: "Ⅲ",
|
||||||
|
4: "Ⅳ",
|
||||||
|
5: "VI ",
|
||||||
|
}
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
skInfo: {
|
||||||
|
type: Object,
|
||||||
|
default: {}
|
||||||
|
},
|
||||||
|
value:{
|
||||||
|
type: String,
|
||||||
|
default:''
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
list: selectData[0],
|
||||||
|
range: [{
|
||||||
|
value: 0,
|
||||||
|
text: "水库"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 1,
|
||||||
|
text: "主坝"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 2,
|
||||||
|
text: "副坝"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 3,
|
||||||
|
text: "溢洪道"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 4,
|
||||||
|
text: "灌溉发电洞"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 5,
|
||||||
|
text: "放空洞"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 6,
|
||||||
|
text: "拦洪坝"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: 7,
|
||||||
|
text: "防汛道路"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
selectValue: 0,
|
||||||
|
keyObj: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
selectChage(e) {
|
||||||
|
console.log("e",e);
|
||||||
|
this.selectValue = e
|
||||||
|
this.list = selectData[e]
|
||||||
|
if (e == 0) {
|
||||||
|
this.keyObj = this.skInfo;
|
||||||
|
} else if (e == 1 || e == 2 || e == 6) {
|
||||||
|
this.getDbData(e)
|
||||||
|
} else if (e == 3) {
|
||||||
|
this.getyhdData()
|
||||||
|
} else if (e == 4 || e == 5) {
|
||||||
|
this.getfdData(e)
|
||||||
|
} else {
|
||||||
|
this.getfxdData(e)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 主坝，副坝，拦洪坝
|
||||||
|
async getDbData(e) {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post('/gunshiApp/tsg/attDamBase/list')
|
||||||
|
if (data.code == 200) {
|
||||||
|
if (e == 1) {
|
||||||
|
this.keyObj = data.data.find(item => item.isMain == 1)
|
||||||
|
} else if (e == 2) {
|
||||||
|
this.keyObj = data.data.find(item => item.isMain == 0)
|
||||||
|
} else {
|
||||||
|
this.keyObj = data.data.find(item => item.isMain == 2)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 溢洪道
|
||||||
|
async getyhdData(e) {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post('/gunshiApp/tsg/attSpillwayBase/list')
|
||||||
|
if (data.code == 200) {
|
||||||
|
this.keyObj = data.data[0]
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 灌溉发电洞 放空洞
|
||||||
|
async getfdData(e) {
|
||||||
|
try {
|
||||||
|
const params = e == 5 ? 1 : 2;
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.get('/gunshiApp/tsg/resTunnel/list',{type:params})
|
||||||
|
if (data.code == 200) {
|
||||||
|
this.keyObj = data.data[0]
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 防汛道路
|
||||||
|
async getfxdData(e) {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post('/gunshiApp/tsg/resFloodRoad/list')
|
||||||
|
if (data.code == 200) {
|
||||||
|
this.keyObj = data.data[0]
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
tableData() {
|
||||||
|
return this.list.map(item => {
|
||||||
|
if (item.key == "engScal") {
|
||||||
|
this.keyObj[item.key] = gmObj[this.skInfo[item.key]]
|
||||||
|
}
|
||||||
|
if (item.key == "seismicIntensity") {
|
||||||
|
this.keyObj[item.key] = qdObj[this.skInfo[item.key]]
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
name: item.name,
|
||||||
|
value: this.keyObj[item.key]
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.keyObj = this.skInfo;
|
||||||
|
if(this.value){
|
||||||
|
this.selectChage(this.value - 0)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss">
|
||||||
|
.basic-box {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.basic-data-select {
|
||||||
|
width: 40%;
|
||||||
|
margin-top: 10px;
|
||||||
|
margin-left: auto;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project-des {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
border: 1px solid #f2f2f2;
|
||||||
|
background-color: #ffffff;
|
||||||
|
padding: 0 10px;
|
||||||
|
max-height: calc(100vh - 190px);
|
||||||
|
overflow: auto;
|
||||||
|
|
||||||
|
.circle-dot {
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #409eff;
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label-name {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
flex: 1
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,188 @@
|
||||||
|
<template>
|
||||||
|
<view class="skinfo">
|
||||||
|
<view class="title">
|
||||||
|
<view class="left">
|
||||||
|
<u-icon name="file-text" color="#f59d29" size="20"></u-icon>
|
||||||
|
<text style="margin-left:5px">{{dataform.resName}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="right">
|
||||||
|
{{tm}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="content">
|
||||||
|
<view class="" style="display: flex;">
|
||||||
|
<!-- <image src="../../static/c1.png" mode="" style="width:30%;height: 120px;"></image> -->
|
||||||
|
<image :src="showImg" style="width: 30%;height: 120px;margin: 5px;" @click="previewImage(showImg)"></image>
|
||||||
|
<view class="listItem" @click="toDetail()">
|
||||||
|
<view class="item-text" v-for="(v,k) of list" :key="k">
|
||||||
|
<text>{{v}}</text>:
|
||||||
|
<text>{{dataform[k]}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="bottom">
|
||||||
|
<view class="bottomItem">
|
||||||
|
<view class="withd-2" @click="toWaterDetail('生活供水',shStcd)">
|
||||||
|
<text>生活供水m³/s</text>:
|
||||||
|
<text>{{shgs}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="withd-2" @click="toWaterDetail('生态供水',stStcd)">
|
||||||
|
<text>生态供水m³/s</text>:
|
||||||
|
<text>{{stgs}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import moment from 'moment'
|
||||||
|
export default{
|
||||||
|
data(){
|
||||||
|
return{
|
||||||
|
list:{
|
||||||
|
"rz":'当前水位m',
|
||||||
|
"today":'今日雨量mm',
|
||||||
|
'flLowLimLev':'汛限水位m',
|
||||||
|
"afsltdz":'比汛期m',
|
||||||
|
'wcrstel':'堰顶高程m',
|
||||||
|
'crestElev':'坝顶高程m',
|
||||||
|
"h24":'24h预报mm',
|
||||||
|
"yesterdayDrp":'昨日雨量mm',
|
||||||
|
'totCap':'总库容m³',
|
||||||
|
"nowCap":'蓄水量万m³'
|
||||||
|
},
|
||||||
|
tm: '',
|
||||||
|
dataform:{},
|
||||||
|
stgs:'',
|
||||||
|
shgs:'',
|
||||||
|
stStcd:'',
|
||||||
|
shStcd:'',
|
||||||
|
imageList:[],
|
||||||
|
baseUrl:'http://223.75.53.141:9102/test.by-lyf.tmp',
|
||||||
|
showImg:'../../static/empty.png'
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getList()
|
||||||
|
this.getDrp()
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
previewImage(item){
|
||||||
|
uni.previewImage({
|
||||||
|
urls: [this.showImg],
|
||||||
|
longPressActions: {
|
||||||
|
itemList: ['发送给朋友', '保存图片', '收藏'],
|
||||||
|
success: function(data) {
|
||||||
|
console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
|
||||||
|
},
|
||||||
|
fail: function(err) {
|
||||||
|
console.log(err.errMsg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getDrp(){
|
||||||
|
uni.$http.get('/gunshiApp/tsg/reservoir/water/detail?stcd=716164061&_=1731028927554').then(res=>{
|
||||||
|
|
||||||
|
this.dataform={...this.dataform,...res.data.data}
|
||||||
|
|
||||||
|
})
|
||||||
|
uni.$http.post('/gunshiApp/tsg/reservoir/water/list').then(res=>{
|
||||||
|
this.dataform={...this.dataform,...res.data.data[0]}
|
||||||
|
this.tm = res.data.data[0].tm
|
||||||
|
})
|
||||||
|
uni.$http.post('/gunshiApp/tsg/stWaterRReal/list').then(res=>{
|
||||||
|
res.data.data.forEach(item=>{
|
||||||
|
if(item.sttp == 'QQ'){
|
||||||
|
this.stgs=item.q
|
||||||
|
this.stStcd=item.stcd
|
||||||
|
}
|
||||||
|
if(item.sttp == 'PQ'){
|
||||||
|
this.shgs=item.q
|
||||||
|
this.shStcd=item.stcd
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
uni.$http.post('/gunshiApp/tsg/resProjectImg/list',{resCode:42120250085}).then(res=>{
|
||||||
|
res.data.data.forEach(item=>{
|
||||||
|
if(item.projType == 1){
|
||||||
|
this.imageList = item.files.map((item,index)=>
|
||||||
|
{
|
||||||
|
item.url = this.baseUrl + item.filePath
|
||||||
|
if(index == 0){
|
||||||
|
|
||||||
|
this.showImg = item.url
|
||||||
|
}
|
||||||
|
return item})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
},
|
||||||
|
toDetail(){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:'/pages/skInfo/detail/index'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
toWaterDetail(name,stcd){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pages/skInfo/waterDatail/index?name=${name}&stcd=${stcd}`,
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getList(){
|
||||||
|
uni.$http.post('/gunshiApp/tsg/attResBase/list').then(res=>{
|
||||||
|
this.dataform=res.data.data[0]
|
||||||
|
})
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.skinfo {
|
||||||
|
.title {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
.left{
|
||||||
|
font-family: '微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑', sans-serif;
|
||||||
|
font-weight: 700;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 16px;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.content{
|
||||||
|
.listItem{
|
||||||
|
font-size: 13px;
|
||||||
|
color: #333333;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
width: 70%;
|
||||||
|
height: 22px;
|
||||||
|
.item-text{
|
||||||
|
width: 50%;
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.bottomItem{
|
||||||
|
display: flex;
|
||||||
|
border-top: 1px solid #f0f0f0;
|
||||||
|
padding: 10px 0 0 0;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.withd-2{
|
||||||
|
width: 50%;
|
||||||
|
text-align: center;
|
||||||
|
background-color: #caf982;
|
||||||
|
margin-right: 5px;
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,138 @@
|
||||||
|
<template>
|
||||||
|
<view :style="{height:'100vh',overflow:'auto',backgroundColor:'#fff'}">
|
||||||
|
<u-navbar :title="name" :autoBack="true" :titleStyle="{
|
||||||
|
fontSize:'18px'
|
||||||
|
}" :height='40' :safeAreaInsetTop=true leftIconSize='20' leftIconColor='rgb(153, 153, 153)'>
|
||||||
|
</u-navbar>
|
||||||
|
<view style="padding:10px">
|
||||||
|
<view class="time-ranger" style="margin-top:70px">
|
||||||
|
<view class="start-time">
|
||||||
|
<text>开始时间</text>
|
||||||
|
<text @click="showTime=true" style="margin-left:10%;color:#3399ef">{{stm}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="end-time">
|
||||||
|
<text>结束时间</text>
|
||||||
|
<text @click="showTime1=true" style="margin:0 10%;color:#3399ef">{{etm}}</text>
|
||||||
|
<view class="search-btn" @click="searchHandle">
|
||||||
|
搜索
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="tableData.length != 0">
|
||||||
|
<view class="water-chart-area">
|
||||||
|
<qiun-data-charts :chartData="chartData.chartData" :echartsApp="true" :eopts="chartData.eopts" />
|
||||||
|
</view>
|
||||||
|
<view class="water-table-area">
|
||||||
|
<Table :tableData="tableData"></Table>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="height:calc(100vh - 150px);display: flex;align-items: center;justify-content: center;background-color: #fff;" v-else>
|
||||||
|
<image src="../../../static/empty.png" mode="" ></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<u-datetime-picker :show="showTime" v-model="startTime" mode="datetime" @confirm="handleStartTime"
|
||||||
|
@cancel="showTime=false"></u-datetime-picker>
|
||||||
|
<u-datetime-picker :show="showTime1" v-model="endTime" mode="datetime" @confirm="handleEndTime"
|
||||||
|
@cancel="showTime1=false"></u-datetime-picker>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import moment from 'moment';
|
||||||
|
import Table from "./jcTable.vue"
|
||||||
|
import {
|
||||||
|
numberFormat
|
||||||
|
} from '../../utils/tool'
|
||||||
|
import drpOptions from './jcOptions'
|
||||||
|
const stm = moment().subtract(7, 'days').set({
|
||||||
|
minute: 0,
|
||||||
|
second: 0
|
||||||
|
}).format("YYYY-MM-DD HH:mm");
|
||||||
|
const etm = moment().set({
|
||||||
|
minute: 0,
|
||||||
|
second: 0
|
||||||
|
}).format("YYYY-MM-DD HH:mm");
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
Table
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
name: '',
|
||||||
|
stcd: '',
|
||||||
|
startTime: stm,
|
||||||
|
endTime: etm,
|
||||||
|
stm,
|
||||||
|
etm,
|
||||||
|
showTime: false,
|
||||||
|
showTime1: false,
|
||||||
|
tableData: [],
|
||||||
|
chartData: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleStartTime(e) {
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
this.stm = time
|
||||||
|
this.showTime = false
|
||||||
|
},
|
||||||
|
handleEndTime(e) {
|
||||||
|
let time = moment(e.value).format("YYYY-MM-DD HH:mm")
|
||||||
|
this.etm = time;
|
||||||
|
this.showTime1 = false
|
||||||
|
},
|
||||||
|
async geTableData() {
|
||||||
|
try {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await uni.$http.post(
|
||||||
|
"/gunshiApp/tsg/stWaterR/list", {
|
||||||
|
stcd: this.stcd,
|
||||||
|
startTime: moment(this.stm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
endTime: moment(this.etm).format("YYYY-MM-DD HH:mm:ss"),
|
||||||
|
isAsc: false,
|
||||||
|
orderField: "tm"
|
||||||
|
})
|
||||||
|
|
||||||
|
if (data.code == 200) {
|
||||||
|
this.tableData = [...data.data]
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
uni.$showMsg();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
searchHandle() {
|
||||||
|
this.geTableData()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
tableData(n, o) {
|
||||||
|
let num = 0;
|
||||||
|
if (n.length > 0) {
|
||||||
|
n.forEach(s => {
|
||||||
|
num += Number(s.v)
|
||||||
|
})
|
||||||
|
this.chartData = {
|
||||||
|
...drpOptions(n, numberFormat(num))
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.geTableData()
|
||||||
|
},
|
||||||
|
onLoad(options) {
|
||||||
|
this.stcd = options.stcd;
|
||||||
|
this.name = options.name;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.water-chart-area {
|
||||||
|
width: 100%;
|
||||||
|
height: 250px;
|
||||||
|
}
|
||||||
|
.water-table-area{
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,166 @@
|
||||||
|
|
||||||
|
import echarts from 'echarts/lib/echarts';
|
||||||
|
import { format } from 'echarts/lib/export';
|
||||||
|
export default function DrpOption(data,num) {
|
||||||
|
const minL = Math.floor(Math.min(...data?.map(s => s.q)));
|
||||||
|
const maxL = Math.ceil(Math.max(...data?.map(s => s.q)));
|
||||||
|
const minS = Math.floor(Math.min(...data?.map(s => s.v)));
|
||||||
|
const maxS = Math.ceil(Math.max(...data?.map(s => s.v)));
|
||||||
|
let eopts = {
|
||||||
|
title: {
|
||||||
|
text: `时段总水量:${num.value}${num.unit}m³`,
|
||||||
|
top: "0%",
|
||||||
|
right: "12%",
|
||||||
|
textStyle: {
|
||||||
|
fontWeight: "normal",
|
||||||
|
fontSize:14
|
||||||
|
}
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis',
|
||||||
|
},
|
||||||
|
grid: {
|
||||||
|
top: '20%',
|
||||||
|
left: '7%',
|
||||||
|
right: '11%',
|
||||||
|
bottom: '10%',
|
||||||
|
borderWidth: 0
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
show: true,
|
||||||
|
top: "8%",
|
||||||
|
},
|
||||||
|
calculable: true,
|
||||||
|
xAxis: [
|
||||||
|
{
|
||||||
|
type: 'category',
|
||||||
|
data: data?.map(item => item.tm),
|
||||||
|
splitLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 14,
|
||||||
|
// formatter: val => val.substr(0,'2020-11-11 11:11'.length)
|
||||||
|
format:"waterXaxis"
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.5,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
}
|
||||||
|
],
|
||||||
|
yAxis: [
|
||||||
|
{
|
||||||
|
type: 'value',
|
||||||
|
position: 'left',
|
||||||
|
name: "流量(m³/s)",
|
||||||
|
nameTextStyle: {
|
||||||
|
padding: [0, 0, 0, 30]
|
||||||
|
},
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dashed'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
min: minL,
|
||||||
|
max: maxL
|
||||||
|
// max: xMaxVal
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'value',
|
||||||
|
position: 'right',
|
||||||
|
name:"水量(m³)",
|
||||||
|
splitLine: {
|
||||||
|
show: true,
|
||||||
|
lineStyle: {
|
||||||
|
color: '#07a6ff',
|
||||||
|
width: 0.25,
|
||||||
|
type: 'dashed'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
color: '#333',
|
||||||
|
fontSize: 12,
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
axisTick: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
min: minS - 1,
|
||||||
|
max: maxS
|
||||||
|
}
|
||||||
|
],
|
||||||
|
};
|
||||||
|
let chartData = {
|
||||||
|
series: [
|
||||||
|
|
||||||
|
{
|
||||||
|
name:'流量',
|
||||||
|
type:'line',
|
||||||
|
smooth: true,
|
||||||
|
showSymbol: false,
|
||||||
|
symbol: false,
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
color: "#FAC858",
|
||||||
|
}
|
||||||
|
},
|
||||||
|
lineStyle: {
|
||||||
|
normal: {
|
||||||
|
width: 3,
|
||||||
|
shadowColor: 'rgba(0,0,0,0.4)',
|
||||||
|
shadowBlur: 10,
|
||||||
|
shadowOffsetY: 10
|
||||||
|
}
|
||||||
|
},
|
||||||
|
markPoint: {
|
||||||
|
data: [{
|
||||||
|
name: '最大值',
|
||||||
|
type: 'max',
|
||||||
|
}],
|
||||||
|
},
|
||||||
|
data: data?.map(s => s.q),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '水量',
|
||||||
|
type: 'bar',
|
||||||
|
yAxisIndex:1,
|
||||||
|
barWidth: '10%',
|
||||||
|
data: data?.map(s => s.v),
|
||||||
|
itemStyle: {
|
||||||
|
normal: {
|
||||||
|
color:"#5773c7"
|
||||||
|
},
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
]
|
||||||
|
};
|
||||||
|
return {
|
||||||
|
eopts,
|
||||||
|
chartData
|
||||||
|
}
|
||||||
|
}
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue