bocai_supplyChain_uni/components/list/apply.vue

<template>
	<view :class="isLogin ? '' : 'm-login-false'">
		<view class="m-panel" :class="!loading && speed == 0 ? 'g_bg_f_5' : ''">
			<view class="link g_bg_f" :class="!loading && speed == 0 ? '' : ''">
				<g-loading bg="#f5f5f5" v-if="loading && speed == -1" />
				<view v-if="!loading && speed == 0 && isLogin" style="background-color: #f5f5f5">
					<view>
						<view class="g_h_100"></view>
						<g-empty :text="isLogin ? '暂无数据' : '请登录'" />
					</view>
				</view>
				<view v-if="!isLogin" style="background-color: #f5f5f5" class="m-log g_flex_column_start">
					<view>
						<g-empty text="您还有没有登录，请登录后查看工单" />
						<view class="g_h_32"></view>
						<g-button btnText="去登录" size="small" class="g_mt_32" @clickBtn="goLogin" />
					</view>
				</view>
				<scroll-view v-if="speed > 0" :style="{ height: `calc(100vh - ${navInfo.statusBarHeight + 62}px)` }" :scroll-y="true" @scrolltolower="reachBottom" :lower-threshold="100">
					<view class="" style="min-height: calc(100% - 90px)">
						<view class="item g_pt_18 g_pl_10 g_pr_10" hover-class="g_bg_f_5" v-for="(item, index) in query.list" :key="index" @click="goDetail(item, index)">
							<view class="g_border_e_b g_flex_row_start g_pb_18">
								<view class="g_flex_none g_mr_12 g_w_44 g_h_44 g_radius_50 g_flex_c" @click.stop="goTel(item.tel)">
									<image :src="cdnBaseImg + 'blueTel.svg'" class="g_w_44 g_h_44" v-if="item.tel"></image>
									<image :src="cdnBaseImg + 'order_tel_gray.svg'" class="g_w_44 g_h_44" v-else></image>
								</view>
								<view class="g_flex_1 g_flex_row_start">
									<view class="g_flex_1 g_flex_column_between">
										<view class="g_fs_16 g_c_3 g_fw_bold g_ell_1"> {{ item.userName }}{{ item.setTitle }} </view>
										<view class="g_fs_14 g_c_6 g_ell_1">{{ item.storeJobName + "@" + item.upAgencyName }}</view>
									</view>
									<view class="g_flex_none g_ml_20 g_flex_column_between">
										<view class="g_fs_14 g_c_9 g_flex_row_end">{{ item.time }}</view>
										<view class="g_fs_14 g_c_3 g_flex_row_end">{{ item.status_text }}</view>
									</view>
								</view>
							</view>
						</view>
					</view>
					<view class="g_bg_f_5">
						<g-panel-hr :str="query.isFinish >= 0 && query.isFinish < query.size ? speed + '个工单' : '加载中'" />
					</view>
					<!-- #ifdef H5 -->
					<view class="g-h-100"></view>
					<!-- #endif -->
				</scroll-view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	// 组件名称
	name: "",
	// 局部注册的组件
	components: {},
	// 组件参数 接收来自父组件的数据
	props: {
		from: {
			type: String,
			default: () => {
				return "default";
			},
		},
		list: {
			type: Array,
			default: () => {
				return [];
			},
		},
		speed: {
			type: Number,
			default: () => {
				return -1;
			},
		},
		query: {
			type: Object,
			default: () => {
				return {
					page: 1,
					size: 10,
					list: [],
					isFinish: -1,
				};
			},
		},
		tabActive: {
			type: Number,
			default: () => {
				return 0;
			},
		},
		loading: {
			type: Boolean,
			default: () => {
				return true;
			},
		},
		isLogin: {
			type: Boolean,
		},
		navInfo: {
			type: Object,
			default: () => {
				return {};
			},
		},
	},
	// 组件状态值
	data() {
		return {
			cdnBaseImg: this.G.store().cdnBaseImg,
		};
	},
	// 计算属性
	computed: {},
	// 侦听器
	watch: {},
	created() {},
	mounted() {},
	// 组件方法
	methods: {
		reachBottom() {
			let that = this;
			console.log(123123);
			console.log("that.query", that.query);
			this.G.isLogin();
			if (this.G.isLogin()) {
				if (that.query.isFinish == -1 || that.query.isFinish == that.query.size) {
					that.query.page++;
					that.$emit("update:query", that.query);
					that.$emit("uploadList");
				}
			}
		},
		goDetail($item, $index) {
			let that = this;
			uni.navigateTo({
				url: `/root/detail/applyTob?id=${$item.id}&type=${that.tabActive + 1}&relationId=${$item.relationId}`,
				// url: "/root/detail/apply?id=" + $item.id + "&type=" + (that.tabActive + 1),
			});
		},
		goLogin() {
			uni.reLaunch({
				url: "/pages/login/index",
			});
		},
		goTel($item) {
			console.log($item);
			if ($item) {
				uni.makePhoneCall({
					phoneNumber: $item,
				});
			}
		},
	},
};
</script>

<style scoped lang="less">
.link {
	.item {
		.doc {
			bottom: 0;
			left: 50%;
			transform: translateX(-50%);
		}
	}
}
</style>