Skip to content

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

feat: 重构农场

上级 4e33924a
正在显示 包含 87 行增加 和 26 行删除
src/pages/device/device.vue
......@@ -146,19 +146,19 @@ function handleDeviceClick(device) {
<text class="stat-label">设备ID：</text>
<text class="stat-value">{{ pageData.selectedDevice.deviceIdentifier }}</text>
</view>
<!-- <view class="stat-item">
<view class="stat-item">
<text class="stat-label">位置坐标：</text>
<text class="stat-value">30.2680, 120.0450</text>
</view> -->
</view>
</view>
<view class="device-stats">
<view class="stat-item">
<text class="stat-label">设备来源：</text>
<text class="stat-label">设备类型：</text>
<text class="stat-value">灌溉设备</text>
</view>
<view class="stat-item">
<text class="stat-label">归属地：</text>
<text class="stat-value">西区灌溉基地</text>
<text class="stat-value">西区油茶基地</text>
</view>
</view>
</view>
......@@ -168,13 +168,20 @@ function handleDeviceClick(device) {
<!-- 搜索框 -->
<view class="codefun-flex-row codefun-items-center section_2">
<image class="image_6" src="/static/images/codefun/6c5c5a3c082b8c60a307d3a7caee623c.png" />
<u-input
<!-- <u-input
v-model="pageData.param.deviceName"
:placeholder="isCameraDevice ? '请输入关键词搜索' : '请输入设备名称搜索'"
border="none"
class="codefun-ml-8"
@confirm="handleSearch"
/>
/> -->
<u-input
v-model="pageData.param.deviceName"
placeholder="请输入搜索内容"
border="none"
class="codefun-ml-8"
@confirm="handleSearch"
/>
</view>
<!-- 分类标签 -->
......@@ -926,6 +933,8 @@ body {
.device-title-group {
flex: 1;
display: flex;
align-items: center;
}
.device-title {
......@@ -960,7 +969,7 @@ body {
display: flex;
justify-content: space-between;
margin-bottom: 16rpx;
padding-right: 26rpx;
&:last-child {
margin-bottom: 0;
}
......@@ -973,13 +982,13 @@ body {
}
.stat-label {
font-size: 26rpx;
font-size: 24rpx;
color: #999999;
}
.stat-value {
font-size: 26rpx;
color: #333333;
font-size: 24rpx;
color: #666666;
}
.device-grid {
......
src/pages/nongchang/detail/index.vue
......@@ -16,6 +16,7 @@ import { ToolBoxWidget, useToolBoxWidget } from '@/components/Map/Widgets/ToolBo
import * as NongchangAPI from '@/api/model/nongchang'
import * as farmbaseApi from '@/api/model/farmbase'
import navigate from '@/utils/page/navigate'
import dayjs from 'dayjs'
// 页面参数
const page = reactive<Page>({
......@@ -29,6 +30,7 @@ const showDialog = ref(false)
onShow(() => {
getFarmbaseInfoList()
})
const model = reactive({
id: '',
name: '',
......@@ -58,12 +60,19 @@ const model = reactive({
],
},
// 预报日期
forecasts: ['29日', '30日', '1日', '2日', '3日'],
forecasts: [],
clicked: 0,
farmbaseInfo: {},
farmbaseInfoList: [],
deviceTypeCount: [],
})
onLoad(()=>{
var today = dayjs();
for (var i = 0; i < 5; i++) {
var futureDate = today.add(i, 'day');
model.forecasts.push(futureDate.format('DD')+'日');
}
})
async function getFarmbaseInfoList() {
farmbaseApi
.list({
......@@ -124,7 +133,7 @@ const [registerMap, map] = useMapbox({
center: model.lonlat.split(',').map(Number) as [number, number],
duration: 0,
})
// 渲染地块数据
model.plots = [
turf.polygon(
......@@ -240,6 +249,28 @@ const [registerMap, map] = useMapbox({
},
})
/* const mapAddImage = new Image();
mapAddImage.src = '/static/images/test/mapLayer.png';
// 添加自定义图像图层
map.on('load','custom-image',()=>{
console.log("进到自定义的地图里了")
// 添加图片资源
map.addImage('custom-image', mapAddImage, { pixelRatio: 2 }); // 确保路径正确且图片可访问
// 添加图层到地图上，并指定位置和大小
map.addLayer({
id: 'custom-image-layer', // 图层的唯一ID
type: 'raster', // 或者使用 'raster' 根据需要选择类型
source: {
type: 'image', // 指定源类型为图像
url: '/static/images/test/mapLayer.png' // 同上，确保路径正确
},
layout: {
'icon-image': 'custom-image', // 使用上面添加的图片ID
'icon-anchor': 'center' // 设置锚点为图片中心，根据需要调整
}
});
}) */
// 左侧工具栏小部件
const [registerToolBoxWidget] = useToolBoxWidget({
show: true,
......@@ -396,11 +427,33 @@ const toDevice = (device)=>{
</view>
</view>
</view>
<view class="card !top-950">
<view class="card !top-854">
<view class="box-1">
<view class="relative w-full flex flex-row">
<view class="box-1-left"
><image class="image_1" src="/static/images/nongchang/play.png"
/></view>
<view class="box-1-right">
<view class="box-1-right-top">
<view class="text_1">预报</view>
</view>
<view class="box-1-right-bottom"
><text
v-for="(forecast, index) in model.forecasts"
:class="model.clicked === index ? 'active' : ''"
:key="index"
>{{ forecast }}</text
></view
>
</view>
</view>
</view>
</view>
<view class="card !top-954">
<view class="w-full absolute">
<view style="background: #e6f5e8">
<view class="box-1">
<!-- <view class="box-1">
<view class="relative w-full flex flex-row">
<view class="box-1-left"
><image class="image_1" src="/static/images/nongchang/play.png"
......@@ -419,7 +472,7 @@ const toDevice = (device)=>{
>
</view>
</view>
</view>
</view> -->
<view class="box-2">
<view class="box-2-left">
<view class="box-2-left-top">
......@@ -663,11 +716,9 @@ page {
.card {
width: 100%;
background-color: #e6f5e8;
position: absolute;
font-weight: 400;
font-family: '思源黑体';
.box-1 {
width: 95%;
height: 80rpx;
......@@ -676,7 +727,7 @@ page {
border-radius: 18rpx;
display: flex;
flex-direction: row;
// margin-top:-500rpx;
.box-1-left {
width: 50rpx;
height: 100%;
......@@ -699,14 +750,16 @@ page {
.box-1-right-top {
// height: 50%;
background-image: url('/static/images/nongchang/yubaobeijing.png');
background-size: 100% 100%;
background-repeat: no-repeat;
// background-image: url('/static/images/nongchang/yubaobeijing.png');
padding-left: 184rpx;
.text_1 {
font-size: 25rpx;
color: #5db66f;
text-align: center;
background: linear-gradient(180deg, rgba(93, 182, 111, 0.3) 0%, rgba(93, 182, 111, 0) 100%);
background-size: 100% 100%;
background-repeat: no-repeat;
border-top-right-radius: 16rpx;
}
}
......
src/pages/nongchang/nongchang.vue
......@@ -740,13 +740,12 @@ onHide(() => {
</view>
</view>
<fui-fab position="right" distance="10" bottom="240" width="96" @click="handlePublish">
<!-- <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>
</fui-fab> -->
</template>
<style scoped lang="scss">
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论