夏滨修改 农产品溯源，溯源列表
This commit is contained in:
parent
93f13af072
commit
fc6d3a5cd4
75
new-digital-agriculture-screen/auto-imports.d.ts
vendored
Normal file
75
new-digital-agriculture-screen/auto-imports.d.ts
vendored
Normal file
@ -0,0 +1,75 @@
|
||||
/* eslint-disable */
|
||||
/* prettier-ignore */
|
||||
// @ts-nocheck
|
||||
// noinspection JSUnusedGlobalSymbols
|
||||
// Generated by unplugin-auto-import
|
||||
export {}
|
||||
declare global {
|
||||
const EffectScope: typeof import('vue')['EffectScope']
|
||||
const computed: typeof import('vue')['computed']
|
||||
const createApp: typeof import('vue')['createApp']
|
||||
const customRef: typeof import('vue')['customRef']
|
||||
const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
|
||||
const defineComponent: typeof import('vue')['defineComponent']
|
||||
const effectScope: typeof import('vue')['effectScope']
|
||||
const getCurrentInstance: typeof import('vue')['getCurrentInstance']
|
||||
const getCurrentScope: typeof import('vue')['getCurrentScope']
|
||||
const h: typeof import('vue')['h']
|
||||
const inject: typeof import('vue')['inject']
|
||||
const isProxy: typeof import('vue')['isProxy']
|
||||
const isReactive: typeof import('vue')['isReactive']
|
||||
const isReadonly: typeof import('vue')['isReadonly']
|
||||
const isRef: typeof import('vue')['isRef']
|
||||
const markRaw: typeof import('vue')['markRaw']
|
||||
const nextTick: typeof import('vue')['nextTick']
|
||||
const onActivated: typeof import('vue')['onActivated']
|
||||
const onBeforeMount: typeof import('vue')['onBeforeMount']
|
||||
const onBeforeRouteLeave: typeof import('vue-router')['onBeforeRouteLeave']
|
||||
const onBeforeRouteUpdate: typeof import('vue-router')['onBeforeRouteUpdate']
|
||||
const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
|
||||
const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
|
||||
const onDeactivated: typeof import('vue')['onDeactivated']
|
||||
const onErrorCaptured: typeof import('vue')['onErrorCaptured']
|
||||
const onMounted: typeof import('vue')['onMounted']
|
||||
const onRenderTracked: typeof import('vue')['onRenderTracked']
|
||||
const onRenderTriggered: typeof import('vue')['onRenderTriggered']
|
||||
const onScopeDispose: typeof import('vue')['onScopeDispose']
|
||||
const onServerPrefetch: typeof import('vue')['onServerPrefetch']
|
||||
const onUnmounted: typeof import('vue')['onUnmounted']
|
||||
const onUpdated: typeof import('vue')['onUpdated']
|
||||
const onWatcherCleanup: typeof import('vue')['onWatcherCleanup']
|
||||
const provide: typeof import('vue')['provide']
|
||||
const reactive: typeof import('vue')['reactive']
|
||||
const readonly: typeof import('vue')['readonly']
|
||||
const ref: typeof import('vue')['ref']
|
||||
const resolveComponent: typeof import('vue')['resolveComponent']
|
||||
const shallowReactive: typeof import('vue')['shallowReactive']
|
||||
const shallowReadonly: typeof import('vue')['shallowReadonly']
|
||||
const shallowRef: typeof import('vue')['shallowRef']
|
||||
const toRaw: typeof import('vue')['toRaw']
|
||||
const toRef: typeof import('vue')['toRef']
|
||||
const toRefs: typeof import('vue')['toRefs']
|
||||
const toValue: typeof import('vue')['toValue']
|
||||
const triggerRef: typeof import('vue')['triggerRef']
|
||||
const unref: typeof import('vue')['unref']
|
||||
const useAttrs: typeof import('vue')['useAttrs']
|
||||
const useCssModule: typeof import('vue')['useCssModule']
|
||||
const useCssVars: typeof import('vue')['useCssVars']
|
||||
const useId: typeof import('vue')['useId']
|
||||
const useLink: typeof import('vue-router')['useLink']
|
||||
const useModel: typeof import('vue')['useModel']
|
||||
const useRoute: typeof import('vue-router')['useRoute']
|
||||
const useRouter: typeof import('vue-router')['useRouter']
|
||||
const useSlots: typeof import('vue')['useSlots']
|
||||
const useTemplateRef: typeof import('vue')['useTemplateRef']
|
||||
const watch: typeof import('vue')['watch']
|
||||
const watchEffect: typeof import('vue')['watchEffect']
|
||||
const watchPostEffect: typeof import('vue')['watchPostEffect']
|
||||
const watchSyncEffect: typeof import('vue')['watchSyncEffect']
|
||||
}
|
||||
// for type re-export
|
||||
declare global {
|
||||
// @ts-ignore
|
||||
export type { Component, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
|
||||
import('vue')
|
||||
}
|
||||
53
new-digital-agriculture-screen/components.d.ts
vendored
Normal file
53
new-digital-agriculture-screen/components.d.ts
vendored
Normal file
@ -0,0 +1,53 @@
|
||||
/* eslint-disable */
|
||||
/* prettier-ignore */
|
||||
// @ts-nocheck
|
||||
// Generated by unplugin-vue-components
|
||||
// Read more: https://github.com/vuejs/core/pull/3399
|
||||
export {}
|
||||
|
||||
declare module 'vue' {
|
||||
export interface GlobalComponents {
|
||||
BaseBg: typeof import('./src/components/baseBg.vue')['default']
|
||||
CenterMap: typeof import('./src/components/centerMap.vue')['default']
|
||||
'CenterMap copy': typeof import('./src/components/centerMap copy.vue')['default']
|
||||
CodeDialog: typeof import('./src/components/code-dialog/index.vue')['default']
|
||||
Components: typeof import('./src/components/index.js')['default']
|
||||
copy: typeof import('./src/components/centerMap copy.vue')['default']
|
||||
CurrentTime: typeof import('./src/components/currentTime.vue')['default']
|
||||
CustomBack: typeof import('./src/components/customBack.vue')['default']
|
||||
CustomCarouselPicture: typeof import('./src/components/custom-carousel-picture/index.vue')['default']
|
||||
CustomEchartBar: typeof import('./src/components/custom-echart-bar/index.vue')['default']
|
||||
CustomEchartBubble: typeof import('./src/components/custom-echart-bubble/index.vue')['default']
|
||||
CustomEchartColumnLine: typeof import('./src/components/custom-echart-column-line/index.vue')['default']
|
||||
CustomEchartHyalineCake: typeof import('./src/components/custom-echart-hyaline-cake/index.vue')['default']
|
||||
CustomEchartLine: typeof import('./src/components/custom-echart-line/index.vue')['default']
|
||||
CustomEchartLineLine: typeof import('./src/components/custom-echart-line-line/index.vue')['default']
|
||||
CustomEchartMaps: typeof import('./src/components/custom-echart-maps/index.vue')['default']
|
||||
CustomEchartMixin: typeof import('./src/components/custom-echart-mixin/index.vue')['default']
|
||||
CustomEchartPictorialBar: typeof import('./src/components/custom-echart-pictorial-bar/index.vue')['default']
|
||||
CustomEchartPie: typeof import('./src/components/custom-echart-pie/index.vue')['default']
|
||||
CustomEchartPie3d: typeof import('./src/components/custom-echart-pie-3d/index.vue')['default']
|
||||
CustomEchartPieGauge: typeof import('./src/components/custom-echart-pie-gauge/index.vue')['default']
|
||||
CustomEchartRadar: typeof import('./src/components/custom-echart-radar/index.vue')['default']
|
||||
CustomEchartScatterBlister: typeof import('./src/components/custom-echart-scatter-blister/index.vue')['default']
|
||||
CustomEchartTriangle: typeof import('./src/components/custom-echart-triangle/index.vue')['default']
|
||||
CustomEchartWaterDroplet: typeof import('./src/components/custom-echart-water-droplet/index.vue')['default']
|
||||
CustomEchartWordCloud: typeof import('./src/components/custom-echart-word-cloud/index.vue')['default']
|
||||
CustomIframe: typeof import('./src/components/custom-iframe/index.vue')['default']
|
||||
CustomImportExcel: typeof import('./src/components/custom-import-excel/index.vue')['default']
|
||||
CustomProgress: typeof import('./src/components/customProgress.vue')['default']
|
||||
CustomRankList: typeof import('./src/components/custom-rank-list/index.vue')['default']
|
||||
CustomRichEditor: typeof import('./src/components/custom-rich-editor/index.vue')['default']
|
||||
CustomScrollBoard: typeof import('./src/components/custom-scroll-board/index.vue')['default']
|
||||
CustomScrollTitle: typeof import('./src/components/custom-scroll-title/index.vue')['default']
|
||||
CustomTableOperate: typeof import('./src/components/custom-table-operate/index.vue')['default']
|
||||
CustomTableTree: typeof import('./src/components/custom-table-tree/index.vue')['default']
|
||||
NewHyalineCake: typeof import('./src/components/custom-echart-hyaline-cake/new-hyaline-cake.vue')['default']
|
||||
NewPie: typeof import('./src/components/custom-echart-hyaline-cake/new-pie.vue')['default']
|
||||
RouterLink: typeof import('vue-router')['RouterLink']
|
||||
RouterView: typeof import('vue-router')['RouterView']
|
||||
SubTop: typeof import('./src/components/subTop.vue')['default']
|
||||
SvgIcon: typeof import('./src/components/svg-icon/index.vue')['default']
|
||||
UpFile: typeof import('./src/components/custom-rich-editor/upFile.js')['default']
|
||||
}
|
||||
}
|
||||
BIN
new-digital-agriculture-screen/src/assets/images/trace/maprl.png
Normal file
BIN
new-digital-agriculture-screen/src/assets/images/trace/maprl.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 215 KiB |
@ -22,45 +22,59 @@
|
||||
<section class="line_info" :style="{ '--top': info.show ? '18vh' : '140vh' }">
|
||||
<i class="el-icon-close" @click="handleCloseInfo"></i>
|
||||
<section>
|
||||
<div class="traceability_info">
|
||||
<div class="_label" style="font-size: 30px">溯源信息</div>
|
||||
<div class="traceability_info_box">
|
||||
<div class="traceability_info_box_image">
|
||||
<img style="width: 100%; height: 100%" src="../../../assets/images/entities/tomatoImg.png" />
|
||||
</div>
|
||||
<div class="traceability_info_box_title">
|
||||
<div class="traceability_info_right">新鲜番茄</div>
|
||||
<div class="traceability_info_right_bottom">检测通过</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detection_text">权威检测</div>
|
||||
<section class="info_box">
|
||||
<div>
|
||||
<span class="_label">产品名称</span>
|
||||
<span>{{ info.productName }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="_label">产品批次号</span>
|
||||
<span>{{ info.productCode }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="_label">产品规格</span>
|
||||
<span>{{ info.specs }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="_label">产品类型</span>
|
||||
<span>{{ info.productType }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="_label">生产厂家</span>
|
||||
<span>{{ info.info && info.info.manufacturer }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="_label">生产时间</span>
|
||||
<span>{{ info.info && info.info.productTime }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<span class="_label">终端零售店</span>
|
||||
<span>{{ info.info && info.info.shop }}</span>
|
||||
<div v-for="item in list1" :key="item.name">
|
||||
<span class="_label">{{ item.title }}</span>
|
||||
<span>{{ item.name }}</span>
|
||||
</div>
|
||||
</section>
|
||||
<section class="route_box">
|
||||
<div v-for="(item, i) in info.info && info.info.route" :key="`route_${i}`" class="route_item">
|
||||
<!-- <div v-for="(item, i) in info.info && info.info.route" :key="`route_${i}`" class="route_item">
|
||||
<div class="_circle"></div>
|
||||
<div class="_name">{{ item.name }}</div>
|
||||
<div class="_time">{{ item.time }}</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div style="text-align: center">
|
||||
<img src="../../../assets/images/trace/testReport.png" style="width: 30%" />
|
||||
<div>检测报告</div>
|
||||
<img src="../../../assets/images/trace/testReport.png" style="width: 100%" />
|
||||
<!-- <div>检测报告</div> -->
|
||||
</div>
|
||||
</section>
|
||||
<div class="detection_text">产地信息</div>
|
||||
<div class="traceability_info">
|
||||
<div class="traceability_info_box" style="flex-direction: column">
|
||||
<div class="traceability_info_box_images">
|
||||
<img style="width: 100%; height: 100%" src="../../../assets/images/trace/maprl.png" />
|
||||
</div>
|
||||
<div class="traceability_info_box_titles">
|
||||
<div class="traceability_info_rights">临沧市耿马县耿马镇</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="detection_text">仓储环节</div>
|
||||
<section class="info_box">
|
||||
<div v-for="item in list2" :key="item.name">
|
||||
<span class="_label">{{ item.title }}</span>
|
||||
<span>{{ item.name }}</span>
|
||||
</div>
|
||||
</section>
|
||||
<div class="detection_text">物流环节</div>
|
||||
<section class="info_box">
|
||||
<div v-for="item in list3" :key="item.name">
|
||||
<span class="_label">{{ item.title }}</span>
|
||||
<span>{{ item.name }}</span>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
@ -82,6 +96,44 @@ onMounted(() => {
|
||||
});
|
||||
let list = ref([]);
|
||||
|
||||
let list1 = ref([
|
||||
{ title: '报告编号', name: 'H1212457' },
|
||||
{ title: '送检单位', name: '水果综合种植基地' },
|
||||
{ title: '送检日期', name: '2021-12-11' },
|
||||
{ title: '送样人', name: '李宏微' },
|
||||
{ title: '联系方式', name: '19876782134' },
|
||||
{ title: '样品数量', name: '1000克' },
|
||||
{ title: '样品名称', name: '新鲜番茄' },
|
||||
{ title: '检测单位', name: '农残检测中心' },
|
||||
{ title: '检测类型', name: '农残检测' },
|
||||
{ title: '检测方法', name: '食品快速检测法' },
|
||||
{ title: '评判标准', name: 'GB/T5009.199-2003' },
|
||||
{ title: '检测结果', name: '合格' },
|
||||
]);
|
||||
|
||||
let list2 = ref([
|
||||
{ title: '仓库位置', name: '耿马县耿马村仓储站' },
|
||||
{ title: '仓储数量', name: '5吨' },
|
||||
{ title: '入库时间', name: '2021-12-11' },
|
||||
{ title: '仓库类型', name: '冷藏仓库' },
|
||||
{ title: '批次编号', name: 'AP20211212001' },
|
||||
{ title: '出库时间', name: '2021-12-15' },
|
||||
]);
|
||||
|
||||
let list3 = ref([
|
||||
{ title: '运输批次', name: '第一批次' },
|
||||
{ title: '运输工具', name: '冷藏车' },
|
||||
{ title: '运输路线', name: '耿马县一昆明市' },
|
||||
{ title: '运输数量', name: '4吨' },
|
||||
{ title: '运输时间', name: '2021-12-15 5:30~12-16 8:30' },
|
||||
{ title: '', name: '' },
|
||||
{ title: '运输批次', name: '第二批次' },
|
||||
{ title: '运输工具', name: '小型运载卡车' },
|
||||
{ title: '运输路线', name: '耿马县一四排乡' },
|
||||
{ title: '运输数量', name: '1吨' },
|
||||
{ title: '运输时间', name: '2021-12-15 5:30~12-16 7:30' },
|
||||
]);
|
||||
|
||||
const classOptions = {
|
||||
singleHeight: 48,
|
||||
};
|
||||
@ -103,7 +155,7 @@ function handleCloseInfo() {
|
||||
.label {
|
||||
display: grid;
|
||||
grid-template-columns: 25% 40% 18% 17%;
|
||||
background-color: rgba(53, 208, 192, 0.3);
|
||||
background-color: rgba(70, 109, 109, 0.8);
|
||||
color: #ffffff;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
@ -162,6 +214,58 @@ function handleCloseInfo() {
|
||||
z-index: 9999;
|
||||
transition: all 0.8s cubic-bezier(0.58, 0.15, 0.4, 1.42);
|
||||
font-size: 18px;
|
||||
.detection_text {
|
||||
font-size: 25px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.traceability_info {
|
||||
.traceability_info_box {
|
||||
justify-content: space-evenly;
|
||||
padding: 10px;
|
||||
display: flex;
|
||||
margin: 20px 0px;
|
||||
background-color: rgba(70, 109, 109, 0.8);
|
||||
border-radius: 10px;
|
||||
.traceability_info_box_image {
|
||||
width: 130px;
|
||||
height: 75px;
|
||||
}
|
||||
.traceability_info_box_images {
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
}
|
||||
|
||||
.traceability_info_box_title {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
align-items: center;
|
||||
height: 75px;
|
||||
}
|
||||
.traceability_info_box_titles {
|
||||
margin-top: 10px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-evenly;
|
||||
align-items: start;
|
||||
}
|
||||
.traceability_info_right {
|
||||
font-size: 23px;
|
||||
color: #fff;
|
||||
}
|
||||
.traceability_info_rights {
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
.traceability_info_right_bottom {
|
||||
padding: 5px 20px;
|
||||
border-radius: 40px;
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
color: #04ed8c;
|
||||
font-size: 17px;
|
||||
}
|
||||
}
|
||||
}
|
||||
._label {
|
||||
color: #01fefd;
|
||||
}
|
||||
@ -207,7 +311,6 @@ function handleCloseInfo() {
|
||||
}
|
||||
}
|
||||
.route_box {
|
||||
padding: 0 34px;
|
||||
> div {
|
||||
position: relative;
|
||||
padding-bottom: 16px;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user