Merge branch 'dev' of http://192.168.18.88:8077/sznyb/daimp-front into dev

2025-04-03 17:24:08 +08:00 · 2025-04-03 17:24:08 +08:00 · 86cacd8316
commit 86cacd8316
parent 9f09d313ee 89a2cb8809
58 changed files with 3376 additions and 224 deletions
--- a/main/src/components/custom-table-operate/index.vue
+++ b/main/src/components/custom-table-operate/index.vue
@ -1,7 +1,11 @@
 <template>
  <el-dropdown popper-class="custom-table-operate">
-    <el-icon class="custom-table-operate__more"><More /></el-icon>
-    <template #dropdown>
+    <el-icon class="custom-table-operate__more">
+      <template v-if="show">
+        <More />
+      </template>
+    </el-icon>
+    <template v-if="show" #dropdown>
      <el-dropdown-menu v-if="!isEmpty(actions)">
        <template v-for="item in actions" :key="item.name">
          <el-dropdown-item v-if="onPermission(item)" @click="item.event(data)">
@ -20,6 +24,7 @@ import { isEmpty } from '@/utils';
 const props = defineProps({
  actions: { type: Array, default: () => [] },
  data: { type: Object, default: () => {} },
+  show: { type: Boolean, default: true },
 });

 const onPermission = (row) => {
--- a/main/src/micro/app.js
+++ b/main/src/micro/app.js
@ -58,7 +58,7 @@ export const rightApps = [
  {
    name: 'sub-government-screen-service',
    entry: VITE_APP_SUB_GSS,
-    activeRule: '/sub-government-screen-service/',
+    activeRule: '/sub-government-screen-service',
    title: '数据大屏',
    icon: 'images/platform/icon-screen.png',
  },
@ -75,10 +75,17 @@ export const defaultApps = [
  {
    name: 'sub-government-screen-service',
    entry: VITE_APP_SUB_GSS,
-    activeRule: '/sub-government-screen-service/',
+    activeRule: '/sub-government-screen-service',
    title: '数据大屏',
    icon: 'images/platform/icon-screen.png',
  },
+  {
+    name: 'sub-operation-service',
+    entry: VITE_APP_SUB_OS,
+    activeRule: '/sub-operation-service',
+    title: '运营服务',
+    icon: 'images/platform/icon-home.png',
+  },
 ];

 // export const microApps = [...defaultApps, ...leftApps, ...rightApps];
--- a/sub-government-affairs-service/src/apis/system/menu.js
+++ b/sub-government-affairs-service/src/apis/system/menu.js
@ -47,7 +47,6 @@ export function GetMenu(dictType) {
 }

 // 查询菜单下拉树结构
-// 返回parentId
 export function GetMenuTree() {
  return request('/system/menu/treeselect', {
    method: 'GET',
--- a/sub-government-affairs-service/src/config/index.js
+++ b/sub-government-affairs-service/src/config/index.js
@ -31,6 +31,7 @@ export const CRUD_OPTIONS = {
  menuWidth: 100,
  actions: [],
  dialogDrag: true,
+  rowKey: 'id',
 };

 export const CRUD_VIEW_OPTIONS = {
--- a/sub-government-affairs-service/src/utils/index.js
+++ b/sub-government-affairs-service/src/utils/index.js
@ -3,7 +3,7 @@
 * @Author: zenghua.wang
 * @Date: 2022-02-23 21:12:37
 * @LastEditors: zenghua.wang
- * @LastEditTime: 2025-03-28 14:18:58
+ * @LastEditTime: 2025-04-02 14:21:56
 */
 import lodash from 'lodash';
 import dayjs from 'dayjs';
@ -138,12 +138,12 @@ export const setPropDisplay = (column, fields) => {
 * @param {*} tree
 * @returns
 */
-export const flattenTree = (tree) => {
+export const flattenTree = (tree, children = 'children') => {
  const result = [];
  function traverse(node) {
    result.push(node);
-    if (node.children && node.children.length > 0) {
-      node.children.forEach((child) => traverse(child));
+    if (node[children] && node[children].length > 0) {
+      node[children].forEach((child) => traverse(child));
    }
  }
  if (Array.isArray(tree)) {
@ -276,6 +276,7 @@ export const getTree = (data, id = 'id', parentId = 'parentId', children = 'chil

  const map = {};
  data.forEach((item) => {
+    item.level = 0;
    map[item[id]] = item;
  });

@ -283,9 +284,11 @@ export const getTree = (data, id = 'id', parentId = 'parentId', children = 'chil
  data.forEach((item) => {
    const parent = map[item[parentId]];
    if (parent) {
+      item.level = parent.level + 1;
      parent[children] = parent[children] || [];
      parent[children].push(item);
    } else {
+      item.level = 0;
      tree.push(item);
    }
  });
--- a/sub-government-affairs-service/src/views/plantingAndBreeding/base/index.vue
+++ b/sub-government-affairs-service/src/views/plantingAndBreeding/base/index.vue
@ -23,8 +23,8 @@
      </template>

      <template #status="{ row }">
-        <el-tag v-if="row.status == 1" type="success" size="small">启用</el-tag>
-        <el-tag v-if="row.status == 0" type="danger" size="small">禁用</el-tag>
+        <el-tag v-if="row.status == 1" type="success">启用</el-tag>
+        <el-tag v-if="row.status == 0" type="danger">禁用</el-tag>
      </template>

      <template #menu="scope">
@ -35,18 +35,17 @@
 </template>
 <script setup>
 import { ref, reactive } from 'vue';
-import { useRouter } from 'vue-router';
 import { useApp } from '@/hooks';
 import { useUserStore } from '@/store/modules/user';
 import { CRUD_OPTIONS } from '@/config';
 import { isEmpty, setDicData, debounce } from '@/utils';
+// import { CommonDicData } from '@/apis';
 import { getLandsList } from '@/apis/land';
 import { GetEntityList, AddEntity, UpdateEntity, DeleteEntity, UpdateStatus } from '@/apis/plantingAndBreeding/base';

 const { VITE_APP_BASE_API } = import.meta.env;
 const app = useApp();
 const UserStore = useUserStore();
-const router = useRouter();
 const crudRef = ref(null);
 const state = reactive({
  loading: false,
@ -141,9 +140,15 @@ const state = reactive({
      {
        label: '区域面积',
        prop: 'area',
-        width: 100,
+        width: 150,
+        overHidden: true,
        disabled: true,
        labelTip: '请先选择地块！',
+        formatter: (row) => {
+          // const item = state.unitList.find((v) => v.dictValue == row.unit);
+          // return row.area + (!isEmpty(item) ? item.dictLabel : '平方米');
+          return row.area + (!isEmpty(row.unit) ? row.unit : '平方米');
+        },
      },
      {
        label: '状态',
@ -233,10 +238,23 @@ const state = reactive({
    pageSize: 10,
  },
  data: [],
-  currentRow: {},
+  unitList: [],
 });

 // 加载
+// const getUnit = async () => {
+//   CommonDicData('sys_unit_type')
+//     .then((res) => {
+//       console.log(250, res);
+//       if (res.code === 200) {
+//         state.unitList = res.data;
+//       }
+//     })
+//     .catch((err) => {
+//       app.$message.error(err.msg);
+//     });
+// };
+
 const loadData = async () => {
  state.loading = true;
  GetEntityList(state.query)
@ -262,6 +280,10 @@ const loadData = async () => {

 loadData();

+// onMounted(() => {
+//   getUnit();
+// });
+
 // 页数
 const currentChange = (current) => {
  state.query.current = current;
@ -384,7 +406,6 @@ const rowDel = (row, index, done) => {

 // 远程搜搜
 const remoteLandList = async (val) => {
-  if (!isEmpty(val)) return;
  const query = { landName: val, current: 1, size: 20 };
  const res = await getLandsList(query);
  if (res.code === 200) {
@ -395,12 +416,12 @@ const remoteLandList = async (val) => {
 // 选择赋值
 const selectedChange = ({ item, value, dic }) => {
  // console.log(390, value, item);
-  crudRef.value.tableForm.landId = item?.id;
+  crudRef.value.tableForm.landId = value;
  crudRef.value.tableForm.landName = item?.landName;
  crudRef.value.tableForm.address = item?.address;
  crudRef.value.tableForm.area = item?.area;
+  crudRef.value.tableForm.unit = item?.landUnit;
  crudRef.value.tableForm.provinceCode = item?.provinceCode;
-  // crudRef.value.tableForm.provinceName = item?.provinceName;
  crudRef.value.tableForm.cityCode = item?.cityCode;
  crudRef.value.tableForm.districtCode = item?.county;
  crudRef.value.tableForm.townCode = item?.townCode;
--- a/sub-government-affairs-service/src/views/resource/grid/index.vue
+++ b/sub-government-affairs-service/src/views/resource/grid/index.vue
@ -51,13 +51,16 @@ const state = reactive({
  selection: [],
  options: {
    ...CRUD_OPTIONS,
-    addBtnText: '添加网格',
+    // addBtnText: '添加网格',
    column: [
      {
        label: '网格区',
        prop: 'gridArea',
        search: true,
        width: 200,
+        addDisplay: false,
+        editDisplay: false,
+        viewDisplay: true,
        rules: {
          required: true,
          message: '请输入',
@ -93,6 +96,11 @@ const state = reactive({
        addDisplay: true,
        editDisplay: true,
        viewDisplay: false,
+        // multiple: true,
+        // checkStrictly: true,
+        // collapseTags: true,
+        // emitPath: false,
+        // checkDescendants: false,
        props: {
          label: 'areaName',
          value: 'areaCode',
@ -261,7 +269,6 @@ const selectionChange = (rows) => {

 // 查看
 const rowView = (row) => {
-  // state.currentRow = row;
  crudRef.value.rowView(row);
 };

@ -271,7 +278,8 @@ const setCity = (row) => {
    row.cityCode = row?.cities[1] ?? null;
    row.gridAreaCode = row?.cities[2] ?? null;
    row.townCode = row?.cities[3] ?? null;
-    row.village = row?.cities[3] ?? null;
+    row.village = row?.cities[4] ?? null;
+    // row.village = row?.cities.join(',');
  }
 };

@ -296,7 +304,8 @@ const rowSave = (row, done, loading) => {

 // 编辑
 const rowEdit = (row) => {
-  row.cities = compact([row.provinceCode, row.cityCode, row.gridAreaCode ?? '', row.townCode ?? '', row.village ?? '']);
+  const village = !isEmpty(row.village) ? row.village : [];
+  row.cities = compact([row.provinceCode, row.cityCode, row.gridAreaCode ?? '', row.townCode ?? '', ...village]);
  crudRef.value.rowEdit(row);
 };
 const rowUpdate = (row, index, done, loading) => {
@ -331,7 +340,6 @@ const rowDel = (row, index, done) => {
        .then((res) => {
          if (res.code === 200) {
            app.$message.success('删除成功！');
-            done();
            loadData();
          }
        })
--- a/sub-government-affairs-service/src/views/system/dept/index.vue
+++ b/sub-government-affairs-service/src/views/system/dept/index.vue
@ -16,8 +16,8 @@
      @row-del="rowDel"
    >
      <template #status="{ row }">
-        <el-tag v-if="row.status == 0" type="success" size="small">启用</el-tag>
-        <el-tag v-if="row.status == 1" type="danger" size="small">禁用</el-tag>
+        <el-tag v-if="row.status == 0" type="success">启用</el-tag>
+        <el-tag v-if="row.status == 1" type="danger">禁用</el-tag>
      </template>

      <template #menu="scope">
--- a/sub-government-affairs-service/src/views/system/dict/index.vue
+++ b/sub-government-affairs-service/src/views/system/dict/index.vue
@ -19,8 +19,8 @@
      @row-del="rowDel"
    >
      <template #status="{ row }">
-        <el-tag v-if="row.status == 0" type="success" size="small">启用</el-tag>
-        <el-tag v-if="row.status == 1" type="danger" size="small">禁用</el-tag>
+        <el-tag v-if="row.status == 0" type="success">启用</el-tag>
+        <el-tag v-if="row.status == 1" type="danger">禁用</el-tag>
      </template>

      <template #menu="scope">
--- a/sub-government-affairs-service/src/views/system/dict/type.vue
+++ b/sub-government-affairs-service/src/views/system/dict/type.vue
@ -19,8 +19,8 @@
      @row-del="rowDel"
    >
      <template #status="{ row }">
-        <el-tag v-if="row.status == 0" type="success" size="small">启用</el-tag>
-        <el-tag v-if="row.status == 1" type="danger" size="small">禁用</el-tag>
+        <el-tag v-if="row.status == 0" type="success">启用</el-tag>
+        <el-tag v-if="row.status == 1" type="danger">禁用</el-tag>
      </template>

      <template #menu="scope">
--- a/sub-government-affairs-service/src/views/trace/agricultural/coding/index.vue
+++ b/sub-government-affairs-service/src/views/trace/agricultural/coding/index.vue
@ -84,7 +84,7 @@ const state = reactive({
  selection: [],
  options: {
    ...CRUD_OPTIONS,
-    addBtnText: '添加信息',
+    // addBtnText: '添加信息',
    column: [
      {
        label: '溯源码',
@ -156,7 +156,7 @@ const state = reactive({
        dicHeaders: {
          authorization: UserStore.token,
        },
-        dicFormatter: (res) => res?.data?.records ?? [],
+        dicFormatter: (res) => res?.data ?? [],
        rules: {
          required: true,
          message: '请选择',
@ -236,6 +236,12 @@ const state = reactive({
      },
      {
        label: '乡镇',
+        prop: 'town',
+        hide: true,
+        display: false,
+      },
+      {
+        label: '村',
        prop: 'village',
        hide: true,
        display: false,
@ -455,7 +461,8 @@ const setCity = (row) => {
    row.province = row?.cities[0] ?? null;
    row.city = row?.cities[1] ?? null;
    row.county = row?.cities[2] ?? null;
-    row.village = row?.cities[3] ?? null;
+    row.town = row?.cities[3] ?? null;
+    row.village = row?.cities[4] ?? null;
  }
 };

@ -509,7 +516,7 @@ const rowSave = (row, done, loading) => {
 // 编辑
 const rowEdit = (row) => {
  row.base64 = row.productUrl;
-  row.cities = compact([row.province, row.city, row.county ?? '', row.village ?? '']);
+  row.cities = compact([row.province, row.city, row.county ?? '', row.town ?? '', row.village ?? '']);
  crudRef.value.rowEdit(row);
 };
 const rowUpdate = (row, index, done, loading) => {
--- a/sub-government-screen-service/src/components/baseBg.vue
+++ b/sub-government-screen-service/src/components/baseBg.vue
@ -1,5 +1,6 @@
 <template>
-  <div class="data-warp" :style="{ 'background-image': 'url(' + getAssetsFile('images/vsualized/screenbg.png') + ')' }">
+  <!-- :style="{ 'background-image': 'url(' + getAssetsFile('images/vsualized/screenbg.png') + ')' }" -->
+  <div class="data-warp">
    <div class="chart-content">
      <div class="top">
        <slot v-if="$slots.top" name="top"></slot>
@ -14,27 +15,6 @@
      <div class="content">
        <slot name="center"></slot>
      </div>
-      <div class="bottom" :style="{ 'background-image': 'url(' + getAssetsFile('images/vsualized/bottombg.jpg') + ')' }">
-        <div class="b-nav">
-          <div
-            v-for="n in navlist"
-            :key="n.name"
-            class="b-nav-item"
-            :style="{
-              'background-image':
-                'url(' +
-                (currentName == n.name ? getAssetsFile('images/vsualized/home/nav-on.png') : getAssetsFile('images/vsualized/home/nav.png')) +
-                ')',
-            }"
-            :class="currentName == n.name ? 'nav-act' : 'nav-normal'"
-            @click="itemAct(n.name)"
-          >
-            <!-- <router-link :to="n.name"> -->
-            <span>{{ n.title }}</span>
-            <!-- </router-link> -->
-          </div>
-        </div>
-      </div>
    </div>
  </div>
 </template>
--- a/sub-government-screen-service/src/components/currentTime.vue
+++ b/sub-government-screen-service/src/components/currentTime.vue
@ -42,11 +42,11 @@ const chearTime = () => {
 };

 onMounted(() => {
-  // startTime();
+  startTime();
 });

 onUnmounted(() => {
-  // chearTime();
+  chearTime();
 });

 defineExpose({
--- a/sub-government-screen-service/src/layouts/component/Bottom/index.vue
+++ b/sub-government-screen-service/src/layouts/component/Bottom/index.vue
@ -0,0 +1,110 @@
+<template>
+  <div class="layout-bottom">
+    <div class="bottom" :style="{ 'background-image': 'url(' + getAssetsFile('images/vsualized/bottombg.jpg') + ')' }">
+      <div class="b-nav">
+        <div
+          v-for="n in navlist"
+          :key="n.name"
+          class="b-nav-item"
+          :style="{
+            'background-image':
+              'url(' +
+              (currentName == n.name ? getAssetsFile('images/vsualized/home/nav-on.png') : getAssetsFile('images/vsualized/home/nav.png')) +
+              ')',
+          }"
+          :class="currentName == n.name ? 'nav-act' : 'nav-normal'"
+          @click="itemAct(n.name)"
+        >
+          <!-- <router-link :to="n.name"> -->
+          <span>{{ n.title }}</span>
+          <!-- </router-link> -->
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup name="layout-bottom">
+import { computed, ref } from 'vue';
+import { useSettingStore } from '@/store/modules/setting';
+import { setPx } from '@/utils';
+import { getAssetsFile } from '@/utils';
+import { useRoute, useRouter } from 'vue-router';
+const route = useRoute();
+const router = useRouter();
+const SettingStore = useSettingStore();
+
+// 主题配置
+const themeConfig = computed(() => SettingStore.themeConfig);
+const isCollapse = computed(() => !SettingStore.isCollapse);
+
+const stylePlaceholder = () => {
+  return { height: themeConfig.value.showTag ? setPx(90) : setPx(50) };
+};
+
+const navlist = ref([
+  { title: '首页', name: 'home' },
+  { title: '土地资源', name: 'land' },
+  { title: '投入品', name: 'inputs' },
+  { title: '生产经营主体', name: 'entities' },
+  { title: '智慧种植检测', name: 'plant' },
+  { title: '智慧养殖检测', name: 'breed' },
+  { title: '全流程溯源', name: 'trace' },
+  { title: '产业预警决策', name: 'early' },
+]);
+
+let currentName = ref(route.name);
+
+const itemAct = (name) => {
+  console.info('itemAct', name);
+  currentName.value = name;
+  router.push({ name: name });
+};
+</script>
+
+<style lang="scss" scoped>
+.layout-bottom {
+  width: 100%;
+  text-align: center;
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  z-index: 100;
+  .bottom {
+    height: 98px;
+    text-align: center;
+
+    .b-nav {
+      margin: auto;
+      display: inline-flex;
+      gap: 20px;
+      .b-nav-item {
+        display: inline-block;
+        cursor: pointer;
+        min-width: 132px;
+        height: 42px;
+        text-align: center;
+        line-height: 38px;
+        span {
+          font-size: 14px;
+          font-weight: bold;
+          display: inline-flex;
+          transform: skewX(-8deg);
+          background: linear-gradient(to bottom, '#ff7e5f', '#548fff');
+          -webkit-background-clip: text;
+
+          letter-spacing: 4px;
+          text-shadow: -2px 0 0 1px #add8f1;
+        }
+
+        &.nav-act {
+          color: rgba(255, 255, 255, 1);
+        }
+        &.nav-normal {
+          color: rgba(255, 255, 255, 0.6);
+        }
+      }
+    }
+  }
+}
+</style>
--- a/sub-government-screen-service/src/layouts/component/Main/index.vue
+++ b/sub-government-screen-service/src/layouts/component/Main/index.vue
@ -31,18 +31,5 @@ const isReload = computed(() => SettingStore.isReload);

 <style lang="scss" scoped>
 .layout-main {
-  flex: 1;
-  display: flex;
-  width: 100%;
-  height: 100%;
-  @include scrollable;
-
-  box-sizing: border-box;
-  &-inner {
-    padding: 10px;
-    width: 100%;
-    background-color: #f5f5f5;
-    box-sizing: border-box;
-  }
 }
 </style>
--- a/sub-government-screen-service/src/layouts/index.vue
+++ b/sub-government-screen-service/src/layouts/index.vue
@ -6,34 +6,36 @@
 * @LastEditTime: 2024-02-05 16:03:31
 -->
 <template>
-  <div
-    class="basic-layout"
-    :class="{
-      hideSider: !SettingStore.isCollapse,
-    }"
-  >
-    <Sider />
+  <div class="basic-layout" :style="{ 'background-image': 'url(' + getAssetsFile('images/vsualized/screenbg.png') + ')' }">
    <div class="basic-layout-container">
-      <Header />
      <Main />
+      <Bottom :name-val="route.name"></Bottom>
    </div>
  </div>
 </template>

 <script setup name="layout">
+import { getAssetsFile } from '@/utils';
 import { useSettingStore } from '@/store/modules/setting';

 import Sider from './component/Sider';
 import Header from './component/Header';
+import Bottom from './component/Bottom';
 import Main from './component/Main';
+import { useRoute, useRouter } from 'vue-router';
+import { onMounted } from 'vue';
+const route = useRoute();
+
 const SettingStore = useSettingStore();
+onMounted(() => {
+  console.info('route', route);
+});
 </script>

 <style lang="scss" scoped>
 .basic-layout {
  width: 100%;
-  min-width: 1200px;
-  height: 100%;
+  height: 100vh;
  &.hideSider {
    :deep(.layout-sider) {
      width: 60px !important;
@ -44,7 +46,6 @@ const SettingStore = useSettingStore();
  }
  &-container {
    position: relative;
-    margin-left: 210px;
    height: 100%;
    transition: margin-left 0.28s;
    box-sizing: border-box;
--- a/sub-government-screen-service/src/router/index.js
+++ b/sub-government-screen-service/src/router/index.js
@ -21,52 +21,109 @@ export const constantRoutes = [
    hidden: true,
  },
  {
-    path: '/sub-government-screen-service/home',
-    name: 'home',
-    component: () => import('@/views/home/index.vue'),
-  },
-  {
-    path: '/sub-government-screen-service/land',
-    name: 'land',
-    component: () => import('@/views/land/index.vue'),
-    hidden: true,
-  },
-  {
-    path: '/sub-government-screen-service/inputs',
-    name: 'inputs',
-    component: () => import('@/views/inputs/index.vue'),
-    hidden: true,
-  },
-  {
-    path: '/sub-government-screen-service/entities',
-    name: 'entities',
-    component: () => import('@/views/entities/index.vue'),
-    hidden: true,
-  },
-  {
-    path: '/sub-government-screen-service/breed',
-    name: 'breed',
-    component: () => import('@/views/breed/index.vue'),
-    hidden: true,
-  },
-  {
-    path: '/sub-government-screen-service/plant',
-    name: 'plant',
-    component: () => import('@/views/plant/index.vue'),
-    hidden: true,
-  },
-  {
-    path: '/sub-government-screen-service/trace',
-    name: 'trace',
-    component: () => import('@/views/trace/index.vue'),
-    hidden: true,
-  },
-  {
-    path: '/sub-government-screen-service/early',
-    name: 'early',
-    component: () => import('@/views/early/index.vue'),
-    hidden: true,
+    path: '/sub-government-screen-service',
+    name: 'layout',
+    component: Layout,
+    redirect: '/sub-government-screen-service/home',
+    meta: { title: '首页', icon: 'House' },
+    children: [
+      {
+        path: '/sub-government-screen-service/home',
+        component: () => import('@/views/home/index.vue'),
+        name: 'home',
+        meta: { title: '首页', icon: 'House' },
+      },
+      {
+        path: '/sub-government-screen-service/land',
+        component: () => import('@/views/land/index.vue'),
+        name: 'land',
+        meta: { title: '土地资源', icon: 'House' },
+      },
+      {
+        path: '/sub-government-screen-service/inputs',
+        name: 'inputs',
+        component: () => import('@/views/inputs/index.vue'),
+        hidden: true,
+      },
+      {
+        path: '/sub-government-screen-service/entities',
+        name: 'entities',
+        component: () => import('@/views/entities/index.vue'),
+        hidden: true,
+      },
+      {
+        path: '/sub-government-screen-service/breed',
+        name: 'breed',
+        component: () => import('@/views/breed/index.vue'),
+        hidden: true,
+      },
+      {
+        path: '/sub-government-screen-service/plant',
+        name: 'plant',
+        component: () => import('@/views/plant/index.vue'),
+        hidden: true,
+      },
+      {
+        path: '/sub-government-screen-service/trace',
+        name: 'trace',
+        component: () => import('@/views/trace/index.vue'),
+        hidden: true,
+      },
+      {
+        path: '/sub-government-screen-service/early',
+        name: 'early',
+        component: () => import('@/views/early/index.vue'),
+        hidden: true,
+      },
+    ],
  },
+  // {
+  //   path: '/sub-government-screen-service/home',
+  //   name: 'home',
+  //   component: () => import('@/views/home/index.vue'),
+  // },
+  // {
+  //   path: '/sub-government-screen-service/land',
+  //   name: 'land',
+  //   component: () => import('@/views/land/index.vue'),
+  //   hidden: true,
+  // },
+  // {
+  //   path: '/sub-government-screen-service/inputs',
+  //   name: 'inputs',
+  //   component: () => import('@/views/inputs/index.vue'),
+  //   hidden: true,
+  // },
+  // {
+  //   path: '/sub-government-screen-service/entities',
+  //   name: 'entities',
+  //   component: () => import('@/views/entities/index.vue'),
+  //   hidden: true,
+  // },
+  // {
+  //   path: '/sub-government-screen-service/breed',
+  //   name: 'breed',
+  //   component: () => import('@/views/breed/index.vue'),
+  //   hidden: true,
+  // },
+  // {
+  //   path: '/sub-government-screen-service/plant',
+  //   name: 'plant',
+  //   component: () => import('@/views/plant/index.vue'),
+  //   hidden: true,
+  // },
+  // {
+  //   path: '/sub-government-screen-service/trace',
+  //   name: 'trace',
+  //   component: () => import('@/views/trace/index.vue'),
+  //   hidden: true,
+  // },
+  // {
+  //   path: '/sub-government-screen-service/early',
+  //   name: 'early',
+  //   component: () => import('@/views/early/index.vue'),
+  //   hidden: true,
+  // },
 ];

 /**
@ -75,7 +132,7 @@ export const constantRoutes = [
 export const notFoundRouter = {
  path: '/sub-government-screen-service/:pathMatch(.*)',
  name: 'notFound',
-  redirect: '/sub-government-screen-service/home',
+  redirect: '/sub-government-screen-service/404',
 };

 const router = createRouter({
--- a/sub-government-screen-service/src/utils/permission.js
+++ b/sub-government-screen-service/src/utils/permission.js
@ -17,9 +17,11 @@ NProgress.configure({ showSpinner: false });
 const { VITE_APP_MIAN_URL } = import.meta.env;
 const whiteList = [];
 router.beforeEach(async (to, from, next) => {
+  console.info('beforeEach************to', to);
+  console.info('beforeEach**********from', from);
  NProgress.start();
  if (typeof to.meta.title === 'string') {
-    document.title = '政务服务 | ' + to.meta.title;
+    document.title = '数据大屏 | ' + to.meta.title;
  }

  const userStore = useUserStore();
--- a/sub-operation-service/.env.development
+++ b/sub-operation-service/.env.development
@ -1,6 +1,10 @@
 # 开发环境
 VITE_PORT = 9526
 VITE_MODE = 'DEV'
+VITE_APP_MIAN = 'daimp-front-main'
+VITE_APP_MIAN_URL = 'http://localhost:9000'
 VITE_APP_NAME = 'sub-operation-service'
-VITE_APP_BASE_API = '/apis'
-VITE_APP_BASE_URL = 'http://localhost:8080/'
+VITE_APP_BASE_API = '/apis' 
+VITE_APP_BASE_URL = 'http://192.168.18.99:8080'
+VITE_APP_UPLOAD_API = '/uploadApis'
+VITE_APP_UPLOAD_URL = 'http://192.168.18.99:9300'
--- a/sub-operation-service/.env.production
+++ b/sub-operation-service/.env.production
@ -1,5 +1,11 @@
 # 生产环境
 VITE_MODE = 'PRO'
+VITE_APP_MIAN = 'daimp-front-main'
+VITE_APP_MIAN_URL = 'http://192.168.18.99:88'
 VITE_APP_NAME = 'sub-operation-service'
-VITE_APP_BASE_API = 'https://www.localhost.com/8080/api/'
-VITE_APP_BASE_URL = 'https://www.localhost.com/8080/'
+# 接口
+VITE_APP_BASE_API = '/apis' 
+VITE_APP_BASE_URL = ''
+VITE_APP_UPLOAD_API = '/uploadApis'
+VITE_APP_UPLOAD_URL = ''
+
--- a/sub-operation-service/src/App.vue
+++ b/sub-operation-service/src/App.vue
@ -24,4 +24,44 @@ const size = computed(() => SettingStore.themeConfig.globalComSize);

 <style lang="scss">
@import './styles/style.scss';
+@import './styles/global.scss';
+@import '@/styles/iconfont.css';
+
+body {
+  div {
+    box-sizing: border-box;
+  }
+  --el-color-primary: #25bf82;
+  --el-color-primary-light-3: #45dda1;
+  --el-color-primary-light-5: #8cddbd;
+  --el-color-primary-light-9: rgba(37, 191, 130, 0.1);
+  --el-color-primary-light-8: rgba(37, 191, 130, 0.5);
+  .el-input {
+    --el-input-focus-border-color: #25bf82;
+    --el-input-focus-border: #25bf82;
+    ::v-deep() {
+      .el-input__wrapper:focus,
+      .el-input__wrapper:hover,
+      .el-input__wrapper .is-focus {
+        box-shadow: 0 0 0 1px $color-main !important;
+      }
+    }
+  }
+  .el-button--primary {
+    --el-button-bg-color: #25bf82;
+    --el-button-border-color: #25bf82;
+    --el-button-outline-color: #45dda1;
+    --el-button-active-color: #158b5c;
+    --el-button-hover-bg-color: #45dda1;
+    --el-button-hover-border-color: #45dda1;
+    --el-button-active-bg-color: #158b5c;
+    --el-button-active-border-color: #158b5c;
+    --el-button-disabled-text-color: var(--el-color-white);
+    --el-button-disabled-bg-color: #45dda1;
+    --el-button-disabled-border-color: #45dda1;
+  }
+
+  --el-menu-hover-text-color: #25bf82;
+  --el-menu-hover-bg-color: fff;
+}
 </style>
--- a/sub-operation-service/src/apis/index.js
+++ b/sub-operation-service/src/apis/index.js
@ -0,0 +1,9 @@
+import request from '@/utils/axios';
+
+//云南省所有区域信息
+export function getRegion(code) {
+  let codeVal = code ? code : '530000';
+  return request('/system/area/region?areaCode=' + codeVal, {
+    method: 'GET',
+  });
+}
--- a/sub-operation-service/src/assets/images/ecommerce/banner.png
+++ b/sub-operation-service/src/assets/images/ecommerce/banner.png
--- a/sub-operation-service/src/assets/images/ecommerce/banner1.png
+++ b/sub-operation-service/src/assets/images/ecommerce/banner1.png
--- a/sub-operation-service/src/assets/images/ecommerce/banner3.png
+++ b/sub-operation-service/src/assets/images/ecommerce/banner3.png
--- a/sub-operation-service/src/assets/images/ecommerce/menu1.png
+++ b/sub-operation-service/src/assets/images/ecommerce/menu1.png
--- a/sub-operation-service/src/assets/images/ecommerce/menu2.png
+++ b/sub-operation-service/src/assets/images/ecommerce/menu2.png
--- a/sub-operation-service/src/assets/images/ecommerce/menu3.png
+++ b/sub-operation-service/src/assets/images/ecommerce/menu3.png
--- a/sub-operation-service/src/assets/images/ecommerce/menu4.png
+++ b/sub-operation-service/src/assets/images/ecommerce/menu4.png
--- a/sub-operation-service/src/assets/images/ecommerce/pic.png
+++ b/sub-operation-service/src/assets/images/ecommerce/pic.png
--- a/sub-operation-service/src/assets/images/ecommerce/test01.png
+++ b/sub-operation-service/src/assets/images/ecommerce/test01.png
--- a/sub-operation-service/src/assets/images/logo.png
+++ b/sub-operation-service/src/assets/images/logo.png
--- a/sub-operation-service/src/config/index.js
+++ b/sub-operation-service/src/config/index.js
@ -1,7 +1,9 @@
-const { VITE_APP_NAME } = import.meta.env;
+import { qiankunWindow } from 'vite-plugin-qiankun/dist/helper';
+const { VITE_APP_MIAN, VITE_APP_NAME } = import.meta.env;

-export const GenKey = (key, prefix = `${VITE_APP_NAME}_`) => {
-  return prefix ? prefix + key : key;
+export const GenKey = (key, prefix = VITE_APP_NAME) => {
+  prefix = qiankunWindow.__POWERED_BY_QIANKUN__ ? VITE_APP_MIAN : VITE_APP_MIAN;
+  return prefix ? `${prefix}_` + key : key;
 };

 export const CONSTANTS = {
--- a/sub-operation-service/src/layouts/component/Header/index.vue
+++ b/sub-operation-service/src/layouts/component/Header/index.vue
@ -1,44 +1,59 @@
 <template>
-  <div class="layout-header">
-    <div class="layout-header-top">
-      <div class="layout-header-top-left">
-        <span>您好，欢迎来到农业产业服务平台</span>
-        <el-tag>运营大屏</el-tag>
-        <el-tag>产业服务APP</el-tag>
-        <el-tag>产业运营管理</el-tag>
-      </div>
-      <div class="layout-header-top-right">
-        <span>商家中心</span>
-        <span>个人中心</span>
-        <span>返回首页</span>
-      </div>
-    </div>
-    <div class="layout-header-bottom">
-      <div class="layout-header-bottom-left">
-        <div class="layout-header-bottom-search">
-          <div class="title">农业产业服务平台</div>
-          <el-input v-model="keyword" placeholder="请输入关键词进行搜索"></el-input>
-          <el-button type="primary" @click="Search">搜索</el-button>
+  <div class="layout-header-warp">
+    <div class="layout-header">
+      <div class="layout-header-top">
+        <div class="layout-header-top-left">
+          <span class="welcome-msg">您好，欢迎来到农业产业服务平台</span>
+          <div class="left-link">
+            <div class="iconfont icon-bigScreen"></div>
+            <span>数据大屏</span>
+          </div>
+          <div class="left-link">
+            <div class="iconfont icon-operation" style="font-size: 12px"></div>
+            <span>产业运营管理</span>
+          </div>
        </div>
+        <div class="layout-header-top-right">
+          <span>商家中心</span>
+          <span>个人中心</span>
+          <span @click="toHome" class="back-home">
+            <div class="iconfont icon-home" style="font-size: 12px"></div>
+            <span>返回首页</span>
+          </span>
+        </div>
+      </div>
+      <div class="layout-header-bottom">
+        <div class="layout-header-bottom-left">
+          <div class="layout-header-bottom-search">
+            <div class="title">
+              <img :src="getAssetsFile('images/logo.png')" />
+            </div>
+            <div class="search-warp">
+              <el-input v-model="keyword" placeholder="请输入关键词进行搜索"></el-input>
+              <el-button type="primary" @click="Search">搜索</el-button>
+            </div>
+          </div>
+        </div>
+        <div class="layout-header-bottom-right">
+          <div class="layout-header-bottom-right-qr">
+            <div class="layout-header-bottom-right-qr-img">
+              <img :src="qrImg" alt="" />
+              <p>下载数农App</p>
+            </div>
+            <div class="layout-header-bottom-right-qr-img">
+              <img :src="qrImg" alt="" />
+              <p>打开数农小程序</p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="layout-header-menu">
        <el-menu ellipsis class="layout-header-bottom-menu" mode="horizontal">
          <app-link v-for="(item, index) in meuns" :key="index" :to="item.path">
-            <el-menu-item>{{ item.label }}</el-menu-item>
+            <el-menu-item active-text-color="#25BF82">{{ item.label }}</el-menu-item>
          </app-link>
        </el-menu>
      </div>
-      <div class="layout-header-bottom-right">
-        <div class="layout-header-bottom-right-qr">
-          <div class="layout-header-bottom-right-qr-img">
-            <img :src="qrImg" alt="" />
-            <p>下载数农App</p>
-          </div>
-          <div class="layout-header-bottom-right-qr-img">
-            <img :src="qrImg" alt="" />
-            <p>打开数农小程序</p>
-          </div>
-        </div>
-        <p>使用数农手机服务，更方便</p>
-      </div>
    </div>
  </div>
 </template>
@ -49,9 +64,11 @@ import { useSettingStore } from '@/store/modules/setting';
 import { usePermissionStore } from '@/store/modules/permission';
 import { qrImg } from './base64img';
 import AppLink from '../Menu/Link.vue';
-import { useRoute } from 'vue-router';
+import { useRoute, useRouter } from 'vue-router';
+import { isEmpty, getAssetsFile } from '@/utils';

 const route = useRoute();
+const router = useRouter();
 const SettingStore = useSettingStore();
 const PermissionStore = usePermissionStore();
 const cacheRoutes = computed(() => PermissionStore.keepAliveRoutes);
@ -75,6 +92,7 @@ const meuns = ref([
  },
  {
    label: '电商交易',
+    path: '/sub-operation-service/ecommerce',
  },
  {
    label: '分拣包装',
@ -90,47 +108,105 @@ const meuns = ref([
 function Search() {
  console.log(keyword.value, 'search');
 }
+
+const toHome = () => {
+  console.info('toHome', router);
+  router.push('/');
+};
 </script>

 <style lang="scss" scoped>
+div {
+  box-sizing: border-box;
+}
+
+.layout-header-warp {
+  width: 100%;
+  text-align: center;
+  background: $color-fff;
+  .layout-header-menu {
+    width: 100%;
+    ::v-deep() {
+      .el-menu {
+        justify-content: space-around;
+        border: none !important;
+      }
+      .el-menu-item {
+        font-size: 24px;
+      }
+      .el-menu-item:hover {
+        background: none !important;
+        color: $color-main;
+      }
+      .el-menu-item:active {
+        background: none !important;
+        color: $color-main;
+      }
+    }
+  }
+}
 .layout {
  // width: 100%;
  // height: 100%;
  // box-sizing: border-box;
  &-header {
-    width: 100%;
+    width: 1200px;
    height: 206px;
    overflow: hidden;
+    margin: auto;
    &-top {
      display: flex;
      height: 44px;
      justify-content: space-between;
      align-items: center;
-      background-color: #f8f8f8;
      padding: 0 32px;
      &-left {
        line-height: 36px;
-        font-size: 16px;
-        .el-tag {
-          color: #fff;
-          background-color: #a4adb3;
-          margin-left: 12px;
-          border-color: #a4adb3;
+        .welcome-msg {
+          font-size: 12px;
+          color: $color-5a;
+        }
+        .left-link {
+          color: $color-main;
+          margin: 0 10px;
+          font-size: 12px;
          cursor: pointer;
-          font-size: 18px;
+          display: inline-block;
+          .iconfont {
+            color: $color-main;
+            display: inline-block;
+            margin-right: 2px;
+          }
+          .iconfont,
+          span {
+            vertical-align: middle;
+          }
        }
      }
      &-right {
        span {
-          color: #000;
+          color: $color-000;
          margin-left: 25px;
          line-height: 36px;
-          font-size: 16px;
+          font-size: 12px;
          text-align: center;
          cursor: pointer;
          &:nth-child(1) {
            margin-left: 0;
-            font-weight: bold;
+          }
+
+          &.back-home {
+            .iconfont {
+              display: inline-block;
+              vertical-align: middle;
+              color: $color-main;
+            }
+            span {
+              margin-left: 6px;
+              display: inline-block;
+              vertical-align: middle;
+            }
+            color: $color-main;
          }
        }
      }
@ -151,18 +227,31 @@ function Search() {
            font-size: 45px;
            white-space: nowrap;
          }
-          .el-input {
-            flex-grow: 1;
-            max-width: 460px;
-            margin-left: 40px;
-            height: 50px;
-            font-size: 18px;
-          }
-          .el-button {
-            margin-left: 40px;
-            font-size: 18px;
-            height: 45px;
-            padding: 8px 24px;
+          .search-warp {
+            width: 100%;
+            padding-left: 36px;
+            position: relative;
+            .el-input {
+              flex-grow: 1;
+              height: 50px;
+              font-size: 18px;
+              width: 100%;
+              ::v-deep() {
+                .el-input__wrapper {
+                  padding-right: 100px;
+                }
+              }
+            }
+
+            .el-button {
+              position: absolute;
+              right: 8px;
+              top: 50%;
+              transform: translateY(-50%);
+              font-size: 18px;
+              padding: 0 24px;
+              height: 42px;
+            }
          }
        }
        .layout-header-bottom-menu {
@ -185,8 +274,8 @@ function Search() {
          justify-content: space-between;
          &-img {
            img {
-              width: 110px;
-              height: 110px;
+              width: 48px;
+              height: 48px;
            }
            p {
              text-align: center;
--- a/sub-operation-service/src/router/index.js
+++ b/sub-operation-service/src/router/index.js
@ -8,6 +8,7 @@
 import { createRouter, createWebHistory } from 'vue-router';
 import { qiankunWindow } from 'vite-plugin-qiankun/dist/helper';
 import Layout from '@/layouts/index.vue';
+import Views from '@/layouts/Views.vue';

 import demo from './modules/demo';

@ -15,29 +16,93 @@ const { VITE_APP_NAME } = import.meta.env;

 export const constantRoutes = [
  {
-    path: '/404',
+    path: '/sub-operation-service/404',
    name: '404',
    component: () => import('@/views/error/404.vue'),
    hidden: true,
  },
  {
-    path: '/403',
+    path: '/sub-operation-service/403',
    name: '403',
    component: () => import('@/views/error/403.vue'),
    hidden: true,
  },
  {
-    path: '/',
+    path: '/sub-operation-service',
    name: 'layout',
    component: Layout,
-    redirect: '/home',
-    meta: { title: '首页', icon: 'House' },
+    redirect: '/sub-operation-service/home',
+    meta: { title: '首页' },
    children: [
      {
-        path: '/home',
+        path: '/sub-operation-service/home',
        component: () => import('@/views/home/index.vue'),
        name: 'home',
-        meta: { title: '首页', icon: 'House' },
+        meta: { title: '首页' },
+      },
+    ],
+  },
+  {
+    path: '/ecommerce',
+    name: 'ecommerce',
+    component: Layout,
+    redirect: '/sub-operation-service/ecommerce',
+    meta: { title: '电商交易' },
+    children: [
+      {
+        path: '/sub-operation-service/ecommerce',
+        component: () => import('@/views/ecommerce/index.vue'),
+        name: 'agricultural',
+        meta: { title: '农资交易' },
+      },
+      {
+        path: '/purchaser',
+        component: Views,
+        redirect: '/sub-operation-service/purchaser',
+        name: 'purchaserParent',
+        meta: { title: '采购商服务' },
+        children: [
+          {
+            path: '/sub-operation-service/purchaser',
+            component: () => import('@/views/ecommerce/purchaser.vue'),
+            name: 'purchaser',
+            meta: { title: '采购商服务' },
+          },
+          {
+            path: '/sub-operation-service/purchaserDetail',
+            component: () => import('@/views/ecommerce/purchaserDetail.vue'),
+            name: 'purchaserDetail',
+            meta: { title: '采购详情' },
+          },
+        ],
+      },
+
+      {
+        path: '/sub-operation-service/supplier',
+        component: () => import('@/views/ecommerce/supplier.vue'),
+        name: 'supplier',
+        meta: { title: '供应商服务' },
+      },
+      {
+        path: '/land',
+        component: Views,
+        redirect: '/sub-operation-service/land',
+        name: 'landParent',
+        meta: { title: '土地交易' },
+        children: [
+          {
+            path: '/sub-operation-service/land',
+            component: () => import('@/views/ecommerce/land.vue'),
+            name: 'land',
+            meta: { title: '土地交易' },
+          },
+          {
+            path: '/sub-operation-service/landDetail',
+            component: () => import('@/views/ecommerce/landDetail.vue'),
+            name: 'landDetail',
+            meta: { title: '土地详情' },
+          },
+        ],
      },
    ],
  },
@ -48,13 +113,13 @@ export const constantRoutes = [
 * @Title notFoundRouter(找不到路由)
 */
 export const notFoundRouter = {
-  path: '/:pathMatch(.*)',
+  path: '/sub-operation-service/:pathMatch(.*)',
  name: 'notFound',
-  redirect: '/404',
+  redirect: '/sub-operation-service/404',
 };

 const router = createRouter({
-  history: createWebHistory(qiankunWindow.__POWERED_BY_QIANKUN__ ? `/${VITE_APP_NAME}/` : '/'), // history
+  history: createWebHistory(), // history
  routes: constantRoutes,
 });

--- a/sub-operation-service/src/store/modules/user.js
+++ b/sub-operation-service/src/store/modules/user.js
@ -3,7 +3,7 @@ import { GenKey } from '@/config';
 import { isEmpty, encode, decode } from '@/utils';

 export const useUserStore = defineStore({
-  id: GenKey('USER_STATE'),
+  id: GenKey('userStore'),
  state: () => ({
    token: null,
    userInfo: {},
@ -52,14 +52,14 @@ export const useUserStore = defineStore({
      this.currentOrg = null;
      this.orgList = [];
      this.menus = [];
-      localStorage.removeItem(GenKey('USER_STATE'));
+      localStorage.removeItem(GenKey('userStore'));
    },
    clear() {
-      localStorage.removeItem(GenKey('USER_STATE'));
+      localStorage.removeItem(GenKey('userStore'));
    },
  },
  persist: {
-    key: GenKey('USER_STATE'),
+    key: GenKey('userStore'),
    storage: window.localStorage,
  },
 });
--- a/sub-operation-service/src/styles/global.scss
+++ b/sub-operation-service/src/styles/global.scss
@ -1,5 +1,11 @@
 // color
 $legacy-ie: 10;
+$color-main:#25BF82;
+$color-main-table-header:rgba(37,191,130,0.1);
+$color-main-border:rgba(37, 191, 130, 0.5);
+$color-5a:#5A5A5A;
+$color-000:#000;
+$color-fff:#fff;
 $color-primary: #20a0ff;
 $color-success: #13ce66;
 $color-warning: #f7ba2a;
@ -20,11 +26,13 @@ $color-gray: #d3dce6;
 $color-gray-light: #e5e9f2;
 $color-gray-lighter: #eff2f7;
 $color-333: #333333;
-$color-666: #333333;
+$color-666: #666;
 $color-999: #999999;
 $color-border-gray: #d1dbe5;
 $color-input-border: #dcdfe6;
 $color-border: $color-border-gray;
+
+$width-main:1200px;
 $color-types: (
  primary: (
    $color-primary,
@ -58,4 +66,5 @@ $color-types: (
  ),
 );

+
@import 'utils/utils';
--- a/sub-operation-service/src/styles/iconfont.css
+++ b/sub-operation-service/src/styles/iconfont.css
@ -0,0 +1,78 @@
+@font-face {
+  font-family: "iconfont"; /* Project id 4879313 */
+  src: 
+       url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAwEAAsAAAAAFRwAAAu3AAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACEUgqaYJYOATYCJANECyQABCAFhGcHgSob4hEjEbaCsXIl++sEbsAQrAb6GyLWKCra1s4arx2+okU9xXa4WH6+Mzz9My4jvICK4jflu0Mp4f9tbzt3Zn7ru0tztaou/CpUacYi8eAsxhGPJLx4gv6Xa5n5pISyKsI8qgKyy+X2gHKT24fqqirZ8YSKfR2wUe30tGn/NhtpVjBbyCd42pIGQs2JKVpRzZ92t/XdO0cCyZ2nCSROxKkbcOIegtzd1i+ztgQyDDDKssQDjyiwGiCAwGye+5kV4Hr1vc+3n6szSVtoiF+jl7v/bxs384/5xw9RazQykUgy8cgjRLGUSZRWca6mjvtvUhIr6FpbLlcFVjNMpPb3PA0CuWP9Um18dpU0d4ER6cDgkUJVXt21Bam9uQSGRlJrzLtqVPogglvuNsB79vr6zKXgRAm8p/nHTHL9M822J0fgH0pfI5jdgQh4sO+ZR5Md94oWZD8z5TQ6mCOkZCqH3y4rtj2Op8BOs7amG1VuKreomZNw/RcvEkukMrlCqVJrtIgy2FSC9MvRmksc4RnGkIxADAABNgfgYfPoE48tAEAMWwRIYEsAKWwZIIOtAOSwNYACtg5QwjYAKtgmQA3bAmhg2y5aEHdzryKcIWEQEu1A+lZWAifaGcQh4hNIU6BxobZ4C32kSMZnazFpVnq6HsPw2RgHCzZhIiQ4juFcIRfiztfwMCWCcHi6SJwi/AtxDDXrw4N0v2Ftk6Q2IGxA0SSy8w6KwkGx34+ijFfoBW6UuReBYJTR++tkwQ3MA5DkPoLRDyGYeoRymz+3xOElBXYPLXL6KLHLz6xkUTUsurup/leldQBlM33NLz3i2gbt3ExsXiDiFDrg0PO95AHaFwxCEMo0NAxkhUZCAQAWeQMCg0fgFPtnqw0NoZWM2I7Rg6NtUArVHh1CcUC+oJhGk+x+iBo1mjtMjqBwwuFMtDPpIrEranPYBQKP5/WGonxif52YULRETRhhiYJ3EYSuJQOoOV7oWBS4I8E1U2Ed050TydYw94gldS/u1cRcrXhOamaJ80PQMKZAWHR/C0jVOSDk8Iv8XpqKTBhKZLdBryUS23EmRDbpyQ1TzQ60EiExdtvQ39KHnM2RjGCbDvL5EBEtQDxeMsgK5ZDLALJVa/e8LqCbACBD3iETU4YRiD5Xg6XizL1L8xB/8a5bF+pnNVcF2+nb50GyC4vrSltqE99746xIjboiiO6crnfGwHsJ3XgfLTBoXtf0T7tu7VZarAkkccSQlnElHJDTHzRF5Zy+IFUnXsBJvAFACjx7mMkw0cTEDoPkVUhti0MUv2O1/+QO1c5H0iIPYnpwrcuLNXD68WMyFmMSCSoed2ytlGZGOPtRJETW0PbHMzkgTZ2zHa5oAqKccRzITd8c7XotEr3F3BjpJDuGryMHwPQy01GDCa27/5iOVyuJG4mhA2DFdKooqc3f2BDYyHYEMWOtcrC5UVgWhKhEK5jYtOTjQyx6sE2WUtc+5CInBIFBeRqic32SgVZpcm1L/2rI5afCtMDu9NFNpNDhZZajm4kg9cRQTdwWIjPHYlUObwhlxK5YwhU4qa3jZ66DNWihHaSGhiBbpmQyO/2QesQ8IO+viTfq5e0CYaxqYZjrpI9c4pW0M1591xypeLeWYByxqjumjtL79sc1mHvTFrvb8/roHIt9KyZqEDbiGbWRa8uC8yCdsKtmZKhGkl1lBUJ7QBLvgLfsh2DKt5IZUZBeMcpA1MU4Qj8GgJzalMQliIIqHlA/jNBxaAp/tXOqrh5/jvfI8jHv2HPhUs2d0KSM6VPU3+1TN9iBMP0G5xj7hjSFC2wN6n3/qadMV0wauGMpBUftaq4aREVf+Le7+5bm1pU0rBkuhn0W4fqC6dWIRbB8+FdBUD76FfFaauZXd3uhVMi96sh2bgqXjBzh+jhl8Yb6Z9OYiF4W+PIC+p/HmnYkKR3eTpzsh1JzUjmNHxjEYSg30+l4e//CoYvjD67eKv76yl2ZIL73JWm/KFsQEp8h+cPegwqvjXmmXSDLI44SkyfnJkLL87ZOziOgsacVK4f22R3nL4SbbFfONu6rvHCISHWVbpjBXwammzsPqVcq5k5U6rEfJD9gepRNyBvNm+bKlV9jQAKwCFs2+wO1kpibzdE0WqqkvByeSZWjelpyIqba44Bcc8r9B89+g/ymiP6jeFLxT1QhUXT8rehN3ZRSxZ+c+VdXvsg2xZUN5dhtpo3XMvhBbYCvSgFtkBdJ8AJU8hL+gPR9Ovlb+hA8WTC38itj4wdR0vXLRmj1xbSOdAqm9ih3r+WuWQ+c+dx8fdLUcZA0XR79v7FpvPxl4TuiXOG7QiiaNFf0jhDC5MBkm0f2HtSvytWH1fJXsRkChhfjMYL9mXfu5f4dqknS8bQDVxMq3MHiEXy8zYGr5DW1nKck1I/EJ3hg5qt32Dpcv+vDz0PzDle1HJE/55F6VLIjrbadC8PrOTqWmH2q1FChKysqnDe/VFuk2W+6RDt/fkm+rucqyx8Fvv7GnsYTW/cczFvJW2X9Tv2erfrW7W/V79pXpfNSssDdn8fTQmI94YyOMiBfR1h7FUvNzvGFWfn5WYXjXxk5w3qKZUZVCa2SH47UshZkdjNO3oxmRk5WLhULipZbdy1YsOuMYWxnik3NunH27EHJGav1gARITo8hHpACHEoJy5eVG0uNE0uzK5blt9d//8OPP/w0lsu6LLviv1SpscK45NuM/cEDqCu8f1ammL3+ETLAM9K6Opwj5eEDuAobwJRSDtRsZ6bW0lOqz0i40jM39xrnuYrHFxrG508oCE0oLLjwa2l/XE6hXaDRHSQnic8uXXOWlaSEsdPrF/vHQaSf4PGLp53aupGZFjDMvUw/5Zl+Gph/KF4uu1Gf/jC9/obMhHHQ2WlKyUJSJZ2Oc3ELdRH7Z+DG5XCG9X/h9ubF7ifbnhHeu0vVbNvexTVKDX5eRAtmVy/VOZ88vki9XHPXV7FYXbDAOk/nzHKDVcA9/9V7ossKEwvZ+7zdJetPdWQuVuWzptA6DO4rbwfEYxkyKr3yrWITInY22ziWKQL/igwL9fqFlQUTU8UYXQl12YbvdXmlI3BU9mxQFp7a1TU3Khi4i5cUK+a9MX+mU7VMewcs1zhVZzNvKOYVR++7qxRF8me29fZsI4sJkM6HgHjMnt5tzxTLKxUgO1J05zvrmwXXFn4HX1JoUxHu7UuS+iU9N7qXtv107rel3dd7lwAlPO/whllrZ85cO2vDL4aBC6v7Xx6Tp71mWec023JybGbnTcOMbctxmm+iqffONCdbYBK2JJtha/a0ViJH85cKtuRYUpINR6yqiWX2VU6T076ybKI1s0afnGJJzoVzPtcaTfNmmWeb5oOjYwgAY8fYOJgKqDD9AF4J8AywpG4Axo4yI41/E26B9SiApr/BBwKi1AfPDyDpIKz8UNw1vWtS73SNKjilhHB/kHPgn/UlOtL8f5TUqbmOyT3zD9OUjPAGH+pm4/vQDy2z/lP072/UT3udmd4PfKjC3OyBbWK3a4bxf8ZbTegGhPzFUedSNQu9ODRWY1BnT8w7kJNMGAlO6r3YtQzc+HhnGaoQJ7FC/MeyCsIg3Q2JFE5JTJNeh+T2jK1dGMQoRQZs2oUQae2HOLVP4kF6SwJIn0MiM78kBulfSO4mfHOFzV5GNAgEkxs73JUqsmzFbLzLYBcDofuy10EnLjN5PpNrF0xABFrFEknJLiBa3NIq5OOXvUEQKB5r5YHEjIMYd2ezFm2JjFQhGaEBAZOIJs6wE90lKRGre2y+v2XAVhQQNKdwndOSE4PGz+Vl5DiEE6aIq1lPqiZKbAWIOAuPiEb5IW78BkmCa67CxXTeA+Q7LsOR4GPdsqQ7i9eUsW8JN7yJbdcivtYuJ6+gSLESpcqUq1CpSrUaterUMzZHhVCn4pVA63OpdYZrr0gNEDEwXWRSaGSJa0fMUMqvCqAEQbXlRm7i1MIk+a+BoRtCtZASYqwx7LR0BNIEgIkiOinpEg==') format('woff2'),
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-home:before {
+  content: "\e639";
+}
+
+.icon-operation:before {
+  content: "\e638";
+}
+
+.icon-bigScreen:before {
+  content: "\e74d";
+}
+
+.icon-edit:before {
+  content: "\e74c";
+}
+
+.icon-cart:before {
+  content: "\e74e";
+}
+
+.icon-sign:before {
+  content: "\e74f";
+}
+
+.icon-book:before {
+  content: "\e750";
+}
+
+.icon-level:before {
+  content: "\e751";
+}
+
+.icon-finish:before {
+  content: "\e752";
+}
+
+.icon-location:before {
+  content: "\e753";
+}
+
+.icon-time:before {
+  content: "\e755";
+}
+
+.icon-accept:before {
+  content: "\e756";
+}
+
+.icon-bg-chat:before {
+  content: "\e757";
+}
+
+.icon-see:before {
+  content: "\e758";
+}
+
+.icon-auth:before {
+  content: "\e759";
+}
+
+.icon-ci:before {
+  content: "\e75a";
+}
+
--- a/sub-operation-service/src/styles/style.scss
+++ b/sub-operation-service/src/styles/style.scss
@ -17,3 +17,22 @@
  height: auto;
  max-height: calc(100vh - 130px);
 }
+
+.txt-ellipsis{
+  display: -webkit-inline-box; 
+  -webkit-box-orient: vertical; 
+  overflow: hidden; 
+  text-overflow: ellipsis; 
+}
+.clamp1{
+  -webkit-line-clamp: 1; 
+  line-height: 1.5; 
+  max-height: calc(1.5em * 1); 
+}
+
+.clamp2{
+  -webkit-line-clamp: 2; 
+  line-height: 1.5; 
+  max-height: calc(1.5em * 2); 
+}
+
--- a/sub-operation-service/src/utils/axios.js
+++ b/sub-operation-service/src/utils/axios.js
@ -45,15 +45,20 @@ const errorHandler = async (error) => {
 */
 publicAxios.interceptors.request.use(async (config) => {
  const UserStore = useUserStore();
-  config.baseURL = config.isUpload ? VITE_APP_UPLOAD_API : VITE_APP_BASE_API;
+  switch (config.apisType) {
+    case 'upload': {
+      config.baseURL = VITE_APP_UPLOAD_API;
+      config.headers['Content-Type'] = config.uploadType;
+      break;
+    }
+    default: {
+      config.baseURL = VITE_APP_BASE_API;
+    }
+  }
  if (UserStore.hasToken()) {
-    config.headers['fairies-auth-token'] = config.headers['fairies-auth-token'] ?? UserStore.token;
-    config.headers['fairies-org-id'] = UserStore.currentOrg;
+    config.headers['authorization'] = config.headers['authorization'] ?? UserStore.token;
    config.headers['cache-control'] = 'no-cache';
    config.headers.Pragma = 'no-cache';
-    if (config?.isUpload) {
-      config.headers['Content-Type'] = config.uploadType;
-    }
  }
  if (config.method === 'POST' || config.method === 'DELETE') {
    config.headers.Accept = 'application/json';
--- a/sub-operation-service/src/utils/permission.js
+++ b/sub-operation-service/src/utils/permission.js
@ -18,7 +18,7 @@ const whiteList = ['/login', '/auth-redirect']; // 设置白名单
 router.beforeEach(async (to, from, next) => {
  NProgress.start();
  if (typeof to.meta.title === 'string') {
-    document.title = 'SUB-ADMIN | ' + to.meta.title || '管理系统';
+    document.title = '运营服务 | ' + to.meta.title || '管理系统';
  }

  const userStore = useUserStore();
@ -31,14 +31,16 @@ router.beforeEach(async (to, from, next) => {
    } else {
      try {
        const PermissionStore = usePermissionStore();
-        // 路由添加进去了没有及时更新 需要重新进去一次拦截
        if (!PermissionStore.routes.length) {
-          // 获取权限列表进行接口访问 因为这里页面要切换权限
          const accessRoutes = await PermissionStore.generateRoutes(userStore.roles);
-          accessRoutes.forEach((item) => router.addRoute(item)); // 动态添加访问路由表
-          next({ ...to, replace: true }); // 这里相当于push到一个页面 不在进入路由拦截
+          accessRoutes.forEach((item) => router.addRoute(item));
+          return next({ ...to, replace: true });
        } else {
-          next(); // 如果不传参数就会重新执行路由拦截，重新进到这里
+          if (from.path.includes('/sub') && to.path.includes('/platform')) {
+            window.location.reload();
+            return;
+          }
+          next();
        }
      } catch (error) {
        next(`/login?redirect=${to.path}`);
--- a/sub-operation-service/src/views/ecommerce/components/banner.vue
+++ b/sub-operation-service/src/views/ecommerce/components/banner.vue
@ -0,0 +1,48 @@
+<template>
+  <div class="ecommerce-banner" :style="{ height: height }">
+    <el-carousel height="height" motion-blur>
+      <el-carousel-item v-for="(item, index) in list" :key="index">
+        <img :src="getAssetsFile(item)" />
+      </el-carousel-item>
+    </el-carousel>
+  </div>
+</template>
+<script setup>
+import { ref, reactive, onMounted, watch } from 'vue';
+import { isEmpty, getAssetsFile } from '@/utils';
+
+const props = defineProps({
+  height: { type: String, default: '320px' },
+  name: { type: String, default: 'agricultural' },
+  imglist: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+});
+
+let nameVal = ref(props.name);
+let list = reactive(props.imglist);
+
+watch(
+  () => (props.list, props.imglist),
+  () => {
+    nameVal.value = props.name;
+    list = props.imglist;
+  },
+  {
+    immediate: true,
+  }
+);
+</script>
+<style lang="scss" scoped>
+.ecommerce-banner {
+  width: 100%;
+  ::v-deep() {
+    .el-carousel__item {
+      border-radius: 16px !important;
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/components/common.vue
+++ b/sub-operation-service/src/views/ecommerce/components/common.vue
@ -0,0 +1,55 @@
+<template>
+  <div class="ecommerce-common-warp">
+    <div class="ecommerce-common-content">
+      <div class="left-menu">
+        <slot v-if="$slots.left" name="left"></slot>
+        <template v-else>
+          <leftMenu :current-name="currentName"></leftMenu>
+        </template>
+      </div>
+      <div class="common-content">
+        <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';
+
+const props = defineProps({
+  currentName: { type: String, default: 'agricultural' },
+});
+</script>
+<style lang="scss" scoped>
+.ecommerce-common-warp {
+  width: 100%;
+  height: calc(100vh - 230px);
+  text-align: center;
+  .ecommerce-common-content {
+    width: $width-main;
+    margin: auto;
+    height: 100%;
+    display: inline-flex;
+    justify-content: space-between;
+    .left-menu,
+    .common-content {
+      height: 100%;
+      min-height: 100%;
+
+      border-radius: 8px;
+      padding: 8px;
+      overflow-y: auto;
+    }
+    .left-menu {
+      width: 240px;
+      background: $color-fff;
+    }
+    .common-content {
+      width: calc(100% - 240px);
+      margin-left: 16px;
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/components/filtertop.vue
+++ b/sub-operation-service/src/views/ecommerce/components/filtertop.vue
@ -0,0 +1,162 @@
+<template>
+  <div class="filter-top-warp">
+    <div v-for="(n, index) in maxLevelAndNodes.LevelKey" :key="index" class="filter-item">
+      <div class="single-item">
+        <div class="single-li all" :class="maxLevelAndNodes.LevelVal[n].id == '' ? 'li-act' : ''" @click="selectAll(n)">全部</div>
+        <div class="not-all">
+          <div
+            v-for="(m, indexm) in handlelist(n)"
+            :key="indexm"
+            class="single-li"
+            :class="select[n].id == m.id && ((m.pId && select[n].pId == m.pId) || !m.pId) ? 'li-act' : ''"
+            @click="selectItem(index, n, m)"
+          >
+            {{ m.title }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup>
+import { ref, reactive, onMounted, watch, computed } from 'vue';
+import { isEmpty, getAssetsFile } from '@/utils';
+
+const props = defineProps({
+  list: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+});
+
+let treeList = reactive([]);
+
+watch(
+  () => props.list,
+  () => {
+    treeList = props.list;
+  },
+  {
+    immediate: true,
+  }
+);
+
+const currentLevel = ref(null);
+// 计算最大层级和每层的节点数组
+const maxLevelAndNodes = computed(() => {
+  let maxLevel = 0;
+  const levelMap = {}; // 存储每层的节点数组
+  let LevelKey = [];
+  let LevelVal = {};
+
+  // 使用栈模拟递归，每个栈元素是一个对象，包含节点和当前层级
+  const stack = [];
+
+  // 初始化栈，将根节点和初始层级（1）压入栈中
+  for (const node of treeList) {
+    stack.push({ node, level: 1 });
+  }
+
+  // 开始遍历
+  while (stack.length > 0) {
+    const { node, level } = stack.pop(); // 弹出栈顶元素
+
+    // 更新最大层级
+    maxLevel = Math.max(maxLevel, level);
+
+    // 将当前节点加入对应层级的数组中
+    if (!levelMap[level]) {
+      levelMap[level] = [];
+    }
+    levelMap[level].push(node);
+    LevelVal[level] = { id: '', pId: node.pId ? node.pId : '' };
+
+    // 如果有子节点，将其压入栈中，并增加层级
+    if (node.children) {
+      for (const child of node.children) {
+        stack.push({ node: child, level: level + 1 });
+      }
+    }
+  }
+  LevelKey = Object.keys(levelMap);
+
+  return { maxLevel, levelMap, LevelKey, LevelVal };
+});
+
+const select = reactive(maxLevelAndNodes.value.LevelVal);
+
+const handlelist = (key) => {
+  if (!key || !maxLevelAndNodes.value.levelMap[key]) return [];
+  let LevelKey = maxLevelAndNodes.value.LevelKey || [];
+  const originalList = maxLevelAndNodes.value.levelMap[key];
+  const parentKey = String(Number(key) - 1); // 上一层级的 key
+  const parentVal = select[parentKey]; // 上一层级的选中状态
+
+  // 如果是第一层级，直接返回所有数据
+  if (LevelKey[0] === key || !parentVal || parentVal.id === '') {
+    return originalList;
+  }
+
+  // 如果上一层级有选中的 pId，筛选当前层级的数据
+  if (parentVal && parentVal.id) {
+    return originalList.filter((m) => m.pId === parentVal.id);
+  }
+
+  // 如果上一层级没有选中任何项，返回空数组
+  return [];
+};
+
+const selectItem = (index, key, item) => {
+  if (key && item.id) {
+    currentLevel.value = index || 0;
+    select[key] = { id: item.id, pId: item.pId ? item.pId : null };
+    emit('select', select);
+  }
+};
+
+const selectAll = (key) => {
+  select[key].id = '';
+  emit('select', select);
+};
+
+const emit = defineEmits(['select']);
+</script>
+<style lang="scss" scoped>
+.filter-top-warp {
+  width: 100%;
+  border-radius: 16px;
+  background: $color-fff;
+  padding: 16px;
+  text-align: left;
+  .filter-item {
+    width: 100%;
+  }
+  .single-item {
+    width: 100%;
+    display: inline-flex;
+    justify-content: flex-start;
+    .single-li {
+      display: inline-block;
+      cursor: pointer;
+      margin: 10px;
+      font-size: 18px;
+      &.all {
+        width: 60px;
+      }
+      &.li-act {
+        color: $color-main;
+      }
+    }
+    .not-all {
+      display: inline-flex;
+      justify-content: flex-start;
+      width: calc(100% - 60px);
+      flex-wrap: wrap;
+      .single-li {
+      }
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/components/goodsItem.vue
+++ b/sub-operation-service/src/views/ecommerce/components/goodsItem.vue
@ -0,0 +1,76 @@
+<template>
+  <div class="c-goods-item-warp">
+    <div class="goods-img">
+      <el-image :src="getAssetsFile('images/ecommerce/' + 'pic.png')" fit="cover" />
+    </div>
+    <div class="goods-name txt-ellipsis clamp2">{{ '遇合堂新款禽泰克家禽通用药250遇合堂新款禽泰克家禽通用药250' }}</div>
+    <div class="goods-do">
+      <div class="price txt-ellipsis clamp">25.00</div>
+      <div class="do">
+        <div class="iconfont icon-cart"></div>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup>
+import { isEmpty, getAssetsFile } from '@/utils';
+</script>
+<style lang="scss" scoped>
+.c-goods-item-warp {
+  width: 100%;
+  padding: 8px;
+  .goods-img {
+    width: 100%;
+    height: 168px;
+    border-radius: 16px;
+    overflow: hidden;
+    ::v-deep() {
+      .el-image {
+        width: 100%;
+        height: 168px;
+      }
+    }
+  }
+  .goods-name {
+    margin-top: 8px;
+    font-size: 16px;
+    color: $color-666;
+  }
+  .goods-do {
+    display: inline-flex;
+    width: 100%;
+    justify-content: space-between;
+    .price {
+      width: calc(100% - 32px);
+      text-align: left;
+      font-size: 22px;
+      padding-right: 8px;
+      color: $color-main;
+      font-weight: 700;
+    }
+    .price::before {
+      content: ' ￥';
+      font-size: 16px !important;
+      font-weight: normal !important;
+    }
+    .do {
+      display: inline-block;
+      width: 32px;
+      height: 32px;
+      border-radius: 50%;
+      text-align: center;
+      background: $color-main;
+      position: relative;
+      cursor: pointer;
+      .iconfont {
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        color: $color-fff;
+        font-size: 20px;
+      }
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/components/hotGoodsWordClould.vue
+++ b/sub-operation-service/src/views/ecommerce/components/hotGoodsWordClould.vue
@ -0,0 +1,97 @@
+<template>
+  <div class="hot-goods-word-clould" :style="{ height: height }">
+    <custom-echart-word-cloud :chart-data="chartsData.valData" height="100%" :option="chartsData.option" />
+  </div>
+</template>
+<script setup>
+import { ref, reactive, onMounted } from 'vue';
+const props = defineProps({
+  height: {
+    type: String,
+    default: '200px',
+  },
+});
+
+const chartsData = reactive({
+  option: {
+    backgroundColor: 'transparent',
+    tooltip: {
+      show: true,
+      textStyle: {
+        fontSize: '16',
+        color: '#3c3c3c',
+      },
+      backgroundColor: '#fff',
+      borderColor: '#ddd',
+      borderWidth: 1,
+    },
+    series: [],
+  },
+  valData: [
+    {
+      type: 'wordCloud',
+      // 网格大小，各项之间间距
+      gridSize: 22,
+      // 形状 circle 圆，cardioid  心， diamond 菱形，
+      // triangle-forward 、triangle 三角，star五角星
+      shape: 'circle',
+      // 字体大小范围
+      sizeRange: [10, 30],
+      // 文字旋转角度范围
+      rotationRange: [0, 0],
+      // 旋转步值
+      rotationStep: 90,
+      // 自定义图形
+      // maskImage: maskImage,
+      left: 'center',
+      top: 'center',
+      right: null,
+      bottom: null,
+      // 画布宽
+      width: '90%',
+      // 画布高
+      height: '90%',
+      // 是否渲染超出画布的文字
+      drawOutOfBound: false,
+      textStyle: {
+        color: function () {
+          const colors = ['#165DFF', '#6aca37', '#05a4b6', '#f93920', '#f0b114', '#ab1489', '#149cab', '#ab1414', '#27b30f', '#7e11b3', '#11b32e'];
+          return colors[parseInt(Math.random() * colors.length)];
+        },
+        emphasis: {
+          shadowBlur: 10,
+          shadowColor: '#2ac',
+        },
+      },
+      data: [
+        { value: 11.7392043070835, name: '有机白菜' },
+        { value: 9.23723855786, name: '土鸡蛋' },
+        { value: 7.75434839431, name: '猪肉' },
+        { value: 11.3865516372, name: '牛肉' },
+        { value: 7.75434839431, name: '零添加' },
+        { value: 5.83541244308, name: '原产地' },
+        { value: 15.83541244308, name: '菠萝' },
+        { value: 2.83541244308, name: '甘蔗' },
+        { value: 5.83541244308, name: '土豆' },
+        { value: 10.83541244308, name: '绿色' },
+        { value: 5.83541244308, name: '美味' },
+        { value: 5.83541244308, name: '特产' },
+      ],
+    },
+  ],
+});
+
+onMounted(() => {
+  if (chartsData.valData && chartsData.valData.length) {
+    chartsData.valData.forEach((m, index) => {
+      let num = 100;
+      m.value = (Number(m.value) + Math.random() + num).toFixed(2);
+    });
+  }
+});
+</script>
+<style lang="scss" scoped>
+.hot-goods-word-clould {
+  height: 100%;
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/components/landItem.vue
+++ b/sub-operation-service/src/views/ecommerce/components/landItem.vue
@ -0,0 +1,142 @@
+<template>
+  <div class="c-land-item-warp" @click="toDetail">
+    <div class="land-img">
+      <el-image :src="getAssetsFile('images/ecommerce/' + 'pic.png')" fit="cover" />
+    </div>
+    <div class="land-info">
+      <div class="land-info-pos">
+        <div class="land-info-c">
+          <div class="land-name txt-ellipsis clamp2">{{ '遇合堂新款禽泰克家禽通用药250遇合堂新款禽泰克家禽通用药250' }}</div>
+          <div class="tag-list">
+            <el-tag type="primary" size="small">现场核实</el-tag>
+            <el-tag type="primary" size="small">官方发布</el-tag>
+            <el-tag type="primary" size="small">优质地源</el-tag>
+          </div>
+          <div class="type-list">
+            <div class="type-val">100亩</div>
+            <div class="type-val">耕地</div>
+            <div class="type-val">蔬菜瓜果类</div>
+            <div class="type-val">水浇地</div>
+            <div class="type-val">10年起租</div>
+          </div>
+          <div class="addr">
+            <div class="iconfont icon-location"></div>
+            {{ '临沧市·耿马县' }}
+          </div>
+          <div class="land-do">
+            <div class="price txt-ellipsis clamp">25.00</div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup>
+import { isEmpty, getAssetsFile } from '@/utils';
+import { useRoute, useRouter } from 'vue-router';
+const route = useRoute();
+const router = useRouter();
+
+const toDetail = () => {
+  let id = '01';
+  router.push('/sub-operation-service/landDetail?id' + id);
+};
+</script>
+<style lang="scss" scoped>
+.c-land-item-warp {
+  width: 100%;
+  padding: 8px;
+  background: $color-fff;
+  border-radius: 16px;
+  margin-bottom: 16px;
+  cursor: pointer;
+  .land-img,
+  .land-info {
+    display: inline-block;
+    vertical-align: top;
+  }
+  .land-img {
+    width: 200px;
+    height: 200px;
+    border-radius: 16px;
+    overflow: hidden;
+    ::v-deep() {
+      .el-image {
+        width: 100%;
+        height: 100%;
+      }
+    }
+  }
+  .land-info {
+    width: calc(100% - 200px);
+    padding-left: 16px;
+    height: 200px;
+    .land-info-pos {
+      width: 100%;
+      height: 100%;
+      display: inline-flex;
+      justify-content: space-around;
+      flex-direction: column;
+      .land-info-c {
+        width: 100%;
+      }
+    }
+  }
+  .land-name {
+    margin-bottom: 3px;
+    font-size: 16px;
+    color: $color-666;
+  }
+  .tag-list {
+    width: 100%;
+    text-align: left;
+    .el-tag {
+      margin-right: 5px;
+    }
+  }
+  .type-list {
+    width: 100%;
+    text-align: left;
+    .type-val {
+      display: inline-block;
+      margin: 3px 8px 0 0;
+      font-size: 14px;
+      color: $color-999;
+    }
+  }
+  .addr {
+    width: 100%;
+    text-align: left;
+    font-size: 14px;
+    margin-top: 8px;
+    .iconfont {
+      display: inline-block;
+      margin-right: 3px;
+      font-size: 20px;
+      color: $color-666;
+      vertical-align: middle;
+    }
+  }
+  .land-do {
+    display: inline-flex;
+    width: 100%;
+    justify-content: space-between;
+    .price {
+      width: calc(100% - 0px);
+      text-align: left;
+      font-size: 22px;
+      padding-right: 8px;
+      color: $color-main;
+      font-weight: 700;
+    }
+    .price::before {
+      content: '￥';
+      font-size: 16px !important;
+      font-weight: normal !important;
+    }
+    .price::after {
+      content: '/年';
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/components/leftMenu.vue
+++ b/sub-operation-service/src/views/ecommerce/components/leftMenu.vue
@ -0,0 +1,84 @@
+<template>
+  <div class="ecommerce-left-menu-warp">
+    <div class="left-menu">
+      <view v-for="(n, index) in leftMenu" :key="index" class="left-menu-item" :class="currentIndex == index ? 'active' : ''" @click="toLink(index)">
+        <div class="item-img">
+          <img :src="getAssetsFile('images/ecommerce/' + n.icon)" />
+        </div>
+        <span class="item-title">{{ n.title }}</span>
+      </view>
+    </div>
+  </div>
+</template>
+<script setup name="home">
+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 props = defineProps({
+  currentName: { type: String, default: 'agricultural' },
+});
+
+const leftMenu = reactive([
+  { name: 'agricultural', title: '农资交易', icon: 'menu2.png', path: '/sub-operation-service/ecommerce' },
+  { name: 'supplier', title: '供应商服务', icon: 'menu1.png', path: '/sub-operation-service/supplier' },
+  { name: 'purchaser', title: '采购商服务', icon: 'menu3.png', path: '/sub-operation-service/purchaser' },
+  { name: 'land', title: '土地交易', icon: 'menu4.png', path: '/sub-operation-service/land' },
+]);
+
+let currentIndex = ref(0);
+
+watch(
+  () => props.currentName,
+  () => {
+    console.info('currentName', props.currentName);
+    currentIndex.value = leftMenu.findIndex((m) => {
+      return m.name == props.currentName;
+    });
+  },
+  { deep: true, immediate: true }
+);
+
+const toLink = (index) => {
+  currentIndex.value = index;
+  let path = index != undefined ? leftMenu[index].path : null;
+  if (path) {
+    router.push(path);
+  }
+};
+</script>
+<style lang="scss" scoped>
+.ecommerce-left-menu-warp {
+  width: 100%;
+  height: 100%;
+  .left-menu {
+    .left-menu-item {
+      width: 100%;
+      display: inline-flex;
+      justify-content: flex-start;
+      padding: 16px 0;
+      cursor: pointer;
+      &.active {
+        color: $color-main;
+      }
+      .item-img,
+      .item-title {
+        vertical-align: middle;
+      }
+      .item-img {
+        display: inline-block;
+        width: 32px;
+        height: 32px;
+      }
+      .item-title {
+        display: -webkit-inline-box;
+        font-size: 20px;
+        font-weight: 400;
+        padding-left: 8px;
+      }
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/components/marketCharts.vue
+++ b/sub-operation-service/src/views/ecommerce/components/marketCharts.vue
@ -0,0 +1,235 @@
+<template>
+  <div class="market-charts" :style="{ height: height }">
+    <custom-echart-line-line :chart-data="chartsData.valData" height="100%" :option="chartsData.option" />
+  </div>
+</template>
+<script setup>
+import { ref, reactive, onMounted, computed } from 'vue';
+
+const props = defineProps({
+  height: {
+    type: String,
+    default: '200px',
+  },
+});
+const legendData = reactive(['苹果', '小麦', '白菜']);
+let linearColors = reactive([
+  [
+    { offset: 0, color: 'rgba(15, 155, 179,0.1)' },
+    { offset: 0.6, color: 'rgba(15, 155, 179,0.5)' },
+    { offset: 1, color: 'rgba(15, 155, 179,1)' },
+  ],
+  [
+    { offset: 0, color: 'rgba(106, 202, 55,0.1)' },
+    { offset: 0.6, color: 'rgba(106, 202, 55,0.5)' },
+    { offset: 1, color: 'rgba(106, 202, 55,1)' },
+  ],
+  [
+    { offset: 0, color: 'rgba(141, 76, 181,0.1)' },
+    { offset: 0.6, color: 'rgba(141, 76, 181,0.5)' },
+    { offset: 1, color: 'rgba(141, 76, 181,1)' },
+  ],
+]);
+const lineColors = reactive(['#0f9bb3', '#6aca37', '#8d4cb5']);
+
+const currentYear = ref(new Date().getFullYear() + 1);
+const xPoint = computed(() => {
+  let list = [];
+  console.info('111', currentYear.value);
+  let minYear = currentYear.value - 10;
+  for (let i = minYear; i < currentYear.value; i++) {
+    list.push(i);
+  }
+
+  return list;
+});
+
+let numList = reactive([10, 100, 80]);
+const dataNum = (num) => {
+  let data = [];
+  if (xPoint.value && xPoint.value.length && xPoint.value.length > 0 && num) {
+    xPoint.value.forEach((n) => {
+      let numVal = Number(Number(n) * 0.1 + num + Math.random() * 100).toFixed(2);
+      data.push(numVal);
+    });
+  }
+
+  return data;
+};
+
+const series = () => {
+  let list = [];
+
+  if (legendData && legendData.length && legendData.length > 0) {
+    // console.info('legendData', legendData);
+
+    legendData.forEach((m, index) => {
+      let val = {
+        name: m,
+        type: 'line',
+        symbol: 'none', // 默认是空心圆（中间是白色的），改成实心圆
+        smooth: true,
+        lineStyle: {
+          normal: {
+            width: 1,
+            color: lineColors[index], // 线条颜色
+          },
+        },
+        areaStyle: {
+          normal: {
+            //线性渐变，前4个参数分别是x0,y0,x2,y2(范围0~1);相当于图形包围盒中的百分比。如果最后一个参数是‘true’，则该四个值是绝对像素位置。
+            color: {
+              type: 'linear', // 线性渐变
+              x: 0,
+              y: 0,
+              x2: 0,
+              y2: 1,
+              colorStops: linearColors[index],
+              global: false, // 默认为 false
+            },
+          },
+        },
+        data: [],
+      };
+      val.data = dataNum(numList[index]);
+      list.push(val);
+    });
+  }
+  return list;
+};
+
+const chartsData = reactive({
+  option: {
+    backgroundColor: 'transparent',
+    grid: {
+      left: 20,
+      right: 20,
+      bottom: '5%',
+      top: '20%',
+      containLabel: true,
+    },
+    tooltip: {
+      trigger: 'axis',
+      borderWidth: 1,
+      borderColor: {
+        type: 'linear',
+        x: 0,
+        y: 0,
+        x2: 0,
+        y2: 1,
+        colorStops: [
+          {
+            offset: 0,
+            color: 'rgba(85, 149, 233, .6)', // 0% 处的颜色
+          },
+          {
+            offset: 1,
+            color: 'rgba(85, 149, 233, 0)', // 100% 处的颜色
+          },
+        ],
+        global: false, // 缺省为 false
+      },
+      padding: [0, 8, 0, 8],
+      textStyle: {
+        color: '#fff',
+      },
+      axisPointer: {
+        lineStyle: {
+          type: 'dashed',
+          color: 'rgba(255, 255, 255, .6)',
+        },
+      },
+      extraCssText: 'box-shadow: 2px 2px 16px 1px rgba(0, 39, 102, 0.16)',
+      formatter: function (params) {
+        let content = `<div style='font-size: 14px; color: #666;text-align:left'>${params[0].name}</div>`;
+        if (Array.isArray(params)) {
+          for (let i = 0; i < params.length; i++) {
+            content += `
+                        <div style='display: flex; align-items: center;color: #666;'>
+                         <div style='width: 10px; height: 10px;border-radius:4px;background: ${params[i].color}; margin-right: 8px;'></div>
+                         <div style='font-size: 12px; margin-right: 8px;'>${params[i].seriesName}</div>
+                         <div style='font-size: 14px;'>${params[i].value}</div>
+                       </div>
+                     `;
+          }
+        }
+        return content;
+      },
+    },
+    legend: {
+      show: true,
+      data: Array.from(legendData),
+      left: 'center', // 距离左侧10%的位置
+      top: '0', // 垂直居中
+      itemWidth: 15, // 图例标记的宽度
+      itemHeight: 8, // 图例标记的高度
+      textStyle: {
+        fontSize: 10, // 图例文字的字体大小
+        color: '#333', // 图例文字的颜色
+      },
+    },
+    xAxis: {
+      type: 'category',
+      boundaryGap: false,
+      axisLabel: {
+        interval: 0, // 设置为 1，表示『隔一个标签显示一个标签』
+        textStyle: {
+          color: '#666',
+          fontStyle: 'normal',
+          fontSize: 10,
+        },
+      },
+      axisTick: {
+        show: false,
+      },
+      axisLine: {
+        // 坐标轴轴线相关设置
+        lineStyle: {
+          color: 'rgba(77, 128, 254, 1)',
+        },
+      },
+      splitLine: {
+        show: false,
+      },
+      data: xPoint.value,
+    },
+    yAxis: {
+      type: 'value',
+      name: ' ',
+      nameTextStyle: {
+        color: '#666',
+        fontSize: 14,
+        padding: [0, 0, 0, -30],
+      },
+      axisLabel: {
+        interval: 0, // 设置为 1，表示『隔一个标签显示一个标签』
+        textStyle: {
+          color: '#666',
+          fontStyle: 'normal',
+          fontSize: 12,
+        },
+      },
+      axisTick: {
+        show: false,
+      },
+      axisLine: {
+        // 坐标轴轴线相关设置
+        lineStyle: {
+          color: 'rgba(77, 128, 254, 0.2)',
+        },
+      },
+      splitLine: {
+        show: false,
+      },
+    },
+    series: series(),
+  },
+});
+
+onMounted(() => {});
+</script>
+<style lang="scss" scoped>
+.market-charts-charts {
+  height: 100%;
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/components/purchaserPopup.vue
+++ b/sub-operation-service/src/views/ecommerce/components/purchaserPopup.vue
@ -0,0 +1,151 @@
+<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-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-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button @click="doCancel">取消</el-button>
+          <el-button type="primary" @click="doSure"> 确定 </el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+<script setup>
+import { ref, reactive, onMounted, watch } from 'vue';
+import { isEmpty, getAssetsFile } from '@/utils';
+import { useRoute, useRouter } from 'vue-router';
+import { fa } from 'element-plus/es/locale/index.mjs';
+const route = useRoute();
+const router = useRouter();
+
+const props = defineProps({
+  list: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+});
+
+let treeList = reactive([]);
+let ruleForm = reactive({
+  typeId: '',
+  price: '',
+  goods: '',
+  num: '',
+  addr: '',
+  isPickup: 1,
+  remark: '',
+});
+
+const pickupOptions = reactive([
+  { label: '可上门收货', value: 1 },
+  { label: '不上门收货', value: 0 },
+]);
+
+let ruleFormRef = ref(null);
+const treeOption = ref({
+  children: 'children',
+  label: 'title',
+});
+
+watch(
+  () => props.list,
+  () => {
+    treeList = props.list;
+  },
+  {
+    immediate: true,
+  }
+);
+let isShow = ref(false);
+const doShow = () => {
+  isShow.value = true;
+};
+
+const doHide = () => {
+  isShow.value = false;
+};
+
+const doCancel = () => {
+  doHide();
+};
+
+const doSure = () => {
+  doHide();
+};
+
+const rules = reactive({
+  typeId: [{ required: true, message: '请选择商品分类', trigger: ['blur', 'change'] }],
+  price: [{ required: true, message: '请输入采购价格', trigger: ['blur', 'change'] }],
+  goods: [{ required: true, message: '请输入采购商品', trigger: ['blur', 'change'] }],
+  num: [{ required: true, message: '请输入采购数量', trigger: ['blur', 'change'] }],
+  addr: [{ required: true, message: '请填入详细地址', trigger: ['blur', 'change'] }],
+  isPickup: [{ required: true, message: '请选择是否上门取货', trigger: ['blur', 'change'] }],
+  remark: [{ required: false, message: '请输入补充说明', trigger: ['blur', 'change'] }],
+});
+
+defineExpose({
+  doShow,
+  doHide,
+});
+</script>
+<style lang="scss" scoped>
+.purchaser-popup-warp {
+}
+.custom-form {
+  ::v-deep() {
+    .el-form-item__label {
+      font-size: 18px !important;
+      color: $color-999 !important;
+      font-weight: 400 !important;
+    }
+    .el-radio__label {
+      font-size: 18px;
+      color: $color-333;
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/components/typetop.vue
+++ b/sub-operation-service/src/views/ecommerce/components/typetop.vue
@ -0,0 +1,125 @@
+<template>
+  <div class="type-top-warp">
+    <div class="filter-item">
+      <div class="single-item">
+        <div class="item-title">{{ titleVal || ' ' }}</div>
+        <div class="single-li all" :class="!select ? 'li-act' : ''" @click="selectAll()">全部</div>
+        <div class="not-all">
+          <div
+            v-for="(m, indexm) in listVal"
+            :key="indexm"
+            class="single-li"
+            :class="select && select.id == m.id ? 'li-act' : ''"
+            @click="selectItem(m)"
+          >
+            {{ m.title }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup>
+import { ref, reactive, onMounted, watch, computed } from 'vue';
+import { isEmpty, getAssetsFile } from '@/utils';
+
+const props = defineProps({
+  list: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+  //唯一标识
+  name: {
+    type: String,
+    default: '',
+  },
+  title: {
+    type: String,
+    default: '选择分类',
+  },
+});
+
+const emit = defineEmits(['select']);
+
+let listVal = reactive([]);
+
+let titleVal = ref(props.title);
+let nameVal = ref(props.name);
+
+let select = ref(null);
+
+watch(
+  () => (props.list, props.title, props.name),
+  () => {
+    listVal = props.list;
+    titleVal.value = props.title;
+    nameVal.value = props.name;
+  },
+  {
+    immediate: true,
+  }
+);
+
+const selectItem = (item) => {
+  select.value = item || null;
+  emit('select', { select: select.value, nameVal: nameVal.value });
+};
+
+const selectAll = (key) => {
+  select.value = null;
+  emit('select', { select: select.value, nameVal: nameVal.value });
+};
+
+const clearSelect = () => {
+  select.value = null;
+};
+
+defineExpose({
+  clearSelect,
+});
+</script>
+<style lang="scss" scoped>
+.type-top-warp {
+  width: 100%;
+  text-align: left;
+  .filter-item {
+    width: 100%;
+  }
+  .single-item {
+    width: 100%;
+    display: inline-flex;
+    justify-content: flex-start;
+    .item-title {
+      display: -webkit-inline-box;
+      color: $color-999;
+      font-size: 20px;
+      width: 120px;
+      vertical-align: top;
+      font-weight: 500;
+      line-height: 40px;
+    }
+    .single-li {
+      display: inline-block;
+      cursor: pointer;
+      margin: 10px;
+      font-size: 18px;
+      &.all {
+        width: 60px;
+      }
+      &.li-act {
+        color: $color-main;
+      }
+    }
+    .not-all {
+      display: inline-flex;
+      justify-content: flex-start;
+      width: calc(100% - 180px);
+      flex-wrap: wrap;
+      .single-li {
+      }
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/index.vue
+++ b/sub-operation-service/src/views/ecommerce/index.vue
@ -0,0 +1,85 @@
+<template>
+  <div>
+    <common current-name="agricultural">
+      <template #main>
+        <banner :imglist="bannerList"></banner>
+        <filtertop :list="treeList"></filtertop>
+        <div class="goods-list-warp">
+          <div class="goods-list">
+            <template v-for="(n, index) in 16" :key="index">
+              <div class="goods-item">
+                <goodsItem></goodsItem>
+              </div>
+            </template>
+          </div>
+        </div>
+      </template>
+    </common>
+  </div>
+</template>
+<script setup name="ecommerce">
+import common from './components/common.vue';
+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',
+    title: '农用百货',
+    children: [
+      { pId: '01', id: '0101', title: '农具' },
+      { pId: '01', id: '0102', title: '农机' },
+      { pId: '01', id: '0103', title: '灌溉设备' },
+      { pId: '01', id: '0104', title: '防护用品' },
+    ],
+  },
+  {
+    id: '02',
+    title: '肥料',
+    children: [
+      { pId: '02', id: '0101', title: '有机肥' },
+      { pId: '02', id: '0102', title: '水溶肥' },
+      { pId: '02', id: '0103', title: '天然肥料' },
+    ],
+  },
+  {
+    id: '03',
+    title: '农药',
+    children: [
+      { pId: '03', id: '0101', title: '杀虫剂' },
+      { pId: '03', id: '0102', title: '杀菌剂' },
+      { pId: '03', id: '0103', title: '除草剂' },
+      { pId: '03', id: '0104', title: '杀螨剂' },
+    ],
+  },
+]);
+
+let bannerList = reactive(['images/ecommerce/' + 'banner.png', 'images/ecommerce/' + 'banner.png']);
+</script>
+<style lang="scss" scoped>
+.goods-list-warp {
+  width: 100%;
+  margin-top: 16px;
+  .goods-list {
+    width: 100%;
+    display: inline-flex;
+    flex-wrap: wrap;
+    justify-content: space-around;
+    gap: 10px;
+    .goods-item {
+      display: inline-block;
+      width: calc((100% - 50px) / 5);
+      background: $color-fff;
+      border-radius: 16px;
+      overflow: hidden;
+      margin-bottom: 16px;
+    }
+  }
+  /* 添加伪元素占位 */
+  .goods-list::after {
+    content: '';
+    flex: auto;
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/land.vue
+++ b/sub-operation-service/src/views/ecommerce/land.vue
@ -0,0 +1,328 @@
+<template>
+  <div class="land-index-warp">
+    <common current-name="land">
+      <template #main>
+        <banner :imglist="bannerList"></banner>
+        <div class="land-filter-top">
+          <div v-if="!isHide">
+            <typetop ref="arearef" :list="LevelOne" :name="'area'" title="选择地区" @select="doSelect"></typetop>
+            <typetop ref="uesdref" :list="landUse" :name="'uesd'" title="选择土地" @select="doSelect"></typetop>
+            <typetop ref="typeref" :list="landType" :name="'type'" title="土地用途" @select="doSelect"></typetop>
+            <typetop ref="productref" :list="landProduct" :name="'product'" title="种养殖产物" @select="doSelect"></typetop>
+            <typetop ref="circulationref" :list="landCirculation" :name="'circulation'" title="土地流转" @select="doSelect"></typetop>
+            <div class="more-filter">
+              <div class="more-title">更多</div>
+              <div class="filter-r">
+                <el-row :gutter="16">
+                  <el-col :span="8">
+                    <el-select v-model="fliter.area" placeholder="请选择面积范围" style="width: 200px">
+                      <el-option v-for="item in areaRange" :key="item.value" :label="item.label" :value="item.value" />
+                    </el-select>
+                  </el-col>
+                  <el-col :span="8">
+                    <el-select v-model="fliter.year" placeholder="请选择流转年限" style="width: 200px">
+                      <el-option v-for="m in yearList" :key="m.value" :label="m.label" :value="m.value" />
+                    </el-select>
+                  </el-col>
+                  <el-col :span="8">
+                    <el-select v-model="fliter.lookType" placeholder="请选择预约带看" style="width: 200px">
+                      <el-option v-for="n in lookType" :key="n.value" :label="n.label" :value="n.value" />
+                    </el-select>
+                  </el-col>
+                  <el-col :span="24" style="margin: 16px 0">
+                    <el-radio-group v-model="fliter.other">
+                      <el-radio v-for="(k, index) in radioList" :key="index" :value="k.value">{{ k.label }}</el-radio>
+                    </el-radio-group>
+                  </el-col>
+                </el-row>
+              </div>
+            </div>
+          </div>
+          <div class="select-result">
+            <div class="title">所选分类</div>
+            <div class="result-list">
+              <template v-for="(r, indexr) in selectkeylist" :key="indexr">
+                <div class="result-item">
+                  <el-tag closable :type="'info'" @close="handleClose(r)">
+                    {{ selectAll[r] && selectAll[r].title ? selectAll[r].title : '' }}
+                  </el-tag>
+                </div>
+              </template>
+              <div class="show-hide" @click="doShowHide">
+                <el-icon v-if="!isHide"><ArrowUpBold /></el-icon>
+                <el-icon v-else><ArrowDownBold /></el-icon>
+                <span>{{ isHide ? '展开' : '收起' }}</span>
+              </div>
+            </div>
+          </div>
+
+          <div class="filter-bottom">
+            <el-row :gutter="16">
+              <el-col :span="12" align="left">
+                <div class="result-count">
+                  共匹配到
+                  <span class="count">{{ '0' }}</span>
+                  个结果
+                </div>
+              </el-col>
+              <el-col :span="12" align="right">
+                <div class="do-set">
+                  <el-icon><Refresh /></el-icon>
+                  <span>重置</span>
+                </div>
+              </el-col>
+            </el-row>
+          </div>
+        </div>
+
+        <div class="land-reuslt-list">
+          <el-row class="land-item-warp" :gutter="24">
+            <template v-for="(land, indexl) in 11" :key="indexl">
+              <el-col :span="12">
+                <landItem></landItem>
+              </el-col>
+            </template>
+          </el-row>
+        </div>
+      </template>
+    </common>
+  </div>
+</template>
+<script setup name="ecommerce">
+import common from './components/common.vue';
+import banner from './components/banner.vue';
+import typetop from './components/typetop.vue';
+import landItem from './components/landItem.vue';
+import { ref, reactive, onMounted, watch, computed } from 'vue';
+
+let LevelOne = reactive([
+  { id: '01', title: '耿马镇' },
+  { id: '02', title: '孟定镇' },
+  { id: '03', title: '孟永镇' },
+  { id: '04', title: '孟撒镇' },
+  { id: '05', title: '勐简乡' },
+  { id: '06', title: '大兴乡' },
+  { id: '07', title: '四排山乡' },
+  { id: '08', title: '贺派乡' },
+]);
+
+let landUse = reactive([
+  { id: '01', title: '耕地' },
+  { id: '02', title: '林地' },
+  { id: '03', title: '园地' },
+  { id: '04', title: '草地' },
+  { id: '05', title: '交通运输用地' },
+  { id: '06', title: '水域水利设施用地' },
+  { id: '07', title: '其他用地' },
+]);
+
+let landType = reactive([
+  { id: '01', title: '水田' },
+  { id: '02', title: '水浇地' },
+  { id: '03', title: '旱地' },
+]);
+
+let landProduct = reactive([
+  { id: '01', title: '水果坚果类' },
+  { id: '02', title: '蔬菜瓜果类' },
+  { id: '03', title: '粮食油料类' },
+  { id: '04', title: '养殖类' },
+  { id: '05', title: '其他' },
+]);
+
+let landCirculation = reactive([
+  { id: '01', title: '经营权出租' },
+  { id: '02', title: '经营权合作' },
+  { id: '03', title: '经营权入股' },
+  { id: '04', title: '经营权转让' },
+  { id: '05', title: '经营权互换' },
+  { id: '06', title: '经营权转包' },
+  { id: '07', title: '使用权出租' },
+  { id: '08', title: '使用权转让' },
+  { id: '09', title: '使用权入股' },
+  { id: '10', title: '使用权合作' },
+]);
+let radioList = reactive([
+  { value: '01', label: '电话核实' },
+  { value: '02', label: '现场核实' },
+  { value: '03', label: '现场视频' },
+  { value: '04', label: '官方发布' },
+  { value: '05', label: '金牌地源' },
+  { value: '06', label: '优质地源' },
+  { value: '07', label: '地区商家' },
+]);
+
+let areaRange = reactive([
+  { value: '0', label: '10亩以下' },
+  { value: '10', label: '10 ~ 100亩' },
+  { value: '100', label: '101 ~ 1000亩' },
+  { value: '1000', label: '1001 ~ 5000亩' },
+  { value: '5000', label: '5000亩以上' },
+]);
+
+let yearList = reactive([
+  { value: '0', label: '5年以下' },
+  { value: '5', label: '6 ~ 10年' },
+  { value: '10', label: '11 ~ 15年' },
+  { value: '15', label: '16 ~ 20年' },
+  { value: '20', label: '21 ~ 30年' },
+  { value: '30', label: '30年以上' },
+]);
+
+let lookType = reactive([
+  { value: 'reservation', babel: '可预约带看' },
+  { value: 'pay', babel: '单词付费带看' },
+  { value: 'bond', babel: '保证金带看' },
+]);
+
+let bannerList = reactive(['images/ecommerce/' + 'banner3.png', 'images/ecommerce/' + 'banner3.png']);
+let isHide = ref(false);
+let fliter = reactive({
+  area: null,
+  year: null,
+  lookType: null,
+  other: null,
+});
+
+let selectAll = reactive({});
+const doSelect = (data) => {
+  let { select, nameVal } = data;
+  selectAll[nameVal] = select;
+  console.info('doSelect', data);
+};
+
+let selectkeylist = computed(() => {
+  let list = Object.keys(selectAll);
+  return list;
+});
+
+let arearef = ref(null);
+let uesdref = ref(null);
+let typeref = ref(null);
+let productref = ref(null);
+let circulationref = ref(null);
+
+const refs = {
+  arearef,
+  uesdref,
+  typeref,
+  productref,
+  circulationref,
+};
+
+const handleClose = (name) => {
+  if (name) {
+    let refName = name + 'ref';
+    const componentRef = refs[refName];
+    console.info(' componentRef.value', componentRef.value);
+    componentRef.value && componentRef.value.clearSelect();
+    delete selectAll[name];
+  }
+};
+
+const doShowHide = () => {
+  isHide.value = !isHide.value;
+};
+</script>
+<style lang="scss" scoped>
+.land-index-warp {
+  width: 100%;
+  .land-filter-top {
+    width: 100%;
+    border-radius: 16px;
+    background: $color-fff;
+    padding: 16px;
+
+    .more-filter {
+      display: inline-flex;
+      justify-content: flex-start;
+      width: 100%;
+      .filter-r,
+      .more-title {
+        display: -webkit-inline-box;
+        vertical-align: top;
+      }
+      .more-title {
+        color: $color-999;
+        font-size: 20px;
+        width: 120px;
+        vertical-align: top;
+        font-weight: 500;
+        line-height: 40px;
+      }
+      .filter-r {
+      }
+    }
+
+    .select-result {
+      display: inline-flex;
+      justify-content: flex-start;
+      width: 100%;
+      text-align: left;
+      .title,
+      .result-list {
+        display: inline-block;
+        vertical-align: top;
+      }
+      .title {
+        display: -webkit-inline-box;
+        color: $color-999;
+        font-size: 20px;
+        width: 120px;
+        vertical-align: top;
+        font-weight: 500;
+        line-height: 40px;
+      }
+      .result-list {
+        width: calc(100% - 120px);
+        padding-right: 30px;
+        position: relative;
+        .result-item {
+          display: inline-block;
+          margin: 8px;
+        }
+        .show-hide {
+          position: absolute;
+          right: 0;
+          top: 50%;
+          transform: translateY(-50%);
+          cursor: pointer;
+          font-size: 16px;
+          .el-icon {
+            display: inline-block;
+            vertical-align: middle;
+          }
+        }
+      }
+    }
+  }
+  .filter-bottom {
+    width: 100%;
+    text-align: center;
+    .result-count {
+      font-size: 18px;
+      color: $color-666;
+      .count {
+        color: $color-main;
+        padding: 0 2px;
+      }
+    }
+    .do-set {
+      font-size: 16px;
+      color: $color-666;
+      .el-icon {
+        display: inline-block;
+        vertical-align: middle;
+        font-size: 20px;
+      }
+    }
+  }
+
+  .land-reuslt-list {
+    width: 100%;
+    margin-top: 24px;
+    .land-item-warp {
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/landDetail.vue
+++ b/sub-operation-service/src/views/ecommerce/landDetail.vue
@ -0,0 +1,113 @@
+<template>
+  <div class="land-detail-warp">
+    <common current-name="land">
+      <template #main> </template>
+    </common>
+  </div>
+</template>
+<script setup name="ecommerce">
+import common from './components/common.vue';
+import { ref, reactive, onMounted, watch, computed } from 'vue';
+</script>
+<style lang="scss" scoped>
+.land-detail-warp {
+  width: 100%;
+  .land-filter-top {
+    width: 100%;
+    border-radius: 16px;
+    background: $color-fff;
+    padding: 16px;
+
+    .more-filter {
+      display: inline-flex;
+      justify-content: flex-start;
+      width: 100%;
+      .filter-r,
+      .more-title {
+        display: -webkit-inline-box;
+        vertical-align: top;
+      }
+      .more-title {
+        color: $color-999;
+        font-size: 20px;
+        width: 120px;
+        vertical-align: top;
+        font-weight: 500;
+        line-height: 40px;
+      }
+      .filter-r {
+      }
+    }
+
+    .select-result {
+      display: inline-flex;
+      justify-content: flex-start;
+      width: 100%;
+      text-align: left;
+      .title,
+      .result-list {
+        display: inline-block;
+        vertical-align: top;
+      }
+      .title {
+        display: -webkit-inline-box;
+        color: $color-999;
+        font-size: 20px;
+        width: 120px;
+        vertical-align: top;
+        font-weight: 500;
+        line-height: 40px;
+      }
+      .result-list {
+        width: calc(100% - 120px);
+        padding-right: 30px;
+        position: relative;
+        .result-item {
+          display: inline-block;
+          margin: 8px;
+        }
+        .show-hide {
+          position: absolute;
+          right: 0;
+          top: 50%;
+          transform: translateY(-50%);
+          cursor: pointer;
+          font-size: 16px;
+          .el-icon {
+            display: inline-block;
+            vertical-align: middle;
+          }
+        }
+      }
+    }
+  }
+  .filter-bottom {
+    width: 100%;
+    text-align: center;
+    .result-count {
+      font-size: 18px;
+      color: $color-666;
+      .count {
+        color: $color-main;
+        padding: 0 2px;
+      }
+    }
+    .do-set {
+      font-size: 16px;
+      color: $color-666;
+      .el-icon {
+        display: inline-block;
+        vertical-align: middle;
+        font-size: 20px;
+      }
+    }
+  }
+
+  .land-reuslt-list {
+    width: 100%;
+    margin-top: 24px;
+    .land-item-warp {
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/purchaser.vue
+++ b/sub-operation-service/src/views/ecommerce/purchaser.vue
@ -0,0 +1,286 @@
+<template>
+  <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 class="hot-list-warp">
+          <el-row :gutter="10">
+            <el-col :span="8" align="left">
+              <el-cascader :options="typeTree" :props="treeOption" clearable :placeholder="'请选择地区'" />
+            </el-col>
+            <el-col :span="16" align="left">
+              <el-radio-group v-model="filter.time">
+                <el-radio v-for="(n, index) in dateList" :key="index" :value="n.value">{{ n.label }}</el-radio>
+              </el-radio-group>
+            </el-col>
+          </el-row>
+          <el-row>
+            <el-col :span="24">
+              <el-table :data="tableData" style="width: 100%" height="320" @row-click="rowClick">
+                <el-table-column prop="title" label="采购品种" />
+                <el-table-column prop="region" label="收货地" />
+                <el-table-column prop="buyer" label="采购方" />
+                <el-table-column prop="buyNum" label="采购量(kg)" />
+                <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>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-col>
+          </el-row>
+        </div>
+      </template>
+    </common>
+
+    <purchaserPopup ref="popupQuote" :list="treeList"></purchaserPopup>
+  </div>
+</template>
+<script setup name="ecommerce">
+import common from './components/common.vue';
+import filtertop from './components/filtertop.vue';
+import hotGoodsWordClould from './components/hotGoodsWordClould.vue';
+import marketCharts from './components/marketCharts.vue';
+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';
+const route = useRoute();
+const router = useRouter();
+
+let treeList = reactive([
+  {
+    id: '01',
+    title: '农产品',
+    children: [
+      {
+        pId: '01',
+        id: '0101',
+        title: '植物性农产品',
+        children: [
+          { pId: '0101', id: '010101', title: '谷物' },
+          { pId: '0101', id: '010102', title: '蔬菜' },
+          { pId: '0101', id: '010103', title: '水果' },
+          { pId: '0101', id: '010104', title: '坚果与油料作物' },
+          { pId: '0101', id: '010105', title: '糖料作物' },
+          { pId: '0101', id: '010106', title: '纤维作物' },
+          { pId: '0101', id: '010107', title: '茶叶' },
+          { pId: '0101', id: '010108', title: '咖啡' },
+          { pId: '0101', id: '010109', title: '香料' },
+        ],
+      },
+      {
+        pId: '01',
+        id: '0102',
+        title: '动物性农产品',
+        children: [
+          { pId: '0102', id: '010201', title: '肉类' },
+          { pId: '0102', id: '010202', title: '奶制品' },
+          { pId: '0102', id: '010203', title: '蛋类' },
+          { pId: '0102', id: '010204', title: '蜂蜜' },
+          { pId: '0102', id: '010205', title: '水产品' },
+        ],
+      },
+      {
+        pId: '01',
+        id: '0103',
+        title: '特殊农产品',
+        children: [
+          { pId: '0103', id: '010301', title: '花卉与苗木' },
+          { pId: '0103', id: '010302', title: '药材' },
+          { pId: '0103', id: '010303', title: '菌类' },
+        ],
+      },
+      {
+        pId: '01',
+        id: '0104',
+        title: '其他',
+        children: [{ pId: '0104', id: '010401', title: '饲料' }],
+      },
+    ],
+  },
+  {
+    id: '02',
+    title: '种子种苗',
+    children: [
+      {
+        pId: '02',
+        id: '0101',
+        title: '花卉种子种苗',
+        children: [
+          { pId: '0101', id: '010101', title: '草本花卉' },
+          { pId: '0101', id: '010102', title: '木本花卉' },
+          { pId: '0101', id: '010103', title: '野生花卉' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0102',
+        title: '蔬菜种子种苗',
+        children: [
+          { pId: '0102', id: '010201', title: '叶菜类' },
+          { pId: '0102', id: '010202', title: '根茎类' },
+          { pId: '0102', id: '010203', title: '果实类' },
+          { pId: '0102', id: '010204', title: '豆类' },
+          { pId: '0102', id: '010205', title: '瓜类' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0103',
+        title: '果树种苗',
+        children: [
+          { pId: '0103', id: '010301', title: '柑橘类' },
+          { pId: '0103', id: '010302', title: '仁果类' },
+          { pId: '0103', id: '010303', title: '核果类' },
+          { pId: '0103', id: '010304', title: '浆果类' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0104',
+        title: '药材种子与种苗',
+        children: [
+          { pId: '0104', id: '010401', title: '寒地龙药' },
+          { pId: '0104', id: '010402', title: '常见中药材' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0105',
+        title: '其他作物',
+        children: [
+          { pId: '0105', id: '010501', title: '牧草' },
+          { pId: '0105', id: '010502', title: '经济作物' },
+          { pId: '0105', id: '010503', title: '观赏树木' },
+        ],
+      },
+    ],
+  },
+]);
+
+let popupQuote = ref(null);
+
+const typeTree = ref([]);
+const treeOption = ref({
+  children: 'areaChildVOS',
+  label: 'areaName',
+});
+
+const getTree = () => {
+  console.info('getTree');
+  getRegion().then((res) => {
+    if (res.code === 200) {
+      const { code, data } = res;
+      typeTree.value = data;
+      console.info('区域信息', typeTree.value);
+    }
+  });
+};
+
+const handleClick = () => {
+  popupQuote.value && popupQuote.value.doShow();
+};
+const dateList = reactive([
+  { label: '近7天发布', value: 7 },
+  { label: '近30天发布', value: 30 },
+]);
+let filter = ref({
+  region: '',
+  time: 7,
+});
+
+let tableData = reactive([
+  { id: '01', title: '西红柿', region: '耿马镇', buyer: '盛源农业', buyNum: 5000, time: '2025-04-02 12:25:36' },
+  { id: '02', title: '白菜', region: '孟定镇', buyer: '星悦农业', buyNum: 6000, time: '2025-04-01 12:25:36' },
+  { id: '03', title: '西蓝花', region: '孟勇镇', buyer: '盛源农业', buyNum: 7000, time: '2025-04-02 13:25:36' },
+  { id: '04', title: '鸡蛋', region: '勐简乡', buyer: '上好佳农业', buyNum: 8000, time: '2025-04-02 12:25:36' },
+  { id: '05', title: '牛肉', region: '四排山乡', buyer: '尚嘉农业', buyNum: 5000, time: '2025-03-31 12:25:36' },
+  { id: '06', title: '氮肥', region: '大兴乡', buyer: '信誉农资', buyNum: 6000, time: '2025-04-02 12:25:36' },
+  { id: '07', title: '白菜种子', region: '贺派乡', buyer: '佳佳农业', buyNum: 5000, time: '2025-04-02 12:25:36' },
+  { id: '08', title: '西红柿种子', region: '勐撒镇', buyer: '佳佳农业', buyNum: 8000, time: '2025-04-02 12:25:36' },
+]);
+
+const rowClick = (data) => {
+  router.push('/sub-operation-service/purchaserDetail?id=' + data.id);
+};
+
+onMounted(() => {
+  console.info('onMounted');
+  getTree();
+});
+</script>
+<style lang="scss" scoped>
+.purchaser-index-warp {
+  width: 100%;
+  .purchaser-top {
+    width: 100%;
+    margin-bottom: 16px;
+    background: $color-fff;
+    border-radius: 16px;
+    overflow: hidden;
+    padding: 10px;
+    .purchaser-top-title {
+      width: 100%;
+      text-align: left;
+      font-size: 18px;
+    }
+    .purchaser-charts {
+      width: 100%;
+    }
+  }
+
+  .hot-list-warp {
+    background: $color-fff;
+    padding: 16px;
+    border-radius: 16px;
+    margin: 16px 0;
+
+    ::v-deep() {
+      thead {
+        border-radius: 16px;
+        overflow: hidden;
+      }
+      thead th {
+        background: $color-main-table-header;
+        color: $color-999 !important;
+        border: none !important;
+        padding: 16px 0;
+      }
+      thead th:first-child {
+        border-top-left-radius: 16px;
+        border-bottom-left-radius: 16px;
+      }
+      thead th:last-child {
+        border-top-right-radius: 16px;
+        border-bottom-right-radius: 16px;
+      }
+      table {
+        margin-top: 16px !important;
+      }
+      tbody td {
+        border: none !important;
+      }
+      .el-table__inner-wrapper::before {
+        display: none !important;
+      }
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/purchaserDetail.vue
+++ b/sub-operation-service/src/views/ecommerce/purchaserDetail.vue
@ -0,0 +1,485 @@
+<template>
+  <div class="purchaser-detail-warp">
+    <common current-name="purchaser">
+      <template #main>
+        <div class="purchaser-detail-top">
+          <div class="top-title">
+            <div class="father-title">采购商服务</div>
+            <div class="current-title">采购详情</div>
+          </div>
+          <div class="purchaser-info">
+            <el-row :gutter="16">
+              <el-col :span="16">
+                <div class="purchaser-info-l">
+                  <div class="img">
+                    <el-image :src="getAssetsFile('images/ecommerce/' + 'test01.png')" fit="cover" />
+                  </div>
+                  <div class="content">
+                    <div class="title-warp">
+                      <div class="txt txt-ellipsis clamp2">耿马县勐简乡飘云生态农业耿马县勐简乡飘云生态农业</div>
+                      <div class="icon-warp">
+                        <div class="iconfont icon-level"></div>
+                        <div class="iconfont icon-auth"></div>
+                      </div>
+                    </div>
+                    <div class="is-auth">
+                      <span>已实名认证</span>
+                    </div>
+                    <div class="settled-time">
+                      <span>入驻时间：37天</span>
+                    </div>
+                  </div>
+                </div>
+              </el-col>
+              <el-col :span="8">
+                <div class="purchaser-info-r">
+                  <div class="addr">
+                    {{ '南省临沧市耿马傣族佤族自治县耿马县勐简乡' }}
+                    <div class="iconfont icon-location"></div>
+                  </div>
+                </div>
+              </el-col>
+            </el-row>
+            <el-row :gutter="56" class="purchase-info-total">
+              <el-col :span="12">
+                <div class="info-total-item">
+                  <div class="label">采购品种：</div>
+                  <div class="val">西红柿</div>
+                </div>
+              </el-col>
+              <el-col :span="12">
+                <div class="info-total-item">
+                  <div class="label">采购数量：</div>
+                  <div class="val">5000kg</div>
+                </div>
+              </el-col>
+              <el-col :span="12">
+                <div class="info-total-item">
+                  <div class="label">期望货源地：</div>
+                  <div class="val">耿马县·贺派乡</div>
+                </div>
+              </el-col>
+              <el-col :span="12">
+                <div class="info-total-item">
+                  <div class="label">浏览次数：</div>
+                  <div class="val">188次</div>
+                </div>
+              </el-col>
+              <el-col :span="12">
+                <div class="info-total-item">
+                  <div class="label">期望货源地：</div>
+                  <div class="val">耿马县·贺派乡</div>
+                </div>
+              </el-col>
+              <el-col :span="12">
+                <div class="info-total-item">
+                  <div class="label">更新时间：</div>
+                  <div class="val">2025.01.01 12:15:18</div>
+                </div>
+              </el-col>
+            </el-row>
+            <el-row class="contant-wrap">
+              <el-col :span="24">
+                <div class="contant-btn">
+                  <div class="iconfont icon-bg-chat"></div>
+                  <span>在线联系</span>
+                </div>
+              </el-col>
+            </el-row>
+          </div>
+        </div>
+        <div class="hot-list-warp">
+          <div class="block-title">热门采购</div>
+          <el-row>
+            <el-col :span="24">
+              <el-table :data="tableData" style="width: 100%" height="320">
+                <el-table-column prop="title" label="采购品种" />
+                <el-table-column prop="region" label="收货地" />
+                <el-table-column prop="buyer" label="采购方" />
+                <el-table-column prop="buyNum" label="采购量(kg)" />
+                <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>
+                  </template>
+                </el-table-column>
+              </el-table>
+            </el-col>
+          </el-row>
+        </div>
+      </template>
+    </common>
+
+    <purchaserPopup ref="popupQuote" :list="treeList"></purchaserPopup>
+  </div>
+</template>
+<script setup name="ecommerce">
+import common from './components/common.vue';
+import purchaserPopup from './components/purchaserPopup.vue';
+import { ref, reactive, onMounted, watch, computed } from 'vue';
+import { isEmpty, getAssetsFile } from '@/utils';
+
+let popupQuote = ref(null);
+let treeList = reactive([
+  {
+    id: '01',
+    title: '农产品',
+    children: [
+      {
+        pId: '01',
+        id: '0101',
+        title: '植物性农产品',
+        children: [
+          { pId: '0101', id: '010101', title: '谷物' },
+          { pId: '0101', id: '010102', title: '蔬菜' },
+          { pId: '0101', id: '010103', title: '水果' },
+          { pId: '0101', id: '010104', title: '坚果与油料作物' },
+          { pId: '0101', id: '010105', title: '糖料作物' },
+          { pId: '0101', id: '010106', title: '纤维作物' },
+          { pId: '0101', id: '010107', title: '茶叶' },
+          { pId: '0101', id: '010108', title: '咖啡' },
+          { pId: '0101', id: '010109', title: '香料' },
+        ],
+      },
+      {
+        pId: '01',
+        id: '0102',
+        title: '动物性农产品',
+        children: [
+          { pId: '0102', id: '010201', title: '肉类' },
+          { pId: '0102', id: '010202', title: '奶制品' },
+          { pId: '0102', id: '010203', title: '蛋类' },
+          { pId: '0102', id: '010204', title: '蜂蜜' },
+          { pId: '0102', id: '010205', title: '水产品' },
+        ],
+      },
+      {
+        pId: '01',
+        id: '0103',
+        title: '特殊农产品',
+        children: [
+          { pId: '0103', id: '010301', title: '花卉与苗木' },
+          { pId: '0103', id: '010302', title: '药材' },
+          { pId: '0103', id: '010303', title: '菌类' },
+        ],
+      },
+      {
+        pId: '01',
+        id: '0104',
+        title: '其他',
+        children: [{ pId: '0104', id: '010401', title: '饲料' }],
+      },
+    ],
+  },
+  {
+    id: '02',
+    title: '种子种苗',
+    children: [
+      {
+        pId: '02',
+        id: '0101',
+        title: '花卉种子种苗',
+        children: [
+          { pId: '0101', id: '010101', title: '草本花卉' },
+          { pId: '0101', id: '010102', title: '木本花卉' },
+          { pId: '0101', id: '010103', title: '野生花卉' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0102',
+        title: '蔬菜种子种苗',
+        children: [
+          { pId: '0102', id: '010201', title: '叶菜类' },
+          { pId: '0102', id: '010202', title: '根茎类' },
+          { pId: '0102', id: '010203', title: '果实类' },
+          { pId: '0102', id: '010204', title: '豆类' },
+          { pId: '0102', id: '010205', title: '瓜类' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0103',
+        title: '果树种苗',
+        children: [
+          { pId: '0103', id: '010301', title: '柑橘类' },
+          { pId: '0103', id: '010302', title: '仁果类' },
+          { pId: '0103', id: '010303', title: '核果类' },
+          { pId: '0103', id: '010304', title: '浆果类' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0104',
+        title: '药材种子与种苗',
+        children: [
+          { pId: '0104', id: '010401', title: '寒地龙药' },
+          { pId: '0104', id: '010402', title: '常见中药材' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0105',
+        title: '其他作物',
+        children: [
+          { pId: '0105', id: '010501', title: '牧草' },
+          { pId: '0105', id: '010502', title: '经济作物' },
+          { pId: '0105', id: '010503', title: '观赏树木' },
+        ],
+      },
+    ],
+  },
+]);
+
+let tableData = reactive([
+  { title: '西红柿', region: '耿马镇', buyer: '盛源农业', buyNum: 5000, time: '2025-04-02 12:25:36' },
+  { title: '白菜', region: '孟定镇', buyer: '星悦农业', buyNum: 6000, time: '2025-04-01 12:25:36' },
+  { title: '西蓝花', region: '孟勇镇', buyer: '盛源农业', buyNum: 7000, time: '2025-04-02 13:25:36' },
+  { title: '鸡蛋', region: '勐简乡', buyer: '上好佳农业', buyNum: 8000, time: '2025-04-02 12:25:36' },
+  // { title: '牛肉', region: '四排山乡', buyer: '尚嘉农业', buyNum: 5000, time: '2025-03-31 12:25:36' },
+  // { title: '氮肥', region: '大兴乡', buyer: '信誉农资', buyNum: 6000, time: '2025-04-02 12:25:36' },
+  // { title: '白菜种子', region: '贺派乡', buyer: '佳佳农业', buyNum: 5000, time: '2025-04-02 12:25:36' },
+  // { title: '西红柿种子', region: '勐撒镇', buyer: '佳佳农业', buyNum: 8000, time: '2025-04-02 12:25:36' },
+]);
+
+const handleClick = () => {
+  popupQuote.value && popupQuote.value.doShow();
+};
+
+onMounted(() => {
+  console.info('onMounted');
+});
+</script>
+<style lang="scss" scoped>
+.purchaser-detail-warp {
+  width: 100%;
+  .block-title {
+    font-size: 20px;
+    font-weight: 700;
+    text-align: left;
+    padding: 8px 0;
+  }
+  .purchaser-detail-top {
+    width: 100%;
+    margin-bottom: 16px;
+    background: $color-fff;
+    border-radius: 16px;
+    overflow: hidden;
+    padding: 10px;
+    .top-title {
+      width: 100%;
+      text-align: left;
+      .father-title,
+      .current-title {
+        display: inline-block;
+        vertical-align: middle;
+        font-weight: 700;
+      }
+      .father-title {
+        font-size: 18px;
+      }
+      .current-title {
+        font-size: 16px;
+        color: $color-main;
+        position: relative;
+        padding: 0 8px;
+        margin-left: 8px;
+      }
+      .current-title::before {
+        content: '.';
+
+        position: absolute;
+        left: 0;
+        top: 30%;
+        transform: translateY(-50%);
+      }
+    }
+
+    .purchaser-info {
+      margin: 16px 0;
+      .purchaser-info-l {
+        display: inline-flex;
+        justify-content: flex-start;
+        width: 100%;
+        text-align: left;
+        .img,
+        .content {
+          display: inline-block;
+          vertical-align: top;
+        }
+        .img {
+          width: 160px;
+          height: 160px;
+          border-radius: 8px;
+          overflow: hidden;
+
+          img {
+            width: 100%;
+            height: 100%;
+          }
+        }
+        .content {
+          width: calc(100% - 160px);
+          padding-left: 16px;
+          .title-warp {
+            width: 100%;
+            .txt,
+            .icon-warp {
+              vertical-align: top;
+            }
+            .txt {
+              width: calc(100% - 80px);
+              font-size: 24px;
+              font-weight: 500;
+            }
+            .icon-warp {
+              display: inline-block;
+
+              width: 80px;
+              .iconfont {
+                display: inline-block;
+                margin-top: 6px;
+                &.icon-level {
+                  font-size: 26px;
+                  color: $color-main;
+                }
+                &.icon-auth {
+                  font-size: 28px;
+                  color: $color-warning;
+                }
+              }
+            }
+          }
+          .is-auth {
+            width: 100%;
+            margin: 16px 0;
+            span {
+              background: $color-main-table-header;
+              border: 1px solid $color-main-border;
+              border-radius: 8px;
+              padding: 0 16px;
+              color: $color-main;
+              line-height: 32px;
+              height: 32px;
+              display: inline-block;
+              font-size: 16px;
+              font-weight: 400;
+            }
+          }
+          .settled-time {
+            width: 100%;
+            span {
+              font-size: 20px;
+              color: $color-999;
+              font-weight: 500;
+            }
+          }
+        }
+      }
+      .purchaser-info-r {
+        .addr {
+          text-align: left;
+          width: 100%;
+          font-size: 18px;
+          font-weight: 500;
+          color: $color-666;
+          .iconfont {
+            display: inline-block;
+            font-size: 26px;
+            vertical-align: middle;
+          }
+        }
+      }
+
+      .purchase-info-total {
+        .info-total-item {
+          display: inline-flex;
+          width: 100%;
+          justify-content: space-between;
+          margin: 8px 0;
+          .label,
+          .val {
+            display: -webkit-inline-box;
+            vertical-align: top;
+          }
+          .label {
+            color: $color-999;
+            font-size: 18px;
+            max-width: 180px;
+          }
+          .val {
+            font-size: 20px;
+            max-width: calc(100% - 180px);
+            color: $color-666;
+            text-align: right;
+          }
+        }
+      }
+
+      .contant-wrap {
+        width: 100%;
+        text-align: center;
+        margin-top: 16px;
+        .contant-btn {
+          background: $color-main;
+          padding: 0 16px;
+          line-height: 48px;
+          height: 48px;
+          border-radius: 16px;
+          color: $color-fff;
+          display: inline-block;
+          .iconfont,
+          span {
+            display: inline-block;
+            vertical-align: middle;
+          }
+          .iconfont {
+            font-size: 26px;
+          }
+          span {
+            padding-left: 8px;
+            font-size: 20px;
+          }
+        }
+      }
+    }
+  }
+
+  .hot-list-warp {
+    background: $color-fff;
+    padding: 16px;
+    border-radius: 16px;
+    margin: 16px 0;
+
+    ::v-deep() {
+      thead {
+        border-radius: 16px;
+        overflow: hidden;
+      }
+      thead th {
+        background: $color-main-table-header;
+        color: $color-999 !important;
+        border: none !important;
+        padding: 16px 0;
+      }
+      thead th:first-child {
+        border-top-left-radius: 16px;
+        border-bottom-left-radius: 16px;
+      }
+      thead th:last-child {
+        border-top-right-radius: 16px;
+        border-bottom-right-radius: 16px;
+      }
+      table {
+        margin-top: 16px !important;
+      }
+      tbody td {
+        border: none !important;
+      }
+      .el-table__inner-wrapper::before {
+        display: none !important;
+      }
+    }
+  }
+}
+</style>
--- a/sub-operation-service/src/views/ecommerce/supplier.vue
+++ b/sub-operation-service/src/views/ecommerce/supplier.vue
@ -0,0 +1,164 @@
+<template>
+  <div>
+    <common current-name="supplier">
+      <template #main>
+        <banner name="supplier" :imglist="bannerList"></banner>
+        <filtertop :list="treeList"></filtertop>
+        <div class="goods-list-warp">
+          <div class="goods-list">
+            <template v-for="(n, index) in 16" :key="index">
+              <div class="goods-item">
+                <goodsItem></goodsItem>
+              </div>
+            </template>
+          </div>
+        </div>
+      </template>
+    </common>
+  </div>
+</template>
+<script setup name="ecommerce">
+import common from './components/common.vue';
+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',
+    title: '农产品',
+    children: [
+      {
+        pId: '01',
+        id: '0101',
+        title: '植物性农产品',
+        children: [
+          { pId: '0101', id: '010101', title: '谷物' },
+          { pId: '0101', id: '010102', title: '蔬菜' },
+          { pId: '0101', id: '010103', title: '水果' },
+          { pId: '0101', id: '010104', title: '坚果与油料作物' },
+          { pId: '0101', id: '010105', title: '糖料作物' },
+          { pId: '0101', id: '010106', title: '纤维作物' },
+          { pId: '0101', id: '010107', title: '茶叶' },
+          { pId: '0101', id: '010108', title: '咖啡' },
+          { pId: '0101', id: '010109', title: '香料' },
+        ],
+      },
+      {
+        pId: '01',
+        id: '0102',
+        title: '动物性农产品',
+        children: [
+          { pId: '0102', id: '010201', title: '肉类' },
+          { pId: '0102', id: '010202', title: '奶制品' },
+          { pId: '0102', id: '010203', title: '蛋类' },
+          { pId: '0102', id: '010204', title: '蜂蜜' },
+          { pId: '0102', id: '010205', title: '水产品' },
+        ],
+      },
+      {
+        pId: '01',
+        id: '0103',
+        title: '特殊农产品',
+        children: [
+          { pId: '0103', id: '010301', title: '花卉与苗木' },
+          { pId: '0103', id: '010302', title: '药材' },
+          { pId: '0103', id: '010303', title: '菌类' },
+        ],
+      },
+      {
+        pId: '01',
+        id: '0104',
+        title: '其他',
+        children: [{ pId: '0104', id: '010401', title: '饲料' }],
+      },
+    ],
+  },
+  {
+    id: '02',
+    title: '种子种苗',
+    children: [
+      {
+        pId: '02',
+        id: '0101',
+        title: '花卉种子种苗',
+        children: [
+          { pId: '0101', id: '010101', title: '草本花卉' },
+          { pId: '0101', id: '010102', title: '木本花卉' },
+          { pId: '0101', id: '010103', title: '野生花卉' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0102',
+        title: '蔬菜种子种苗',
+        children: [
+          { pId: '0102', id: '010201', title: '叶菜类' },
+          { pId: '0102', id: '010202', title: '根茎类' },
+          { pId: '0102', id: '010203', title: '果实类' },
+          { pId: '0102', id: '010204', title: '豆类' },
+          { pId: '0102', id: '010205', title: '瓜类' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0103',
+        title: '果树种苗',
+        children: [
+          { pId: '0103', id: '010301', title: '柑橘类' },
+          { pId: '0103', id: '010302', title: '仁果类' },
+          { pId: '0103', id: '010303', title: '核果类' },
+          { pId: '0103', id: '010304', title: '浆果类' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0104',
+        title: '药材种子与种苗',
+        children: [
+          { pId: '0104', id: '010401', title: '寒地龙药' },
+          { pId: '0104', id: '010402', title: '常见中药材' },
+        ],
+      },
+      {
+        pId: '02',
+        id: '0105',
+        title: '其他作物',
+        children: [
+          { pId: '0105', id: '010501', title: '牧草' },
+          { pId: '0105', id: '010502', title: '经济作物' },
+          { pId: '0105', id: '010503', title: '观赏树木' },
+        ],
+      },
+    ],
+  },
+]);
+
+let bannerList = reactive(['images/ecommerce/' + 'banner1.png', 'images/ecommerce/' + 'banner1.png']);
+</script>
+<style lang="scss" scoped>
+.goods-list-warp {
+  width: 100%;
+  margin-top: 16px;
+  .goods-list {
+    width: 100%;
+    display: inline-flex;
+    flex-wrap: wrap;
+    justify-content: space-around;
+    gap: 10px;
+    .goods-item {
+      display: inline-block;
+      width: calc((100% - 50px) / 5);
+      background: $color-fff;
+      border-radius: 16px;
+      overflow: hidden;
+      margin-bottom: 16px;
+    }
+  }
+  /* 添加伪元素占位 */
+  .goods-list::after {
+    content: '';
+    flex: auto;
+  }
+}
+</style>
--- a/sub-operation-service/vite.config.js
+++ b/sub-operation-service/vite.config.js
@ -25,7 +25,7 @@ const useDevMode = true;
 export default defineConfig(({ command, mode }) => {
  const { VITE_PORT, VITE_APP_NAME, VITE_APP_BASE_API, VITE_APP_BASE_URL, VITE_APP_UPLOAD_API, VITE_APP_UPLOAD_URL } = loadEnv(mode, process.cwd());
  const config = {
-    base: './',
+    base: '/sub-operation-service/',
    build: {
      target: 'ESNext',
      outDir: 'dist',