integrated_traffic_uniapp/pages/application/video/VideoManager/VideoManager.vue

<template>
	<view>
		<cu-custom bgColor="bg-gradual-blueness" :isBack="true" :isRingt="true">
			<block slot="backText">返回</block>
			<block slot="content">视频管理</block>
<!--			<block slot="right">-->
<!--				<view @click="showDrawer('showRight')">查询</view>-->
<!--			</block>-->
		</cu-custom>
		<view class="select-fixed top-fixed" >
			<view class="cu-bar search bg-white">
				<view class="search-form radius">
					<text class="cuIcon-search"></text>
					<input @input="InputBlur" placeholder="请输入关键字"></input>
				</view>
				<view class="action">
					<button class="cu-btn bg-green shadow-blur radius" @click="getQuery()">搜索</button>
				</view>
			</view>
			<view class="line"></view>
		</view>
			<scroll-view class="dy-scroll" @scrolltolower="scrolltolower" scroll-y :style="'top:'+sTop+'px;height:calc(100vh - '+totalHeight+'px)'">
				<view class="dy-list">
					<view v-for="(item,index) of varList" :key="index" :data-id="item.VIDEOMANAGER_ID" class="dy-list-item p201 arrow" @click="$noMultipleClicks(gotRectify,item.VIDEOMANAGER_ID)">
						<view class="dy-title-flex">
							<text  class="cu-tag radius bg-yellow light">{{item.VIDEONAME}}</text>
						</view>
						<view class="dy-subtitle-flex">
							<view>
								<text>上传时间:</text>
								<text>{{item.OPDATE}}</text>
							</view>
						</view>
					</view>
				</view>
				<view class="cu-tabbar-height"></view>
			</scroll-view>
	</view>
</template>

<script>
	import {
		basePath,corpinfoId,loginUserId,loginSession,loginUser
	} from '@/common/tool.js';
	import tkiTree from "@/components/select-tree/select-tree.vue"
	export default {
		components: {
			tkiTree
		},
		data() {
			return {
				sTop:0,
				totalHeight:0,
				msg: 'add',
				listLoading: true,
				dialogForm: false,
				dialogImageUrl: '',
				dialogVisible: false,
				list:[],
				noClick:true,
				add: true,
				del: true,
				edit: true,
				listQuery: {
					page: 1,
					limit: 10
				},
				total: 0,
				KEYWORDS: '',
				dates: [],
				dataFlag:'noData',
				varList: [],
				hideUpload: false,
				form: {
					VIDEOMANAGER_ID: '',
					VIDEONAME: '', //
					VIDEOURL: '',
					ISSHOW: ''
				}
			}
		},

		back() {
			this.dialogVideo = false
			this.dialogVideoAll = false
			this.dialogForm = false
			this.listLoading = false
		},

	onLoad() {
			this.getData();

			loginSession();
		},
		onReady() {
			let that=this;
			let CustomBar = this.CustomBar;
			uni.getSystemInfo({ //调用uni-app接口获取屏幕高度
				success(res) { //成功回调函数
					let titleH=uni.createSelectorQuery().select(".top-fixed"); //想要获取高度的元素名（class/id）
					titleH.boundingClientRect(data=>{
						that._data.sTop=data.height  //计算高度：元素高度=窗口高度-元素距离顶部的距离（data.top）
						that.totalHeight = data.height+CustomBar
					}).exec()
				}
			})
		},
		onShow(){
			var _this = this;
			if(_this.initflag){
				_this.initflag = false;
				_this.getQuery()
			}
		},
		methods: {
      InputBlur(e){
        console.log(e)
        this.KEYWORDS = e.detail.value
      },
			getData() {
				var _this = this;
				this.listLoading = true
				uni.request({
					url: basePath + '/app/videomanager/list',
					method: 'POST',
					dataType: 'json',
					header: {
						'Content-type': 'application/x-www-form-urlencoded'
					},
					data:{
            KEYWORDS: _this.KEYWORDS,
						CORPINFO_ID:loginUser.CORPINFO_ID,
					},
					success: (res) => {
						// console.log(res.data.varList)
						_this.varList = res.data.varList
						// _this.VIDEOURL = res.data.varList.VIDEOURL + '&aspect=600x380'

						this.listLoading = false
					}
				})
			},

			// 打开窗口
			showDrawer(e) {
				this.$refs[e].open()
			},
			// 关闭窗口
			closeDrawer(e) {
				this.$refs[e].close()
			},
			// 抽屉状态发生变化触发
			change(e, type) {
				console.log((type === 'showLeft' ? '左窗口' : '右窗口') + (e ? '打开' : '关闭'));
				this[type] = e
			},
			//跳转事件
			gotRectify(e) {
				uni.navigateTo({
					url: '/pages/application/video/VideoManager/VideoManager-detail?id='+e,
				});
			},
			//跳转事件
			gotReview(e) {
				uni.navigateTo({
					url: '/pages/works/hidden-danger/hidden-danger-review?id='+e,
				});
			},
			//跳转事件
			gotCheck(e) {
				uni.navigateTo({
					url: '/pages/works/hidden-danger/hidden-danger-check?id='+e,
				});
			},
			//跳转事件
			gotDetail(e) {
				uni.navigateTo({
					url: '/pages/works/hidden-danger/hidden-danger-details?id='+e,
				});
			},

			// 确定回调事件
			depttreeConfirm(e) {
				// this.isUps=false;
				if(e && e.length > 0){

					this.DEPT = e[0].id;
					this.DEPTNAME = e[0].name;
				}
				// this.RISK_UNIT_ID = ''; //单元
				// this.RISK_UNIT_NAME = ''; //单元
				this.$forceUpdate(); //强制刷新
				// this.getUserList();
				this.getQuery();
			},
      depttreeConfirm1(e) {
        // this.isUps=false;
        if(e && e.length > 0){

          this.RECTIFICATIONDEPT = e[0].id;
          this.RECTIFICATIONDEPT_NAME = e[0].name;
        }
        // this.RISK_UNIT_ID = ''; //单元
        // this.RISK_UNIT_NAME = ''; //单元
        this.$forceUpdate(); //强制刷新
        // this.getUserList();
        this.getQuery();
      },
			getQuery(){
				var _this = this;
				_this.page = 1;
				_this.isEnd = false;
				_this.list = [];
				_this.getData()
			},
			getlist() {
				var _this = this;
				_this.page = 1;
				_this.isEnd = false;
				_this.totalCount = 0;
				_this.total =0;
				_this.list = [];
				_this.getData()
			},
			// 取消回调事件
			depttreeCancel(e) {
				// this.isUps=false;
			},
			// 取消回调事件
			depttreeCancel1(e) {
				// this.isUps=false;
			},
			scrolltolower(){
				this.getData();
			}
		}
	}
</script>
<style>
	.sr-s .cu-btn{
		font-size: 24upx;
		height: 54upx;
		flex: 1;
	}
	.scroll-view {
		/* #ifndef APP-NVUE */
		width: 100%;
		height: 100%;
		/* #endif */
		flex: 1;
		z-index: 999;

	}

	.scroll-view-box {
		flex: 1;
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;

	}
</style>