2025-6-11
This commit is contained in:
parent
f97b473d31
commit
09b3894966
@ -39,6 +39,12 @@ export function authList(params) {
|
||||
params,
|
||||
});
|
||||
}
|
||||
export function authDetail(id, params) {
|
||||
return request(`brand/brandbase/detail/${id}`, {
|
||||
method: 'GET',
|
||||
params,
|
||||
});
|
||||
}
|
||||
|
||||
export function saveRecords(data) {
|
||||
return request('brand/applicationrecord/save', {
|
||||
|
||||
BIN
sub-operation-service/src/assets/images/mockPic/nyzc0.png
Normal file
BIN
sub-operation-service/src/assets/images/mockPic/nyzc0.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 971 KiB |
BIN
sub-operation-service/src/assets/images/mockPic/nyzc1.png
Normal file
BIN
sub-operation-service/src/assets/images/mockPic/nyzc1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 601 KiB |
BIN
sub-operation-service/src/assets/images/mockPic/nyzc2.png
Normal file
BIN
sub-operation-service/src/assets/images/mockPic/nyzc2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 683 KiB |
BIN
sub-operation-service/src/assets/images/mockPic/nyzc3.png
Normal file
BIN
sub-operation-service/src/assets/images/mockPic/nyzc3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 209 KiB |
@ -15,12 +15,14 @@
|
||||
</div>
|
||||
<div class="layout-header-top-right">
|
||||
<el-badge :hidden="goodNum < 1" :value="goodNum" :max="99" class="item" :offset="[-3, 10]">
|
||||
<span class="block-icon" @click="toCart">
|
||||
<div class="iconfont icon-shopcar" style="font-size: 12px"></div>
|
||||
<span>购物车</span>
|
||||
</span>
|
||||
<div style="display: flex" @click="toCart">
|
||||
<div class="iconfont icon-shopcar" style="font-size: 14px; margin: 0 5px; color: #25bf82; font-weight: bold"></div>
|
||||
<div>购物车</div>
|
||||
</div>
|
||||
</el-badge>
|
||||
<el-badge :hidden="true" :value="0" :max="99" class="item" :offset="[-3, 10]">
|
||||
<span>商家中心</span>
|
||||
</el-badge>
|
||||
<span @click="toUserCenter">个人中心</span>
|
||||
<span class="block-icon" @click="toHome">
|
||||
<div class="iconfont icon-home" style="font-size: 12px"></div>
|
||||
@ -336,4 +338,15 @@ const toCart = () => {
|
||||
.layout-header-bottom-right {
|
||||
margin-top: 0;
|
||||
}
|
||||
.layout-header-top-right {
|
||||
display: flex;
|
||||
.item {
|
||||
margin-left: 25px;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
color: $color-000;
|
||||
line-height: 36px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -121,6 +121,55 @@ export const constantRoutes = [
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/sub-operation-service/farmService',
|
||||
component: Layout,
|
||||
name: 'farmService',
|
||||
redirect: '/sub-operation-service/farmService/consult/policy',
|
||||
meta: { title: '农事服务' },
|
||||
children: [
|
||||
{
|
||||
path: 'consult',
|
||||
component: Views,
|
||||
name: 'farmServiceMain',
|
||||
meta: { title: '农事咨询' },
|
||||
children: [
|
||||
{
|
||||
path: 'policy',
|
||||
component: Views,
|
||||
name: 'farmPolicys',
|
||||
meta: { title: '农业政策' },
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
component: () => import('@/views/farmingService/farmingConsult/index.vue'),
|
||||
name: 'farmPolicy',
|
||||
meta: { title: '农业政策', hideInBread: true },
|
||||
},
|
||||
{
|
||||
path: 'detail',
|
||||
component: () => import('@/views/farmingService/farmingConsult/index.vue'),
|
||||
name: 'farmPolicyDetail',
|
||||
meta: { title: '农业政策详情' },
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'technology',
|
||||
component: () => import('@/views/farmingService/farmingConsult/farmingTec.vue'),
|
||||
name: 'farmTechnology',
|
||||
meta: { title: '农事技术' },
|
||||
},
|
||||
{
|
||||
path: 'situation',
|
||||
component: () => import('@/views/farmingService/farmingConsult/situation.vue'),
|
||||
name: 'farmSituation',
|
||||
meta: { title: '市场行情' },
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: '/sub-operation-service/dashboard',
|
||||
component: Layout,
|
||||
@ -336,39 +385,44 @@ export const constantRoutes = [
|
||||
meta: { title: '公共品牌' },
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
path: 'apply',
|
||||
component: BrandLayout,
|
||||
meta: { title: '使用申请' },
|
||||
name: 'brandList',
|
||||
redirect: '/sub-operation-service/brand/apply',
|
||||
children: [
|
||||
{
|
||||
path: 'apply',
|
||||
name: 'brandApplyList',
|
||||
path: '',
|
||||
component: () => import('@/views/brand/components/ApplyList.vue'),
|
||||
meta: { title: '使用申请' },
|
||||
meta: { title: '使用申请', hideInBread: true },
|
||||
name: 'brandApplyList',
|
||||
},
|
||||
{
|
||||
path: 'brandApplyDetail',
|
||||
name: 'brandApplyDetail',
|
||||
path: 'detail',
|
||||
component: () => import('@/views/brand/components/ApplyDetail.vue'),
|
||||
meta: { title: '产品申请' },
|
||||
meta: { title: '申请详情' },
|
||||
name: 'brandApplyDetail',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'auth/record',
|
||||
name: 'brandAuth',
|
||||
path: 'auth',
|
||||
component: BrandLayout,
|
||||
meta: { title: '授权管理' },
|
||||
name: 'authManage',
|
||||
redirect: 'record',
|
||||
children: [
|
||||
{
|
||||
path: 'record',
|
||||
name: 'authRecord',
|
||||
component: () => import('@/views/brand/components/Auth.vue'),
|
||||
meta: { title: '授权记录' },
|
||||
},
|
||||
{
|
||||
path: 'auth/system',
|
||||
name: 'brandSystem',
|
||||
path: 'manage',
|
||||
name: 'brandManage',
|
||||
component: () => import('@/views/brand/components/BrandSystem.vue'),
|
||||
meta: { title: '品牌制度' },
|
||||
},
|
||||
{
|
||||
path: 'monitor',
|
||||
name: 'brandMonitor',
|
||||
component: () => import('@/views/brand/components/Monitor.vue'),
|
||||
meta: { title: '使用监管' },
|
||||
meta: { title: '品牌使用管理' },
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
@ -1,18 +1,11 @@
|
||||
<template>
|
||||
<div class="container">
|
||||
<el-breadcrumb separator="·">
|
||||
<el-breadcrumb-item style="cursor: pointer" @click="backToList"
|
||||
><el-icon><ArrowLeftBold /></el-icon>使用申请</el-breadcrumb-item
|
||||
>
|
||||
<el-breadcrumb-item><a href="#">我要申请</a></el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
|
||||
<img :src="getAssetsFile('images/brand/11.png')" alt="" class="img" />
|
||||
<img :src="goodDetail.imgPath" alt="" class="img" />
|
||||
|
||||
<el-form label-width="120px" class="form">
|
||||
<h1 style="margin: 20px 0 20px 50px">请选择溯源农产品申请</h1>
|
||||
<h1 style="margin: 0 0 20px 50px">请选择溯源农产品申请</h1>
|
||||
<el-form-item label="溯源商品">
|
||||
<el-select v-model="batch" placeholder="请选择商品" :width="200">
|
||||
<el-select v-model="batch" placeholder="请选择商品" filterable :width="200">
|
||||
<el-option v-for="(item, index) in goodsList" :key="index" :label="item.goodName" :value="item.id">
|
||||
<el-tooltip :content="item.goodName" placement="top">
|
||||
<span>{{ item.goodNames }}</span>
|
||||
@ -59,12 +52,14 @@ import { ref, onMounted, reactive } from 'vue';
|
||||
import { ElMessage } from 'element-plus';
|
||||
import { getAssetsFile } from '@/utils/index.js';
|
||||
import { goodList, saveRecords } from '@/apis/brand.js';
|
||||
import { authDetail } from '../../../apis/brand.js';
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
|
||||
const productId = route.query.id;
|
||||
const product = ref({ name: '加载中...', id: productId });
|
||||
const goodDetail = ref({});
|
||||
|
||||
const goodsList = reactive([]);
|
||||
|
||||
@ -82,6 +77,11 @@ onMounted(() => {
|
||||
}
|
||||
}
|
||||
});
|
||||
authDetail(productId).then((res) => {
|
||||
if (res.code === 200) {
|
||||
goodDetail.value = res.data;
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
const batch = ref('');
|
||||
@ -134,12 +134,11 @@ function submit() {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
position: absolute;
|
||||
top: 60px;
|
||||
top: 20px;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.form {
|
||||
margin-top: 20px;
|
||||
width: 60%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
<el-col v-for="product in products" :key="product.id" :span="6">
|
||||
<el-card class="box-card" :body-style="{ padding: '8px', height: '100%' }">
|
||||
<div class="flex-column">
|
||||
<img :src="getAssetsFile(product.imgPath)" alt="商品图" class="img" />
|
||||
<img :src="product.imgPath" alt="商品图" class="img" />
|
||||
<div class="flex-1 flex-around">
|
||||
<p>{{ product.title }}</p>
|
||||
<el-button type="success" class="button" @click="gotoApplication(product.id)">我要申请</el-button>
|
||||
@ -39,7 +39,7 @@ const applyData = [
|
||||
];
|
||||
|
||||
function gotoApplication(id) {
|
||||
router.push('/sub-operation-service/brand/brandApplyDetail?id=' + id);
|
||||
router.push('/sub-operation-service/brand/apply/detail?id=' + id);
|
||||
}
|
||||
|
||||
// TODO: 对接口需要删除这个方法
|
||||
@ -60,8 +60,8 @@ function getApplyData() {
|
||||
|
||||
// 组件挂载时获取数据
|
||||
onMounted(() => {
|
||||
// getApplyData();
|
||||
data();
|
||||
getApplyData();
|
||||
// data();
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@ -38,8 +38,8 @@
|
||||
<el-card shadow="hover" style="border-radius: 16px" class="product-card">
|
||||
<!-- 状态筛选 -->
|
||||
<el-tabs v-model="activeStatus" class="tabs-wrapper" @tab-change="changeStatus">
|
||||
<el-tab-pane label="已授权" name="1" />
|
||||
<el-tab-pane label="审批中" name="2" />
|
||||
<el-tab-pane label="已授权" name="2" />
|
||||
<el-tab-pane label="审批中" name="1" />
|
||||
<el-tab-pane label="被驳回" name="3" />
|
||||
<el-tab-pane label="已失效" name="4" />
|
||||
</el-tabs>
|
||||
@ -67,13 +67,13 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="product-action">
|
||||
<el-tag v-if="product.status == 1" size="large" class="text-success status-tag" type="success">已授权</el-tag>
|
||||
<el-tag v-if="product.status == 2" size="large" class="text-warning status-tag" type="warning">审批中</el-tag>
|
||||
<el-tag v-if="product.status == 2" size="large" class="text-success status-tag" type="success">已授权</el-tag>
|
||||
<el-tag v-if="product.status == 1" size="large" class="text-warning status-tag" type="warning">审批中</el-tag>
|
||||
<el-tag v-if="product.status == 3" size="large" class="text-danger status-tag" type="danger">被驳回</el-tag>
|
||||
<el-tag v-if="product.status == 4" size="large" class="text-info status-tag" type="info">已失效</el-tag>
|
||||
<div style="display: flex">
|
||||
<el-button
|
||||
v-if="product.status == 1"
|
||||
v-if="product.status == 2"
|
||||
type="primary"
|
||||
plain
|
||||
:icon="Edit"
|
||||
@ -84,7 +84,7 @@
|
||||
授权证书
|
||||
</el-button>
|
||||
<el-button size="large" class="button" @click="onInspect(product)">溯源报告</el-button>
|
||||
<el-button v-if="product.status == 1" size="large" class="button" type="danger" @click="onRevoke(product)">取消授权</el-button>
|
||||
<el-button v-if="product.status == 2" size="large" class="button" type="danger" @click="onRevoke(product)">取消授权</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -174,7 +174,7 @@
|
||||
|
||||
<!-- 右侧图片 -->
|
||||
<div class="trace-img">
|
||||
<img :src="traceData.img" alt="产品图" />
|
||||
<img :src="traceData.img" alt="产品图" width="150" />
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
@ -339,7 +339,7 @@ const getAuthList = (status) => {
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getAuthList(1);
|
||||
getAuthList(2);
|
||||
});
|
||||
</script>
|
||||
|
||||
|
||||
@ -1,12 +1,13 @@
|
||||
<template>
|
||||
<div class="brand-system">
|
||||
<!-- 搜索与筛选 -->
|
||||
<div class="system-header">
|
||||
<el-input v-model="searchQuery" placeholder="搜索制度名称/编号" prefix-icon="el-icon-search" />
|
||||
<el-select v-model="filterType" placeholder="分类筛选">
|
||||
<el-option v-for="type in filterTypes" :key="type.value" :label="type.label" :value="type.value" />
|
||||
</el-select>
|
||||
</div>
|
||||
<!-- <div class="system-header">-->
|
||||
<!-- <el-input v-model="searchQuery" placeholder="搜索制度名称/编号" prefix-icon="el-icon-search" />-->
|
||||
<!-- <el-select v-model="filterType" placeholder="分类筛选">-->
|
||||
<!-- <el-option v-for="type in filterTypes" :key="type.value" :label="type.label" :value="type.value" />-->
|
||||
<!-- </el-select>-->
|
||||
<!-- </div>-->
|
||||
<h2>品牌制度</h2>
|
||||
|
||||
<!-- 制度列表 -->
|
||||
<div class="system-list">
|
||||
@ -18,16 +19,15 @@
|
||||
</div>
|
||||
<div class="card-meta">
|
||||
<span>编号：{{ item.code }}</span>
|
||||
<span>版本：v{{ item.version }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<p>{{ item.desc }}</p>
|
||||
</div>
|
||||
<div class="card-footer">
|
||||
<span :class="`status-tag ${item.status === '生效中' ? 'active' : 'inactive'}`">{{ item.status }}</span>
|
||||
<span>生效日期：{{ item.effectiveDate }}</span>
|
||||
</div>
|
||||
<!-- <div class="card-footer">-->
|
||||
<!-- <span :class="`status-tag ${item.status === '生效中' ? 'active' : 'inactive'}`">{{ item.status }}</span>-->
|
||||
<!-- <span>生效日期：{{ item.effectiveDate }}</span>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -40,7 +40,6 @@
|
||||
<h3>{{ currentDetail.title }}</h3>
|
||||
<div class="dialog-meta">
|
||||
<span>编号：{{ currentDetail.code }}</span>
|
||||
<span>版本：v{{ currentDetail.version }}</span>
|
||||
<span :class="`status-tag ${currentDetail.status === '生效中' ? 'active' : 'inactive'}`">{{ currentDetail.status }}</span>
|
||||
</div>
|
||||
</div>
|
||||
@ -56,7 +55,6 @@
|
||||
</div>
|
||||
<div class="dialog-footer">
|
||||
<div class="footer-info">
|
||||
<p>制定部门：{{ currentDetail.department }}</p>
|
||||
<p>发布日期：{{ currentDetail.publishDate }}</p>
|
||||
</div>
|
||||
<el-button @click="hideDetail">关闭</el-button>
|
||||
@ -236,10 +234,10 @@ $color-danger: #ff4949;
|
||||
}
|
||||
|
||||
.system-list {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||||
gap: 24px;
|
||||
flex: 1;
|
||||
margin-top: 20px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
@ -248,9 +246,11 @@ $color-danger: #ff4949;
|
||||
border-radius: 12px;
|
||||
border: 1px solid $color-border;
|
||||
cursor: pointer;
|
||||
width: 48%;
|
||||
transition: all 0.3s;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
|
||||
overflow: hidden;
|
||||
margin-bottom: 20px;
|
||||
&:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 12px 24px -4px rgba(0, 0, 0, 0.1);
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
<span>授权管理</span>
|
||||
</template>
|
||||
<el-menu-item index="auth/record"> 授权记录 </el-menu-item>
|
||||
<el-menu-item index="auth/system"> 品牌使用管理 </el-menu-item>
|
||||
<el-menu-item index="auth/manage"> 品牌使用管理 </el-menu-item>
|
||||
</el-sub-menu>
|
||||
|
||||
<!-- <el-menu-item index="monitor">-->
|
||||
@ -26,6 +26,7 @@
|
||||
</el-aside>
|
||||
|
||||
<el-main class="brand-main">
|
||||
<bread-comp></bread-comp>
|
||||
<router-view />
|
||||
</el-main>
|
||||
</el-container>
|
||||
@ -44,13 +45,14 @@ const openMenus = ref(['auth']);
|
||||
|
||||
const menuMap = {
|
||||
apply: ['brandApplyList'],
|
||||
'auth/record': ['brandAuth'],
|
||||
'auth/system': ['brandSystem'],
|
||||
'auth/record': ['authRecord'],
|
||||
'auth/manage': ['brandManage'],
|
||||
monitor: ['brandMonitor'],
|
||||
};
|
||||
|
||||
// 获取当前菜单激活项
|
||||
const activeMenu = computed(() => {
|
||||
console.log(route.name);
|
||||
const matched = Object.entries(menuMap).find(([key, names]) => names.includes(route.name));
|
||||
// console.log(matched[0]);
|
||||
return matched ? matched[0] : '';
|
||||
|
||||
@ -144,6 +144,7 @@ import { getGoodDetail } from '@/apis/agricultural.js';
|
||||
import { addToCart, quicklyBuy } from '../../apis/agricultural.js';
|
||||
import { useMethodsStore } from '@/store/modules/methods';
|
||||
import { ElMessage, ElMessageBox } from 'element-plus';
|
||||
import { ElMessage, ElMessageBox } from 'element-plus';
|
||||
|
||||
const methodsStore = useMethodsStore();
|
||||
|
||||
|
||||
@ -14,12 +14,13 @@
|
||||
</div>
|
||||
<el-dialog v-model="centerDialogVisible" title="Warning" width="80%" align-center :show-close="false" style="border-radius: 16px">
|
||||
<template #header>
|
||||
<div style="text-align: right" @click="centerDialogVisible = false">
|
||||
<div style="display: flex; justify-content: space-between; padding: 0 20px" @click="centerDialogVisible = false">
|
||||
<div style="font-size: 20px">商品购买</div>
|
||||
<el-icon size="25" style="cursor: pointer"><Close /></el-icon>
|
||||
</div>
|
||||
</template>
|
||||
<template #default>
|
||||
<div style="padding: 20px; text-align: left">
|
||||
<div style="padding: 0 20px 20px 20px; text-align: left">
|
||||
<div style="text-align: left; display: flex">
|
||||
<img :src="currentGood.goodUrl" style="width: 120px" alt="" />
|
||||
<div style="margin-left: 15px; display: flex; flex-direction: column; justify-content: space-around">
|
||||
|
||||
@ -93,7 +93,7 @@ let params = reactive({
|
||||
});
|
||||
let pagination = reactive({
|
||||
current: 1,
|
||||
size: 10,
|
||||
size: 50,
|
||||
total: 0,
|
||||
});
|
||||
const handleSizeChange = (val) => {
|
||||
|
||||
@ -22,13 +22,22 @@
|
||||
<div v-if="activeCurrent == 'baseInfo'" class="baseInfo-content">
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="6">
|
||||
<banner name="codeinfo" :imglist="bannerList" indicator-pos="none" arrow="always" height="160px" :is-view="true"> </banner>
|
||||
<banner
|
||||
name="codeinfo"
|
||||
:imglist="bannerList"
|
||||
:is-montage="false"
|
||||
indicator-pos="none"
|
||||
arrow="always"
|
||||
height="160px"
|
||||
:is-view="true"
|
||||
>
|
||||
</banner>
|
||||
</el-col>
|
||||
<el-col :span="18">
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="12" class="des-item">
|
||||
<span class="label">产品名称：</span>
|
||||
<span class="val">有机沙瓤西红柿</span>
|
||||
<span class="val">{{ goodInfo.goodName }}</span>
|
||||
</el-col>
|
||||
<el-col :span="12" class="des-item">
|
||||
<span class="label">追溯次数：</span>
|
||||
@ -66,7 +75,16 @@
|
||||
<div v-if="activeCurrent == 'report'" class="report-content">
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="6">
|
||||
<banner name="report" :imglist="bannerList" indicator-pos="none" arrow="always" height="160px" :is-view="true"> </banner>
|
||||
<banner
|
||||
name="report"
|
||||
:imglist="bannerList"
|
||||
:is-montage="false"
|
||||
indicator-pos="none"
|
||||
arrow="always"
|
||||
height="160px"
|
||||
:is-view="true"
|
||||
>
|
||||
</banner>
|
||||
</el-col>
|
||||
<el-col :span="18">
|
||||
<el-row :gutter="16">
|
||||
@ -110,7 +128,16 @@
|
||||
<div v-if="activeCurrent == 'business'" class="business-content">
|
||||
<el-row :gutter="16">
|
||||
<el-col :span="6">
|
||||
<banner name="business" :imglist="bannerList" indicator-pos="none" arrow="always" height="160px" :is-view="true"> </banner>
|
||||
<banner
|
||||
name="business"
|
||||
:is-montage="false"
|
||||
:imglist="bannerList"
|
||||
indicator-pos="none"
|
||||
arrow="always"
|
||||
height="160px"
|
||||
:is-view="true"
|
||||
>
|
||||
</banner>
|
||||
</el-col>
|
||||
<el-col :span="18">
|
||||
<el-row :gutter="16">
|
||||
@ -158,8 +185,10 @@
|
||||
<div class="report">
|
||||
<!-- <el-image :src="getAssetsFile('images/ecommerce/' + 'pic.png')" fit="none" /> -->
|
||||
<costomImg
|
||||
:url="'images/ecommerce/' + 'pic.png'"
|
||||
:preview-list="[getAssetsFile('images/ecommerce/' + 'pic.png')?.href ?? '']"
|
||||
v-if="bannerList.length > 0"
|
||||
:url="bannerList[0]"
|
||||
:is-montage="false"
|
||||
:preview-list="bannerList"
|
||||
:is-view="true"
|
||||
></costomImg>
|
||||
<span class="img-tips">溯源证书</span>
|
||||
@ -181,15 +210,21 @@
|
||||
</template>
|
||||
<script setup>
|
||||
import common from './components/common.vue';
|
||||
import { ref, reactive, onMounted, watch, computed } from 'vue';
|
||||
import { isEmpty, getAssetsFile } from '@/utils';
|
||||
import { onMounted, reactive, ref } from 'vue';
|
||||
import { getAssetsFile } from '@/utils';
|
||||
import banner from './components/banner.vue';
|
||||
import { qrImg } from '@/layouts/component/Header/base64img.js';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import costomImg from '@/components/costomImg.vue';
|
||||
import { getGoodDetail } from '@/apis/agricultural.js';
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const goodId = route.query.id;
|
||||
|
||||
const goodInfo = ref({});
|
||||
|
||||
let bottomList = reactive([
|
||||
{ title: '基本信息', img: 'trace01.png', name: 'baseInfo' },
|
||||
{ title: '检测报告', img: 'trace02.png', name: 'report' },
|
||||
@ -200,19 +235,33 @@ let bottomList = reactive([
|
||||
|
||||
let activeCurrent = ref('baseInfo');
|
||||
|
||||
let bannerList = reactive(['images/ecommerce/' + 'pic.png', 'images/ecommerce/' + 'pic.png']);
|
||||
const bannerList = ref([]);
|
||||
|
||||
let tableData = reactive([
|
||||
{ id: 'NS10000111', title: '施肥', inputs: '氮肥', operator: '张三', time: '2025-04-02 12:25:36' },
|
||||
{ id: 'NS10000112', title: '灌溉', inputs: '矿物质', operator: '李四', time: '2025-04-01 12:25:36' },
|
||||
{ id: 'NS10000113', title: '喷洒农药', inputs: '杀虫剂', operator: '王五', time: '2025-04-02 13:25:36' },
|
||||
{ id: 'NS10000114', title: '施肥', inputs: '有机肥', operator: '张三', time: '2025-04-02 12:25:36' },
|
||||
{ id: 'NS10000115', title: '灌溉', inputs: '白糖水', operator: '李四', time: '2025-03-31 12:25:36' },
|
||||
{ id: 'NS10000116', title: '喷洒农药', inputs: '除草剂', operator: '王五', time: '2025-04-02 12:25:36' },
|
||||
{ id: 'NS10000117', title: '施肥', inputs: '钾肥', operator: '张三', time: '2025-04-02 12:25:36' },
|
||||
{ id: 'NS10000118', title: '灌溉', inputs: '尿素水', operator: '李四', time: '2025-04-02 12:25:36' },
|
||||
{ id: 'NS10000111', title: '施肥', inputs: '氮肥', operator: '王持国', time: '2025-04-02 12:25:36' },
|
||||
{ id: 'NS10000112', title: '灌溉', inputs: '矿物质', operator: '李东', time: '2025-04-01 12:25:36' },
|
||||
{ id: 'NS10000113', title: '喷洒农药', inputs: '杀虫剂', operator: '王国舫', time: '2025-04-02 13:25:36' },
|
||||
{ id: 'NS10000114', title: '施肥', inputs: '有机肥', operator: '张旭东', time: '2025-04-02 12:25:36' },
|
||||
{ id: 'NS10000115', title: '灌溉', inputs: '白糖水', operator: '李楠', time: '2025-03-31 12:25:36' },
|
||||
{ id: 'NS10000116', title: '喷洒农药', inputs: '除草剂', operator: '姚勋', time: '2025-04-02 12:25:36' },
|
||||
{ id: 'NS10000117', title: '施肥', inputs: '钾肥', operator: '沈红', time: '2025-04-02 12:25:36' },
|
||||
{ id: 'NS10000118', title: '灌溉', inputs: '尿素水', operator: '郭开', time: '2025-04-02 12:25:36' },
|
||||
]);
|
||||
|
||||
onMounted(() => {
|
||||
getGoodDetail(goodId).then((res) => {
|
||||
if (res.code === 200) {
|
||||
goodInfo.value = res.data;
|
||||
if (res.data.goodUrl) {
|
||||
let ar = res.data.goodUrl.split(',');
|
||||
for (let i in ar) {
|
||||
bannerList.value[i] = ar[i];
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
const toBack = (level) => {
|
||||
router.go(level);
|
||||
};
|
||||
@ -335,7 +384,7 @@ const toBack = (level) => {
|
||||
}
|
||||
.val {
|
||||
width: calc(100% - 150px);
|
||||
text-align: right;
|
||||
text-align: left;
|
||||
color: $color-333;
|
||||
}
|
||||
}
|
||||
@ -456,4 +505,11 @@ const toBack = (level) => {
|
||||
}
|
||||
}
|
||||
}
|
||||
.report {
|
||||
:deep(.el-image img) {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: fill !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -61,7 +61,7 @@ let params = reactive({
|
||||
});
|
||||
let pagination = reactive({
|
||||
current: 1,
|
||||
size: 10,
|
||||
size: 50,
|
||||
total: 4,
|
||||
});
|
||||
let bannerList = reactive(['images/ecommerce/' + 'banner1.png', 'images/ecommerce/' + 'banner1.png']);
|
||||
|
||||
@ -0,0 +1,124 @@
|
||||
<template>
|
||||
<div class="smartFarm-common-warp">
|
||||
<div class="smartFarm-common-content">
|
||||
<div class="left-menu">
|
||||
<slot v-if="$slots.left" name="left"></slot>
|
||||
<template v-else>
|
||||
<left-menu :menus="menus"></left-menu>
|
||||
</template>
|
||||
</div>
|
||||
<div class="common-content">
|
||||
<bread-comp></bread-comp>
|
||||
<slot v-if="$slots.main" name="main"></slot>
|
||||
<template v-else></template>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, watch } from 'vue';
|
||||
import leftMenu from './leftMenu.vue';
|
||||
import BreadComp from '@/components/breadComp.vue';
|
||||
|
||||
const props = defineProps({
|
||||
currentName: { type: String, default: 'agricultural' },
|
||||
});
|
||||
|
||||
const menus = reactive([
|
||||
{
|
||||
name: 'supplier',
|
||||
title: '农业环境监测',
|
||||
icon: 'menu1.png',
|
||||
path: '/sub-operation-service/smartFarm/main',
|
||||
isOpen: true,
|
||||
children: [
|
||||
{
|
||||
name: 'supplier',
|
||||
title: '田间监测',
|
||||
path: '/sub-operation-service/smartFarm/inspection',
|
||||
},
|
||||
{
|
||||
name: 'supplier',
|
||||
title: '水质监测',
|
||||
path: '/sub-operation-service/ecommerce-supplier',
|
||||
},
|
||||
{
|
||||
name: 'supplier',
|
||||
title: '病虫害监测',
|
||||
path: '/sub-operation-service/ecommerce-supplier',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: 'control',
|
||||
title: '生产管理控制',
|
||||
icon: 'menu3.png',
|
||||
path: '',
|
||||
isOpen: false,
|
||||
children: [
|
||||
{
|
||||
name: 'control',
|
||||
title: '一体育苗',
|
||||
icon: 'menu3.png',
|
||||
path: '/sub-operation-service/smartFarm/manageControl/growSeedlings',
|
||||
},
|
||||
{
|
||||
name: 'control',
|
||||
title: '病虫害预防',
|
||||
icon: 'menu3.png',
|
||||
path: '/sub-operation-service/smartFarm/manageControl/pestPrevention',
|
||||
},
|
||||
{
|
||||
name: 'control',
|
||||
title: '喷灌滴灌',
|
||||
icon: 'menu3.png',
|
||||
path: '/sub-operation-service/smartFarm/manageControl/irrigationSystem',
|
||||
},
|
||||
{
|
||||
name: 'control',
|
||||
title: '排集水控制',
|
||||
icon: 'menu3.png',
|
||||
path: '/sub-operation-service/smartFarm/manageControl/drainageControl',
|
||||
},
|
||||
{
|
||||
name: 'control',
|
||||
title: '开窗卷帘',
|
||||
icon: 'menu3.png',
|
||||
path: '/sub-operation-service/smartFarm/manageControl/openCurtain',
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.smartFarm-common-warp {
|
||||
width: 100%;
|
||||
height: calc(100vh - 230px);
|
||||
text-align: center;
|
||||
.smartFarm-common-content {
|
||||
width: $width-main;
|
||||
margin: auto;
|
||||
height: 100%;
|
||||
display: inline-flex;
|
||||
justify-content: space-between;
|
||||
margin: auto;
|
||||
width: $width-main;
|
||||
height: 100%;
|
||||
.left-menu,
|
||||
.common-content {
|
||||
overflow-y: auto;
|
||||
padding: 8px;
|
||||
height: calc(100% - 16px);
|
||||
border-radius: 8px;
|
||||
}
|
||||
.left-menu {
|
||||
width: 240px;
|
||||
background: $color-fff;
|
||||
}
|
||||
.common-content {
|
||||
margin-left: 16px;
|
||||
width: calc(100% - 240px);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,232 @@
|
||||
<template>
|
||||
<div class="smartFarm-left-menu-warp">
|
||||
<div class="left-menu">
|
||||
<div
|
||||
v-for="(n, index) in leftMenu"
|
||||
:key="index"
|
||||
class="left-menu-item"
|
||||
style="position: relative"
|
||||
@click.stop="
|
||||
toLink(index);
|
||||
openList(index);
|
||||
"
|
||||
>
|
||||
<div style="display: flex; justify-content: flex-start; align-items: center">
|
||||
<div class="item-img">
|
||||
<img :src="getAssetsFile('images/smartFarm/' + n.icon)?.href ?? ''" alt="" />
|
||||
</div>
|
||||
<span :class="n.isOpen ? 'active' : ''" class="item-title">{{ n.title }}</span>
|
||||
<img v-if="n.children && n.isOpen" alt="" :src="getAssetsFile('images/smartFarm/closing.png')" class="isOpen" />
|
||||
<img
|
||||
v-if="n.children && !n.isOpen"
|
||||
alt=""
|
||||
:src="getAssetsFile('images/smartFarm/down_1@2x.png')"
|
||||
class="isOpen fz"
|
||||
@click.stop="openList(index)"
|
||||
/>
|
||||
</div>
|
||||
<div v-if="n.children && n.isOpen" class="item-children">
|
||||
<div v-for="(item, indexC) in n.children" :key="indexC">
|
||||
<ul style="overflow: visible; padding-left: 40px; text-align: left; list-style-type: disc !important">
|
||||
<li :class="item.name === currentCIndex ? 'active' : ''" @click.stop="toLinkSub(index, item.name)">
|
||||
<div class="dot"></div>
|
||||
{{ item.title }}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, watch } from 'vue';
|
||||
import { isEmpty, getAssetsFile } from '@/utils';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const leftMenu = reactive([
|
||||
{
|
||||
name: 'inspection',
|
||||
title: '农事咨询',
|
||||
icon: 'menu1.png',
|
||||
path: '',
|
||||
isOpen: false,
|
||||
children: [
|
||||
{
|
||||
name: 'farmPolicy',
|
||||
title: '农业政策',
|
||||
icon: 'menu1.png',
|
||||
path: '/sub-operation-service/farmService/consult/policy',
|
||||
},
|
||||
// {
|
||||
// name: 'farmTechnology',
|
||||
// title: '农事技术',
|
||||
// icon: 'menu1.png',
|
||||
// path: '/sub-operation-service/farmService/consult/technology',
|
||||
// },
|
||||
// {
|
||||
// name: 'farmSituation',
|
||||
// title: '市场行情',
|
||||
// icon: 'menu1.png',
|
||||
// path: '/sub-operation-service/farmService/consult/situation',
|
||||
// },
|
||||
],
|
||||
},
|
||||
// {
|
||||
// name: 'control',
|
||||
// title: '生产管理控制',
|
||||
// icon: 'menu3.png',
|
||||
// path: '',
|
||||
// isOpen: false,
|
||||
// children: [
|
||||
// {
|
||||
// name: 'growSeedlings',
|
||||
// title: '一体育苗',
|
||||
// icon: 'menu3.png',
|
||||
// path: '/sub-operation-service/smartFarm/growSeedlings',
|
||||
// },
|
||||
// {
|
||||
// name: 'pestPrevention',
|
||||
// title: '病虫害预防',
|
||||
// icon: 'menu3.png',
|
||||
// path: '/sub-operation-service/smartFarm/pestPrevention',
|
||||
// },
|
||||
// {
|
||||
// name: 'irrigationSystem',
|
||||
// title: '喷灌滴灌',
|
||||
// icon: 'menu3.png',
|
||||
// path: '/sub-operation-service/smartFarm/irrigationSystem',
|
||||
// },
|
||||
// {
|
||||
// name: 'drainageControl',
|
||||
// title: '排集水控制',
|
||||
// icon: 'menu3.png',
|
||||
// path: '/sub-operation-service/smartFarm/drainageControl',
|
||||
// },
|
||||
// {
|
||||
// name: 'openCurtain',
|
||||
// title: '开窗卷帘',
|
||||
// icon: 'menu3.png',
|
||||
// path: '/sub-operation-service/smartFarm/openCurtain',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
]);
|
||||
|
||||
let currentIndex = ref(0);
|
||||
let currentCIndex = ref('');
|
||||
|
||||
const toLink = (index) => {
|
||||
currentIndex.value = index;
|
||||
window.sessionStorage.setItem('currentOpen', index);
|
||||
if (index === 0) {
|
||||
window.sessionStorage.setItem('currentChild', 'main');
|
||||
}
|
||||
currentCIndex.value = '';
|
||||
let path = index !== undefined ? leftMenu[index].path : null;
|
||||
if (path) {
|
||||
router.push(path);
|
||||
}
|
||||
};
|
||||
const toLinkSub = (index, name) => {
|
||||
console.info('index', index);
|
||||
console.info('currentChild', name);
|
||||
currentCIndex.value = name;
|
||||
window.sessionStorage.setItem('currentChild', name);
|
||||
let path;
|
||||
for (let i in leftMenu[index].children) {
|
||||
if (leftMenu[index].children[i].name === name) {
|
||||
path = leftMenu[index].children[i].path;
|
||||
}
|
||||
}
|
||||
if (path) {
|
||||
console.info('path', path);
|
||||
router.push(path);
|
||||
}
|
||||
};
|
||||
const openList = (index) => {
|
||||
currentIndex.value = index;
|
||||
leftMenu[index].isOpen = !leftMenu[index].isOpen;
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
const currentMenu = window.sessionStorage.getItem('currentOpen');
|
||||
if (currentMenu) {
|
||||
for (let i in leftMenu) {
|
||||
leftMenu[i].isOpen = i === currentMenu;
|
||||
}
|
||||
}
|
||||
const currentChild = window.sessionStorage.getItem('currentChild');
|
||||
if (currentChild && currentChild === 'main') {
|
||||
currentIndex.value = 0;
|
||||
currentCIndex.value = '';
|
||||
} else if (currentChild) {
|
||||
currentCIndex.value = currentChild;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.fz {
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
.isOpen {
|
||||
position: absolute;
|
||||
right: -24px;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.active {
|
||||
color: $color-main;
|
||||
}
|
||||
.smartFarm-left-menu-warp {
|
||||
padding: 0 30px 0 10px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.left-menu {
|
||||
.left-menu-item {
|
||||
padding: 16px 0;
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
&.active {
|
||||
color: $color-main;
|
||||
}
|
||||
.item-img,
|
||||
.item-title {
|
||||
vertical-align: middle;
|
||||
}
|
||||
.item-img {
|
||||
display: inline-block;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
}
|
||||
.item-title {
|
||||
padding-left: 8px;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
}
|
||||
.item-children {
|
||||
margin-top: 8px;
|
||||
font-size: 16px;
|
||||
text-align: center;
|
||||
transition: transform 0.3s ease;
|
||||
.dot {
|
||||
display: inline-block;
|
||||
margin-right: 15px;
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
border-radius: 90px;
|
||||
background-color: black;
|
||||
vertical-align: middle;
|
||||
}
|
||||
li {
|
||||
margin: 5px auto;
|
||||
height: 35px;
|
||||
line-height: 35px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,33 @@
|
||||
<template>
|
||||
<div>
|
||||
<common>
|
||||
<template #main> </template>
|
||||
</common>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import common from '../components/common.vue';
|
||||
|
||||
/* --------------- data --------------- */
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.framing_service_content {
|
||||
margin: 0 auto;
|
||||
padding: 0 32px;
|
||||
width: 1200px;
|
||||
min-height: 600px;
|
||||
border: 1px solid skyblue;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
@ -1,13 +1,62 @@
|
||||
<template>
|
||||
<section>framing consult</section>
|
||||
<div>
|
||||
<common>
|
||||
<template #main>
|
||||
<div>
|
||||
<el-card shadow="hover" style="border-radius: 16px">
|
||||
<h2 style="text-align: left">农业政策</h2>
|
||||
<div v-for="(item, index) in tableData" :key="index" class="card-item">
|
||||
<div style="width: 49%"><img :src="getAssetsFile(item.imgPath)" alt="" width="100%" /></div>
|
||||
<div style="width: 49%; display: flex; flex-direction: column; justify-content: space-between">
|
||||
<div>
|
||||
<div style="font-size: 20px; font-weight: bold">{{ item.title }}</div>
|
||||
<div style="font-size: 14px; margin-top: 20px">
|
||||
{{ item.desc }}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<el-button style="height: 50px; background-color: #25bf82; color: #ffffff; border-radius: 16px"
|
||||
>查看详情<el-icon><Right /></el-icon
|
||||
></el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-card>
|
||||
</div>
|
||||
</template>
|
||||
</common>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import common from '../components/common.vue';
|
||||
import { getAssetsFile } from '../../../utils/index.js';
|
||||
|
||||
/* --------------- data --------------- */
|
||||
// #region
|
||||
|
||||
const tableData = ref([
|
||||
{
|
||||
id: 1,
|
||||
title: '完善强农惠农富农支持制度',
|
||||
desc: '制度关乎根本、稳定和长远，全面推进乡村振兴事关国泰民安。以农业农村现代化推进农业强国建设，尤其需要重视农村制度建设。党的二十届三中全会作出“完善强农惠农富农支持制度”的决策部署。',
|
||||
imgPath: 'images/mockPic/nyzc0.png',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: '农民日报仲农平文章：一号文件里的“三农”脉动',
|
||||
desc: '自党的十九大提出乡村振兴战略后，2018年中央一号文件对该战略进行了顶层设计，将其作为新时代“三农”工作的总抓手，绘制出一幅扎实的蓝图。',
|
||||
imgPath: 'images/mockPic/nyzc2.png',
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: '近年来，三农问题一直是国家关注的焦点。在新的历史时期，我们必须坚持农业农村优先发展的战略，加快推进乡村振兴，建设美好新农村。',
|
||||
desc: '首先，我们要深入推进农业现代化。传统农业已经无法满足现代社会的需求，我们必须引进新技术、新品种、新模式，提高农业生产效率和质量。',
|
||||
imgPath: 'images/mockPic/nyzc3.png',
|
||||
},
|
||||
]);
|
||||
|
||||
// #endregion
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
@ -16,4 +65,19 @@ import { ref } from 'vue';
|
||||
// #endregion
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped></style>
|
||||
<style lang="scss" scoped>
|
||||
.framing_service_content {
|
||||
margin: 0 auto;
|
||||
padding: 0 32px;
|
||||
width: 1200px;
|
||||
min-height: 600px;
|
||||
border: 1px solid skyblue;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.card-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 20px 0;
|
||||
text-align: left;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -0,0 +1,33 @@
|
||||
<template>
|
||||
<div>
|
||||
<common>
|
||||
<template #main> </template>
|
||||
</common>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import common from '../components/common.vue';
|
||||
|
||||
/* --------------- data --------------- */
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
|
||||
/* --------------- methods --------------- */
|
||||
// #region
|
||||
|
||||
// #endregion
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.framing_service_content {
|
||||
margin: 0 auto;
|
||||
padding: 0 32px;
|
||||
width: 1200px;
|
||||
min-height: 600px;
|
||||
border: 1px solid skyblue;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
</style>
|
||||
@ -1,9 +1,14 @@
|
||||
<template>
|
||||
<section class="framing_service_content"><el-button type="primary">农事服务</el-button></section>
|
||||
<div>
|
||||
<common>
|
||||
<template #main> </template>
|
||||
</common>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import common from './components/common.vue';
|
||||
|
||||
/* --------------- data --------------- */
|
||||
// #region
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user