Compare commits
2 Commits
9f58884a5b
...
1c1b1369b3
| Author | SHA1 | Date | |
|---|---|---|---|
| 1c1b1369b3 | |||
| 25a555d6b1 |
BIN
sub-operation-service/src/assets/images/smartFarm/logo2.png
Normal file
BIN
sub-operation-service/src/assets/images/smartFarm/logo2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 118 KiB |
BIN
sub-operation-service/src/assets/images/smartFarm/message.png
Normal file
BIN
sub-operation-service/src/assets/images/smartFarm/message.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
BIN
sub-operation-service/src/assets/images/smartFarm/position.png
Normal file
BIN
sub-operation-service/src/assets/images/smartFarm/position.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
BIN
sub-operation-service/src/assets/images/smartFarm/优先级.png
Normal file
BIN
sub-operation-service/src/assets/images/smartFarm/优先级.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
BIN
sub-operation-service/src/assets/images/smartFarm/认证.png
Normal file
BIN
sub-operation-service/src/assets/images/smartFarm/认证.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.4 KiB |
@ -248,7 +248,7 @@ export const constantRoutes = [
|
||||
meta: { title: '使用申请' },
|
||||
},
|
||||
{
|
||||
path: 'apply/:id',
|
||||
path: 'brandApplyDetail',
|
||||
name: 'brandApplyDetail',
|
||||
component: () => import('@/views/brand/components/ApplyDetail.vue'),
|
||||
meta: { title: '产品申请' },
|
||||
|
||||
@ -19,7 +19,7 @@
|
||||
<el-form-item label="溯源码">
|
||||
<el-button type="primary" @click="uploadTraceCode">
|
||||
<template #icon>
|
||||
<i class="el-icon-upload"></i>
|
||||
<el-icon><Upload /></el-icon>
|
||||
</template>
|
||||
点击上传
|
||||
</el-button>
|
||||
|
||||
@ -24,9 +24,9 @@ const router = useRouter();
|
||||
const products = ref([]);
|
||||
|
||||
// 获取商品数据
|
||||
getApplyList().then((res) => {
|
||||
products.value = res.data;
|
||||
});
|
||||
// getApplyList().then((res) => {
|
||||
// products.value = res.data;
|
||||
// });
|
||||
|
||||
const applyData = [
|
||||
{ id: 1, name: '耿马绿色蔬菜', imageUrl: 'images/brand/11.png' },
|
||||
@ -44,7 +44,7 @@ const applyData = [
|
||||
];
|
||||
|
||||
function gotoApplication(id) {
|
||||
router.push(`/sub-operation-service/brand/apply/${id}`);
|
||||
router.push('/sub-operation-service/brand/brandApplyDetail?id=' + id);
|
||||
}
|
||||
|
||||
// TODO: 对接口需要删除这个方法
|
||||
|
||||
@ -52,7 +52,7 @@ const menuMap = {
|
||||
// 获取当前菜单激活项
|
||||
const activeMenu = computed(() => {
|
||||
const matched = Object.entries(menuMap).find(([key, names]) => names.includes(route.name));
|
||||
console.log(matched[0]);
|
||||
// console.log(matched[0]);
|
||||
return matched ? matched[0] : '';
|
||||
});
|
||||
// 菜单切换处理
|
||||
|
||||
@ -0,0 +1,134 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-card shadow="always">
|
||||
<div class="route"><span style="cursor: pointer" @click.stop="changeDialog">采购商服务</span> <span>·</span> <span>采购服务</span></div>
|
||||
<div style="display: flex; margin-top: 10px">
|
||||
<img :src="getAssetsFile('images/smartFarm/logo2.png')" alt="" style="height: 150px; width: 150px" />
|
||||
<div style="width: calc(100% - 150px); padding: 0 20px">
|
||||
<div style="display: flex; justify-content: space-between; width: 100%; font-size: 18px; font-weight: bold">
|
||||
<div>
|
||||
耿马县勐简乡飘云生态农业<img
|
||||
:src="getAssetsFile('images/smartFarm/优先级.png')"
|
||||
alt=""
|
||||
style="height: 20px; width: 20px; margin: 0 5px"
|
||||
/><img :src="getAssetsFile('images/smartFarm/认证.png')" alt="" style="height: 20px; width: 20px" />
|
||||
</div>
|
||||
<div>
|
||||
耿马县·勐简乡<img :src="getAssetsFile('images/smartFarm/position.png')" alt="" style="height: 20px; width: 20px; margin: 0 5px" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="shiming">已实名认证</div>
|
||||
<div class="inTime">入驻时间： 37天</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="display: flex; margin-top: 40px; justify-content: space-between">
|
||||
<div class="between">
|
||||
<div class="leftTitle">采购品种：</div>
|
||||
<div class="rightValue">西红柿</div>
|
||||
</div>
|
||||
<div class="between">
|
||||
<div class="leftTitle">采购数量：</div>
|
||||
<div class="rightValue">5000kg</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; margin-top: 10px; justify-content: space-between">
|
||||
<div class="between">
|
||||
<div class="leftTitle">期望货源地：</div>
|
||||
<div class="rightValue">耿马县·贺派乡</div>
|
||||
</div>
|
||||
<div class="between">
|
||||
<div class="leftTitle">浏览次数：</div>
|
||||
<div class="rightValue">188次</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; margin-top: 10px; justify-content: space-between">
|
||||
<div class="between">
|
||||
<div class="leftTitle">收获地：</div>
|
||||
<div class="rightValue">耿马县·勐简乡</div>
|
||||
</div>
|
||||
<div class="between">
|
||||
<div class="leftTitle">更新时间：</div>
|
||||
<div class="rightValue">2025.01.01 11:11:11</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<el-button style="background-color: #25bf82; color: #ffffff; padding: 20px 30px; margin-top: 20px">
|
||||
<template #icon>
|
||||
<img :src="getAssetsFile('images/smartFarm/message.png')" alt="" style="height: 20px; width: 20px; margin: 0 5px" />
|
||||
</template>
|
||||
在线联系
|
||||
</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { getAssetsFile } from '@/utils/index.js';
|
||||
|
||||
/* --------------- data --------------- */
|
||||
// #region
|
||||
const props = defineProps({
|
||||
id: {
|
||||
type: Number,
|
||||
default: () => {
|
||||
return 0;
|
||||
},
|
||||
},
|
||||
});
|
||||
// #endregion
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
// #region
|
||||
const emit = defineEmits(['updateStatus']); // 声明要触发的事件
|
||||
|
||||
const changeDialog = () => {
|
||||
const data = { message: false };
|
||||
emit('updateStatus', data); // 触发事件并传递数据
|
||||
};
|
||||
// #endregion
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.between {
|
||||
width: 47%;
|
||||
justify-content: space-between;
|
||||
display: flex;
|
||||
font-size: 18px;
|
||||
}
|
||||
.leftTitle {
|
||||
font-weight: 400;
|
||||
text-align: left;
|
||||
color: #999999;
|
||||
}
|
||||
.rightValue {
|
||||
font-weight: 400;
|
||||
text-align: right;
|
||||
color: #000000;
|
||||
}
|
||||
.shiming {
|
||||
width: fit-content;
|
||||
padding: 2px 5px;
|
||||
margin-top: 20px;
|
||||
background: rgba(37, 191, 130, 0.1);
|
||||
border: 1px solid rgba(37, 191, 130, 0.5);
|
||||
border-radius: 8px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #25bf82;
|
||||
}
|
||||
.inTime {
|
||||
font-size: 18px;
|
||||
margin-top: 20px;
|
||||
font-weight: 400;
|
||||
text-align: left;
|
||||
color: #999999;
|
||||
}
|
||||
.route {
|
||||
font-size: 16px;
|
||||
font-weight: 900;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
@ -139,7 +139,7 @@ const chartsData = reactive({
|
||||
color: 'rgba(255, 255, 255, .6)',
|
||||
},
|
||||
},
|
||||
extraCssText: 'box-shadow: 2px 2px 16px 1px rgba(0, 39, 102, 0.16)',
|
||||
extraCssText: 'box-shadow: 2px 2px 16px 1px rgba(0, 39, 102, 0.16);z-index: 1',
|
||||
formatter: function (params) {
|
||||
let content = `<div style='font-size: 14px; color: #666;text-align:left'>${params[0].name}</div>`;
|
||||
if (Array.isArray(params)) {
|
||||
|
||||
@ -1,52 +1,99 @@
|
||||
<template>
|
||||
<div class="purchaser-popup-warp">
|
||||
<el-dialog v-model="isShow" title="采购报价" width="800" :before-close="doCancel">
|
||||
<el-form ref="ruleFormRef" :model="ruleForm" status-icon :rules="rules" label-width="auto" class="custom-form">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="商品分类" prop="typeId">
|
||||
<el-cascader v-model="ruleForm.typeId" :options="treeList" :props="treeOption" clearable :placeholder="'请选择分类'" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="收购价格" prop="price">
|
||||
<el-input-number v-model="ruleForm.price" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="采购商品" prop="goods">
|
||||
<el-input v-model="ruleForm.goods" style="width: 200px" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-dialog v-model="isShow" title="" width="80%" :before-close="doCancel" style="border-radius: 16px; padding: 40px 80px">
|
||||
<el-form ref="ruleFormRef" :model="ruleForm" status-icon label-width="auto" class="custom-form">
|
||||
<!-- <el-row :gutter="20">-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="商品分类" prop="typeId">-->
|
||||
<!-- <el-cascader v-model="ruleForm.typeId" :options="treeList" :props="treeOption" clearable :placeholder="'请选择分类'" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="收购价格" prop="price">-->
|
||||
<!-- <el-input-number v-model="ruleForm.price" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="采购商品" prop="goods">-->
|
||||
<!-- <el-input v-model="ruleForm.goods" style="width: 200px" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="收购数量" prop="num">
|
||||
<el-input-number v-model="ruleForm.num" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="收货地址" prop="addr">
|
||||
<el-input v-model="ruleForm.addr" :rows="2" type="textarea" :placeholder="'收货地址'" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label=" " prop="isPickup">
|
||||
<el-radio-group v-model="ruleForm.isPickup">
|
||||
<el-radio v-for="(n, index) in pickupOptions" :key="index" :value="n.value">{{ n.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="采购说明" prop="remark">
|
||||
<el-input v-model="ruleForm.remark" :rows="2" type="textarea" :placeholder="'采购说明'" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="收购数量" prop="num">-->
|
||||
<!-- <el-input-number v-model="ruleForm.num" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="收货地址" prop="addr">-->
|
||||
<!-- <el-input v-model="ruleForm.addr" :rows="2" type="textarea" :placeholder="'收货地址'" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label=" " prop="isPickup">-->
|
||||
<!-- <el-radio-group v-model="ruleForm.isPickup">-->
|
||||
<!-- <el-radio v-for="(n, index) in pickupOptions" :key="index" :value="n.value">{{ n.label }}</el-radio>-->
|
||||
<!-- </el-radio-group>-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- <el-col :span="12">-->
|
||||
<!-- <el-form-item label="采购说明" prop="remark">-->
|
||||
<!-- <el-input v-model="ruleForm.remark" :rows="2" type="textarea" :placeholder="'采购说明'" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- </el-row>-->
|
||||
<div style="display: flex; justify-content: flex-start">
|
||||
<el-form-item label="分类名称：" prop="typeId" style="width: 50%">
|
||||
<el-cascader
|
||||
v-model="ruleForm.typeId"
|
||||
:options="treeList"
|
||||
:props="treeOption"
|
||||
clearable
|
||||
:placeholder="'请选择分类'"
|
||||
style="width: 100%; border-radius: 10px; height: 30px"
|
||||
/>
|
||||
</el-form-item>
|
||||
<div style="width: 5%"> </div>
|
||||
<div class="inputs">
|
||||
<span class="labels">收购价格：</span>
|
||||
<input type="text" placeholder="请输入" />
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; justify-content: flex-start; text-align: left; margin-top: 20px">
|
||||
<div class="inputs">
|
||||
<span class="labels">采购商品：</span>
|
||||
<input type="text" placeholder="请输入" />
|
||||
</div>
|
||||
<div style="width: 5%"> </div>
|
||||
<div class="inputs unit">
|
||||
<span class="labels">收购数量：</span>
|
||||
<input type="text" placeholder="请输入" />
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; justify-content: flex-start; text-align: left; margin-top: 20px">
|
||||
<div class="inputs">
|
||||
<span class="labels">收货地址：</span>
|
||||
<input type="text" placeholder="请输入" />
|
||||
</div>
|
||||
<div style="width: 5%"> </div>
|
||||
<div class="inputs">
|
||||
<el-radio-group v-model="formData.toHome">
|
||||
<el-radio value="1" size="large">可上门收货</el-radio>
|
||||
<el-radio value="0" size="large">不上门收货</el-radio>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; justify-content: flex-start; text-align: left; margin-top: 20px">
|
||||
<div class="inputs" style="width: 100%">
|
||||
<span class="labels" style="width: 14%">收货地址：</span>
|
||||
<el-input v-model="formData.address" maxlength="30" style="width: 100%" placeholder="请输入" show-word-limit type="textarea" />
|
||||
</div>
|
||||
</div>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="doCancel">取消</el-button>
|
||||
<el-button type="primary" @click="doSure"> 确定 </el-button>
|
||||
<el-button type="primary" style="height: 40px; width: 120px" @click="doSure"> 确认 </el-button>
|
||||
<el-button style="height: 40px; width: 120px" @click="doCancel">取消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
@ -59,6 +106,10 @@ import { useRoute, useRouter } from 'vue-router';
|
||||
import { fa } from 'element-plus/es/locale/index.mjs';
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const formData = ref({
|
||||
toHome: '0',
|
||||
address: '',
|
||||
});
|
||||
|
||||
const props = defineProps({
|
||||
list: {
|
||||
@ -133,6 +184,40 @@ defineExpose({
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.dialog-footer {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.unit::after {
|
||||
content: 'kg';
|
||||
position: absolute;
|
||||
right: 10px; /* 调整单位与输入框的距离 */
|
||||
color: #000; /* 单位颜色 */
|
||||
pointer-events: none; /* 防止单位遮挡输入框 */
|
||||
}
|
||||
.unit input {
|
||||
}
|
||||
.inputs {
|
||||
color: #999999;
|
||||
font-size: 18px;
|
||||
width: 50%;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.labels {
|
||||
width: 25%;
|
||||
margin-right: 10px;
|
||||
}
|
||||
input {
|
||||
width: calc(74% - 20px);
|
||||
border: 1px solid #999999;
|
||||
border-radius: 10px;
|
||||
height: 30px;
|
||||
padding-left: 15px;
|
||||
}
|
||||
}
|
||||
.purchaser-popup-warp {
|
||||
}
|
||||
.custom-form {
|
||||
@ -148,4 +233,10 @@ defineExpose({
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-input__inner {
|
||||
height: 30px !important;
|
||||
border-radius: 10px;
|
||||
font-size: 18px;
|
||||
color: #999999;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -2,22 +2,29 @@
|
||||
<div class="purchaser-index-warp">
|
||||
<common current-name="purchaser">
|
||||
<template #main>
|
||||
<el-row class="purchaser-top">
|
||||
<el-col :span="12">
|
||||
<div class="purchaser-top-title">行情动态</div>
|
||||
<div class="purchaser-charts">
|
||||
<marketCharts></marketCharts>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="purchaser-top-title">近7天热门产品</div>
|
||||
<div class="purchaser-charts">
|
||||
<hotGoodsWordClould></hotGoodsWordClould>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<filtertop :list="treeList"></filtertop>
|
||||
|
||||
<div v-if="showDetail">
|
||||
<el-row class="purchaser-top">
|
||||
<el-col :span="12">
|
||||
<div class="purchaser-top-title">行情动态</div>
|
||||
<div class="purchaser-charts">
|
||||
<marketCharts :height="'180'"></marketCharts>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div class="purchaser-top-title">近7天热门产品</div>
|
||||
<div class="purchaser-charts">
|
||||
<hotGoodsWordClould></hotGoodsWordClould>
|
||||
</div>
|
||||
<div>
|
||||
<el-button type="success" @click.stop="handleClick">一键发布采购信息</el-button>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<filtertop :list="treeList"></filtertop>
|
||||
</div>
|
||||
<div v-else>
|
||||
<good-source :id="detailId" @update-status="handleUpdate"></good-source>
|
||||
</div>
|
||||
<div class="hot-list-warp">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8" align="left">
|
||||
@ -39,7 +46,7 @@
|
||||
<el-table-column prop="buyer" label="采购时间" />
|
||||
<el-table-column fixed="right" label="操作">
|
||||
<template #default>
|
||||
<el-button link type="primary" size="small" @click.stop="handleClick"> 去报价 </el-button>
|
||||
<el-button link type="primary" size="small"> 去报价 </el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@ -61,6 +68,8 @@ import purchaserPopup from './components/purchaserPopup.vue';
|
||||
import { ref, reactive, onMounted, watch, computed } from 'vue';
|
||||
import { getRegion } from '@/apis/index';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { transaction } from '@/apis/agricultural.js';
|
||||
import GoodSource from '@/views/ecommerce/components/goodSource.vue';
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
@ -115,67 +124,10 @@ let treeList = reactive([
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: '02',
|
||||
name: '种子种苗',
|
||||
children: [
|
||||
{
|
||||
parentId: '02',
|
||||
id: '0101',
|
||||
name: '花卉种子种苗',
|
||||
children: [
|
||||
{ parentId: '0101', id: '010101', name: '草本花卉' },
|
||||
{ parentId: '0101', id: '010102', name: '木本花卉' },
|
||||
{ parentId: '0101', id: '010103', name: '野生花卉' },
|
||||
],
|
||||
},
|
||||
{
|
||||
parentId: '02',
|
||||
id: '0102',
|
||||
name: '蔬菜种子种苗',
|
||||
children: [
|
||||
{ parentId: '0102', id: '010201', name: '叶菜类' },
|
||||
{ parentId: '0102', id: '010202', name: '根茎类' },
|
||||
{ parentId: '0102', id: '010203', name: '果实类' },
|
||||
{ parentId: '0102', id: '010204', name: '豆类' },
|
||||
{ parentId: '0102', id: '010205', name: '瓜类' },
|
||||
],
|
||||
},
|
||||
{
|
||||
parentId: '02',
|
||||
id: '0103',
|
||||
name: '果树种苗',
|
||||
children: [
|
||||
{ parentId: '0103', id: '010301', name: '柑橘类' },
|
||||
{ parentId: '0103', id: '010302', name: '仁果类' },
|
||||
{ parentId: '0103', id: '010303', name: '核果类' },
|
||||
{ parentId: '0103', id: '010304', name: '浆果类' },
|
||||
],
|
||||
},
|
||||
{
|
||||
parentId: '02',
|
||||
id: '0104',
|
||||
name: '药材种子与种苗',
|
||||
children: [
|
||||
{ parentId: '0104', id: '010401', name: '寒地龙药' },
|
||||
{ parentId: '0104', id: '010402', name: '常见中药材' },
|
||||
],
|
||||
},
|
||||
{
|
||||
parentId: '02',
|
||||
id: '0105',
|
||||
name: '其他作物',
|
||||
children: [
|
||||
{ parentId: '0105', id: '010501', name: '牧草' },
|
||||
{ parentId: '0105', id: '010502', name: '经济作物' },
|
||||
{ parentId: '0105', id: '010503', name: '观赏树木' },
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
|
||||
const showDetail = ref(true);
|
||||
let popupQuote = ref(null);
|
||||
const detailId = ref(0);
|
||||
|
||||
const typeTree = ref([]);
|
||||
const treeOption = ref({
|
||||
@ -194,6 +146,15 @@ const getTree = () => {
|
||||
});
|
||||
};
|
||||
|
||||
const getTreeList = () => {
|
||||
transaction().then((res) => {
|
||||
if (res.code === 200) {
|
||||
let a = res.data.sort((a, b) => Number(b.id) - Number(a.id));
|
||||
treeList.splice(0, treeList.length, ...a);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleClick = () => {
|
||||
popupQuote.value && popupQuote.value.doShow();
|
||||
};
|
||||
@ -218,15 +179,33 @@ let tableData = reactive([
|
||||
]);
|
||||
|
||||
const rowClick = (data) => {
|
||||
router.push('/sub-operation-service/ecommerce-purchaserDetail?id=' + data.id);
|
||||
// router.push('/sub-operation-service/ecommerce-purchaserDetail?id=' + data.id);
|
||||
detailId.value = data.id;
|
||||
showDetail.value = false;
|
||||
};
|
||||
|
||||
const handleUpdate = (data) => {
|
||||
// console.log(data);
|
||||
showDetail.value = !showDetail.value;
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
console.info('onMounted');
|
||||
getTree();
|
||||
getTreeList();
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
/* 确保 ElementUI 弹出层有更高的 z-index */
|
||||
.el-dialog {
|
||||
z-index: 2000 !important;
|
||||
}
|
||||
|
||||
/* 降低 ECharts tooltip 的 z-index */
|
||||
div[class^='zr-element'],
|
||||
.echarts-tooltip {
|
||||
z-index: 1000 !important;
|
||||
}
|
||||
.purchaser-index-warp {
|
||||
width: 100%;
|
||||
.purchaser-top {
|
||||
|
||||
@ -3,15 +3,25 @@
|
||||
<common current-name="supplier">
|
||||
<template #main>
|
||||
<banner name="supplier" :imglist="bannerList"></banner>
|
||||
<filtertop :list="treeList"></filtertop>
|
||||
<filtertop :list="treeList" @select="selected"></filtertop>
|
||||
<div class="goods-list-warp">
|
||||
<div class="goods-list">
|
||||
<template v-for="(n, index) in 16" :key="index">
|
||||
<template v-for="(n, index) in list" :key="n.id">
|
||||
<div class="goods-item">
|
||||
<goodsItem></goodsItem>
|
||||
<goodsItem :data="n"></goodsItem>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<el-pagination
|
||||
:current-page="pagination.current"
|
||||
:page-sizes="[10, 20, 50, 100]"
|
||||
:page-size="pagination.size"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="pagination.total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
>
|
||||
</el-pagination>
|
||||
</div>
|
||||
</template>
|
||||
</common>
|
||||
@ -23,118 +33,73 @@ import banner from './components/banner.vue';
|
||||
import filtertop from './components/filtertop.vue';
|
||||
import goodsItem from './components/goodsItem.vue';
|
||||
import { ref, reactive, onMounted, watch, computed } from 'vue';
|
||||
let treeList = reactive([
|
||||
{
|
||||
id: '01',
|
||||
name: '农产品',
|
||||
children: [
|
||||
{
|
||||
parentId: '01',
|
||||
id: '0101',
|
||||
name: '植物性农产品',
|
||||
children: [
|
||||
{ parentId: '0101', id: '010101', name: '谷物' },
|
||||
{ parentId: '0101', id: '010102', name: '蔬菜' },
|
||||
{ parentId: '0101', id: '010103', name: '水果' },
|
||||
{ parentId: '0101', id: '010104', name: '坚果与油料作物' },
|
||||
{ parentId: '0101', id: '010105', name: '糖料作物' },
|
||||
{ parentId: '0101', id: '010106', name: '纤维作物' },
|
||||
{ parentId: '0101', id: '010107', name: '茶叶' },
|
||||
{ parentId: '0101', id: '010108', name: '咖啡' },
|
||||
{ parentId: '0101', id: '010109', name: '香料' },
|
||||
],
|
||||
},
|
||||
{
|
||||
parentId: '01',
|
||||
id: '0102',
|
||||
name: '动物性农产品',
|
||||
children: [
|
||||
{ parentId: '0102', id: '010201', name: '肉类' },
|
||||
{ parentId: '0102', id: '010202', name: '奶制品' },
|
||||
{ parentId: '0102', id: '010203', name: '蛋类' },
|
||||
{ parentId: '0102', id: '010204', name: '蜂蜜' },
|
||||
{ parentId: '0102', id: '010205', name: '水产品' },
|
||||
],
|
||||
},
|
||||
{
|
||||
parentId: '01',
|
||||
id: '0103',
|
||||
name: '特殊农产品',
|
||||
children: [
|
||||
{ parentId: '0103', id: '010301', name: '花卉与苗木' },
|
||||
{ parentId: '0103', id: '010302', name: '药材' },
|
||||
{ parentId: '0103', id: '010303', name: '菌类' },
|
||||
],
|
||||
},
|
||||
{
|
||||
parentId: '01',
|
||||
id: '0104',
|
||||
name: '其他',
|
||||
children: [{ parentId: '0104', id: '010401', name: '饲料' }],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: '02',
|
||||
name: '种子种苗',
|
||||
children: [
|
||||
{
|
||||
parentId: '02',
|
||||
id: '0101',
|
||||
name: '花卉种子种苗',
|
||||
children: [
|
||||
{ parentId: '0101', id: '010101', name: '草本花卉' },
|
||||
{ parentId: '0101', id: '010102', name: '木本花卉' },
|
||||
{ parentId: '0101', id: '010103', name: '野生花卉' },
|
||||
],
|
||||
},
|
||||
{
|
||||
parentId: '02',
|
||||
id: '0102',
|
||||
name: '蔬菜种子种苗',
|
||||
children: [
|
||||
{ parentId: '0102', id: '010201', name: '叶菜类' },
|
||||
{ parentId: '0102', id: '010202', name: '根茎类' },
|
||||
{ parentId: '0102', id: '010203', name: '果实类' },
|
||||
{ parentId: '0102', id: '010204', name: '豆类' },
|
||||
{ parentId: '0102', id: '010205', name: '瓜类' },
|
||||
],
|
||||
},
|
||||
{
|
||||
parentId: '02',
|
||||
id: '0103',
|
||||
name: '果树种苗',
|
||||
children: [
|
||||
{ parentId: '0103', id: '010301', name: '柑橘类' },
|
||||
{ parentId: '0103', id: '010302', name: '仁果类' },
|
||||
{ parentId: '0103', id: '010303', name: '核果类' },
|
||||
{ parentId: '0103', id: '010304', name: '浆果类' },
|
||||
],
|
||||
},
|
||||
{
|
||||
parentId: '02',
|
||||
id: '0104',
|
||||
name: '药材种子与种苗',
|
||||
children: [
|
||||
{ parentId: '0104', id: '010401', name: '寒地龙药' },
|
||||
{ parentId: '0104', id: '010402', name: '常见中药材' },
|
||||
],
|
||||
},
|
||||
{
|
||||
parentId: '02',
|
||||
id: '0105',
|
||||
name: '其他作物',
|
||||
children: [
|
||||
{ parentId: '0105', id: '010501', name: '牧草' },
|
||||
{ parentId: '0105', id: '010502', name: '经济作物' },
|
||||
{ parentId: '0105', id: '010503', name: '观赏树木' },
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
import { agriculturalList, transaction } from '@/apis/agricultural.js';
|
||||
let treeList = reactive([]);
|
||||
|
||||
let list = reactive([]);
|
||||
let params = reactive({
|
||||
current: 1,
|
||||
size: 10,
|
||||
parentId: null,
|
||||
childrenId: null,
|
||||
});
|
||||
let pagination = reactive({
|
||||
current: 1,
|
||||
size: 10,
|
||||
total: 0,
|
||||
});
|
||||
let bannerList = reactive(['images/ecommerce/' + 'banner1.png', 'images/ecommerce/' + 'banner1.png']);
|
||||
const getList = () => {
|
||||
params.current = pagination.current;
|
||||
params.size = pagination.size;
|
||||
agriculturalList(params).then((res) => {
|
||||
if (res.code === 200) {
|
||||
list.splice(0, list.length, ...res.data.records);
|
||||
pagination.total = res.data.total;
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getList();
|
||||
getTree();
|
||||
});
|
||||
|
||||
const handleSizeChange = (val) => {
|
||||
pagination.size = val;
|
||||
getList();
|
||||
};
|
||||
const handleCurrentChange = (val) => {
|
||||
pagination.current = val;
|
||||
getList();
|
||||
};
|
||||
const getTree = () => {
|
||||
transaction().then((res) => {
|
||||
if (res.code === 200) {
|
||||
let a = res.data.sort((a, b) => Number(b.id) - Number(a.id));
|
||||
treeList.splice(0, treeList.length, ...a);
|
||||
// console.log('treeList', treeList);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const selected = (data) => {
|
||||
// 获取所有值并转为数组
|
||||
const val = Object.values(data);
|
||||
console.log(data);
|
||||
if (val.length === 1) {
|
||||
params.parentId = val[0].id;
|
||||
} else {
|
||||
if (val[0].id === '') {
|
||||
params.childrenId = '';
|
||||
params.parentId = null;
|
||||
} else {
|
||||
params.childrenId = val[val.length - 1].id;
|
||||
params.parentId = val[val.length - 1].parentId;
|
||||
}
|
||||
}
|
||||
getList();
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.goods-list-warp {
|
||||
|
||||
@ -5,6 +5,8 @@ import { useRoute, useRouter } from 'vue-router';
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const currentDevice = ref(0);
|
||||
|
||||
// 图标icon对照表
|
||||
const icons = [
|
||||
{ 监控: 'camera' },
|
||||
@ -61,7 +63,13 @@ const props = defineProps({
|
||||
<template>
|
||||
<div>
|
||||
<el-card style="border-radius: 16px">
|
||||
<div style="font-size: 16px; font-weight: bold; text-align: left; color: #000; margin-bottom: 20px">{{ title }}</div>
|
||||
<div style="color: #999999; line-height: 25px; text-align: left">
|
||||
当前设备组
|
||||
<el-select v-model="currentDevice" placeholder="Select" size="small" style="width: 160px; margin-left: 10px">
|
||||
<el-option v-for="item in devices" :key="item.value" :label="item.detail" :value="item.id" />
|
||||
</el-select>
|
||||
</div>
|
||||
<div style="font-size: 16px; font-weight: bold; text-align: left; color: #000; margin: 15px 0">{{ title }}</div>
|
||||
<div style="display: flex; justify-content: flex-start; flex-wrap: wrap; gap: 20px">
|
||||
<div v-for="(item, index) in devices" :key="index" class="device">
|
||||
<div v-if="item.status == 1" class="status" style="background-color: #25bf82">正常</div>
|
||||
|
||||
@ -81,6 +81,14 @@ onMounted(async () => {
|
||||
<el-card style="border-radius: 16px">
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="font-size: 16px; font-weight: bold; text-align: left">{{ title }}</div>
|
||||
<div>
|
||||
<div>当前设备状态：</div>
|
||||
<div>
|
||||
<div class="dot"></div>
|
||||
<span>正常</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="color: #999999; line-height: 25px">
|
||||
当前设备
|
||||
<el-select v-model="currentDevice" placeholder="Select" size="small" style="width: 160px; margin-left: 10px">
|
||||
@ -125,4 +133,11 @@ onMounted(async () => {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.dot {
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
display: inline-block;
|
||||
border-radius: 90px;
|
||||
background-color: #25bf82;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -29,13 +29,6 @@ const devices = ref([
|
||||
status: '1', // 0: 离线 1: 正常 -1: 异常
|
||||
id: 0,
|
||||
},
|
||||
{
|
||||
name: 'A-002',
|
||||
icon: 'temperature',
|
||||
detail: 'A区-监控设备66',
|
||||
status: '1',
|
||||
id: 1,
|
||||
},
|
||||
{
|
||||
name: 'A-003',
|
||||
icon: 'humidity',
|
||||
@ -43,13 +36,6 @@ const devices = ref([
|
||||
status: '0',
|
||||
id: 2,
|
||||
},
|
||||
{
|
||||
name: 'A-004',
|
||||
icon: 'humidity',
|
||||
detail: 'A区-监控设备1',
|
||||
status: '-1',
|
||||
id: 3,
|
||||
},
|
||||
{
|
||||
name: 'A-005',
|
||||
icon: 'valve',
|
||||
@ -57,13 +43,6 @@ const devices = ref([
|
||||
status: '-1',
|
||||
id: 4,
|
||||
},
|
||||
{
|
||||
name: 'A-006',
|
||||
icon: 'valve',
|
||||
status: '0',
|
||||
detail: 'A区-监控设备21',
|
||||
id: 5,
|
||||
},
|
||||
{
|
||||
name: 'A-007',
|
||||
icon: 'sprinkler',
|
||||
@ -71,13 +50,6 @@ const devices = ref([
|
||||
detail: 'A区-监控设备4',
|
||||
id: 6,
|
||||
},
|
||||
{
|
||||
name: 'A-008',
|
||||
detail: 'A区-监控设备3',
|
||||
icon: 'sprinkler',
|
||||
status: '-1',
|
||||
id: 7,
|
||||
},
|
||||
{
|
||||
name: 'A-009',
|
||||
detail: 'A区-监控设备9',
|
||||
@ -85,13 +57,6 @@ const devices = ref([
|
||||
status: '-1',
|
||||
id: 8,
|
||||
},
|
||||
{
|
||||
name: 'A-010',
|
||||
detail: 'A区-监控设备10',
|
||||
icon: 'waterSupplyValve',
|
||||
status: '0',
|
||||
id: 9,
|
||||
},
|
||||
{
|
||||
name: 'A-011',
|
||||
detail: 'A区-监控设备3',
|
||||
@ -99,13 +64,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 10,
|
||||
},
|
||||
{
|
||||
name: 'A-012',
|
||||
detail: 'A区-监控设备3',
|
||||
icon: 'intelligentValveControl',
|
||||
status: '1',
|
||||
id: 11,
|
||||
},
|
||||
]);
|
||||
|
||||
const srcList = ref(['https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg']);
|
||||
|
||||
@ -29,13 +29,6 @@ const devices = ref([
|
||||
status: '1', // 0: 离线 1: 正常 -1: 异常
|
||||
id: 0,
|
||||
},
|
||||
{
|
||||
name: 'A-002',
|
||||
icon: 'tempSensor',
|
||||
detail: 'A区-监控设备66',
|
||||
status: '1',
|
||||
id: 1,
|
||||
},
|
||||
{
|
||||
name: 'A-003',
|
||||
icon: 'heater',
|
||||
@ -43,13 +36,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 2,
|
||||
},
|
||||
{
|
||||
name: 'A-004',
|
||||
icon: 'heater',
|
||||
detail: 'A区-监控设备1',
|
||||
status: '-1',
|
||||
id: 3,
|
||||
},
|
||||
{
|
||||
name: 'A-005',
|
||||
icon: 'heat',
|
||||
@ -57,13 +43,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 4,
|
||||
},
|
||||
{
|
||||
name: 'A-006',
|
||||
icon: 'disinfectionLamp',
|
||||
status: '0',
|
||||
detail: 'A区-监控设备21',
|
||||
id: 5,
|
||||
},
|
||||
{
|
||||
name: 'A-007',
|
||||
icon: 'timer',
|
||||
@ -71,13 +50,6 @@ const devices = ref([
|
||||
detail: 'A区-监控设备4',
|
||||
id: 6,
|
||||
},
|
||||
{
|
||||
name: 'A-008',
|
||||
detail: 'A区-监控设备3',
|
||||
icon: 'timer',
|
||||
status: '-1',
|
||||
id: 7,
|
||||
},
|
||||
{
|
||||
name: 'A-009',
|
||||
detail: 'A区-监控设备9',
|
||||
@ -92,13 +64,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 9,
|
||||
},
|
||||
{
|
||||
name: 'A-011',
|
||||
detail: 'A区-监控设备3',
|
||||
icon: 'liquidSensor',
|
||||
status: '0',
|
||||
id: 10,
|
||||
},
|
||||
{
|
||||
name: 'A-012',
|
||||
detail: 'A区-监控设备3',
|
||||
|
||||
@ -17,13 +17,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 0,
|
||||
},
|
||||
{
|
||||
name: 'A-002',
|
||||
icon: 'temp',
|
||||
detail: 'A区-监控设备2',
|
||||
status: '1',
|
||||
id: 1,
|
||||
},
|
||||
{
|
||||
name: 'A-003',
|
||||
icon: 'ph',
|
||||
@ -31,13 +24,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 2,
|
||||
},
|
||||
{
|
||||
name: 'A-004',
|
||||
icon: 'ph',
|
||||
detail: 'A区-监控设备4',
|
||||
status: '-1',
|
||||
id: 3,
|
||||
},
|
||||
{
|
||||
name: 'A-005',
|
||||
icon: 'O2',
|
||||
@ -59,20 +45,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 6,
|
||||
},
|
||||
{
|
||||
name: 'B-002',
|
||||
icon: 'elect',
|
||||
detail: 'B区-监控设备2',
|
||||
status: '-1',
|
||||
id: 7,
|
||||
},
|
||||
{
|
||||
name: 'B-003',
|
||||
icon: 'dust',
|
||||
detail: 'B区-监控设备3',
|
||||
status: '1',
|
||||
id: 8,
|
||||
},
|
||||
{
|
||||
name: 'B-004',
|
||||
icon: 'dust',
|
||||
@ -87,13 +59,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 10,
|
||||
},
|
||||
{
|
||||
name: 'B-006',
|
||||
icon: 'float',
|
||||
detail: 'B区-监控设备6',
|
||||
status: '1',
|
||||
id: 11,
|
||||
},
|
||||
]);
|
||||
const rules = ref([
|
||||
{
|
||||
|
||||
@ -10,6 +10,13 @@
|
||||
<el-card style="width: 60%; margin-right: 20px; border-radius: 16px">
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="font-size: 16px; font-weight: bold; text-align: left">实时环境监测</div>
|
||||
<div>
|
||||
<div>当前设备状态：</div>
|
||||
<div>
|
||||
<div class="dot"></div>
|
||||
<span>正常</span>
|
||||
</div>
|
||||
</div>
|
||||
<div style="color: #999999; line-height: 25px">
|
||||
当前设备
|
||||
<el-select
|
||||
@ -91,20 +98,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 0,
|
||||
},
|
||||
{
|
||||
name: 'A-002',
|
||||
icon: 'temp',
|
||||
detail: 'A区-监控设备2',
|
||||
status: '1',
|
||||
id: 1,
|
||||
},
|
||||
{
|
||||
name: 'A-003',
|
||||
icon: 'temp',
|
||||
detail: 'A区-监控设备3',
|
||||
status: '1',
|
||||
id: 2,
|
||||
},
|
||||
{
|
||||
name: 'A-004',
|
||||
icon: 'soilSensor',
|
||||
@ -119,13 +112,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 4,
|
||||
},
|
||||
{
|
||||
name: 'A-006',
|
||||
icon: 'anemometer',
|
||||
detail: 'A区-监控设备6',
|
||||
status: '0',
|
||||
id: 5,
|
||||
},
|
||||
{
|
||||
name: 'B-001',
|
||||
icon: 'rainGauge',
|
||||
@ -133,13 +119,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 6,
|
||||
},
|
||||
{
|
||||
name: 'B-002',
|
||||
icon: 'rainGauge',
|
||||
detail: 'B区-监控设备2',
|
||||
status: '-1',
|
||||
id: 7,
|
||||
},
|
||||
{
|
||||
name: 'B-003',
|
||||
icon: 'waterLoggingSensor',
|
||||
@ -154,13 +133,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 9,
|
||||
},
|
||||
{
|
||||
name: 'B-005',
|
||||
icon: 'PM2.5',
|
||||
detail: 'B区-监控设备5',
|
||||
status: '1',
|
||||
id: 10,
|
||||
},
|
||||
{
|
||||
name: 'B-006',
|
||||
icon: 'light',
|
||||
@ -260,6 +232,13 @@ const chooseIcon = (type) => {
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.dot {
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
display: inline-block;
|
||||
border-radius: 90px;
|
||||
background-color: #25bf82;
|
||||
}
|
||||
.plantStatus {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
@ -71,27 +71,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 0,
|
||||
},
|
||||
{
|
||||
name: 'A-002',
|
||||
icon: 'camera',
|
||||
detail: 'A区-监控设备66',
|
||||
status: '1',
|
||||
id: 1,
|
||||
},
|
||||
{
|
||||
name: 'A-003',
|
||||
icon: 'sensor',
|
||||
detail: 'A区-监控设备7',
|
||||
status: '0',
|
||||
id: 2,
|
||||
},
|
||||
{
|
||||
name: 'A-004',
|
||||
icon: 'sensor',
|
||||
detail: 'A区-监控设备1',
|
||||
status: '-1',
|
||||
id: 3,
|
||||
},
|
||||
{
|
||||
name: 'A-005',
|
||||
icon: 'sensor',
|
||||
@ -99,27 +78,6 @@ const devices = ref([
|
||||
status: '-1',
|
||||
id: 4,
|
||||
},
|
||||
{
|
||||
name: 'A-006',
|
||||
icon: 'camera',
|
||||
status: '0',
|
||||
detail: 'A区-监控设备21',
|
||||
id: 5,
|
||||
},
|
||||
{
|
||||
name: 'A-007',
|
||||
icon: 'camera',
|
||||
status: '0',
|
||||
detail: 'A区-监控设备4',
|
||||
id: 6,
|
||||
},
|
||||
{
|
||||
name: 'A-008',
|
||||
detail: 'A区-监控设备3',
|
||||
icon: 'camera',
|
||||
status: '0',
|
||||
id: 7,
|
||||
},
|
||||
]);
|
||||
|
||||
// #endregion
|
||||
|
||||
@ -60,13 +60,6 @@ const devices = ref([
|
||||
status: '0',
|
||||
id: 0,
|
||||
},
|
||||
{
|
||||
name: 'A-002',
|
||||
icon: 'fertilizerTank',
|
||||
detail: 'A区-监控设备66',
|
||||
status: '0',
|
||||
id: 1,
|
||||
},
|
||||
{
|
||||
name: 'A-003',
|
||||
icon: 'fertilization',
|
||||
@ -81,20 +74,6 @@ const devices = ref([
|
||||
status: '-1',
|
||||
id: 3,
|
||||
},
|
||||
{
|
||||
name: 'A-005',
|
||||
icon: 'mixingTank',
|
||||
detail: 'A区-监控设备5',
|
||||
status: '-1',
|
||||
id: 4,
|
||||
},
|
||||
{
|
||||
name: 'A-006',
|
||||
icon: 'mixingTank',
|
||||
status: '0',
|
||||
detail: 'A区-监控设备21',
|
||||
id: 5,
|
||||
},
|
||||
{
|
||||
name: 'A-007',
|
||||
icon: 'mixingPump',
|
||||
@ -102,20 +81,6 @@ const devices = ref([
|
||||
detail: 'A区-监控设备4',
|
||||
id: 6,
|
||||
},
|
||||
{
|
||||
name: 'A-008',
|
||||
detail: 'A区-监控设备3',
|
||||
icon: 'mixingPump',
|
||||
status: '0',
|
||||
id: 7,
|
||||
},
|
||||
{
|
||||
name: 'A-009',
|
||||
detail: 'A区-监控设备9',
|
||||
icon: 'mixingPump',
|
||||
status: '0',
|
||||
id: 8,
|
||||
},
|
||||
{
|
||||
name: 'A-010',
|
||||
detail: 'A区-监控设备10',
|
||||
@ -123,20 +88,6 @@ const devices = ref([
|
||||
status: '0',
|
||||
id: 9,
|
||||
},
|
||||
{
|
||||
name: 'A-008',
|
||||
detail: 'A区-监控设备3',
|
||||
icon: 'solenoidValve',
|
||||
status: '0',
|
||||
id: 10,
|
||||
},
|
||||
{
|
||||
name: 'A-008',
|
||||
detail: 'A区-监控设备3',
|
||||
icon: 'solenoidValve',
|
||||
status: '0',
|
||||
id: 11,
|
||||
},
|
||||
]);
|
||||
// #endregion
|
||||
/* --------------- methods --------------- */
|
||||
|
||||
@ -15,13 +15,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 0,
|
||||
},
|
||||
{
|
||||
name: 'A-002',
|
||||
icon: 'temp',
|
||||
detail: 'A区-监控设备2',
|
||||
status: '1',
|
||||
id: 1,
|
||||
},
|
||||
{
|
||||
name: 'A-003',
|
||||
icon: 'ph',
|
||||
@ -29,13 +22,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 2,
|
||||
},
|
||||
{
|
||||
name: 'A-004',
|
||||
icon: 'ph',
|
||||
detail: 'A区-监控设备4',
|
||||
status: '-1',
|
||||
id: 3,
|
||||
},
|
||||
{
|
||||
name: 'A-005',
|
||||
icon: 'O2',
|
||||
@ -57,13 +43,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 6,
|
||||
},
|
||||
{
|
||||
name: 'B-002',
|
||||
icon: 'elect',
|
||||
detail: 'B区-监控设备2',
|
||||
status: '-1',
|
||||
id: 7,
|
||||
},
|
||||
{
|
||||
name: 'B-003',
|
||||
icon: 'dust',
|
||||
@ -71,13 +50,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 8,
|
||||
},
|
||||
{
|
||||
name: 'B-004',
|
||||
icon: 'dust',
|
||||
detail: 'B区-监控设备4',
|
||||
status: '1',
|
||||
id: 9,
|
||||
},
|
||||
{
|
||||
name: 'B-005',
|
||||
icon: 'float',
|
||||
@ -85,13 +57,6 @@ const devices = ref([
|
||||
status: '1',
|
||||
id: 10,
|
||||
},
|
||||
{
|
||||
name: 'B-006',
|
||||
icon: 'float',
|
||||
detail: 'B区-监控设备6',
|
||||
status: '1',
|
||||
id: 11,
|
||||
},
|
||||
]);
|
||||
const rules = ref([
|
||||
{
|
||||
@ -183,6 +148,13 @@ const chooseIcon = (type) => {
|
||||
<el-card style="border-radius: 16px; width: 58%; height: fit-content">
|
||||
<div style="display: flex; justify-content: space-between">
|
||||
<div style="font-size: 16px; font-weight: bold; text-align: left">实时水质监测</div>
|
||||
<div>
|
||||
<div>当前设备状态：</div>
|
||||
<div>
|
||||
<div class="dot"></div>
|
||||
<span>正常</span>
|
||||
</div>
|
||||
</div>
|
||||
<div style="color: #999999; line-height: 25px">
|
||||
当前设备
|
||||
<el-select v-model="currentDevice" placeholder="Select" size="small" style="width: 160px; margin-left: 10px">
|
||||
@ -250,4 +222,11 @@ const chooseIcon = (type) => {
|
||||
height: 20px;
|
||||
}
|
||||
}
|
||||
.dot {
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
display: inline-block;
|
||||
border-radius: 90px;
|
||||
background-color: #25bf82;
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user