Skip to content

basic-uniapp-v3
basic-uniapp-v3
提交 c5078865 作者: 王定
操作

feat: 优化农技课堂视频封面接入后台传入的宽高，根据设计稿还原农场首页

上级 78e42fbc
正在显示 包含 208 行增加 和 101 行删除
.env.development
# API 接口地址
VITE_GLOB_API_URL=http://111.22.182.169:49600
# VITE_GLOB_API_URL=http://36.133.16.81:42111
# VITE_GLOB_API_URL=http://111.22.182.169:49600
VITE_GLOB_API_URL=http://36.133.16.81:42111
# VITE_GLOB_API_URL=http://123.207.47.17
# API 接口地址前缀
VITE_GLOB_API_URL_PREFIX=/jeecgboot
# VITE_GLOB_API_URL_PREFIX=/jeecg-boot
# VITE_GLOB_API_URL_PREFIX=/jeecgboot
VITE_GLOB_API_URL_PREFIX=/jeecg-boot
# VITE_GLOB_API_URL_PREFIX=/jeecg-boot
src/api/model/linghuoyonggong.ts
......@@ -14,8 +14,24 @@ enum Api {
postLaborAdd = '/server/labor/add', // 新增
getLaborAppList = '/server/labor/appList', // APP用工列表查询
getLaborAppDetail = '/server/labor/appDetail', // APP用工详情查询
getLaborAppDel = '/server/labor/delete', // APP用工通过id删除
}
/**
* 删除设备
* @param id
* @returns
*/
export function getLaborAppDel(params = {}) {
return otherHttp.delete({
url: Api.getLaborAppDel,
params,
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
}
})
}
/**
* @param params 请求参数
* @description: APP灵活用工找人干活用工详情查询
*/
......
src/components/ConfirmDialog/index.vue
......@@ -70,7 +70,7 @@ function handleConfirm() {
display: flex;
align-items: center;
justify-content: center;
z-index: 9999;
z-index: 99999;
}
.confirm-dialog-container {
......
src/pages/knowledgeVideo/index.vue
......@@ -19,7 +19,15 @@
model.loading = true
videoApi.getList(params).then((res) => {
if (res.records.length > 0) {
const { records } = res
const { records } = res;
let scale:any = 0;
for(let i = 0; i < records.length;i++){
scale = (340 / records[i].width).toFixed(1);
records[i].videoWidth = 340;
records[i].videoHeight = Math.floor(records[i].height * scale);
}
if (model.params.pageNo === 1) {
videoList.value = records
} else {
......@@ -106,6 +114,8 @@
v-for="(item, index) in videoList"
:key="index"
:src="item.thumbnailPath"
:imgWidth="item.videoWidth"
:imgHeight="item.videoHeight"
@click="toPlay(item.id)"
>
<view class="flex flex-col justify-between pl-2 pr-2 pb-2">
......
src/pages/linghuoyonggong/linghuoyonggong.vue
......@@ -2,6 +2,7 @@
import { reactive } from 'vue'
import { onLoad, onReachBottom, onShow } from '@dcloudio/uni-app'
import RegisterDialog from './components/register-dialog.vue'
import ConfirmDialog from '@/components/ConfirmDialog/index.vue'
import { getTextByCode } from '@/utils/areaData'
import * as LinghuoyonggongAPI from '@/api/model/linghuoyonggong'
import Navigate from '@/utils/page/navigate'
......@@ -53,7 +54,10 @@
}, {
text: '删除',
background: '#FF2B2B'
}]
}],
isShowConfirmDialog:false,
dialogContent:"确认要删除吗",
delLaborId:null
})
// 缓存已处理的区域数据，避免重复计算
......@@ -64,15 +68,29 @@
maxRetries: 2,
retryDelay: 1000,
}
// 左滑点击
function swipeActionOnClick(e){
console.log("点击了");
console.log(e)
function handleConfirmDialog(){
pageData.loading = true;
LinghuoyonggongAPI.getLaborAppDel({
id: pageData.delLaborId,
}).then((res) => {
resetGetEmploymentList();
}).finally(()=>{
setTimeout(()=>{
pageData.loading = false;
},200)
})
}
// 左滑值的改变
function swipeActionChange(e){
console.log("change*********");
console.log(e)
// 左滑点击
function swipeActionOnClick(e,item){
pageData.delLaborId = item.id;
if(e.item.text == '删除'){
pageData.dialogContent = `确认要删除【${item.villageName}】吗`;
setTimeout(()=>{
pageData.isShowConfirmDialog = true;
},100)
}else{
Navigate.to('/pages/linghuoyonggong/publishEmployment?id='+item.id);
}
}
// 带重试机制的API调用
async function fetchWithRetry(apiCall, maxRetries = requestConfig.maxRetries) {
......@@ -400,35 +418,37 @@
</view>
</template>
<template v-else>
<fui-swipe-action class="yr-list-swipe" v-for="item in pageData.employmentList" :key="item.id" :buttons="pageData.swipeActionButtons" @click="swipeActionOnClick" @change="swipeActionChange">
<fui-list-cell class="yr-list-cell" :padding="['0rpx','0rpx']" :highlight="false">
<view class="work_list_view">
<view class="d-flex j-sb">
<view class="left-width village_number_view">
<view class="village_view text_overflow_ellipsis">{{ item.villageName }}</view>
<view class="d-flex align-center"><image class="avatar_icon" src="/static/images/linghuoyonggong/avatar.png" /><text class="text-color">待工人数{{item.workers}}名</text></view>
<fui-swipeaction-group>
<fui-swipe-action class="yr-list-swipe" v-for="item in pageData.employmentList" :key="item.id" :buttons="pageData.swipeActionButtons" @click="swipeActionOnClick($event,item)">
<fui-list-cell class="yr-list-cell" :padding="['0rpx','0rpx']" :highlight="false">
<view class="work_list_view">
<view class="d-flex j-sb">
<view class="left-width village_number_view">
<view class="village_view text_overflow_ellipsis">{{ item.villageName }}</view>
<view class="d-flex align-center"><image class="avatar_icon" src="/static/images/linghuoyonggong/avatar.png" /><text class="text-color">待工人数{{item.workers}}名</text></view>
</view>
<view class="d-flex align-center justify-center right-width village_distance">
<image class="distance_icon" src="/static/images/linghuoyonggong/distance.png" />
<text class="distance_val text-color">{{getDistanceText(item)}}</text>
</view>
</view>
<view class="d-flex align-center justify-center right-width village_distance">
<image class="distance_icon" src="/static/images/linghuoyonggong/distance.png" />
<text class="distance_val text-color">{{getDistanceText(item)}}</text>
<view class="d-flex j-sb skill_details_view" style="padding-bottom: 0px;">
<view class="left-width d-flex j-sb align-center">
<image class="skill_icon" src="/static/images/linghuoyonggong/skill.png" />
<view class="skill_view text_overflow_ellipsis">技能：{{item.skills.length ? item.skills.join("、") : '未填写'}}</view>
</view>
</view>
</view>
<view class="d-flex j-sb skill_details_view" style="padding-bottom: 0px;">
<view class="left-width d-flex j-sb align-center">
<image class="skill_icon" src="/static/images/linghuoyonggong/skill.png" />
<view class="skill_view text_overflow_ellipsis">技能：{{item.skills.length ? item.skills.join("、") : '未填写'}}</view>
</view>
</view>
<view class="d-flex j-sb skill_details_view">
<view class="left-width d-flex j-sb align-center">
<image class="skill_icon" src="/static/images/linghuoyonggong/address.png" />
<view class="skill_view text_overflow_ellipsis">地址：{{item.villageFullName}}</view>
<view class="d-flex j-sb skill_details_view">
<view class="left-width d-flex j-sb align-center">
<image class="skill_icon" src="/static/images/linghuoyonggong/address.png" />
<view class="skill_view text_overflow_ellipsis">地址：{{item.villageFullName}}</view>
</view>
<view class="right-width see_details_btn" @click="onDetailsClick(item)">查看详情</view>
</view>
<view class="right-width see_details_btn" @click="onDetailsClick(item)">查看详情</view>
</view>
</view>
</fui-list-cell>
</fui-swipe-action>
</fui-list-cell>
</fui-swipe-action>
</fui-swipeaction-group>
</template>
<!-- <template v-else>
<view class="work_list_view" v-for="item in pageData.employmentList" :key="item.id">
......@@ -463,7 +483,15 @@
<view v-if="pageData.hasMore == 'noMore'" class="no-more">没有更多数据了</view>
</scroll-view>
</view>
<!-- 确认对话框 -->
<ConfirmDialog
v-model:show="pageData.isShowConfirmDialog"
title="删除提醒"
:content="pageData.dialogContent"
cancelText="取消"
confirmText="确认"
@confirm="handleConfirmDialog"
/>
<fui-fab position="right" distance="10" bottom="240" width="96" @click="handlePublish">
<view class="text-white text-center">
<view class="fab-icon" />
......
src/pages/linghuoyonggong/publishEmployment.vue
......@@ -14,11 +14,13 @@
const dictStore = useDictStore()
const userStore = useUserStore()
const globSetting = useGlobSetting()
let pageType= 'add';
onLoad((option) => {
// 获取数据详情
if (option.id) {
if (option && option.id) {
pageType = 'edit';
uni.setNavigationBarTitle({title: '编辑'});
getDetails(option.id)
} else {
// 获取当前位置
......@@ -61,7 +63,7 @@
attr:"",// 人员属性
skill:"", // 人员技能
})
const startDate = getDate('start');
let startDate = getDate('start');
const endDate = getDate('end');
// 字典值
const DictData = reactive({
......@@ -392,11 +394,16 @@
// 编辑找人干活待业人员
function editPersonPopup(index){
let workersParamObj = pageData.workersParam[index];
workersParamObj.eduZh = returnDictZhVel('edu',workersParamObj.edu)
workersParamObj.eduZh = returnDictZhVel('edu',workersParamObj.edu);
if(pageType == 'edit'){
workersParamObj.genderZh = workersParamObj.gender+'';
startDate = workersParamObj.birthday;
}
// workersParamObj.skill.split("、");
Object.keys(workersParamObj).forEach((item) => {
Object.keys(workersParamObj).forEach((item) => {
tempWorkersParam[item] = workersParamObj[item];
});
});
pageData.actionType = "edit";
pageData.editWorkersIndex = index;
pageData.isPersonPopupShow = true;
......@@ -552,15 +559,13 @@
function getDetails(id) {
pageData.loading = true
LinghuoyonggongAPI.employmentDetails({ id })
LinghuoyonggongAPI.getLaborAppDetail({ id })
.then((res) => {
pageData.form = res
pageData.form.areaText = getText(pageData.form.area, '/')
pageData.form.urgentdegreeText = pageData.options.urgentdegree.find(
(item) => item.value == pageData.form.urgentdegree,
)?.text
pageData.form.typeText = pageData.options.type.find((item) => item.value == pageData.form.type)?.text
pageData.form.pictureObj = pageData.form.picture && parseUrlInfo(pageData.form.picture)
pageData.laborParam.addr = res.villageName;
pageData.laborParam.contactName = res.contactName;
pageData.laborParam.contactMobile = res.contactMobile;
pageData.workersParam = res.workers;
pageData.isActive = true;
})
.finally(() => {
pageData.loading = false
......
src/pages/nongchang/nongchang.vue
......@@ -222,6 +222,7 @@ function getAgricultureModelsList() {
}).then((res) => {
const { records } = res
pageData.agricultureModels = []
records.sort((a, b) => a.sort_order - b.sort_order);
pageData.agricultureModels = records
})
}
......@@ -233,6 +234,7 @@ function getBaseManagementList() {
}).then((res) => {
const { records } = res
pageData.baseManagement = []
records.sort((a, b) => a.sort_order - b.sort_order);
pageData.baseManagement = records
})
}
......@@ -242,12 +244,19 @@ function getCommonToolsList() {
}).then((res) => {
const { records } = res
pageData.commonTools = []
records.sort((a, b) => a.sort_order - b.sort_order);
pageData.commonTools = records
})
}
function getAgricultureClassList() {
getVideoList({ pageNo: 1, pageSize: 10, status: 1, classify: 3 }).then((res) => {
const { records } = res
let scale:any = 0;
for(let i = 0; i < records.length;i++){
scale = (340 / records[i].width).toFixed(1);
records[i].videoWidth = 340;
records[i].videoHeight = Math.floor(records[i].height * scale);
}
pageData.agricultureClass.videoList = records
})
}
......@@ -474,6 +483,10 @@ function toDetail(item: Recordable) {
Navigate.to(`/pages/nongchang/detail/index?id=${id}&name=${encodeURIComponent(name)}`)
}
function handlePublish() {
Navigate.to('/pages/linghuoyonggong/linghuoyonggong')
}
onHide(() => {
// 停止所有其他视频的播放（只暂停，不重置位置）
pageData.agricultureClass.videoList.forEach((_, index) => {
......@@ -590,9 +603,17 @@ onHide(() => {
<view class="codefun-flex-col mt-17">
<view class="codefun-flex-col codefun-justify-start section_6">
<view class="codefun-flex-row equal-division_3">
<template v-for="model in pageData.agricultureModels" :key="model.id">
<view class="codefun-flex-col equal-division-item_5 group_11">
<view class="flex-row" style="text-align: center">
<view class="yr-wd-style" v-for="model in pageData.agricultureModels" :key="model.id">
<view class="yr-model-item">
<image class="model_icon" :src="model.icon_url" />
<view class="model_content">
<view class="fontsize_28">{{ model.name }}</view>
<view class="fontsize_24 font_11">{{ model.describes }}</view>
<view class="model-btn" @click="onAgricultureModelClick(model)">
<text class="font_8 text_24">查看介绍</text>
</view>
</view>
<!-- <view class="flex-row" style="text-align: center">
<view class="flex-center">
<image class="w-80 h-80" :src="model.icon_url" />
</view>
......@@ -603,51 +624,19 @@ onHide(() => {
</view>
<view
class="codefun-flex-col codefun-justify-start codefun-items-center codefun-self-center text-wrapper_3 mt-2!"
@click="onAgricultureModelClick(model)"
>
@click="onAgricultureModelClick(model)">
<text class="font_8 text_24">查看介绍</text>
</view>
</view> -->
</view>
</template>
</view>
</view>
<view class="codefun-mt-12 codefun-flex-col section_8">
<view class="codefun-flex-row equal-division_4">
<view
class="codefun-flex-row codefun-justify-center equal-division-item_6 section_9"
@click="onViewMoreFlexibleEmployment(1)"
>
<text class="codefun-self-start font_9 text_25">{{
pageData.flexibleEmployment.working
}}</text>
<image
class="codefun-self-center image_8 ml-9"
src="/static/images/codefun/e12b4605ec265981ebf23e742ae09d77.png"
/>
</view>
<view
class="codefun-flex-row codefun-justify-evenly equal-division-item_6 section_10 ml-11"
@click="onViewMoreFlexibleEmployment(2)"
>
<text class="codefun-self-start font_9 text_26">{{
pageData.flexibleEmployment.earning
}}</text>
<image
class="codefun-self-center image_9"
src="/static/images/codefun/abc27711926ec08e17bd512f96740931.png"
/>
</view>
</view>
<text class="codefun-self-start font_10 text_27 mt-7">{{
pageData.flexibleEmployment.progress
}}</text>
</view>
</view>
</view>
<view class="codefun-flex-col group_15">
<view class="codefun-flex-row codefun-justify-between codefun-items-baseline">
<text class="font text_28">基地管理</text>
<text class="font_6 text_29" @click="onBaseManagementClick">更多</text>
<!-- <text class="font_6 text_29" @click="onBaseManagementClick">更多</text> -->
</view>
<view class="codefun-flex-row equal-division_5 mt-17">
<view
......@@ -672,7 +661,7 @@ onHide(() => {
<view class="codefun-flex-col group_21">
<view class="codefun-flex-row codefun-justify-between codefun-items-center group_22">
<text class="font text_42">常用工具</text>
<text class="font_6 text_43 text_44" @click="onViewMoreTools">更多</text>
<!-- <text class="font_6 text_43 text_44" @click="onViewMoreTools">更多</text> -->
</view>
<view class="codefun-flex-col section_12">
<view class="flex-center flex-wrap pt-3">
......@@ -698,6 +687,8 @@ onHide(() => {
<fui-waterfall-item
v-for="(video, index) in pageData.agricultureClass.videoList"
:key="index"
:imgWidth="video.videoWidth"
:imgHeight="video.videoHeight"
:src="video.thumbnailPath"
@click="playVideo(index)"
>
......@@ -735,11 +726,22 @@ onHide(() => {
></video>
</fui-waterfall-item>
</fui-waterfall>
<view @click="onViewMoreClass" style="text-align: center;font-size: 28rpx;padding:32rpx 0rpx;color:#999999;">点击查看更多</view>
</view>
</view>
</view>
</view>
</view>
<fui-fab position="right" distance="10" bottom="240" width="96" @click="handlePublish">
<view class="text-white text-center">
<!-- <view class="fab-icon" /> -->
<image style="width: 52rpx;height:52rpx;" src="/static/images/nongchang/work_icon.png" />
<view style="font-size: 18rpx;margin-top: -16rpx;">找人干活</view>
</view>
</fui-fab>
</template>
<style scoped lang="scss">
......@@ -1913,4 +1915,41 @@ onHide(() => {
left: 50%;
transform: translateX(-50%);
}
.yr-wd-style{
display: flex;
padding-top: 36rpx;
padding-bottom: 20rpx;
.yr-model-item{
display: flex;
padding-left: 20rpx;
}
.model_icon{
width: 68rpx;
height: 68rpx;
}
.model_content{
display: flex;
flex-direction: column;
}
.model-btn{
width: 136rpx;
border-radius: 40rpx;
background: rgba(93, 182, 111, 0.2);
height: 40rpx;
opacity: 1;
font-size: 24rpx;
font-weight: 400;
letter-spacing: 0px;
line-height: 40rpx;
color: #16A34A;
text-align: center;
margin-top: 22rpx;
}
}
::v-deep .fui-fab__btn-main {
background: linear-gradient(124.25deg, #a5d63f 0%, #5db66f 100%) !important;
box-shadow: 0px 1px 8px #5db66f;
}
</style>
src/pages/shouye/shouye.vue
......@@ -335,6 +335,7 @@ function getServiceStatsList() {
function getAgricultureClassList() {
getVideoList({ pageNo: 1, pageSize: 10, status: 1 }).then((res) => {
const { records } = res;
/*
pageData.videoDataLen = records.length;
if(pageData.isApp){
let videwHtmlList = '';
......@@ -342,7 +343,16 @@ function getAgricultureClassList() {
videwHtmlList += '<video class="htmlvideo" data-index="'+i+'" src="'+records[i].url+'"></video>'
}
pageData.videwHtmlList = videwHtmlList;
} */
let scale:any = 0;
for(let i = 0; i < records.length;i++){
scale = (340 / records[i].width).toFixed(1);
records[i].videoWidth = 340;
records[i].videoHeight = Math.floor(records[i].height * scale);
}
console.log("农技课堂***************")
console.log(records);
pageData.agricultureClass.videoList = records;
})
}
......@@ -767,7 +777,7 @@ export default {
<text class="font_7 text_33" @click="onViewMoreClass">查看全部</text>
</view>
<view v-if="pageData.videoListIsShow" class="codefun-flex-col section_13 !relative rounded-lg" style="margin-left: -28rpx;">
<!-- <view v-if="pageData.videoListIsShow" class="codefun-flex-col section_13 !relative rounded-lg" style="margin-left: -28rpx;">
<fui-waterfall topGap="20" leftGap="20" rightGap="20" bottomGap="20">
<fui-waterfall-item :imgWidth="video.videoWidth" :imgHeight="video.videoHeight" v-for="(video, index) in pageData.agricultureClass.videoList" :key="index"
:src="video.thumbnailPath" @click="playVideo(index)">
......@@ -792,17 +802,16 @@ export default {
</view>
<view v-if="pageData.isApp" style="width:0px;height:0px;display:none;" class="domClick" @click="domClick" :vsrc="pageData.agricultureClass.videoList":change:vsrc="renderscript.methodInRenderjs">
<!-- <video class="htmlvideo" :src="video.url" v-for="(video, index) in pageData.agricultureClass.videoList" :key="index"></video> -->
<view v-html="pageData.videwHtmlList"></view>
</view>
<view v-else style="width:0px;height:0px;display:none;" v-for="(video, index) in pageData.agricultureClass.videoList" :key="index">
<video :src="video.url" @loadedmetadata="handleMetadataLoaded($event, video)"></video>
</view>
</view> -->
<!-- <view class="codefun-flex-col section_13 !relative rounded-lg" style="margin-left: -28rpx;">
<view class="codefun-flex-col section_13 !relative rounded-lg" style="margin-left: -28rpx;">
<fui-waterfall topGap="20" leftGap="20" rightGap="20" bottomGap="20">
<fui-waterfall-item v-for="(video, index) in pageData.agricultureClass.videoList" :key="index"
<fui-waterfall-item :imgWidth="video.videoWidth" :imgHeight="video.videoHeight" v-for="(video, index) in pageData.agricultureClass.videoList" :key="index"
:src="video.thumbnailPath" @click="playVideo(index)">
<view class="flex flex-col justify-between pl-2 pr-2 pb-2">
<view class="fontsize_28 mt-1 mb-2 font-13">{{ video.title }}</view>
......@@ -817,12 +826,12 @@ export default {
:title="video.title" :controls="true" :autoplay="false" :muted="false" :loop="true"
:show-play-btn="true" :show-center-play-btn="true" :enable-progress-gesture="true"
:show-progress="true" :direction="0" object-fit="contain"
@loadedmetadata="handleMetadataLoaded" @play="handleVideoPlay(index)"
@play="handleVideoPlay(index)"
@pause="handleVideoPause(index)"
@fullscreenchange="handleFullscreenChange($event, index)" class="!hidden"></video>
</fui-waterfall-item>
</fui-waterfall>
</view> -->
</view>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论