Skip to content

basic-uniapp-v3
basic-uniapp-v3
提交 7ef27b6c 作者: 宇宙超人
操作

修改首页和农场

上级 fb92718d
正在显示 包含 1149 行增加 和 197 行删除
src/api/model/wode.ts
......@@ -14,3 +14,14 @@ export function bizCommonFileList(params = {}) {
params,
})
}
/**
* 添加资源
* @param params
* @returns
*/
export function addResource(params = {}) {
return otherHttp.post({
url: '/resource/add',
params,
})
}
src/pages.json
......@@ -389,6 +389,30 @@
}
}
}
},
{
"path": "pages/resource/resource",
"style": {
"navigationBarTitleText": "资源库管理",
"enablePullDownRefresh": false,
"navigationBarBackgroundColor": "#5DB66F",
"navigationBarTextStyle": "white",
"backgroundColorBottom": "#F2F2F2",
"app-plus": {
"titleNView": {
"titleSize": "20",
"buttons": [
{
"text": "+ 添加资源",
"fontSrc": "/static/uni.ttf",
"color": "#fff",
"fontSize": "28rpx",
"width":"auto"
}
]
}
}
}
}
],
"easycom": {
......
src/pages/device/device.vue
......@@ -682,7 +682,7 @@ body {
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.1);
}
::v-deep .uni-swipe_box {
::v-deep .uni-swipe {
border-radius: 16rpx;
margin-bottom: 20rpx;
}
......
src/pages/nongchang/nongchang.vue
......@@ -365,7 +365,7 @@
<view class="codefun-flex-col section">
<view class="codefun-flex-col mt-52rpx">
<text class="codefun-self-center font text">{{ pageData.header.title }}</text>
<view class="codefun-flex-col codefun-self-stretch mt-19">
<!-- <view class="codefun-flex-col codefun-self-stretch mt-19">
<view class="codefun-flex-row codefun-items-center section_2">
<image class="image_5" src="/static/images/codefun/b8d30fcc0b08b881a41c8b3e35b7f8ac.png" />
<text class="codefun-ml-8 font_2 text_2">{{ pageData.header.searchPlaceholder }}</text>
......@@ -381,7 +381,7 @@
<text class="font_3 mt-13" :class="`text_${item.id + 2}`">{{ item.name }}</text>
</view>
</view>
</view>
</view> -->
</view>
</view>
<view class="codefun-flex-col codefun-relative group_6">
......@@ -420,7 +420,7 @@
<view class="codefun-flex-col group_10">
<view class="codefun-flex-row codefun-justify-between codefun-items-center">
<text class="font">农业大模型</text>
<text class="font_6 text_17">全部</text>
<!-- <text class="font_6 text_17">全部</text> -->
</view>
<view class="codefun-flex-col mt-17">
<view class="codefun-flex-col codefun-justify-start section_6">
......
src/pages/resource/components/save-dialog.vue 0 → 100644
<template>
<u-modal :show="show" :title="dialogTitle" :showConfirmButton="false" :showCancelButton="false" @close="handleClose"
:closeOnClickOverlay="false" >
<view class="dialog-content">
<u-form :model="formData" :rules="rules" ref="formRef" label-width="auto">
<!-- 资源基本信息 -->
<!-- <view class="section-title">资源基本信息</view> -->
<u-form-item label="" prop="fileName">
<u-input v-model="formData.fileName" placeholder="请输入文件名称" border="bottom" />
</u-form-item>
<!-- <u-form-item label="文件类型" prop="fileType" required>
<u-input v-model="formData.fileType" placeholder="请选择文件类型" border="bottom"
@click="showFileTypePicker = true" />
</u-form-item> -->
<u-form-item label="上传文件" prop="file" required>
<view class="file-upload">
<u-button v-if="!formData.file" @click="chooseFile" type="primary"
class="ui-button">
<text class="font_10">选择文件</text>
</u-button>
<view v-else class="file-info">
<view class="file-name-container">
<text class="file-name">{{ formData.file.name }}</text>
<text class="remove-icon" @click="removeFile">×</text>
</view>
</view>
</view>
</u-form-item>
<!-- 操作按钮 -->
<view class="dialog-buttons">
<u-button type="primary" @click="handleSubmit" :loading="loading" size="normal" class="submit-btn"
color="var(--fui-color-success)">
{{ submitButtonText }}
</u-button>
<u-button @click="handleClose" size="normal" class="cancel-btn">取消</u-button>
</view>
</u-form>
</view>
</u-modal>
</template>
<script setup lang="ts">
import { ref, reactive, watch, computed } from 'vue'
import { useUserStore } from '@/store/modules/user'
import { useGlobSetting } from '/@/hooks/setting'
import * as WodeAPI from '@/api/model/wode'
// 定义Props
interface Props {
show: boolean
editData?: any
}
const props = withDefaults(defineProps<Props>(), {
show: false,
editData: null
})
// 定义Emits
const emit = defineEmits<{
'update:show': [value: boolean]
'submit': [data: any]
'close': []
'submitSuccess': []
}>()
// 表单引用
const formRef = ref()
const loading = ref(false)
const uploading = ref(false)
const showFileTypePicker = ref(false)
// 文件类型选项
const fileTypeOptions = [
{ value: 'doc', text: 'Word文档' },
{ value: 'xls', text: 'Excel表格' },
{ value: 'ppt', text: 'PPT演示' },
{ value: 'pdf', text: 'PDF文档' },
{ value: 'img', text: '图片文件' },
{ value: 'video', text: '视频文件' },
{ value: 'audio', text: '音频文件' },
{ value: 'zip', text: '压缩文件' },
{ value: 'other', text: '其他文件' }
]
// 表单数据
const formData = reactive({
fileName: '',
fileType: '',
fileTypeText: '',
file: null,
fileSrc: '',
})
// 计算属性
const dialogTitle = computed(() => {
return props.editData ? '编辑资源' : '上传资源'
})
const submitButtonText = computed(() => {
return props.editData ? '保存' : '上传'
})
// 表单验证规则
const rules = {
fileName: [
{ required: true, message: '请输入文件名称', trigger: 'blur' },
{ min: 2, max: 50, message: '文件名称长度在2-50个字符之间', trigger: 'blur' }
],
fileType: [
{ required: true, message: '请选择文件类型', trigger: 'change' }
],
file: [
{
required: true,
message: '请选择文件',
trigger: 'change',
validator: (rule, value, callback) => {
if (!value) {
callback(new Error('请选择文件'))
} else {
callback()
}
}
}
]
}
// 监听显示状态
watch(() => props.show, (newVal) => {
if (newVal && props.editData) {
// 编辑模式，填充数据
resetFormData()
loadEditData()
} else if (newVal) {
// 添加模式，重置表单
resetFormData()
}
})
// 重置表单数据
const resetFormData = () => {
formData.fileName = ''
formData.fileType = ''
formData.fileTypeText = ''
formData.file = null
formData.fileSrc = ''
// 清除验证状态
if (formRef.value) {
formRef.value.resetFields()
}
}
// 加载编辑数据
const loadEditData = () => {
if (!props.editData) return
formData.fileName = props.editData.fileName || ''
formData.fileType = props.editData.fileType || ''
formData.fileTypeText = props.editData.fileTypeText || ''
// 编辑模式不修改文件本身
// formData.file = null
}
const uplpoadFile = ref(null)
// 选择文件
const chooseFile = () => {
uni.chooseFile({
count: 1,
extension: ['*'],
success: (res) => {
uplpoadFile.value = res
const tempFilePaths = res.tempFilePaths
const tempFiles = res.tempFiles
console.log(tempFiles)
if (tempFiles && tempFiles.length > 0) {
if (!formData.fileName) {
formData.fileName = tempFiles[0].name || ''
}
// 根据文件扩展名设置文件类型
const fileName = tempFiles[0].name || ''
const ext = fileName.split('.').pop()?.toLowerCase() || ''
const fileType = getFileTypeByExt(ext)
formData.file = tempFiles[0]
formData.fileType = fileType.value
formData.fileTypeText = fileType.text
// 文件选择后触发验证
if (formRef.value) {
formRef.value.validateField('file')
}
}
},
fail: (err) => {
console.error('选择文件失败:', err)
uni.showToast({ title: '选择文件失败', icon: 'none' })
uploading.value = false
}
})
}
// 移除文件
const removeFile = () => {
formData.file = null
// 移除文件后触发验证
if (formRef.value) {
formRef.value.validateField('file')
}
}
// 根据文件扩展名获取文件类型
const getFileTypeByExt = (ext) => {
const map = {
'doc': 'doc',
'docx': 'doc',
'xls': 'xls',
'xlsx': 'xls',
'ppt': 'ppt',
'pptx': 'ppt',
'pdf': 'pdf',
'jpg': 'img',
'jpeg': 'img',
'png': 'img',
'gif': 'img',
'mp4': 'video',
'avi': 'video',
'mp3': 'audio',
'wav': 'audio',
'zip': 'zip',
'rar': 'zip',
'7z': 'zip'
}
const type = map[ext] || 'other'
return fileTypeOptions.find(item => item.value === type) || fileTypeOptions[8]
}
const userStore = useUserStore()
const globSetting = useGlobSetting()
const toastRef = ref()
// 提交表单
const handleSubmit = async () => {
try {
console.log(formData)
// 先进行表单验证
const valid = await formRef.value.validate()
if (!valid) {
// 验证失败，返回
return
}
// 额外校验文件是否存在
if (!formData.file) {
uni.showToast({
title: '请选择文件',
icon: 'none'
})
return
}
loading.value = true
// 准备提交数据
const submitData = {
fileName: formData.fileName,
fileType: formData.fileType,
fileSize: formData.file ? formData.file.size : 0,
fileSrc: formData.fileSrc,
// createTime: new Date().toLocaleString()
}
// API留空
console.log('上传资源数据:', submitData)
uni.uploadFile({
url: globSetting.apiUrl + globSetting.urlPrefix + '/sys/common/upload', // 直接使用上传接口URL
filePath: uplpoadFile.value.tempFilePaths[0],
name: 'file',
formData: {
biz: 'temp',
},
header: {
'X-Access-Token': userStore.getToken,
},
success: (res) => {
if (res.statusCode === 200) {
const data = JSON.parse(res.data)
if (data.code === 200 || data.code === 0) {
submitData.fileSrc = data.message;
WodeAPI.addResource(submitData).then(res => {
toastRef.value.show({
type: 'success',
text: `上传成功`,
})
emit('update:show', false)
emit('submitSuccess')
}).catch(error => {
uni.showToast({
title: error.message || '提交失败，请重试',
icon: 'none',
duration: 2000
})
}).finally(() => {
loading.value = false
})
}
}
},
fail: () => {
toastRef.value.show({
type: 'error',
text: '上传失败',
})
},
})
// 模拟上传过程
// setTimeout(() => {
// uni.showToast({ title: '操作成功', icon: 'success' })
// emit('update:show', false)
// emit('submitSuccess')
// }, 1500)
} catch (error) {
console.log('提交失败:', error)
uni.showToast({
title: '操作失败',
icon: 'none',
duration: 2000
})
} finally {
loading.value = false
}
}
// 关闭弹窗
const handleClose = () => {
emit('update:show', false)
emit('close')
}
</script>
<style lang="scss" scoped>
.dialog-content {
padding: 10rpx 30rpx;
width: 90%;
max-height: 80vh;
overflow-y: auto;
}
.section-title {
font-size: 32rpx;
font-weight: bold;
color: #333;
margin-bottom: 30rpx;
border-left: 6rpx solid #5DB66F;
padding-left: 12rpx;
}
.dialog-buttons {
display: flex;
justify-content: space-between;
margin-top: 50rpx;
gap: 20rpx;
}
.submit-btn,
.cancel-btn {
flex: 1;
}
.file-upload {
width: 100%;
}
.file-info {
padding: 20rpx;
background-color: #f5f5f5;
border-radius: 8rpx;
.file-name-container {
position: relative;
display: flex;
align-items: center;
}
.file-name {
flex: 1;
width: 40rpx;
font-size: 28rpx;
color: #333;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
padding-right: 40rpx;
}
.remove-icon {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
font-size: 36rpx;
color: #999;
width: 40rpx;
height: 40rpx;
display: flex;
align-items: center;
justify-content: center;
&:active {
color: #ff4d4f;
background-color: rgba(255, 77, 79, 0.1);
border-radius: 50%;
}
}
}
// 模态框样式调整
::v-deep .u-modal {
background: linear-gradient(0deg, rgba(93, 182, 111, 0) 50%, rgba(93, 182, 111, 0.25) 100%);
.u-modal__content {
border-radius: 20rpx;
padding: 20rpx 0rpx;
}
.u-modal__header {
border-bottom: 2rpx solid #f0f0f0;
padding: 30rpx;
.u-modal__header__title {
font-size: 32rpx;
font-weight: 600;
color: #333;
}
}
}
.ui-button {
padding: 16rpx 0;
background-color: #5db66f26;
border-radius: 10rpx;
mix-blend-mode: NOTTHROUGH;
border-color: #5db66f26;
.font_10 {
font-size: 24rpx;
line-height: 24rpx;
color: #16a34a;
}
}
</style>
src/pages/resource/resource.vue 0 → 100644
<template>
<view class="codefun-flex-col page">
<z-paging ref="paging" v-model="pageData.list" @query="queryList">
<view class="codefun-flex-col group_3">
<view class="codefun-flex-row codefun-items-center section_2">
<image class="image_6" src="/static/images/codefun/6c5c5a3c082b8c60a307d3a7caee623c.png" />
<u-input v-model="pageData.param.fileName" placeholder="请输入文件名称搜索" border="none"
class="codefun-ml-8" @confirm="handleSearch" />
</view>
<!-- 资源列表 - 根据图片样式修改 -->
<view class="resource-list">
<view v-for="(item, index) in pageData.list" :key="index" class="resource-item">
<view class="resource-content">
<view class="resource-main">
<view class="resource-name">{{ item.fileName }}</view>
<view class="resource-meta">
<text class="resource-size">{{ formatFileSize(item.fileSize) }}</text>
<text class="separator">|</text>
<text class="download-count">已下载{{ item.downloadCount || 25 }}次</text>
<text class="separator">|</text>
<text class="upload-time">{{ formatTime(item.createTime) }}</text>
</view>
</view>
<view class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_4"
@click.stop="handleDownload(item)">
<text class="font_10">下载</text>
</view>
<!-- <view class="download-section">
<view class="download-btn" @click="handleDownload(item)">
<text class="btn-text">下载</text>
</view>
</view> -->
</view>
</view>
</view>
<!-- 空状态 -->
<view class="empty-state" v-if="pageData.list.length === 0">
<image class="empty-icon" src="/static/images/empty-file.png" mode="aspectFit"></image>
<text class="empty-text">暂无资源文件</text>
</view>
</view>
</z-paging>
<!-- 弹窗组件 -->
<save-dialog :show="showDialog" :editData="currentEditData" @update:show="showDialog = $event"
@submitSuccess="handleSubmitSuccess" />
</view>
</template>
<script setup>
import { nextTick, reactive, ref } from 'vue'
import { onLoad, onNavigationBarButtonTap, onShow } from '@dcloudio/uni-app'
// import * as ResourceAPI from '@/api/model/resource' // API留空
import SaveDialog from './components/save-dialog.vue'
const isOnePage = ref(true)
const paging = ref(null)
const pageData = reactive({
param: {
pageNo: 1,
pageSize: 10,
fileName: '',
},
list: [],
})
function getList() {
if (!paging.value) return
// API留空，使用模拟数据 - 根据图片内容调整
setTimeout(() => {
const mockData = [
{
id: 1,
fileName: '水稻种植合同模版',
fileType: 'PDF',
fileSize: 128000, // 125kb
downloadCount: 25,
createTime: '2025-11-02 14:00'
},
{
id: 2,
fileName: '农药使用指南',
fileType: 'PDF',
fileSize: 128000,
downloadCount: 25,
createTime: '2025-11-02 14:00'
},
{
id: 3,
fileName: '农业补贴列表说明',
fileType: 'PDF',
fileSize: 128000,
downloadCount: 25,
createTime: '2025-11-02 14:00'
},
{
id: 4,
fileName: '小麦种植合同模版',
fileType: 'PDF',
fileSize: 128000,
downloadCount: 25,
createTime: '2025-11-02 14:00'
},
{
id: 5,
fileName: '化肥使用指南',
fileType: 'PDF',
fileSize: 128000,
downloadCount: 25,
createTime: '2025-11-02 14:00'
},
{
id: 6,
fileName: '油茶种植补贴列表说明',
fileType: 'PDF',
fileSize: 128000,
downloadCount: 25,
createTime: '2025-11-02 14:00'
}
]
pageData.total = mockData.length
paging.value.complete(mockData)
}, 500)
}
function queryList(pageNo, pageSize) {
pageData.param.pageNo = pageNo
pageData.param.pageSize = pageSize
getList()
}
function handleSearch() {
pageData.param.pageNo = 1
if (paging.value) {
paging.value.reload()
}
}
const showDialog = ref(false)
const currentEditData = ref(null)
onNavigationBarButtonTap((_) => {
showAddDialog()
})
const showAddDialog = () => {
currentEditData.value = null
showDialog.value = true
}
// 格式化时间显示
const formatTime = (time) => {
if (!time) return ''
// 如果是完整的时间字符串，可以格式化为图片中的样式
return time.includes(' ') ? time : `${time} 14:00`
}
// 下载资源
const handleDownload = (resource) => {
console.log('下载资源:', resource)
uni.showToast({
title: '开始下载',
icon: 'success',
duration: 2000
})
// 模拟下载逻辑
setTimeout(() => {
// 更新下载次数
const index = pageData.list.findIndex(item => item.id === resource.id)
if (index !== -1) {
pageData.list[index].downloadCount = (pageData.list[index].downloadCount || 0) + 1
}
}, 1000)
}
// 格式化文件大小
const formatFileSize = (bytes) => {
if (!bytes) return '125kb'
const k = 1024
const sizes = ['B', 'KB', 'MB', 'GB']
const i = Math.floor(Math.log(bytes) / Math.log(k))
return parseFloat((bytes / Math.pow(k, i)).toFixed(0)) + sizes[i].toLowerCase()
}
const handleSubmitSuccess = () => {
handleSearch()
}
</script>
<style lang="scss">
body {
background-color: #f8f9fa;
}
.page {
background-color: #f8f9fa;
width: 100%;
overflow-y: auto;
overflow-x: hidden;
height: 100%;
}
.group_3 {
padding: 28rpx 24rpx;
}
.section_2 {
padding: 16rpx 20rpx;
background-color: #ffffff;
border-radius: 1998rpx;
margin-bottom: 30rpx;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.06);
}
.image_6 {
width: 32rpx;
height: 32rpx;
}
/* 资源列表样式 - 根据图片样式重写 */
.resource-list {
margin-top: 0;
}
.resource-item {
background-color: #ffffff;
border-radius: 16rpx;
margin-bottom: 20rpx;
box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.08);
overflow: hidden;
transition: all 0.3s ease;
&:active {
transform: translateY(2rpx);
box-shadow: 0 1rpx 6rpx rgba(0, 0, 0, 0.1);
}
}
.resource-content {
display: flex;
justify-content: space-between;
align-items: center;
padding: 30rpx 24rpx;
}
.resource-main {
flex: 1;
min-width: 0;
}
.resource-name {
font-size: 32rpx;
font-weight: 500;
color: #333333;
line-height: 1.4;
margin-bottom: 12rpx;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
overflow: hidden;
text-overflow: ellipsis;
}
.resource-meta {
display: flex;
align-items: center;
font-size: 24rpx;
color: #999999;
gap: 12rpx;
flex-wrap: wrap;
}
.separator {
color: #dddddd;
font-size: 20rpx;
}
.resource-size,
.download-count,
.upload-time {
color: #666666;
}
.download-section {
margin-left: 30rpx;
flex-shrink: 0;
}
.download-btn {
background-color: #5DB66F;
border: none;
border-radius: 20rpx;
padding: 12rpx 30rpx;
min-width: 120rpx;
transition: all 0.3s ease;
&::after {
border: none;
}
&:active {
background-color: #4ca85c;
transform: scale(0.95);
}
}
.text-wrapper_4 {
padding: 16rpx 0;
background-color: #5db66f26;
border-radius: 400rpx;
mix-blend-mode: NOTTHROUGH;
width: 136rpx;
.font_10 {
font-size: 24rpx;
line-height: 24rpx;
color: #16a34a;
}
}
.btn-text {
color: #ffffff;
font-size: 28rpx;
font-weight: 500;
}
.empty-state {
display: flex;
flex-direction: column;
align-items: center;
padding: 120rpx 0;
color: #999999;
}
.empty-icon {
width: 160rpx;
height: 160rpx;
margin-bottom: 30rpx;
opacity: 0.6;
}
.empty-text {
font-size: 28rpx;
color: #999999;
}
/* 响应式调整 */
@media (max-width: 375px) {
.resource-content {
padding: 24rpx 20rpx;
}
.resource-name {
font-size: 30rpx;
}
.resource-meta {
font-size: 22rpx;
}
.download-btn {
padding: 10rpx 24rpx;
min-width: 100rpx;
}
.btn-text {
font-size: 26rpx;
}
}
</style>
src/pages/shouye/shouye.vue
<script setup lang="ts">
import { reactive } from 'vue'
import { onPullDownRefresh } from '@dcloudio/uni-app'
import dayjs from 'dayjs'
import { closeSplashscreenAndChechUpgrade } from '@/utils/upgrade'
import * as WeatherAPI from '@/api/model/weather'
import * as HomeAPI from '@/api/model/home'
import { useDictStore } from '@/store/modules/dict'
const dictStore = useDictStore()
const model = reactive({
import { reactive } from 'vue'
import { onPullDownRefresh, onHide, onUnload } from '@dcloudio/uni-app'
import dayjs from 'dayjs'
import { closeSplashscreenAndChechUpgrade } from '@/utils/upgrade'
import * as WeatherAPI from '@/api/model/weather'
import * as HomeAPI from '@/api/model/home'
import { useDictStore } from '@/store/modules/dict'
const dictStore = useDictStore()
const model = reactive({
// 湖南省人民政府
location: '112.982931,28.116698',
})
})
onLoad(() => {
onLoad(() => {
// 关闭启动页并检查更新
closeSplashscreenAndChechUpgrade()
})
})
onShow(() => {
onShow(() => {
uni.getLocation({
type: 'wgs84',
success(res) {
......@@ -63,17 +63,17 @@
getServiceStatsList()
// 农技课堂
getAgricultureClassList()
})
})
// 下拉刷新
onPullDownRefresh(() => {
// 下拉刷新
onPullDownRefresh(() => {
setTimeout(function () {
uni.stopPullDownRefresh()
Message.toast('刷新成功')
}, 1000)
})
})
function getWeatherRecommend(weather: string) {
function getWeatherRecommend(weather: string) {
switch (weather) {
case '晴':
return '宜喷药'
......@@ -86,10 +86,10 @@
default:
return '无建议'
}
}
}
// 刷新天气信息
function reloadWeather() {
// 刷新天气信息
function reloadWeather() {
WeatherAPI.now(model.location).then((res) => {
console.log('WeatherAPI.now', res)
......@@ -109,10 +109,10 @@
}
})
})
}
}
// 页面数据
const pageData = reactive({
// 页面数据
const pageData = reactive({
// 顶部标题和搜索
header: {
title: $app.name,
......@@ -213,9 +213,9 @@
videoList: [],
},
current: 0,
})
})
function getServiceItems() {
function getServiceItems() {
HomeAPI.zoneList({
pageNo: 1,
pageSize: 4,
......@@ -226,8 +226,8 @@
pageData.serviceItems = []
pageData.serviceItems = records
})
}
function getMenuItems() {
}
function getMenuItems() {
HomeAPI.zoneList({
pageNo: 1,
pageSize: 4,
......@@ -238,8 +238,8 @@
pageData.menuItems = []
pageData.menuItems = records
})
}
function getWarningInfo() {
}
function getWarningInfo() {
if (!pageData.weather.lon || !pageData.weather.lat) {
return
}
......@@ -250,8 +250,8 @@
}).then((res) => {
pageData.weather.warning = res[0].criteria
})
}
function getProductMarketList() {
}
function getProductMarketList() {
HomeAPI.productMarketList({
status: 1,
}).then((res) => {
......@@ -269,16 +269,16 @@
}
})
})
}
function getServiceStatsList() {
}
function getServiceStatsList() {
HomeAPI.serviceStatsList({
status: 1,
}).then((res) => {
const { records } = res
pageData.serviceStats = records
})
}
function getAgricultureClassList() {
}
function getAgricultureClassList() {
HomeAPI.agricultureClassList({
status: 1,
}).then((res) => {
......@@ -286,46 +286,46 @@
pageData.agricultureClass.videoList = records
pageData.agricultureClass.title = records[0]?.title
})
}
}
// 菜单点击事件
function onMenuItemClick(item: any) {
// 菜单点击事件
function onMenuItemClick(item: any) {
console.log('点击菜单项:', item)
// 在这里添加具体的菜单点击逻辑
}
}
// 农产品关注点击事件
function onProductFollowClick(product: any) {
// 农产品关注点击事件
function onProductFollowClick(product: any) {
console.log('点击关注农产品:', product)
// 在这里添加具体的关注逻辑
}
}
// 查看更多农技课堂
function onViewMoreClass() {
// 查看更多农技课堂
function onViewMoreClass() {
console.log('查看全部农技课堂')
// 在这里添加具体的查看逻辑
}
}
// 轮播视频切换的时候触发
function handleChangeVideo(e: any) {
// 轮播视频切换的时候触发
function handleChangeVideo(e: any) {
// console.log('切换视频', e.detail.current)
pageData.current = e.detail.current
pageData.agricultureClass.title = pageData.agricultureClass.videoList[pageData.current]?.title
}
}
// 获取视频时长
function handleMetadataLoaded(e: any) {
// 获取视频时长
function handleMetadataLoaded(e: any) {
pageData.agricultureClass.time = e.target.duration
}
// 解决轮播视频切换时，上一个视频不停止播放的问题
function handleVideoPlay(currentIndex) {
}
// 解决轮播视频切换时，上一个视频不停止播放的问题
function handleVideoPlay(currentIndex) {
pageData.agricultureClass.videoList.forEach((_, index) => {
if (index !== currentIndex) {
const videoContext = uni.createVideoContext(`video${index}`)
videoContext.pause()
}
})
}
}
</script>
<template>
......@@ -345,14 +345,11 @@
<view class="codefun-flex-row codefun-justify-between">
<view class="codefun-flex-row codefun-items-center">
<view
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper"
>
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper">
<text class="font_2 text_4">{{ pageData.weather.location }}</text>
</view>
<image
class="image_6 codefun-ml-6"
src="/static/images/codefun/a2f290fb1b65d093b844e73ddae1aed9.png"
/>
<image class="image_6 codefun-ml-6"
src="/static/images/codefun/a2f290fb1b65d093b844e73ddae1aed9.png" />
</view>
<view class="codefun-flex-col codefun-justify-start codefun-items-start text-wrapper_2">
<text class="text_3">{{ pageData.weather.date }}</text>
......@@ -360,10 +357,8 @@
</view>
<view class="codefun-flex-row group_5">
<view class="codefun-flex-row codefun-items-center group_8">
<image
class="codefun-shrink-0 image_8"
:src="`/static/images/weather/${pageData.weather.icon}.svg`"
/>
<image class="codefun-shrink-0 image_8"
:src="`/static/images/weather/${pageData.weather.icon}.svg`" />
<view class="codefun-flex-col codefun-items-start codefun-flex-1 codefun-ml-10">
<text class="text_5">{{ pageData.weather.temperature }}</text>
<text class="font_2 text_8 !text-24rpx codefun-mt-16">{{
......@@ -383,78 +378,58 @@
src="/static/images/codefun/c785818f2c08b7682aa5188542b2dede.png"
/> -->
<image
class="image_7"
:src="`/static/images/weather/${forecast.icon}.svg`"
v-for="forecast in pageData.weather.forecast"
:key="forecast.day"
/>
<image class="image_7" :src="`/static/images/weather/${forecast.icon}.svg`"
v-for="forecast in pageData.weather.forecast" :key="forecast.day" />
</view>
<view class="codefun-flex-row codefun-justify-between codefun-items-center group_9">
<view
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_9"
>
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_9">
<text class="font_3 text_6">{{ pageData.weather.forecast[0].day }}</text>
</view>
<view
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_3"
>
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_3">
<text class="font_3 text_52">{{ pageData.weather.forecast[1].day }}</text>
</view>
<text class="font_3 text_7">{{ pageData.weather.forecast[2].day }}</text>
</view>
<view class="codefun-flex-row codefun-justify-center">
<view
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_4"
>
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_4">
<text class="font_4 text_9">{{ pageData.weather.forecast[0].temp }}</text>
</view>
<view
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_1 ml-17"
>
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_1 ml-17">
<text class="font_4 text_10">{{ pageData.weather.forecast[1].temp }}</text>
</view>
<view
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_4 ml-17"
>
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_4 ml-17">
<text class="font_4 text_9">{{ pageData.weather.forecast[2].temp }}</text>
</view>
</view>
</view>
</view>
<view class="codefun-flex-row section_4" v-if="pageData.weather.warning">
<image
class="codefun-shrink-0 image_10"
src="/static/images/codefun/344155285176a7ac7ccd670a2a1daf19.png"
/>
<image class="codefun-shrink-0 image_10"
src="/static/images/codefun/344155285176a7ac7ccd670a2a1daf19.png" />
<view
class="codefun-flex-col codefun-justify-start codefun-shrink-0 text-wrapper_5 codefun-ml-6"
>
class="codefun-flex-col codefun-justify-start codefun-shrink-0 text-wrapper_5 codefun-ml-6">
<text class="text_12">{{ pageData.weather.warning }}</text>
</view>
</view>
</view>
<view class="codefun-flex-col codefun-relative section_5">
<view class="codefun-flex-row">
<view
v-show="item.status"
v-for="item in pageData.menuItems"
:key="item.id"
<view v-show="item.status" v-for="item in pageData.menuItems" :key="item.id"
class="codefun-flex-col codefun-items-center group_10"
@click="onMenuItemClick(item)"
>
@click="onMenuItemClick(item)">
<image class="image_11" :src="item.icon_url" />
<text class="font_2 mt-11">{{ item.name }}</text>
</view>
</view>
<view class="codefun-flex-row codefun-mt-20">
<view
v-show="item.status"
v-for="item in pageData.serviceItems"
:key="item.id"
<view v-show="item.status" v-for="item in pageData.serviceItems" :key="item.id"
class="codefun-flex-col codefun-items-center group_10"
@click="onMenuItemClick(item)"
>
@click="onMenuItemClick(item)">
<image class="image_11" :src="item.icon_url" />
<text class="font_2 mt-11">{{ item.name }}</text>
</view>
......@@ -481,77 +456,55 @@
<!-- <text class="font_7 text_22">{{ pageData.productMarket.updateTime }}</text> -->
</view>
<view class="codefun-flex-row equal-division section_8">
<view
v-for="(product, index) in pageData.productMarket.products"
:key="product.id"
class="codefun-flex-col group_13"
:class="{
<view v-for="(product, index) in pageData.productMarket.products" :key="product.id"
class="codefun-flex-col group_13" :class="{
group_17: index === 0,
group_39: index === 1,
group_21: index === 2,
}"
>
}">
<view
class="codefun-flex-col codefun-justify-start codefun-items-start codefun-self-center codefun-relative group_1"
>
class="codefun-flex-col codefun-justify-start codefun-items-start codefun-self-center codefun-relative group_1">
<text class="font_8 text_23">{{ product.name }}</text>
<text class="font_9 text_23" :class="`pos${index > 0 ? `_${index + 1}` : ''}`">{{
product.current_price
}}</text>
}}元</text>
</view>
<view
class="codefun-flex-row codefun-items-center codefun-self-stretch"
:class="{
<view class="codefun-flex-row codefun-items-center codefun-self-stretch" :class="{
section_10: product.isUp,
section_11: !product.isUp,
}"
>
<image
class="codefun-shrink-0 image_14"
:src="
product.isUp
}">
<image class="codefun-shrink-0 image_14" :src="product.isUp
? '/static/images/codefun/c6f953be58ac3e9752ab9475a2a53c14.png'
: '/static/images/codefun/c7e797cc626699dcc8999a72145e9f8b.png'
"
/>
<text
class="font_10 ml-3"
:class="{
" />
<text class="font_10 ml-3" :class="{
text_25: product.isUp,
text_24: !product.isUp,
text_26: !product.isUp,
}"
>
}">
{{ `${product.isUp ? '' : '-'}${product.percent}%` }}
</text>
</view>
<view
<!-- <view
class="codefun-flex-col codefun-justify-start codefun-items-center codefun-self-stretch text-wrapper_6"
@click="onProductFollowClick(product)"
>
@click="onProductFollowClick(product)">
<text class="font_11">点击关注</text>
</view>
</view> -->
</view>
</view>
<view class="codefun-flex-row codefun-justify-between codefun-items-baseline group_15">
<text class="font_12 text_28">服务展示窗</text>
<text class="font_7 text_20 text_29">实时数据</text>
<!-- <text class="font_7 text_20 text_29">实时数据</text> -->
</view>
<view class="codefun-flex-row equal-division_2 group_16">
<view v-for="stat in pageData.serviceStats" :key="stat.id"
class="codefun-flex-col section_12 section_19">
<view
v-for="stat in pageData.serviceStats"
:key="stat.id"
class="codefun-flex-col section_12 section_19"
>
<view
class="codefun-flex-row codefun-justify-center codefun-items-center codefun-self-stretch codefun-relative group_27"
>
class="codefun-flex-row codefun-justify-center codefun-items-center codefun-self-stretch codefun-relative group_27">
<image class="image_5 mr-1" :class="`pos_${stat.id}`" :src="stat.icon" />
<text
class="font_13"
:class="`text_${stat.id === 1 ? 30 : stat.id === 2 ? 1 : stat.id > 4 ? 46 : 37}`"
>{{ stat.name }}</text
>
<text class="font_13"
:class="`text_${stat.id === 1 ? 30 : stat.id === 2 ? 1 : stat.id > 4 ? 46 : 37}`">{{
stat.name }}</text>
</view>
<view class="codefun-flex-row codefun-justify-center codefun-items-baseline mt-11 group_30">
<text class="font_12 text_37">{{ stat.num }}</text>
......@@ -561,47 +514,29 @@
</view>
<view class="codefun-flex-row codefun-justify-between codefun-items-center group_19">
<text class="font_6 text_32">农技课堂</text>
<text class="font_7 text_33" @click="onViewMoreClass">查看全部</text>
<!-- <text class="font_7 text_33" @click="onViewMoreClass">查看全部</text> -->
</view>
<view class="codefun-flex-col section_13">
<fui-swiper-dot
:items="pageData.agricultureClass.videoList"
:current="pageData.current"
:styles="{
<fui-swiper-dot :items="pageData.agricultureClass.videoList" :current="pageData.current" :styles="{
height: 10,
activeWidth: 40,
background: '#dff0e2',
activeBackground: '#5db66f',
bottom: 10,
}"
>
<swiper
class="fui-banner__wrap"
circular
:indicator-dots="false"
autoplay
:interval="4000"
:duration="150"
@change="handleChangeVideo"
>
}">
<swiper class="fui-banner__wrap" circular :indicator-dots="false" autoplay :interval="4000"
:duration="150" @change="handleChangeVideo">
<swiper-item v-for="(video, index) in pageData.agricultureClass.videoList" :key="index">
<video
:id="`video${index}`"
:src="video.media_video"
:poster="video.cover_image"
:controls="false"
style="width: 654rpx; height: 358rpx"
@loadedmetadata="handleMetadataLoaded"
@play="handleVideoPlay(index)"
></video>
<video :id="`video${index}`" :src="video.media_video" :poster="video.cover_image"
:controls="false" style="width: 654rpx; height: 358rpx"
@loadedmetadata="handleMetadataLoaded" @play="handleVideoPlay(index)"></video>
</swiper-item>
</swiper>
</fui-swiper-dot>
<view class="describe">
<text class="codefun-self-start font text_34">{{ pageData.agricultureClass.title }}</text>
<view
class="codefun-flex-row codefun-justify-between codefun-items-center codefun-self-stretch mt-13"
>
class="codefun-flex-row codefun-justify-between codefun-items-center codefun-self-stretch mt-13">
<!-- <view class="codefun-flex-row codefun-items-center">
<image
class="codefun-shrink-0 image_15"
......@@ -619,34 +554,43 @@
</template>
<style scoped lang="scss">
.ml-17 {
.ml-17 {
margin-left: 34rpx;
}
.ml-43 {
}
.ml-43 {
margin-left: 86rpx;
}
.mt-13 {
}
.mt-13 {
margin-top: 26rpx;
}
.ml-11 {
}
.ml-11 {
margin-left: 22rpx;
}
.ml-3 {
}
.ml-3 {
margin-left: 6rpx;
}
.ml-19 {
}
.ml-19 {
margin-left: 38rpx;
}
.mt-11 {
}
.mt-11 {
margin-top: 22rpx;
}
.ml-5 {
}
.ml-5 {
margin-left: 10rpx;
}
.mt-3 {
}
.mt-3 {
margin-top: 6rpx;
}
.page {
}
.page {
background-color: #e6f5e8;
mix-blend-mode: NOTTHROUGH;
width: 100%;
......@@ -661,28 +605,34 @@
background-image: url('/static/images/codefun/1086a098c06f7f52e77bd7a646747a13.png');
background-size: 100% 100%;
background-repeat: no-repeat;
.group_2 {
padding-left: 16rpx;
.image {
border-radius: 64rpx;
width: 108rpx;
height: 42rpx;
}
.image_2 {
mix-blend-mode: NOTTHROUGH;
width: 34rpx;
height: 22rpx;
}
.image_3 {
mix-blend-mode: NOTTHROUGH;
width: 30rpx;
height: 22rpx;
}
.image_4 {
width: 48rpx;
height: 22rpx;
}
}
.text {
margin-left: 5.3rpx;
margin-top: 37.62rpx;
......@@ -692,6 +642,7 @@
letter-spacing: 4.32rpx;
font-family: meixin;
}
.section_2 {
margin-top: 25.8rpx;
padding: 14rpx 18rpx 16rpx;
......@@ -699,15 +650,19 @@
border-radius: 1998rpx;
mix-blend-mode: NOTTHROUGH;
border: solid 1rpx #ffffff7d;
.text_2 {
line-height: 25.5rpx;
}
}
}
.group_3 {
margin-top: -188rpx;
padding-left: 28rpx;
.group_4 {
// height: 864rpx;
.section_3 {
margin-right: 28rpx;
......@@ -715,24 +670,29 @@
background-image: linear-gradient(180deg, #dcfce7 0%, #f8fef9 100%);
border-radius: 16rpx;
mix-blend-mode: NOTTHROUGH;
.text-wrapper {
padding: 7.6rpx 0 6.76rpx;
overflow: hidden;
width: 56rpx;
height: 40rpx;
.text_4 {
color: #5db66f;
line-height: 25.64rpx;
}
}
.image_6 {
width: 16rpx;
height: 10rpx;
}
.text-wrapper_2 {
overflow: hidden;
width: 140rpx;
height: 40rpx;
.text_3 {
margin-left: 9.28rpx;
color: #5db66f;
......@@ -741,35 +701,44 @@
width: 164rpx;
}
}
.group_5 {
margin-top: 16rpx;
.group_8 {
margin: 4rpx 0;
flex: 1 1 300.68rpx;
.image_8 {
mix-blend-mode: NOTTHROUGH;
width: 112rpx;
height: 112rpx;
}
.text_5 {
color: #06280b;
font-size: 48rpx;
line-height: 34.28rpx;
}
.text_8 {
color: #555555;
line-height: 26.88rpx;
}
}
.group_6 {
flex: 1 1 300.68rpx;
.group_7 {
padding: 0 8rpx;
.image_9 {
margin-top: 4rpx;
width: 54rpx;
height: 42rpx;
}
.image_7 {
margin-right: 4rpx;
margin-bottom: 4rpx;
......@@ -777,86 +746,104 @@
height: 42rpx;
}
}
.group_9 {
margin-top: 10rpx;
padding: 0 12rpx;
.text-wrapper_9 {
padding: 6.8rpx 0 4.6rpx;
overflow: hidden;
width: 48rpx;
height: 32rpx;
.text_6 {
line-height: 20.6rpx;
}
}
.text-wrapper_3 {
padding: 6.54rpx 0 4.92rpx;
overflow: hidden;
width: 48rpx;
height: 32rpx;
.text_52 {
line-height: 20.54rpx;
}
}
.font_3 {
font-size: 24rpx;
line-height: 22.04rpx;
color: #6b7280;
}
.text_7 {
margin-right: 9rpx;
line-height: 20.54rpx;
}
}
.text-wrapper_4 {
padding: 7.84rpx 0 7.02rpx;
overflow: hidden;
width: 76rpx;
height: 32rpx;
.text_9 {
line-height: 17.14rpx;
}
}
.text-wrapper_1 {
padding: 7.84rpx 0 6.98rpx;
overflow: hidden;
width: 76rpx;
height: 32rpx;
.text_10 {
line-height: 17.18rpx;
}
}
}
}
.section_4 {
margin-top: 30rpx;
padding: 10rpx 20rpx;
background-color: #fb81461f;
border-radius: 12rpx;
mix-blend-mode: NOTTHROUGH;
.image_10 {
width: 40rpx;
height: 40rpx;
}
.text-wrapper_5 {
margin-right: 180rpx;
width: 90%;
height: 40rpx;
.text_12 {
margin-left: 2.3rpx;
margin-right: 13.7rpx;
font-size: 28rpx;
line-height: 40rpx;
overflow: hidden;
text-overflow: ellipsis; /* 超出以 ...显示 */
text-overflow: ellipsis;
/* 超出以 ...显示 */
display: -webkit-box;
-webkit-line-clamp: 1; /* // 显示1行 */
-webkit-line-clamp: 1;
/* // 显示1行 */
-webkit-box-orient: vertical;
color: #ff612c;
}
}
}
}
.section_5 {
margin-right: 28rpx;
margin-top: -34rpx;
......@@ -864,40 +851,52 @@
background-color: #ffffff;
border-radius: 16rpx;
mix-blend-mode: NOTTHROUGH;
.image_11 {
border-radius: 88rpx;
width: 96rpx;
height: 96rpx;
}
.group_10 {
flex: 1 1 173.5rpx;
.text_50 {
line-height: 25.76rpx;
}
.text_13 {
line-height: 24.58rpx;
}
.text_51 {
line-height: 25.78rpx;
}
}
.group_43 {
padding-bottom: 10rpx;
}
.group_42 {
padding-bottom: 10rpx;
}
.group_37 {
padding-bottom: 10.06rpx;
}
.group_40 {
padding-bottom: 10.06rpx;
}
.group_11 {
padding-left: 31.3rpx;
padding-right: 25.86rpx;
.group_38 {
padding: 0 9.7rpx;
.image_12 {
border-radius: 88rpx;
mix-blend-mode: NOTTHROUGH;
......@@ -905,22 +904,27 @@
height: 88rpx;
}
}
.text_14 {
line-height: 25.62rpx;
}
.text_15 {
line-height: 25.76rpx;
}
.text_16 {
line-height: 25.78rpx;
}
}
}
.font_2 {
font-size: 28rpx;
line-height: 25.7rpx;
color: #1d2129;
}
.section_6 {
margin-right: 28rpx;
margin-top: 24rpx;
......@@ -928,26 +932,32 @@
background-color: #ffffff;
border-radius: 16rpx;
mix-blend-mode: NOTTHROUGH;
.font_5 {
font-size: 28rpx;
line-height: 44rpx;
color: #5db66f;
}
.text_17 {
font-size: 30rpx;
font-family: alimamashuheiti;
}
.text_18 {
color: #000000;
line-height: 26.16rpx;
}
.text_19 {
font-size: 30rpx;
font-family: alimamashuheiti;
}
.text_21 {
line-height: 17.18rpx;
}
.image_13 {
border-radius: 16rpx;
mix-blend-mode: NOTTHROUGH;
......@@ -955,36 +965,44 @@
height: 32rpx;
}
}
.font_4 {
font-size: 20rpx;
line-height: 18.3rpx;
color: #000000;
}
}
.section_7 {
margin-right: 8rpx;
background-color: #00000000;
width: 24rpx;
height: 24rpx;
}
.group_12 {
margin-top: 17.72rpx;
.text_22 {
margin-right: 30.72rpx;
color: #33333399;
line-height: 22.16rpx;
}
}
.equal-division {
margin-right: 28rpx;
margin-top: 32.72rpx;
.group_13 {
flex: 0 0 33.33%;
text-align: center;
.group_41 {
padding: 10rpx 0 4.92rpx;
width: 106rpx;
}
.section_10 {
margin: 24rpx 0 0 0;
padding: 0 14rpx;
......@@ -992,84 +1010,102 @@
border-radius: 1998rpx;
mix-blend-mode: NOTTHROUGH;
}
.text-wrapper_6 {
margin-top: 40rpx;
padding: 17.3rpx 0 16.66rpx;
background-color: #5db66f29;
border-radius: 1998rpx;
mix-blend-mode: NOTTHROUGH;
.font_11 {
font-size: 24rpx;
line-height: 22.04rpx;
color: #16a34a;
}
}
.group_20 {
padding: 10rpx 0 4.92rpx;
width: 100rpx;
}
.font_8 {
font-size: 28rpx;
line-height: 72rpx;
color: #333333;
}
.text_23 {
width: 100%;
}
.font_9 {
font-size: 36rpx;
line-height: 25.7rpx;
color: #f26464;
}
.group_1 {
padding: 10rpx 0 4.92rpx;
// width: 106rpx;
.text_24 {
color: #5db66f;
}
}
.section_11 {
margin: 24rpx 0 0 0;
padding: 0 14rpx;
background-color: rgba(93, 182, 111, 0.2);
border-radius: 1998rpx;
mix-blend-mode: NOTTHROUGH;
.text_26 {
color: #5db66f;
padding-left: 10rpx;
}
}
.image_14 {
mix-blend-mode: NOTTHROUGH;
width: 28rpx;
height: 16rpx;
margin: 0 8rpx;
}
.font_10 {
font-size: 20rpx;
line-height: 56rpx;
color: #f44336;
}
}
.group_17 {
padding: 0 31.34rpx 12rpx 32rpx;
}
.section_9 {
flex-shrink: 0;
margin: 10.62rpx 0 10rpx;
}
.horiz-divider {
background-color: #fafafa;
width: 2rpx;
height: 288rpx;
}
.group_39 {
padding: 0 30.66rpx 12rpx 32.66rpx;
}
.group_21 {
padding: 0 30rpx 12rpx 33.34rpx;
}
}
.section_8 {
padding: 15.38rpx 0 12rpx;
background-color: #ffffff;
......@@ -1077,90 +1113,115 @@
mix-blend-mode: NOTTHROUGH;
overflow: scroll;
}
.group_15 {
margin-top: 41.54rpx;
.text_28 {
line-height: 29.56rpx;
}
.text_29 {
margin-right: 24.44rpx;
}
}
.font_7 {
font-size: 24rpx;
line-height: 22.04rpx;
color: #000000;
}
.text_20 {
opacity: 0.6;
}
.equal-division_2 {
margin-top: 32.9rpx;
.section_12 {
flex: 0 0 calc(33.33% - 14rpx);
.group_25 {
padding: 5.24rpx 0 4.8rpx;
.pos_4 {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.text_30 {
line-height: 21.96rpx;
}
}
.group_28 {
margin-left: 5.82rpx;
line-height: 26.88rpx;
.text_47 {
line-height: 26.88rpx;
}
.text_49 {
line-height: 21.62rpx;
}
}
.group_26 {
padding: 5.2rpx 0 4.72rpx;
.pos_5 {
position: absolute;
left: 0;
top: 50%;
transform: translateY(-50%);
}
.text_1 {
line-height: 22.08rpx;
}
}
.font_13 {
font-size: 24rpx;
line-height: 22.04rpx;
color: #666666;
}
.group_18 {
margin-left: 5.24rpx;
line-height: 22.84rpx;
.text_48 {
line-height: 22.84rpx;
}
}
.group_27 {
padding: 5.3rpx 0 4.52rpx;
.text_46 {
line-height: 22.18rpx;
}
}
.group_30 {
margin-left: 7.24rpx;
line-height: 22.84rpx;
.text_37 {
line-height: 22.84rpx;
}
.text_31 {
line-height: 21.46rpx;
}
}
}
.section_18 {
padding: 32rpx 20rpx 38rpx;
background-color: #ffffff;
......@@ -1168,6 +1229,7 @@
mix-blend-mode: NOTTHROUGH;
height: 150rpx;
}
.section_1 {
padding: 32rpx 22rpx 39.98rpx;
background-color: #ffffff;
......@@ -1175,6 +1237,7 @@
mix-blend-mode: NOTTHROUGH;
height: 150rpx;
}
.section_19 {
padding: 32rpx 20rpx 40.4rpx;
background-color: #ffffff;
......@@ -1183,6 +1246,7 @@
height: 150rpx;
}
}
.group_16 {
flex-wrap: wrap;
gap: 20rpx;
......@@ -1190,27 +1254,33 @@
align-items: center;
margin-right: 10px;
}
.font_12 {
font-size: 32rpx;
line-height: 22.04rpx;
color: #000000;
}
.group_19 {
margin-top: 38rpx;
.text_32 {
line-height: 29.48rpx;
}
.text_33 {
margin-right: 25.48rpx;
color: #5db66f;
line-height: 21.86rpx;
}
}
.font_6 {
font-size: 32rpx;
line-height: 29.56rpx;
color: #333333;
}
.section_13 {
position: relative;
margin-right: 28rpx;
......@@ -1222,6 +1292,7 @@
background-color: #ffffff;
border-radius: 16rpx;
mix-blend-mode: NOTTHROUGH;
// background-image: url('/static/images/codefun/de7f2f0177d74c2b9c784b3825ea9832.png');
// background-size: 94%;
// background-repeat: no-repeat;
......@@ -1244,6 +1315,7 @@
}
}
}
.describe {
width: 88%;
position: absolute;
......@@ -1254,23 +1326,28 @@
.text_34 {
line-height: 26.58rpx;
}
.image_15 {
mix-blend-mode: NOTTHROUGH;
border-radius: 50%;
width: 48rpx;
height: 48rpx;
}
.font_14 {
font-size: 24rpx;
line-height: 22.04rpx;
color: #ffffff;
}
.text_35 {
line-height: 21.76rpx;
}
.text_36 {
line-height: 23.04rpx;
}
.section_14 {
background-color: #5db66f;
border-radius: 12rpx;
......@@ -1278,13 +1355,16 @@
width: 40rpx;
height: 12rpx;
}
.image-wrapper {
width: 40rpx;
.image_16 {
width: 40rpx;
height: 12rpx;
}
}
.section_15 {
background-color: #5db66f33;
mix-blend-mode: NOTTHROUGH;
......@@ -1294,50 +1374,62 @@
}
}
}
.font {
font-size: 28rpx;
line-height: 25.7rpx;
color: #ffffff;
}
}
.equal-division_3 {
padding: 10rpx 7.98rpx 15.66rpx 7.98rpx;
background-color: #ffffff;
mix-blend-mode: NOTTHROUGH;
border-top: solid 1rpx #e7e7e7;
.group_22 {
flex: 1 1 146.82rpx;
.font_15 {
font-size: 20rpx;
line-height: 18.3rpx;
color: #666666;
}
.text_44 {
line-height: 18.4rpx;
}
.text_45 {
line-height: 18.48rpx;
}
}
.group_32 {
padding: 12rpx 0 11.68rpx;
}
.group_33 {
padding: 12rpx 0 10rpx;
}
.group_34 {
padding: 12rpx 0 11.48rpx;
}
.group_35 {
padding: 12rpx 0 11.38rpx;
}
.group_36 {
padding: 12rpx 0 11.84rpx;
}
}
.image_5 {
width: 32rpx;
height: 32rpx;
}
}
}
</style>
src/pages/wode/wode.vue
......@@ -59,7 +59,7 @@ const pageData = reactive({
status: '离线可用',
statusClass: 'text_14',
arrowIcon: '/static/images/codefun/f29a8c39eb37da965d0a764a567a1c77.png',
url: ''
url: '/pages/resource/resource'
},
{
id: 2,
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论