9.29代码提交

代码提交
2024-09-29 21:09:21 +08:00 · 2024-09-06 08:59:02 +08:00
29 changed files with 897 additions and 591 deletions
--- a/package-lock.json
+++ b/package-lock.json
@ -13,6 +13,7 @@
        "echarts": "^5.5.1",
        "element-plus": "^2.3.14",
        "less": "^4.2.0",
+        "moment": "^2.30.1",
        "three": "^0.164.1",
        "video.js": "^7.21.6",
        "vue": "^3.3.4",
@ -1902,6 +1903,14 @@
        "dom-walk": "^0.1.0"
      }
    },
+    "node_modules/moment": {
+      "version": "2.30.1",
+      "resolved": "https://registry.npmmirror.com/moment/-/moment-2.30.1.tgz",
+      "integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==",
+      "engines": {
+        "node": "*"
+      }
+    },
    "node_modules/mpd-parser": {
      "version": "0.22.1",
      "resolved": "https://registry.npmmirror.com/mpd-parser/-/mpd-parser-0.22.1.tgz",
@ -4392,6 +4401,11 @@
        "dom-walk": "^0.1.0"
      }
    },
+    "moment": {
+      "version": "2.30.1",
+      "resolved": "https://registry.npmmirror.com/moment/-/moment-2.30.1.tgz",
+      "integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how=="
+    },
    "mpd-parser": {
      "version": "0.22.1",
      "resolved": "https://registry.npmmirror.com/mpd-parser/-/mpd-parser-0.22.1.tgz",
--- a/package.json
+++ b/package.json
@ -14,6 +14,7 @@
    "echarts": "^5.5.1",
    "element-plus": "^2.3.14",
    "less": "^4.2.0",
+    "moment": "^2.30.1",
    "three": "^0.164.1",
    "video.js": "^7.21.6",
    "vue": "^3.3.4",
--- a/public/1.mp4
+++ b/public/1.mp4
--- a/public/1.pdf
+++ b/public/1.pdf
@ -0,0 +1,21 @@
+运行代理服务器
+
+1） 修改\nginx\conf 路径下的 nginx.conf 文件，把 server 节点下的 listen 和 server_name 中
+     的 IP 和端口，直接修改成运行 nginx 所在 PC 或者服务器的网卡的 IP 和端口，之后保存
+     文件。
+     (截图示例中部署 nginx 代理服务器所在的 PC 的 IP 为 10.17.35.14，81 为没有被占用的
+     端口，第三方对接时需要修改成实际环境中的 IP 和端口)。
+
+2）运行 nginx-1.10.2 里面的 start.bat 开启代理服务器。
+运行 Demo 页面
+
+浏览器地址栏输入：http://ip:port/cn/demo.html
+（这边的 IP 和 PORT 为第一步骤中，nginx.conf 里配置的 IP 和 PORT，示例中使用的是
+10.17.35.14 和 81，所以地址栏里输入：http://10.17.35.14:81/cn/demo.html）
+
+页面中，登录设备需要输入海康硬件设备的 IP 地址、端口、用户名和密码，其中端口为设
+备的 HTTP 端口（默认内网的 80）
+停止运行代理服务器
+
+运行 nginx-1.10.2 里面的 stop.bat 可以停止运行代理服务器。
+
--- a/src/api/home.js
+++ b/src/api/home.js
@ -55,4 +55,40 @@ export function getLocInfo(params){
        method:'get',
        params
    })
+}
+// 库存消息
+export function getInventoryMessage(params){
+    return request({
+        url:'/api/inventory/GetInventoryMessage',
+        method:'get',
+        params
+    })
+}
+
+// 即时库存信息情况
+export function getStoreMsg(params){
+    return request({
+        url:'/api/inventory/GetInventoryInfo',
+        method:'get',
+        params
+    })
+}
+
+// 空箱 实箱 批次数据获取
+export function getBrandBox(params){
+    return request({
+        url:'/api/location/GetLocInfo',
+        method:'get',
+        params
+    })
+}
+
+// 获取各品牌库存情况表格数据接口
+export function getBrandTable(params){
+    return request({
+        url:'/api/location/GetConLocData',
+        method:'get',
+        params
+    })
+
 }
--- a/src/api/operation/index.js
+++ b/src/api/operation/index.js
@ -0,0 +1,9 @@
+import request from '@/utils/request'
+// 设备基础信息页面
+export function downloadPdf(url){
+    return request({
+        url:url,
+        method:'get',
+        responseType: 'blob',
+    })
+}
--- a/src/api/productionInformation/index.js
+++ b/src/api/productionInformation/index.js
@ -0,0 +1,79 @@
+
+import request from '@/utils/request'
+// 入库信息
+// 获取各品牌的占比
+export function getBrandPercent(params){
+    return request({
+        url:'/api/inOrder/GetBrandPercent',
+        method:'get',
+        params
+    })
+}
+// 获取仓库细节
+export function getRepoDetails(params){
+    return request({
+        url:'/api/inOrder/GetRepoDetails',
+        method:'get',
+        params
+    })
+}
+// 获取所有的品牌名称
+export function getBrandNames(params){
+    return request({
+        url:'/api/inOrder/GetBrandNames',
+        method:'get',
+        params
+    })
+}
+// 获取某品牌某年某月的情况
+export function getBrandTimeCount(params){
+    return request({
+        url:'/api/inOrder/GetBrandTimeCount',
+        method:'get',
+        params
+    })
+}
+
+// 出库信息
+// 获取各品牌的占比
+export function getOutBrandPercent(params){
+    return request({
+        url:'/api/outOrder/GetBrandPercent',
+        method:'get',
+        params
+    })
+}
+// 获取仓库细节
+export function getOutRepoDetails(params){
+    return request({
+        url:'/api/outOrder/GetRepoDetails',
+        method:'get',
+        params
+    })
+}
+// 获取所有的品牌名称
+export function getOutBrandNames(params){
+    return request({
+        url:'/api/outOrder/GetBrandNames',
+        method:'get',
+        params
+    })
+}
+// 获取某品牌某年某月的情况
+export function getOutBrandTimeCount(params){
+    return request({
+        url:'/api/outOrder/GetBrandTimeCount',
+        method:'get',
+        params
+    })
+}
+
+
+// 装箱站入库统计
+export function getWeightBetweenTime(params){
+    return request({
+        url:'/api/inOrder/GetWeightBetweenTime',
+        method:'get',
+        params
+    })
+}
--- a/src/assets/images/dialog/1.png
+++ b/src/assets/images/dialog/1.png
--- a/src/assets/images/dialog/chassis.png
+++ b/src/assets/images/dialog/chassis.png
--- a/src/assets/images/dialog/devData/dev5.png
+++ b/src/assets/images/dialog/devData/dev5.png
--- a/src/assets/images/dialog/devData/dev5Select.png
+++ b/src/assets/images/dialog/devData/dev5Select.png
--- a/src/assets/images/dialog/pro-bg.png
+++ b/src/assets/images/dialog/pro-bg.png
--- a/src/components/echarts/pie.vue
+++ b/src/components/echarts/pie.vue
@ -65,7 +65,7 @@ function initChart() {
      {
        type: "image",
        style: {
-          image: getPath.fontBg, // 图片地址
+          image: props.dataMap.name?getPath.fontBg:'', // 图片地址
          width: 52,
          height: 24,
        },
@ -80,26 +80,26 @@ function initChart() {
        top: "69%",
        style: {
          fill: "#fff",
-          text: `${props.dataMap.name}`,
-          fontSize: `14`,
+          text: `${props.dataMap.name?props.dataMap.name:''}`,
+          fontSize: `0.8rem`,
        },
      },
      {
        type: "text",
        z: 100,
        left: "center",
-        top: props.dataMap.kg?"81%":"84%",
+        top: '78%',
        style: {
          fill: "#fff",
-          text: `${props.dataMap.type}`,
-          fontSize: `12`,
+          text: `${props.dataMap.type?props.dataMap.type:''}`,
+          fontSize: `0.9rem`,
        },
      },
      {
        type: "text",
        z: 100,
        left: "center",
-        top: "91%",
+        top: "85%",
        style: {
          fill: "rgba(255, 206, 84, 1)",
          text: `${props.dataMap.kg?props.dataMap.kg:''}`,
--- a/src/components/equipmentManagement/components/health/index.vue
+++ b/src/components/equipmentManagement/components/health/index.vue
@ -170,12 +170,12 @@ function getTableList() {
  if (props.title === "备件更换统计") {
    getPageSparePart(params).then((res) => {
      tableList.value = res.result.data;
-      total.value = res.result.total;
+      total.value = res.result.totalNum;
    });
  } else if (props.title === "故障分析") {
    getPageFaultAnalysisInfo(params).then((res) => {
      tableList.value = res.result.data;
-      total.value = res.result.total;
+      total.value = res.result.totalNum;
    });
  } else if (props.title === "维修统计") {
    params.isMaintain = isMaintain.value;
--- a/src/components/equipmentManagement/deviceInfo.vue
+++ b/src/components/equipmentManagement/deviceInfo.vue
@ -135,7 +135,7 @@ const tableList = ref([]);
 const deviceListParams = reactive({
  name: "",
  code: "",
-  size:8,
+  size:10,
  index:1
 });
 const total = ref(0)
--- a/src/components/equipmentManagement/equipmentAnalysis.vue
+++ b/src/components/equipmentManagement/equipmentAnalysis.vue
@ -325,7 +325,7 @@ function close() {
 const deviceListParams = reactive({
  deviceName: "",
  deviceCode: "",
-  size:8,
+  size:10,
  index:1
 });
 const total = ref(0)
--- a/src/components/equipmentManagement/maintenance.vue
+++ b/src/components/equipmentManagement/maintenance.vue
@ -497,7 +497,7 @@ function completedMaintenancePlan() {

 const planParams = reactive({
  pageIndex: 1,
-  pageSize: 3,
+  pageSize: 5,
  facName: "",
 });
 const total = ref(0);
--- a/src/components/operation/explosion.vue
+++ b/src/components/operation/explosion.vue
@ -55,8 +55,9 @@ const closeShow= ref(false);
 const emit = defineEmits(['closeExplosion'])
 const changeName = ref("穿梭车");
 function toggleHandle(index,item) {
-    console.log("item",item)
-    changeName.value = item
+  openShow.value = false
+  closeShow.value = false
+  changeName.value = item
  liIndex.value = index;
  if(item==="穿梭车"){
    document.getElementById("unityModule").contentWindow.changeModel('小车');
--- a/src/components/operation/guidance.vue
+++ b/src/components/operation/guidance.vue
@ -7,29 +7,26 @@
        <div class="box-btn" @click="close"></div>
      </div>
      <div class="box-content">
-          <div class="box-content-left-title">
-            <span>文件列表</span>
-          </div>
+        <div class="box-content-left-title">
+          <span>文件列表</span>
          <!-- 选择框 -->
-          <div class="box-content-right-select">
-            <el-select
-              @clear="clearHandle"
-              @change="
-                GetPageGuideDocsData(params1.code);
-              "
-              clearable
-              v-model="params1.code"
-              placeholder="请选择"
-            >
-              <el-option
-                v-for="item in allName"
-                :key="item.showName"
-                :label="item.showName"
-                :value="item.realCode"
-              />
-            </el-select>
-         
-          </div>
+
+          <el-select
+            @clear="clearHandle"
+            @change="GetPageGuideDocsData(params1.code)"
+            clearable
+            v-model="params1.code"
+            placeholder="请选择"
+          >
+            <el-option
+              v-for="item in allName"
+              :key="item.showName"
+              :label="item.showName"
+              :value="item.realCode"
+            />
+          </el-select>
+        </div>
+
        <ul>
          <li v-for="(item, index) in fileList" :key="'file' + index">
            <span>
@ -38,242 +35,89 @@
            <span>
              <!-- <span class="preview">预览</span>
              <span class="download">下载</span> -->
-              <el-button
-                  type="text"
-                  class="preview"
-                  @click="previewFile(item.filePath)"
-                  >预览</el-button
-                >
-                <el-button
-                  type="text"
-                   class="download"
-                  @click="down(item.filePath)"
-                  >下载</el-button
-                >
+              <el-button type="text" class="preview" @click="previewFile(item)"
+                >预览</el-button
+              >
+              <el-button type="text" class="download" @click="download(item)"
+                >下载</el-button
+              >
            </span>
          </li>
        </ul>
+        <div style="float: right">
+            <el-pagination
+              v-model:current-page="params1.pageIndex"
+              :page-size="params1.pageSize"
+              :size="params1.pageSize"
+              :pager-count='5'
+              layout="total, prev, pager, next"
+              :total="total"
+              prev-text="上一页"
+              next-text="下一页"
+              @current-change="GetPageGuideDocsData"
+            >
+            </el-pagination>
+          </div>
      </div>
    </div>
-    <!-- <el-dialog
-                  :visible.sync="dialogVisible4"
-                  title="PDF预览"
-                  width="70%"
-                  append-to-body
-                  top
-                >
-                  <div id="container">
-                    <div class="right-btn">
-                      <div @click="changePage('first')" class="turn">首页</div>
-                      <div style="width: 100%">
-                        <el-button
-                          plain
-                          icon="el-icon-plus"
-                          circle
-                          @click="zoomPDF('plus')"
-                        ></el-button>
-                        <el-button
-                          plain
-                          icon="el-icon-minus"
-                          circle
-                          @click="zoomPDF('minus')"
-                        ></el-button>
-                        <el-button
-                          plain
-                          icon="el-icon-refresh-right"
-                          circle
-                          @click="clock()"
-                        ></el-button>
-                        <el-button
-                          plain
-                          icon="el-icon-refresh-left"
-                          circle
-                          @click="counterClock()"
-                        ></el-button>
-                      </div>
-                      <div style="width: 100%">
-                        <el-button size="mini" @click="changePage(0)" round
-                          >上一页</el-button
-                        >
-                        <el-button size="mini" @click="changePage(1)" round
-                          >下一页</el-button
-                        >
-                      </div>
-
-                    
-                      <div class="pageNum">
-                        <input
-                          v-model.number="currentPage"
-                          type="number"
-                          class="inputNumber"
-                          @input="inputEvent()"
-                        />
-                        / {{ pageCount }}
-                      </div>
-
-          
-
-                      <div @click="changePage('last')" class="turn">尾页</div>
-                    </div>
-                    <div
-                      class="pdfArea"
-                      :style="{
-                        width: pdfWidth + '%',
-                        marginLeft: pdfLeft + '%',
-                        marginTop: pdfTop + '%',
-                        marginBottom: pdfBottom + '%',
-                      }"
-                      style="transition: all 0.3s"
-                    >
-                      <pdf
-                        :src="src"
-                        ref="pdf"
-                        v-show="loadedRatio === 1"
-                        :page="currentPage"
-                        @loaded="loadPdf"
-                        @num-pages="pageCount = $event"
-                        @progress="loadedRatio = $event"
-                        @page-loaded="currentPage = $event"
-                        @link-clicked="currentPage = $event"
-                        style="display: inline-block; width: 100%"
-                        id="pdfID"
-                        :rotate="pageRotate"
-                      ></pdf>
-                      <div class="progress" v-if="loadedRatio != 1">
-                        <el-progress
-                          type="circle"
-                          :width="70"
-                          color="#53a7ff"
-                          :percentage="
-                            Math.floor(loadedRatio * 100)
-                              ? Math.floor(loadedRatio * 100)
-                              : 0
-                          "
-                        ></el-progress>
-                        <br />
-           
-                        <span>{{ remindShow }}</span>
-                      </div>
-                    </div>
-                  </div>
-                </el-dialog> -->
  </div>
 </template>
 <script setup>
 import { ref } from "vue";
 import {
-    getDocsIdentity,GetPageGuideDocs
+  getDocsIdentity,
+  GetPageGuideDocs,
+  
 } from "@/api/equipmentManagement/index";
-import { onMounted} from "vue";
+import {downloadPdf} from "@/api/operation/index"
+import { onMounted } from "vue";
 const emit = defineEmits(["closeGuidance"]);
 const allName = ref([]);
 const fileList = ref([]);
 //获取指导文件下拉数据
-function getDocsIdentityData(){
-  
-    getDocsIdentity().then(res=>{
-        allName.value = res.result
-  })
+function getDocsIdentityData() {
+  getDocsIdentity().then((res) => {
+    allName.value = res.result;
+  });
 }
-const equipmentCode = ref('') 
+const equipmentCode = ref("");
 const params1 = {
-    code:'',
-  pageIndex:1,
-  pageSize:4
+  code: "",
+  pageIndex: 1,
+  pageSize: 10,
+};
+
+//下载
+async function download(item) {
+  const response = await downloadPdf(item.filePath);
+  const url = window.URL.createObjectURL(new Blob([response]));
+  const link = document.createElement("a");
+  link.href = url;
+  link.setAttribute("download", "file.pdf");
+  document.body.appendChild(link);
+  link.click();
 }
-function zoomPDF(method) {
-      const _this = this;
-      if (method === "plus") {
-        if (pdfWidth === 150) {
-        //   $message({
-        //     showClose: true,
-        //     message: "已放大至：100%",
-        //     type: "info",
-        //   });
-        } else {
-          pdfWidth = pdfWidth + 10;
-          pdfLeft = (100 - pdfWidth) / 2;
-        }
-      }
-      if (method === "minus") {
-        if (pdfWidth === 10) {
-        //   $message({
-        //     showClose: true,
-        //     message: "已缩小至：10%，不可再缩小。",
-        //     type: "info",
-        //   });
-        } else {
-          pdfWidth = pdfWidth - 10;
-          pdfLeft = (100 - pdfWidth) / 2;
-        }
-      }
-    }
-    // 顺时针
-    function clock() {
-      pageRotate += 90;
-    }
-    // 逆时针
-    function  counterClock() {
-      pageRotate -= 90;
-    }
-    function  down(url) {
-      window.open(url);
-    }
-    // 翻页
-    function changePage(val) {
-      if (val === 0 && currentPage > 1) {
-        currentPage--;
-      }
-      if (val === 1 && currentPage < pageCount) {
-        currentPage++;
-      } else if (val === "first") {
-        currentPage = 1;
-        toTop();
-      } else if (val === "last" && currentPage < pageCount) {
-        currentPage = pageCount;
-        toTop();
-      }
-    }
-    // pdf加载时
-    function loadPdf() {
-      currentPage = 1; // 加载的时候先加载第一页
-      loadedRatio = 1;
-    }
-    // 输入页码时校验
-    function inputEvent() {
-      if (currentPage > pageCount) {
-        // 1. 大于max
-        currentPage = pageCount;
-      } else if (currentPage < 1) {
-        // 2. 小于min
-        currentPage = 1;
-      }
-    }
-    function toTop() {
-      document.getElementById("container").scrollTop = 0;
-    }
+function previewFile(item) {
+  window.open(import.meta.env.VITE_APP_BASE_API + item.filePath);
+}
+
+
+
+const total = ref(0)
 // 获取指导文件数据
-function GetPageGuideDocsData(item){
-    // console.log("item",item)
-    // if(item){
-    //     // params1.code = item.showName
-    // }
-    GetPageGuideDocs(params1).then(res=>{
-        fileList.value = res.result.data
-        for (var i = 0; i < fileList.value.length; i++) {
-            fileList.value[i].filePath =
-            `http://192.168.55.13:5002` + fileList.value[i].filePath;
-        }
-   
-  })
+function GetPageGuideDocsData(item) {
+  GetPageGuideDocs(params1).then((res) => {
+    total.value = res.result.totalNum
+    fileList.value = res.result.data;
+  });
 }
 function close() {
  emit("closeGuidance", -1);
 }
 onMounted(() => {
-    getDocsIdentityData()
-    GetPageGuideDocsData()
-//   getPageDamageEquipList()
+  getDocsIdentityData();
+  GetPageGuideDocsData();
+  //   getPageDamageEquipList()
 });
 </script>
 <style scoped lang="scss">
@ -328,8 +172,8 @@ onMounted(() => {
    //   border-radius: 8px; /* 滑块的圆角 */
  }
  &-content {
-    overflow: scroll;
-    overflow-x: hidden;
+    // overflow: scroll;
+    // overflow-x: hidden;
    height: vh(636 - 60);
    width: vw(1088);
    padding: vh(20) vw(20);
@ -339,6 +183,8 @@ onMounted(() => {
      box-sizing: border-box;
      height: 100%;
      border: 1px solid;
+      display: flex;
+      justify-content: space-between;
      border-image: linear-gradient(
          180deg,
          rgba(144, 218, 255, 0.5),
@ -346,14 +192,18 @@ onMounted(() => {
        )
        1 1;
      &-title {
-        width: 65%;
+        width: 100%;
        height: vh(36);
        padding-left: vw(32);
        line-height: vh(36);
        box-sizing: border-box;
        background-size: 100% 100%;
-        background-image: url("@/assets/images/dialog/deviceInfo-title1.png");
+        background-image: url("@/assets/images/dialog/deviceInfo-title2.png");
        display: inline-block;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: vh(12);
        span {
          font-size: 1.375rem;
          font-family: "pangmen";
@ -371,8 +221,12 @@ onMounted(() => {
        height: vh(440);
      }
    }
+    ul::-webkit-scrollbar{
+      display: none;
+    }
    ul {
-      
+      height: vh(460);
+      overflow-y: scroll;
      li {
        padding: 0 vw(40);
        display: block;
@ -396,4 +250,8 @@ onMounted(() => {
    }
  }
 }
+:deep(.el-input) {
+  width: vw(160);
+  height: vh(28);
+}
 </style>
--- a/src/components/operation/knowledgeBase.vue
+++ b/src/components/operation/knowledgeBase.vue
@ -13,9 +13,7 @@
            </el-select> -->
            <el-select
              @clear="clearHandle"
-              @change="
-                GetPageGuideDocsData(params1.code);
-              "
+              @change="getPageGuideVideosData(params1.code)"
              clearable
              v-model="params1.code"
              placeholder="请选择"
@ -30,7 +28,7 @@
          </div>
          <div class="box-content-table">
            <el-table
-             :row-class-name="getRowClassName"
+              :row-class-name="getRowClassName"
              :data="tableList"
              style="width: 100%"
              @row-click="rowClick"
@ -39,103 +37,127 @@
              <el-table-column prop="deviceName" label="名称" />
            </el-table>
          </div>
+          <div style="float: right">
+            <el-pagination
+              v-model:current-page="params1.pageIndex"
+              :page-size="params1.pageSize"
+              :size="params1.pageSize"
+              :pager-count='5'
+              layout="total, prev, pager, next"
+              :total="total"
+              prev-text="上一页"
+              next-text="下一页"
+              @current-change="getPageGuideVideosData"
+            >
+            </el-pagination>
+          </div>
        </div>
        <div class="box-content-right">
-      <div class="bg">
-            <video-player
-              class="video-player vjs-custom-skin"
-               style="height: 500px; width: 500px"
-              ref="VideoPlayer1"
-              :playsinline="true"
-              :options="playerOptions"
-            >
-            </video-player>
-        </div>
-         
+          <div class="bg">
+            <videoPlay
+              width="100%"
+              height="100%"
+              title="视频播放"
+              :src="options.src"
+              :poster="options.poster"
+              @play="onPlay"
+              @pause="onPause"
+              @timeupdate="onTimeupdate"
+              @canplay="onCanplay"
+            />
+          </div>
        </div>
      </div>
    </div>
  </div>
 </template>
-<script setup name="knowledgeBase">
-import VideoPlayer from 'vue-video-player';
-import 'video.js/dist/video-js.css';
-import 'vue-video-player/src/custom-theme.css';
-import { ref } from "vue";
+<script setup>
+import { ref, reactive } from "vue";
 import {
-    GetVideosIdentity,GetPageGuideVideos
+  GetVideosIdentity,
+  GetPageGuideVideos,
 } from "@/api/equipmentManagement/index";
-
-import { onMounted} from "vue";
-const value = ref('')
+import { videoPlay } from "vue3-video-play/lib/index";
+import "vue3-video-play/dist/style.css";
+import { onMounted } from "vue";
+const value = ref("");
 const emit = defineEmits(["closeKnowledgeBase"]);
 function close() {
  emit("closeKnowledgeBase", -1);
 }
-const VideoPlayer1 = ref()
-const tableList = ref([
-
-])
+const VideoPlayer1 = ref();
+const tableList = ref([]);
 // const videoUrl = ref("")
-// 视频控制设置
-const playerOptions=  {
-        height: 500,
-        width: 500,
-        playbackRates: [0.5, 1.0, 1.5, 2, 3], // 可选的播放速度
-        autoplay: false, // 如果为true,浏览器准备好时开始回放。
-        muted: false, // 默认情况下将会消除任何音频。
-        loop: false, // 是否视频一结束就重新开始。
-        preload: "auto", // 建议浏览器在<video>加载元素后是否应该开始下载视频数据。auto浏览器选择最佳行为,立即开始加载视频（如果浏览器支持）
-        language: "zh-CN",
-        aspectRatio: "16:9", // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
-        fluid: true, // 当true时，Video.js player将拥有流体大小。换句话说，它将按比例缩放以适应其容器。
-        sources: [
-          {
-            type: "video/mp4", // 类型
-            src: "", // url地址
-          },
-        ],
-        poster: "", // 封面地址
-        notSupportedMessage: "此视频暂无法播放，请稍后再试", // 允许覆盖Video.js无法播放媒体源时显示的默认信息。
-        controlBar: {
-          timeDivider: true, // 当前时间和持续时间的分隔符
-          durationDisplay: true, // 显示持续时间
-          remainingTimeDisplay: true, // 是否显示剩余时间功能
-          fullscreenToggle: true, // 是否显示全屏按钮
-        },
-      }
+const options = reactive({
+  width: document.documentElement.clientWidth,
+  autoplay: true,
+  playbackRates: [0.7, 1.0, 1.5, 2.0], // 播放速度
+  src: "", //视频源
+  poster:
+    "https://pics0.baidu.com/feed/d833c895d143ad4b28bdb4ea587008a1a50f068e.jpeg?token=ecd7d8fd2fd5c08092bfd91627691f7d", //封面
+});
+const onPlay = (ev) => {
+  console.log("播放");
+};
+const onPause = (ev) => {
+  console.log(ev, "暂停");
+};
+
+const onTimeupdate = (ev) => {
+  // console.log(ev, "时间更新");
+};
+const onCanplay = (ev) => {
+  // console.log(ev, "可以播放");
+};
+
 const allName = ref([]);
 //获取知识库下拉数据
-function getVideosIdentityData(){
-  
-    GetVideosIdentity().then(res=>{
-      allName.value = res.result
-})
+function getVideosIdentityData() {
+  GetVideosIdentity().then((res) => {
+    allName.value = res.result;
+  });
 }
+const tableRowIndex = ref(0);
+const getRowClassName = ({ row, rowIndex }) => {
+  row.index = rowIndex;
+  if (tableRowIndex.value == rowIndex) {
+    return "highlight-row";
+  }
+  return "";
+};
 function rowClick(row) {
-    console.log("rowClick",row)
-    //  playerOptions.sources[0].src =
-    //     // "http://220.163.114.158:5001/" + row.path.substring(1);
-    //     "http://192.168.55.13:5002/" + row.path.substring(1);
-    }
-const equipmentCode = ref('') 
-const params1 = {
-  code:'',
-pageIndex:1,
-pageSize:4
+  tableRowIndex.value = row.index;
+  options.src = import.meta.env.VITE_APP_BASE_API + tableList.value[row.index].videoPath
+  console.log(options.src);
 }
+const equipmentCode = ref("");
+const params1 = {
+  code: "",
+  pageIndex: 1,
+  pageSize: 10,
+};
+// total 总数
+const total = ref(0)
 // 获取知识库数据
-function getPageGuideVideosData(item){
-  GetPageGuideVideos(params1).then(res=>{
-    tableList.value = res.result.data
-})
+function getPageGuideVideosData(item) {
+  GetPageGuideVideos(params1).then((res) => {
+    tableList.value = res.result.data;
+    total.value = res.result.totalNum
+    options.src = import.meta.env.VITE_APP_BASE_API + tableList.value[0].videoPath
+  });
 }
 onMounted(() => {
-    getVideosIdentityData()
-    getPageGuideVideosData()
+  getVideosIdentityData();
+  getPageGuideVideosData();
 });
 </script>
 <style scoped lang="scss">
+:deep(.el-pagination__total){
+  left: vw(40) !important;
+}
+:deep(.highlight-row) {
+  background-color: rgba(174, 211, 255, 0.2) !important;
+}
 .box {
  width: vw(1380);
  height: vh(716);
@ -173,8 +195,11 @@ onMounted(() => {
    justify-content: space-between;
    padding: vh(20) vw(20);
    box-sizing: border-box;
-    &-select{
-        margin-bottom: vh(16);
+    &-table{
+      height: vh(500);
+    }
+    &-select {
+      margin-bottom: vh(16);
    }
    &-left {
      width: vw(340);
@ -182,7 +207,7 @@ onMounted(() => {
      background-image: url("@/assets/images/dialog/knowledgeBase-left.png");
      padding: vh(20) vw(20);
      box-sizing: border-box;
-      :deep(.el-input){
+      :deep(.el-input) {
        width: vw(300);
        height: vh(36);
      }
@ -193,12 +218,12 @@ onMounted(() => {
      background-size: 100% 100%;
      background-image: url("@/assets/images/dialog/knowledgeBase-right.png");
      .video-js.vjs-fluid,
-          .video-js.vjs-16-9,
-          .video-js.vjs-4-3 {
-            height: 100%;
-            width: 100%;
-            z-index: 9999;
-          }
+      .video-js.vjs-16-9,
+      .video-js.vjs-4-3 {
+        height: 100%;
+        width: 100%;
+        z-index: 9999;
+      }
      .bg {
        width: 100%;
        height: 100%;
--- a/src/components/productionInformation/inOutMachine.vue
+++ b/src/components/productionInformation/inOutMachine.vue
@ -9,6 +9,18 @@
      <div class="box-content">
        <div class="box-content-title">
          <span> {{ props.title }} </span>
+          <div>
+            <span style="font-size: 0.875rem; margin-right: 0.8rem"
+              >时间筛选</span
+            >
+            <el-date-picker
+              v-model="date"
+              type="daterange"
+              @change="getCountData"
+              start-placeholder="请选择开始时间"
+              end-placeholder="请选择结束时间"
+            />
+          </div>
        </div>
        <div style="display: flex">
          <div class="box-content-plate1">
@ -30,7 +42,6 @@
          </div>
          <div class="box-content-plate2">
            <div id="chart1"></div>
-            <div id="chart2"></div>
          </div>
        </div>
      </div>
@ -38,8 +49,10 @@
  </div>
 </template>
 <script setup>
-import { ref, defineProps, onMounted ,nextTick} from "vue";
+import { ref, defineProps, onMounted, nextTick, reactive } from "vue";
 import * as echarts from "echarts";
+import moment from "moment";
+import { getWeightBetweenTime } from "@/api/productionInformation";
 const emit = defineEmits(["closeMachine"]);
 const deviceList = ref([
  {
@ -48,20 +61,34 @@ const deviceList = ref([
    total: "222699.28",
    avgPro: "27897.41",
  },
-  {
-    name: "2号翻箱机",
-    total: "222699.28",
-    avgPro: "27897.41",
-    id: 2,
-  },
+  // {
+  //   name: "2号翻箱机",
+  //   total: "222699.28",
+  //   avgPro: "27897.41",
+  //   id: 2,
+  // },
 ]);
+// 时间区间
+const date = ref([
+  moment().subtract(1, "days").format("YYYY-MM-DD"),
+  moment().format("YYYY-MM-DD"),
+]);
+
 const props = defineProps({
  title: String,
 });
 function close() {
  emit("closeMachine", -1);
 }
-function drawChart1() {
+
+// 头部的轮播图
+function drawChart1(res) {
+  let xData = [];
+  let yData = [];
+  for (let key in res) {
+    xData.push(key.split(" ")[0]);
+    yData.push(res[key]);
+  }
  let dom = document.querySelector("#chart1");
  dom.removeAttribute("_echarts_instance_");
  let myChart;
@ -70,13 +97,29 @@ function drawChart1() {
    tooltip: {},
    grid: {
      top: "15%",
-      left: "1%",
-      right: "1%",
+      left: "3%",
+      right: "5%",
      bottom: "0%",
      containLabel: true,
    },
+    // dataZoom: [
+    //   {
+    //     type: "slider", // 设置为滑动条型式
+    //     show: true, // 显示dataZoom组件
+    //     start: 0, // 默认显示的起始位置为0
+    //     end: 49, // 默认显示的结束位置为100
+    //     handleSize: 8, // 滑动条的手柄大小
+    //     handleStyle: {
+    //       color: "#DCE2E8", // 滑动条的手柄颜色
+    //     },
+    //     xAxisIndex: [0], // 表示控制第一个x轴
+    //     filterMode: "filter", // 设置为filter模式，即数据超过范围时会被过滤掉
+    //   },
+    // ],
+
    xAxis: [
      {
+        interval: 0,
        type: "category",
        boundaryGap: false,
        axisLine: {
@ -87,26 +130,29 @@ function drawChart1() {
          },
        },
        axisLabel: {
+          interval: 0,
+          // align:'left',
+          // rotate:180,
          //坐标轴刻度标签的相关设置
          textStyle: {
            color: "#fff",
-            fontSize:'0.875rem',
+            fontSize: "0.875rem",
            // margin: 15,
          },
        },
        axisTick: { show: false },
-        data: ['2023-03-03', '2023-03-03', '2023-03-03', '2023-03-03', '2023-03-03', '2023-03-03', '2023-03-03', '2023-03-03'],
+        data: xData,
      },
    ],
    yAxis: [
      {
        type: "value",
-        name:'单位:kg',
-        nameTextStyle:{
-          color:'#fff',
-          fontSize:'0.875rem',
+        name: "单位:kg",
+        nameTextStyle: {
+          color: "#fff",
+          fontSize: "0.875rem",
        },
-        splitNumber: 5,
+        // splitNumber: 5,
        splitLine: {
          show: true,
          lineStyle: {
@ -117,7 +163,7 @@ function drawChart1() {
        axisLabel: {
          textStyle: {
            color: "#fff",
-            fontSize:'0.875rem',
+            fontSize: "0.875rem",
          },
        },
        axisTick: { show: false },
@ -156,7 +202,7 @@ function drawChart1() {
            shadowBlur: 20, //shadowBlur设图形阴影的模糊大小。配合shadowColor,shadowOffsetX/Y, 设置图形的阴影效果。
          },
        },
-        data: [5, 6, 7, 8, 9, 7, 5, 4, 2, 7, 8, 4],
+        data: yData,
      },
    ],
  };
@ -168,6 +214,7 @@ function drawChart1() {
    myChart.resize();
  });
 }
+// 底部的折线图
 function drawChart2() {
  let dom = document.querySelector("#chart2");
  dom.removeAttribute("_echarts_instance_");
@ -197,20 +244,29 @@ function drawChart2() {
          //坐标轴刻度标签的相关设置
          textStyle: {
            color: "#fff",
-            fontSize:'0.875rem',
+            fontSize: "0.875rem",
          },
        },
        axisTick: { show: false },
-        data: ['2023-03-03', '2023-03-03', '2023-03-03', '2023-03-03', '2023-03-03', '2023-03-03', '2023-03-03', '2023-03-03'],
+        data: [
+          "2023-03-03",
+          "2023-03-03",
+          "2023-03-03",
+          "2023-03-03",
+          "2023-03-03",
+          "2023-03-03",
+          "2023-03-03",
+          "2023-03-03",
+        ],
      },
    ],
    yAxis: [
      {
        type: "value",
-        name:'单位:kg',
-        nameTextStyle:{
-          color:'#fff',
-          fontSize:'0.875rem',
+        name: "单位:kg",
+        nameTextStyle: {
+          color: "#fff",
+          fontSize: "0.875rem",
        },
        splitNumber: 5,
        splitLine: {
@ -223,7 +279,7 @@ function drawChart2() {
        axisLabel: {
          textStyle: {
            color: "#fff",
-            fontSize:'0.875rem',
+            fontSize: "0.875rem",
          },
        },
        axisTick: { show: false },
@ -274,9 +330,42 @@ function drawChart2() {
    myChart.resize();
  });
 }
+// 筛选的时间参数
+const params = reactive({
+  startTimeYear: "",
+  startTimeMonth: "",
+  startTimeDay: "",
+  endTimeYear: "",
+  endTimeMonth: "",
+  endTimeDay: "",
+});
+
+// const
+// 获取统计数据
+function getCountData(val) {
+  if (val) {
+    date.value[0] = moment(date.value[0]).format("YYYY-MM-DD");
+    date.value[1] = moment(date.value[1]).format("YYYY-MM-DD");
+  }
+
+  let startList = date.value[0].split("-");
+  let endList = date.value[1].split("-");
+  params.startTimeYear = startList[0];
+  params.startTimeMonth = startList[1];
+  params.startTimeDay = startList[2];
+  params.endTimeYear = endList[0];
+  params.endTimeMonth = endList[1];
+  params.endTimeDay = endList[2];
+  getWeightBetweenTime(params).then((res) => {
+    deviceList.value[0].total = res.result.totalNum;
+    deviceList.value[0].avgPro = res.result.percentNum;
+    drawChart1(res.result.dictionary);
+  });
+}
 onMounted(() => {
-  drawChart1()
-  drawChart2()
+  getCountData();
+  // drawChart1();
+  // drawChart2();
 });
 </script>
 <style scoped lang="scss">
@ -323,10 +412,12 @@ onMounted(() => {
      box-sizing: border-box;
      background-size: 100% 100%;
      background-image: url("@/assets/images/dialog/inoutbound.png");
-      span {
-        font-size: 1.375rem;
-        font-family: "pangmen";
-      }
+      display: flex;
+      justify-content: space-between;
+    }
+    &-title > span {
+      font-size: 1.375rem;
+      font-family: "pangmen";
    }
    &-plate1 {
      float: left;
@ -338,8 +429,10 @@ onMounted(() => {
        padding-top: vh(20);
        box-sizing: border-box;
        &-name {
+          // width: vw(48);
+          // height: vh(230);
          width: vw(48);
-          height: vh(230);
+          height: vh(480);
          background-image: url("@/assets/images/dialog/chassis.png");
          background-size: 100% 100%;
          writing-mode: vertical-rl; /* 文字从上到下，从右到左 */
@ -359,8 +452,10 @@ onMounted(() => {
          }
          section {
            text-align: center;
+            // width: vw(160);
+            // height: vh(104);
            width: vw(160);
-            height: vh(104);
+            height: vh(229);
            background-size: 100% 100%;
            background-image: url("@/assets/images/dialog/pro-bg.png");
            span {
@ -369,16 +464,17 @@ onMounted(() => {
            span:nth-child(1) {
              font-size: 0.875rem;
              // margin-top: vh(16);
-              line-height: vh(31);
+              line-height: vh(38);
            }
            span:nth-child(2) {
              font-size: 1.375rem;
-              margin-top: vh(9);
+              margin-top: vh(68);
              color: rgba(234, 255, 254, 1);
              // line-height: vh(32);
            }
            span:nth-child(3) {
              font-size: 0.8rem;
+              margin-top: vh(26);
              color: rgba(113, 133, 149, 1);
              // line-height: vh(32);
            }
@ -391,9 +487,24 @@ onMounted(() => {
      #chart2 {
        margin-top: vh(20);
        width: vw(800);
-        height: vh(228);
+        // height: vh(228);
+        height: vh(456);
      }
    }
  }
 }
+:deep(.el-date-editor) {
+  width: vw(350) !important;
+  border: 1px solid;
+  border-image: linear-gradient(
+      180deg,
+      rgba(25.000000409781933, 174.00000482797623, 250.00000029802322, 1),
+      rgba(25.000000409781933, 174.00000482797623, 250.00000029802322, 0.7)
+    )
+    1 1;
+  height: vh(28);
+}
+:deep(.el-range-input) {
+  color: #fff !important;
+}
 </style>
--- a/src/components/productionInformation/inOutboundMsg.vue
+++ b/src/components/productionInformation/inOutboundMsg.vue
@ -9,21 +9,24 @@
        <div class="box-content-chart">
          <div class="pre" @click="prvePage"></div>
          <div class="swiper">
-            <div
-              class="swiper-box"
-              :style="`transform:translateX(${transform})`"
+            <transition
+              :name="btnName"
+              v-for="(item, index) in Math.ceil(chartList.length / 8)"
+              :key="item.id"
            >
-              <div
-                class="box-content-chart-item"
-                v-for="item in chartList"
-                :key="item.id"
-              >
-                <div class="chart">
-                  <pieChart :dataMap="item" />
+              <div v-if="index == chartIndex" style="display: flex">
+                <div
+                  class="box-content-chart-item"
+                  v-for="item in chartList.slice(index * 8, 8 * (index + 1))"
+                  :key="item.id"
+                >
+                  <div class="chart">
+                    <pieChart :dataMap="item" />
+                  </div>
+                  <div class="line"></div>
                </div>
-                <div class="line"></div>
              </div>
-            </div>
+            </transition>
          </div>

          <div class="next" @click="nextPage"></div>
@ -32,28 +35,52 @@
          <div class="box-content-inBound-title">
            <span> 入库信息统计 </span>
            <div>
-              <ul>
+              <ul v-if="storeList">
                <li><span>单位：</span><span>kg</span></li>
-                <li><span>总量：</span><span>3047457</span></li>
-                <li><span>品牌总量：</span><span>1632057</span></li>
-                <li><span>批次数量：</span><span>176</span></li>
+                <li>
+                  <span>总量：</span><span>{{ storeList.totalWeight }}</span>
+                </li>
+                <li>
+                  <span>品牌总量：</span><span>{{ storeList.brandNum }}</span>
+                </li>
+                <li>
+                  <span>批次数量：</span><span>{{ storeList.batchNum }}</span>
+                </li>
              </ul>
              <section class="one">
                <el-date-picker
                  class="picker"
-                  v-model="value2"
+                  v-model="params.year"
                  type="year"
                  placeholder="请选择年份"
-                  @change="maintenancePlan"
+                  @change="
+                    getAllBrandName(true);
+                  "
                />
              </section>
              <section>
-                <el-date-picker
-                  v-model="value2"
-                  type="year"
-                  placeholder="请选择年份"
-                  @change="maintenancePlan"
-                />
+                <!-- <el-date-picker
+                  v-model="params.month"
+                  type="month"
+                  placeholder="请选择月份"
+                  @change="
+                    getAllBrandName();
+                  "
+                /> -->
+                <el-select
+                  v-model="params.month"
+                  class="m-2"
+                  placeholder="请选择月份"
+                  clearable
+                  @change="getAllBrandName()"
+                >
+                  <el-option
+                    v-for="(item,index) in options"
+                    :key="'key' + index"
+                    :label="item"
+                    :value="item"
+                  />
+                </el-select>
              </section>
            </div>
          </div>
@ -82,16 +109,28 @@
  </div>
 </template>
 <script setup>
+import {
+  getBrandPercent,
+  getRepoDetails,
+  getBrandNames,
+  getBrandTimeCount,
+  getOutBrandPercent,
+  getOutRepoDetails,
+  getOutBrandNames,
+  getOutBrandTimeCount,
+} from "@/api/productionInformation/index";
 import pieChart from "@/components/echarts/pie";
-import { ref, defineProps, onMounted } from "vue";
+import { ref, defineProps, onMounted, reactive } from "vue";
 import * as echarts from "echarts";
 const props = defineProps({
  title: String,
 });
+
+const options = ref(['1','2','3','4','5','6','7','8','9','10','11','12'])
 const activeNames = ref(["1"]);
 const emit = defineEmits(["closeBoundMsg"]);
-const index = ref(0);
-const transform = ref(0);
+const chartIndex = ref(0);
+const btnName = ref("left");
 const chartList = ref([
  {
    id: 11,
@ -141,6 +180,7 @@ const chartList = ref([
    type: "(硬珍品)烟丝",
    value: 20,
  },
+
  {
    id: 19,
    name: "利群",
@ -154,18 +194,100 @@ const chartList = ref([
    value: 20,
  },
 ]);
+// 获取占比图列表
+function getChartList() {
+  if (props.title === "入库信息") {
+    getBrandPercent().then((res) => {
+      chartList.value = res.result.columnDatas.map((ele) => {
+        return {
+          type: ele.name,
+          value: ele.percentage * 100,
+        };
+      });
+    });
+  } else {
+    getOutBrandPercent().then((res) => {
+      chartList.value = res.result.columnDatas.map((ele) => {
+        return {
+          type: ele.name,
+          value: ele.percentage * 100,
+        };
+      });
+    });
+  }
+}
+
+const storeList = ref(null);
+// 获取仓库细节
+function getStoreDetail() {
+  if (props.title === "入库信息") {
+    getRepoDetails().then((res) => {
+      storeList.value = res.result;
+    });
+  } else {
+    getOutRepoDetails().then((res) => {
+      storeList.value = res.result;
+    });
+  }
+}
+
+// 参数
+const params = reactive({
+  year: new Date(),
+  month: "",
+  brandName: "",
+});
+// 获取所有的品牌名称
+function getAllBrandName(boolean) {
+  if (boolean) {
+    params.year = params.year.getFullYear().toString();
+  } else{
+    console.log(params.month.slice(0,-2));
+    // params.month = params.month.slice(-2)
+  }
+  if (props.title === "入库信息") {
+    getBrandNames(params).then((res) => {
+      brandList.value = res.result;
+      params.brandName = brandList.value[0];
+      getBrandChart();
+    });
+  } else {
+    getOutBrandNames(params).then((res) => {
+      brandList.value = res.result;
+      params.brandName = brandList.value[0];
+      getBrandChart();
+    });
+  }
+}
+// 根据品牌名称获取chart图
+function getBrandChart() {
+  if (props.title === "入库信息") {
+    getBrandTimeCount(params).then((res) => {
+      drawBarChart(res.result);
+    });
+  } else {
+    getOutBrandTimeCount(params).then((res) => {
+      drawBarChart(res.result);
+    });
+  }
+}
 // 下一页
 function nextPage() {
-  if (index.value === parseInt((chartList.value.length + 1) / 8)) return;
-  index.value++;
-  transform.value = -1 * index.value * 100 + "%";
+  btnName.value = "right";
+  if (chartIndex.value == Math.ceil(chartList.value.length / 8) - 1) {
+    chartIndex.value = 0;
+  } else {
+    chartIndex.value++;
+  }
 }
 // 上一页
 function prvePage() {
-  if (index.value === 0) return;
-  index.value--;
-
-  transform.value = 1 * index.value * 100 + "%";
+  btnName.value = "left";
+  if (chartIndex.value == 0) {
+    chartIndex.value = Math.ceil(chartList.value.length / 8) - 1;
+  } else {
+    chartIndex.value--;
+  }
 }

 function close() {
@ -183,28 +305,22 @@ const brandList = ref([
  "利群(长嘴)烟丝",
  "兰州(硬吉祥)烟丝",
 ]);
-function drawBarChart() {
+function drawBarChart(res) {
  let dom = document.querySelector("#barChart");
  dom.removeAttribute("_echarts_instance_");
  let myChart;
  myChart = echarts.init(dom);
  let option = {
-    grid:{
-      left:'5%',
-      bottom:'8%',
-      right:'2%',
-      top:'15%'
+    grid: {
+      left: "5%",
+      bottom: "8%",
+      right: "2%",
+      top: "15%",
    },
    xAxis: {
-      data: [
-        1,
-        2,
-        3,
-        4,
-        5,
-        6,
-        7,
-      ],
+      data: res.map((ele, index) => {
+        return index + 1;
+      }),
      axisLine: {
        lineStyle: {
          color: "rgba(56, 72, 89, 1)",
@ -219,8 +335,8 @@ function drawBarChart() {
      name: "单位:kg",
      nameTextStyle: {
        color: "#fff",
-        fontSize: '1rem',
-        padding:[0,35,10,0]
+        fontSize: "1rem",
+        padding: [0, 35, 10, 0],
      },
      axisLine: {
        lineStyle: {
@ -229,16 +345,15 @@ function drawBarChart() {
      },
      axisLabel: {
        color: "#fff",
-        fontSize: '0.875rem',
+        fontSize: "0.875rem",
      },
      splitLine: {
        show: true,
        lineStyle: {
-          type:'dashed',
+          type: "dashed",
          color: "rgba(255, 255, 255, 0.20)",
        },
      },
-
    },
    series: [
      {
@ -247,8 +362,8 @@ function drawBarChart() {

        itemStyle: {
          normal: {
-            borderColor: 'rgba(28, 238, 251, 1)',
-                borderWidth: 1,
+            borderColor: "rgba(28, 238, 251, 1)",
+            borderWidth: 1,
            color: new echarts.graphic.LinearGradient(
              0,
              0,
@ -268,7 +383,9 @@ function drawBarChart() {
            ),
          },
        },
-        data: [254, 3254, 1654, 2454, 4757, 2011, 1211],
+        data: res.map((ele, index) => {
+          return ele;
+        }),
      },
    ],
  };
@ -277,17 +394,21 @@ function drawBarChart() {
    myChart.resize();
  });
 }
-onMounted(()=>{
- drawBarChart()
-
-})
+onMounted(() => {
+  getChartList();
+  getStoreDetail();
+  // 获取所有品牌的种类
+  getAllBrandName(true);
+});
 </script>
 <style scoped lang="scss">
 .swiper {
+  display: flex;
  overflow: hidden;
+  transition: all linear 0.2s;
  &-box {
    display: flex;
-    // transition: all linear .2s;
+
    // transform: translateX(-100%);
  }
 }
@ -357,12 +478,15 @@ onMounted(()=>{
          rgba(144.00000661611557, 218.00000220537186, 255, 0.10000000149011612)
        )
        1 1;
+      .swiper-box {
+        transition: all 0.5s ease-in-out;
+      }
      &-item {
        margin-right: vw(52);
        // width: vw(100);
        // height: vh(170);
        .chart {
-          width: vw(100);
+          width: vw(110);
          height: vh(170);
        }
      }
--- a/src/main.js
+++ b/src/main.js
@ -6,4 +6,6 @@ import 'element-plus/dist/index.css'
 import zhCn from 'element-plus/es/locale/lang/zh-cn'
 import router from "./router/router.js"

+
+
 createApp(App).use(ElementPlus,{locale:zhCn}).use(router).mount('#app')
--- a/src/style.scss
+++ b/src/style.scss
@ -25,4 +25,37 @@ body {
    width: vw(52);
    height: vh(24);
 }
-
+.left-enter-from {
+    transform: translateX(-100%);
+    opacity: 0;
+}
+.right-enter-from{
+    transform: translateX(100%);
+    opacity: 0;
+}
+ 
+.left-enter-active,
+.left-leave-active,
+.right-enter-active,
+.right-leave-active{
+    transition: transform 600ms ease-in-out, opacity 600ms ease-in-out;
+}
+ 
+.left-enter-to,.right-enter-to {
+    transform: translateX(0);
+    opacity: 1;
+}
+ 
+.left-leave-from,.right-leave-from{
+    transform: translateX(0);
+    opacity: 1;
+}
+ 
+.left-leave-to {
+    transform: translateX(100%);
+    opacity: 0;
+}
+.right-leave-to {
+    transform: translateX(-100%);
+    opacity: 0;
+}
--- a/src/utils/request.js
+++ b/src/utils/request.js
@ -5,7 +5,6 @@ const service = axios.create({
  baseURL: import.meta.env.VITE_APP_BASE_API, // api的base_url
  timeout: 5000 // 请求超时时间
 });
- console.log(import.meta.env.VITE_APP_BASE_API,'xxxx');
 // 请求拦截器
 service.interceptors.request.use(
  config => {
--- a/src/views/home/components/aside/devData.vue
+++ b/src/views/home/components/aside/devData.vue
@ -25,13 +25,14 @@
  <inOutboundMsg :title="title" v-if="listIndex===0||listIndex===1" @closeBoundMsg="closeSecondDialog"/>
  <!-- 出入库批次耗时 -->
  <!-- <inOutBoundBacth :title="title" v-if="listIndex===2 || listIndex===3" @closeBatch='closeSecondDialog'/> -->
-  <!-- 库存消息 -->
-  <inventoryNews v-if="listIndex===2" @close='closeSecondDialog' />
+  <!-- 各品牌库存情况 -->
+  <brand v-if="listIndex===2" @closeBrand='closeSecondDialog' />
+
  <!-- 喂丝机 装箱机弹窗 -->
  <inOutMachine :title="title" v-if="listIndex===3 || listIndex===4" @closeMachine="closeSecondDialog" />
 </template>
 <script setup>
-import inventoryNews from '@/views/home/components/homeDialog/inventoryNews'
+import brand from '@/views/home/components/homeDialog/brand'
 import inOutboundMsg from '@/components/productionInformation/inOutboundMsg'
 import inOutBoundBacth from '@/components/productionInformation/inOutBoundBacth'
 import inOutMachine from '@/components/productionInformation/inOutMachine'
@ -66,7 +67,7 @@ const list = ref([
  {
    default: getPath.dev5,
    select: getPath.dev5Select,
-    title:'库存信息'
+    title:'各品牌库存情况'
  },
  {
    default: getPath.dev6,
--- a/src/views/home/components/homeDialog/brand.vue
+++ b/src/views/home/components/homeDialog/brand.vue
@ -28,24 +28,38 @@
        <div class="box-content-search">
          <div>
            <el-input
-              v-model="searchData"
+              v-model="tableParams.name"
+              @change="getTableList"
              class="w-50 m-2"
              placeholder="请输入搜索内容"
              :prefix-icon="Search"
            />
+            <el-select
+             style="margin-left:1rem"
+              v-model="tableParams.orderByLoc"
+              class="m-2"
+              placeholder="是否排序"
+              @change="getTableList()"
+            >
+              <el-option label="是" :value="true" />
+              <el-option label="否" :value="false" />
+            </el-select>
          </div>
          <div>
            <ul>
              <li>
-                <span>A区空箱：</span><span>{{ areaNum.AareaNo }}</span>
+                <span>货位：</span><span>{{ areaNum.storeNum }}</span>
              </li>
              <li>
-                <span>A区实箱：</span><span>{{ areaNum.AareaHas }}</span>
+                <span>实箱：</span><span>{{ areaNum.hasBox }}</span>
              </li>
              <li>
-                <span>A区批次数量：</span><span>{{ areaNum.ABatch }}</span>
+                <span>空箱：</span><span>{{ areaNum.noBox }}</span>
              </li>
              <li>
+                <span>批次数量：</span><span>{{ areaNum.batchNo }}</span>
+              </li>
+              <!-- <li>
                <span>B区空箱：</span><span>{{ areaNum.BareaNo }}</span>
              </li>
              <li>
@ -53,35 +67,37 @@
              </li>
              <li>
                <span>B区批次数量：</span><span>{{ areaNum.BareaNo }}</span>
-              </li>
+              </li> -->
            </ul>
          </div>
        </div>
        <div class="box-content-table">
-          <el-table :data="tableList" style="width: 100%" @row-click="rowClick">
-            <el-table-column prop="id" label="序号" width="180" />
-            <el-table-column prop="trayNumber" label="托盘号" width="180" />
-            <el-table-column prop="address" label="当前存放位置" />
-            <el-table-column prop="dsc" label="物料描述" />
-            <el-table-column prop="batch" label="批次" />
-            <el-table-column prop="inDate" label="入库时间" />
-            <el-table-column prop="number" label="编号" />
+          <el-table :data="tableList" style="width: 100%">
+            <el-table-column
+              type="index"
+              label="序号"
+              width="50"
+              :index="indexMethod"
+            />
+            <el-table-column prop="palletNum" label="托盘号" />
+            <el-table-column prop="storeLoc" label="当前存放位置" />
+            <el-table-column prop="itemDesc" label="物料描述" />
+            <el-table-column prop="batchNum" label="批次" />
+            <el-table-column prop="inputTime" label="入库时间" width="200" />
+            <!-- <el-table-column prop="number" label="编号" /> -->
            <el-table-column prop="upWeight" label="上箱重量" />
            <el-table-column prop="downWeight" label="下箱重量" />
          </el-table>
          <div style="float: right">
            <el-pagination
-              v-model:current-page="currentPage1"
-              :page-size="100"
-              :size="size"
-              :disabled="disabled"
-              :background="background"
+              v-model:current-page="tableParams.index"
+              :page-size="tableParams.size"
+              :size="tableParams.size"
              layout="total, prev, pager, next"
-              :total="1000"
+              :total="tableTotal"
              prev-text="上一页"
              next-text="下一页"
-              @size-change="handleSizeChange"
-              @current-change="handleCurrentChange"
+              @current-change="getTableList"
            >
            </el-pagination>
          </div>
@ -91,56 +107,55 @@
  </div>
 </template>
 <script setup>
-import { ref } from "vue";
+import { getBrandBox, getBrandTable, getStoreMsg } from "@/api/home";
+import { onMounted, reactive, ref } from "vue";
 import { Search } from "@element-plus/icons-vue";
 import echart from "@/components/echarts/pie";
-const emit = defineEmits(['closeBrand'])
+const emit = defineEmits(["closeBrand"]);
 const list = ref([
-  {
-    id: 1,
-    name: "利群",
-    type: "黑中支",
-    kg: "1148.23kg",
-    value: 20,
-  },
-  {
-    id: 2,
-    name: "利群",
-    type: "黑中支",
-    kg: "1148.23kg",
-    value: 40,
-  },
-  {
-    id: 3,
-    name: "利群",
-    type: "黑中支",
-    kg: "1148.23kg",
-    value: 40,
-  },
-  {
-    id: 4,
-    name: "利群",
-    type: "黑中支",
-    kg: "1148.23kg",
-    value: 40,
-  },
-  {
-    id: 5,
-    name: "利群",
-    type: "黑中支",
-    kg: "1148.23kg",
-    value: 40,
-  },
+  // {
+  //   id: 1,
+  //   name: "利群",
+  //   type: "黑中支",
+  //   kg: "1148.23kg",
+  //   value: 20,
+  // },
+  // {
+  //   id: 2,
+  //   name: "利群",
+  //   type: "黑中支",
+  //   kg: "1148.23kg",
+  //   value: 40,
+  // },
+  // {
+  //   id: 3,
+  //   name: "利群",
+  //   type: "黑中支",
+  //   kg: "1148.23kg",
+  //   value: 40,
+  // },
+  // {
+  //   id: 4,
+  //   name: "利群",
+  //   type: "黑中支",
+  //   kg: "1148.23kg",
+  //   value: 40,
+  // },
+  // {
+  //   id: 5,
+  //   name: "利群",
+  //   type: "黑中支",
+  //   kg: "1148.23kg",
+  //   value: 40,
+  // },
 ]);

 // 区域数量
-const areaNum = ref({
-  AareaNo: 10,
-  AareaHas: 868,
-  Abatch: 17,
-  BareaNo: 48,
-  BareaHas: 736,
-  Bbatch: 15,
+const areaNum = reactive({
+  storeNum: 10,
+  hasBox: 10,
+  noBox: 5,
+  batchNo: 5,
 });
 // table数据
 const tableList = ref([
@ -189,9 +204,63 @@ const tableList = ref([
    upWeight: "156.5",
  },
 ]);
-function close(){
-    emit('closeBrand',false)
+function close() {
+  emit("closeBrand", false);
 }
+// table参数
+const tableTotal = ref(0);
+const tableParams = reactive({
+  index: 1,
+  size: 4,
+  name: "",
+  orderByLoc: false,
+});
+function getTableList() {
+  getBrandTable(tableParams).then((res) => {
+    tableList.value = res.result.data;
+
+    tableTotal.value = res.result.totalNum;
+  });
+}
+// 计算序号
+function indexMethod(index) {
+  return index + 1 + (tableParams.index - 1) * tableParams.size;
+}
+const id = ref(0);
+function getChartData() {
+  getStoreMsg().then((res) => {
+    for (let key in res.result[1]) {
+      list.value.push({
+        name: key,
+        kg: res.result[1][key] * res.result[0] + "kg",
+        id: id.value++,
+        value: res.result[1][key] * 100,
+      });
+    }
+    console.log(list.value);
+  });
+}
+onMounted(() => {
+  //获取即时库存信息情况
+  getChartData();
+  // 获取货位 批次数据
+  getBrandBox().then((res) => {
+    for (let key in res.result) {
+      console.log(res.result, key);
+      if (key === "货位") {
+        areaNum.storeNum = res.result[key];
+      } else if (key === "实箱") {
+        areaNum.hasBox = res.result[key];
+      } else if (key === "空箱") {
+        areaNum.noBox = res.result[key];
+      } else {
+        areaNum.batchNo = res.result[key];
+      }
+    }
+  });
+  // 获取即时库存table数据
+  getTableList();
+});
 </script>
 <style scoped lang="scss">
 .pre,
@ -201,6 +270,7 @@ function close(){
  position: absolute;
  top: 40%;
  background-size: 100% 100%;
+  cursor: pointer;
 }
 .pre {
  left: 0;
@ -250,6 +320,9 @@ function close(){
        font-family: "pangmen";
      }
    }
+    &-table {
+      height: vh(245);
+    }
    &-chart {
      padding: 0 vw(79);
      display: flex;
--- a/src/views/home/components/homeDialog/inventoryNews.vue
+++ b/src/views/home/components/homeDialog/inventoryNews.vue
@ -7,102 +7,41 @@
      </div>
      <div class="box-content">
        <el-table :data="list" style="width: 100%">
-          <el-table-column prop="batchNo" label="批次号" width="180" />
-          <el-table-column prop="brand" label="品牌" width="180" />
-          <el-table-column prop="date" label="入库时间" />
+          <el-table-column prop="batchNum" label="批次号" width="180" />
+          <el-table-column prop="itemDesc" label="品牌" width="180" />
+          <el-table-column prop="inTime" label="入库时间" />
          <el-table-column prop="weight" label="重量(kg)" />
-          <el-table-column prop="Cases" label="箱数" />
+          <el-table-column prop="boxCount" label="箱数" />
        </el-table>
      </div>
    </div>
  </div>
 </template>
    <script setup>
-import { ref } from "vue";
+import { onMounted, ref } from "vue";
+import {getInventoryMessage} from '@/api/home'
 import getPath from "@/utils/getPath";
 const emit = defineEmits(["close"]);
 const list = ref([
  {
-    batchNo: "YXZZP2303001",
-    brand: "利群(新版)烟丝",
-    date: "2023-04-08",
+    batchNum: "YXZZP2303001",
+    itemDesc: "利群(新版)烟丝",
+    inTime: "2023-04-08",
    weight: "2767.52",
-    Cases: "66",
-  },
-  {
-    batchNo: "YXZZP2303001",
-    brand: "利群(新版)烟丝",
-    date: "2023-04-08",
-    weight: "2767.52",
-    Cases: "66",
-  },
-  {
-    batchNo: "YXZZP2303001",
-    brand: "利群(新版)烟丝",
-    date: "2023-04-08",
-    weight: "2767.52",
-    Cases: "66",
-  },
-  {
-    batchNo: "YXZZP2303001",
-    brand: "利群(新版)烟丝",
-    date: "2023-04-08",
-    weight: "2767.52",
-    Cases: "66",
-  },
-  {
-    batchNo: "YXZZP2303001",
-    brand: "利群(新版)烟丝",
-    date: "2023-04-08",
-    weight: "2767.52",
-    Cases: "66",
-  },
-  {
-    batchNo: "YXZZP2303001",
-    brand: "利群(新版)烟丝",
-    date: "2023-04-08",
-    weight: "2767.52",
-    Cases: "66",
-  },
-  {
-    batchNo: "YXZZP2303001",
-    brand: "利群(新版)烟丝",
-    date: "2023-04-08",
-    weight: "2767.52",
-    Cases: "66",
-  },
-  {
-    batchNo: "YXZZP2303001",
-    brand: "利群(新版)烟丝",
-    date: "2023-04-08",
-    weight: "2767.52",
-    Cases: "66",
-  },
-  {
-    batchNo: "YXZZP2303001",
-    brand: "利群(新版)烟丝",
-    date: "2023-04-08",
-    weight: "2767.52",
-    Cases: "66",
-  },
-  {
-    batchNo: "YXZZP2303001",
-    brand: "利群(新版)烟丝",
-    date: "2023-04-08",
-    weight: "2767.52",
-    Cases: "66",
-  },
-  {
-    batchNo: "YXZZP2303001",
-    brand: "利群(新版)烟丝",
-    date: "2023-04-08",
-    weight: "2767.52",
-    Cases: "66",
+    boxCount: "66",
  },
 ]);
 function close() {
  emit("close", false);
 }
+onMounted(()=>{
+  getInventoryMessage().then(res=>{
+    console.log(res,'xxxxxxxx');
+    if(res.code==200){
+      list.value = res.result
+    }
+  })
+})
 </script>
    <style scoped lang="scss">
 .box {
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@ -204,6 +204,7 @@ import {
  getInOrder,
  getOutOrder,
  getLocInfo,
+  
 } from "@/api/home";
 // 设备状态列表
 const deviceList = ref([
Author	SHA1	Message	Date
luoshiwen	c3b1d338c1	9.29代码提交	2024-09-29 21:09:21 +08:00
luoshiwen	0548069a08	代码提交	2024-09-06 08:59:02 +08:00