生产计划样式调整

src/pages/index.vue

@@ -13,11 +13,21 @@
           safe-area-inset-top
           placeholder
       />
+      <u-tabs
+          :list="menuList"
+          :current="current"
+          key-name="name"
+          :scrollable="false"
+          :active-style="{
+          color: '#0E85FF',
+        }"
+          @change="change"
+      >
+      </u-tabs>
     </u-sticky>
     <uni-notice-bar show-icon scrollable text="安全生产！有序生产！高效生产！" />
-    <uni-section title="开工中" type="line" title-color="#18bc37"> </uni-section>
+    <el-collapse accordion  v-if="current === 0">
-    <el-collapse accordion>
+      <el-collapse-item v-for="(item, index) in startList"  :name="item.id" :key="index">
-      <el-collapse-item v-for="(item, index) in startList"  :name="item.id">
         <template #title>
           <el-icon><Tickets /></el-icon>
           <el-text  size="large">{{item.productName}}</el-text>&nbsp;/&nbsp;
@@ -55,11 +65,9 @@
         </el-row>
       </el-collapse-item>
     </el-collapse>
-
+    <!--    派工中-->
-<!--    派工中-->
+    <el-collapse accordion  v-if="current === 1">
-    <uni-section title="派工中" type="line" title-color="#2979ff"></uni-section>
+      <el-collapse-item v-for="(item, index) in paigongList"  :name="item.id" :key="index">
-    <el-collapse accordion>
-      <el-collapse-item v-for="(item, index) in paigongList"  :name="item.id">
         <template #title>
           <el-icon><Tickets /></el-icon>
           <el-text  size="large">{{item.productName}}</el-text>&nbsp;/&nbsp;
@@ -84,10 +92,9 @@
         <el-text>备注:{{ item.remark }}</el-text>
       </el-collapse-item>
     </el-collapse>
-<!--    计划中-->
+    <!--    计划中-->
-    <uni-section title="计划中" type="line" title-color="#f3a73f"></uni-section>
+    <el-collapse accordion v-if="current === 2">
-    <el-collapse accordion>
+      <el-collapse-item v-for="(item, index) in planList"  :name="item.id" :key="index">
-      <el-collapse-item v-for="(item, index) in planList"  :name="item.id">
         <template #title>
           <el-icon><Tickets /></el-icon>
           <el-text  size="large">{{item.productName}}</el-text>&nbsp;/&nbsp;
@@ -112,10 +119,9 @@
         <el-text>备注:{{ item.remark }}</el-text>
       </el-collapse-item>
     </el-collapse>
-<!--   暂停中 -->
+    <!--   暂停中 -->
-    <uni-section title="暂停中" type="line" title-color="#e43d33"></uni-section>
+    <el-collapse accordion v-if="current === 3">
-    <el-collapse accordion>
+      <el-collapse-item v-for="(item, index) in pauseList"  :name="item.id" :key="index">
-      <el-collapse-item v-for="(item, index) in pauseList"  :name="item.id">
         <template #title>
           <el-icon><Tickets /></el-icon>
           <el-text  size="large">{{item.productName}}</el-text>&nbsp;/&nbsp;
@@ -146,18 +152,18 @@
         <el-text>备注:{{ item.remark }}</el-text>
       </el-collapse-item>
     </el-collapse>
-<!--    <view class="charts-box">-->
+    <!--    <view class="charts-box">-->
-<!--      <qiun-data-charts :chartData="chartData" type="column"/>-->
+    <!--      <qiun-data-charts :chartData="chartData" type="column"/>-->
-<!--    </view>-->
+    <!--    </view>-->
   </view>
 </template>
 
 <script setup>
-import {ref, onMounted} from 'vue';
+import { ref, onMounted } from 'vue';
 import useUserStore from '@/store/modules/user'
-import {getPage, getById, paigong, updateStatus, getByStatus} from "@/api/mes/plan"
+import { updateStatus, getByStatus } from "@/api/mes/plan"
-import {timestampToTime} from "@/utils/dateUtil";
+import { timestampToTime } from "@/utils/dateUtil";
-import {Tickets} from "@element-plus/icons-vue";
+import { Tickets } from "@element-plus/icons-vue";
 import modal from "@/plugins/modal";
 import tab from "@/plugins/tab";
 import {showConfirm} from "@/utils/common";
@@ -169,6 +175,25 @@ const pauseList = ref([]);
 const planList = ref([]);
 const chartData = ref({});
 
+const menuList = ref([
+  {
+    name: '开工中'
+  },
+  {
+    name: '派工中'
+  },
+  {
+    name: '计划中'
+  },
+  {
+    name: '暂停中'
+  }
+])
+const current = ref(0)
+const change = (index)=>{
+  current.value = index.index
+}
+
 onMounted(() => {
   getServerData()
   getPlanList()
@@ -233,6 +258,9 @@ function planProgress(plan){
 </script>
 
 <style lang="scss" scoped>
+.page {
+  width: 100%
+}
 .sticky {
   background: linear-gradient(180deg, #d4e9ff 0%, #f3f9ff 100%);
   backdrop-filter: blur(27.18px);

src/pages/report.vue

@@ -43,7 +43,7 @@
         </uni-list>
         <uni-fab ref="fab" @fabClick="editOrAddReport" />
       </el-tab-pane>
-      <el-tab-pane label="代报工" name="second"  v-if="auth.hasPermi('mes:produce-report-detail:replace')">
+      <el-tab-pane label="代报工" name="second"  v-if="auth('mes:produce-report-detail:replace')">
         <uni-fab :pattern="pattern"  ref="fabReplace" @fabClick="addReplaceReport" />
         <uni-forms ref="valiReplaceForm" :model="valiFormData">
           <uni-row>
@@ -89,7 +89,7 @@
           </uni-list-item>
         </uni-list>
       </el-tab-pane>
-      <el-tab-pane label="个人报工审核" name="third" v-if="auth.hasPermi('mes:produce-report-detail:replace')">
+      <el-tab-pane label="个人报工审核" name="third" v-if="auth('mes:produce-report-detail:replace')">
         <uni-forms ref="valiForm" :model="valiFormData">
           <uni-row>
             <uni-col :xs="14" :sm="12" :md="6" :lg="3" :xl="1">
@@ -145,7 +145,7 @@
 </template>
 
 <script>
-import {getMyList, getOtherList, getById, updateStatus,deleteByReportId } from "@/api/mes/report";
+import {getMyList, getOtherList, updateStatus,deleteByReportId } from "@/api/mes/report";
 import {Check, Delete, Edit,Promotion,Close,View} from '@element-plus/icons-vue'
 import tab from "@/plugins/tab";
 import modal from "@/plugins/modal";
@@ -156,7 +156,6 @@ import {processTypes} from "@/api/system/dict/data";
 import {getOtherPersonalUser} from "@/api/mes/organization";
 export default {
   computed: {
-    auth() {return auth},
     Delete() {return Delete},
     Promotion() {return Promotion},
     Close() {return Close},
@@ -213,6 +212,9 @@ export default {
     }, 1000);
   },
   methods: {
+    auth(permission) {
+      return auth.hasPermi(permission)
+    },
     processTypes() {
       return processTypes
     },