From 1baaf3556bf47bedb2e9c8d1177fd74fd3dd3ce7 Mon Sep 17 00:00:00 2001
From: sunshine <1467939124@qq.com>
Date: Wed, 24 Jul 2024 18:16:50 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8A=95=E6=96=99bug=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=EF=BC=8C=E9=A1=B5=E9=9D=A2=E6=A0=B7=E5=BC=8F=E8=B0=83=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/page_record/feedingRecordForm.vue |  72 ++++++---
 src/pages.json                        |   2 +-
 src/pages/work.vue                    | 224 +++++++++++++++++---------
 3 files changed, 204 insertions(+), 94 deletions(-)

diff --git a/src/page_record/feedingRecordForm.vue b/src/page_record/feedingRecordForm.vue
index ba4f169..09e88c1 100644
--- a/src/page_record/feedingRecordForm.vue
+++ b/src/page_record/feedingRecordForm.vue
@@ -1,12 +1,24 @@
 <template>
-	<view class="container">
-
-    <view class="example">
-      <uni-forms ref="customForm" :rules="customRules" labelWidth="60px" :modelValue="formData">
-        <uni-forms-item label="制浆线" required name="feedingPipeline">
+	<view>
+    <u-sticky
+        class="sticky"
+        :custom-nav-height="0"
+    >
+      <u-navbar
+          title="新增投料记录"
+          bg-color="transparent"
+          :auto-back="true"
+          :title-style="{ fontWeight: 'bold' }"
+          safe-area-inset-top
+          placeholder
+      />
+    </u-sticky>
+    <view class="container">
+      <uni-forms ref="customForm" :rules="customRules" labelWidth="80px" :modelValue="formData">
+        <uni-forms-item label="制浆线" required name="feedingPipeline" class="u-flex align-center">
           <uni-data-checkbox v-model="formData.feedingPipeline" :localdata="pipelineTypes()" />
         </uni-forms-item>
-        <uni-forms-item label="投料类型" required name="feedingType">
+        <uni-forms-item label="投料类型" required name="feedingType" class="u-flex align-center">
           <uni-data-checkbox v-model="formData.feedingType" :localdata="feedingTypes()" @change="handleTypeChange"/>
         </uni-forms-item>
         <uni-forms-item v-if="formData.feedingType==='wet' || formData.feedingType==='dry'" label="重量/kg"  name="weight">
@@ -20,12 +32,12 @@
           <template v-slot:title>
             <view class="uni-group-title">
               <uni-row>
-                <uni-col :span="18">
+                <uni-col :span="22">
                   <uni-forms-item  label="原料" required name="itemId">
                     <uni-data-select placement="top" v-model="formData.feedingRecordDetails[index].itemId" :localdata="itemList"></uni-data-select>
                   </uni-forms-item>
                 </uni-col>
-                <uni-col :span="6" align="center">
+                <uni-col :span="2" class="u-p-t-10">
                   <uni-icons type="trash" size="25" color="red" @click="del(item.id)"></uni-icons>
                 </uni-col>
               </uni-row>
@@ -37,15 +49,17 @@
           <uni-forms-item label="数量" required name="weight">
             <uni-easyinput type="number" v-model="formData.feedingRecordDetails[index].weight"/>
           </uni-forms-item>
-
         </uni-group>
       </uni-forms>
-      <view class="button-group">
-        <button v-if="formData.feedingType==='org'" type="primary" size="mini" @click="add">
-          <uni-icons type="plus" size="15"></uni-icons>
-          添加原料
-        </button>
-        <button type="primary" size="mini" @click="submit('customForm')">保存</button>
+      <view class="u-flex justify-end">
+        <view class="u-flex u-m-t-30">
+          <u-button  v-if="formData.feedingType==='org'" type="primary" @click="add" class="u-m-r-30">
+            <uni-icons type="plus" class="u-m-r-10"/> 添加原料
+          </u-button>
+          <u-button type="success"  @click="submit('customForm')">
+            <uni-icons type="checkbox" class="u-m-r-10"/>保存
+          </u-button>
+        </view>
       </view>
     </view>
 	</view>
@@ -162,8 +176,14 @@ export default {
 }
 </script>
 
-<style lang="scss">
-	.example {
+<style lang="scss" scoped>
+.sticky {
+  background: linear-gradient(180deg, #d4e9ff 0%, #f3f9ff 100%);
+  backdrop-filter: blur(27.18px);
+  box-shadow: 0 1px 1px 0 rgba(0, 72, 145, 0.1),
+  0 0.5px 0 0 rgba(0, 0, 0, 0.1);
+}
+	.container {
 		padding: 15px;
 		background-color: #fff;
 	}
@@ -182,7 +202,21 @@ export default {
     margin-left: 10px;
   }
   .uni-group-title{
-    padding-top: 5px;
-    background-color: #f4c7c7;
+    height: 55px;
+    padding: 10px;
+    background: linear-gradient(180deg, #d4e9ff 0%, #f3f9ff 100%);
   }
+.uni-group--card {
+  margin :0
+}
+.uniui-plus:before{
+  color: #ffffff
+}
+.uniui-checkbox:before{
+  color: #ffffff
+}
+.u-button {
+  height: 35px;
+  width: auto;
+}
 </style>
diff --git a/src/pages.json b/src/pages.json
index dcc6366..b2c2290 100644
--- a/src/pages.json
+++ b/src/pages.json
@@ -102,7 +102,7 @@
         {
           "path": "feedingRecordForm",
           "style": {
-            "navigationBarTitleText": "新增投料记录"
+            "navigationStyle": "custom"
           }
         }
       ]
diff --git a/src/pages/work.vue b/src/pages/work.vue
index c7b9062..12e5715 100644
--- a/src/pages/work.vue
+++ b/src/pages/work.vue
@@ -13,94 +13,149 @@
           safe-area-inset-top
           placeholder
       />
+      <u-tabs
+          :list="menuList"
+          :current="current"
+          key-name="name"
+          :scrollable="false"
+          :active-style="{
+          color: '#0E85FF',
+        }"
+          @change="change"
+      />
     </u-sticky>
     <uni-notice-bar show-icon scrollable
                     text="安全生产！有序生产！高效生产！" />
-<!--    已提交-->
-    <uni-section title="已提交" type="line" title-color="#18bc37"></uni-section>
-    <el-collapse accordion>
-      <el-collapse-item v-for="(item, index) in finishList"  :name="item.id" @click="handleFinishClick(item.id,index)">
-        <template #title>
-          <el-icon><Tickets /></el-icon>
-          <el-text type="success">{{timestampToTime(item.feedingTime)}}</el-text>&nbsp;/&nbsp;
-          <el-text  type="warning">{{ findTextByValue(pipelineTypes, item.feedingPipeline)}}</el-text>&nbsp;/&nbsp;
-          <el-text type="info">{{findTextByValue(feedingTypes, item.feedingType)  }}</el-text>
-        </template>
-        <el-text  size="large">{{item.feedingRecordCode}}</el-text>
-        <el-row>
-          <el-col :span="8">记录人:
-            <el-text type="success">{{ item.userName }}</el-text>
-          </el-col>
-          <el-col :span="8" v-if="item.feedingType !=='org'">重量/kg:
-            <el-text>{{ item.weight }} </el-text>
-          </el-col>
-        </el-row>
-        <el-row v-for="(item2, index2) in finishList[index].detailList">
-          <el-col :span="8">原料:
-            <el-text type="warning">{{item2.itemName}}</el-text>
-          </el-col>
-          <el-col :span="8">数量:
-            <el-text type="success">{{ item2.weight }}</el-text>
-          </el-col>
-          <el-col :span="8">单位:
-            <el-text>{{item2.unitName }} </el-text>
-          </el-col>
-        </el-row>
-      </el-collapse-item>
-    </el-collapse>
+    <!--    已提交-->
+    <view v-if="current === 0" class="container" >
+      <u-list>
+        <u-list-item
+            v-for="(item, index) in finishList"
+            :key="item"
+            @click="handleFinishClick(item.id,index)"
+        >
+          <view class="content">
+            <view class="header">
+              <view class="title">
+                <u-image
+                    src="@/static/images/icon/product.png"
+                    width="40rpx"
+                    height="40rpx"
+                />
+                <el-text type="success" class="u-m-l-10">
+                  {{ timestampToTime(item.feedingTime) }}
+                </el-text>
+              </view>
+              <el-text type="warning">{{ findTextByValue(pipelineTypes, item.feedingPipeline)}}</el-text>
+              <el-text type="info">{{findTextByValue(feedingTypes, item.feedingType)  }}</el-text>
+            </view>
+            <view class="u-m-t-30"><el-text  size="large">{{item.feedingRecordCode}}</el-text></view>
+            <el-row class="u-m-t-30 u-m-b-30">
+              <el-col :span="8">记录人:
+                <el-text type="success">{{ item.userName }}</el-text>
+              </el-col>
+              <el-col :span="8" v-if="item.feedingType !=='org'">重量/kg:
+                <el-text>{{ item.weight }} </el-text>
+              </el-col>
+            </el-row>
+            <el-row v-for="(item2, index2) in handleFinishClick(item.id,index)" :key="index2" class="u-m-b-30">
+              <el-col :span="8">原料:
+                <el-text type="warning">{{item2.itemName}}</el-text>
+              </el-col>
+              <el-col :span="8">数量:
+                <el-text type="success">{{ item2.weight }}</el-text>
+              </el-col>
+              <el-col :span="8">单位:
+                <el-text>{{item2.unitName }} </el-text>
+              </el-col>
+            </el-row>
+          </view>
+        </u-list-item>
+      </u-list>
+    </view>
     <!--    草稿状态-->
-    <uni-section title="草稿" type="line" title-color="#f3a73f"></uni-section>
-    <el-collapse accordion>
-      <el-collapse-item v-for="(item, index) in draftList"  :name="item.id"  @click="handleDraftClick(item.id,index)">
-        <template #title>
-          <el-icon><Tickets /></el-icon>
-          <el-text type="success">{{timestampToTime(item.feedingTime)}}</el-text>&nbsp;/&nbsp;
-          <el-text  type="warning">{{ findTextByValue(pipelineTypes, item.feedingPipeline)}}</el-text>&nbsp;/&nbsp;
-          <el-text type="info">{{findTextByValue(feedingTypes, item.feedingType)  }}</el-text>
-        </template>
-        <el-text  size="large">{{item.feedingRecordCode}}</el-text>
-        <el-row>
-          <el-col :span="8">记录人:
-            <el-text type="success">{{ item.userName }}</el-text>
-          </el-col>
-          <el-col :span="4" v-if="item.feedingType !=='org'">重量/kg:
-            <el-text>{{ item.weight }} </el-text>
-          </el-col>
-          <el-col :span="3">
-            <el-button type="info"  @click="handleUpdate(item.id)">提交</el-button>
-          </el-col>
-          <el-col :span="3">
-            <el-button type="danger"  @click="handleDelete(item.id)">删除</el-button>
-          </el-col>
-        </el-row>
-        <el-row v-for="(item2, index2) in draftList[index].detailList">
-          <el-col :span="8">原料:
-            <el-text type="warning">{{item2.itemName}}</el-text>
-          </el-col>
-          <el-col :span="8">数量:
-            <el-text type="success">{{ item2.weight }}</el-text>
-          </el-col>
-          <el-col :span="8">单位:
-            <el-text>{{item2.unitName }} </el-text>
-          </el-col>
-        </el-row>
-      </el-collapse-item>
-    </el-collapse>
+    <view v-if="current === 1" class="container" >
+      <u-list>
+        <u-list-item
+            v-for="(item, index) in draftList"
+            :key="item"
+        >
+          <view class="content">
+            <view class="header">
+              <view class="title">
+                <u-image
+                    src="@/static/images/icon/product.png"
+                    width="40rpx"
+                    height="40rpx"
+                />
+                <el-text type="success" class="u-m-l-10">
+                  {{ timestampToTime(item.feedingTime) }}
+                </el-text>
+              </view>
+              <el-text type="warning">{{ findTextByValue(pipelineTypes, item.feedingPipeline)}}</el-text>
+              <el-text type="info">{{findTextByValue(feedingTypes, item.feedingType)  }}</el-text>
+            </view>
+            <view class="u-m-t-30"><el-text  size="large">{{item.feedingRecordCode}}</el-text></view>
+            <el-row class="u-m-t-30 u-m-b-30">
+              <el-col :span="8">记录人:
+                <el-text type="success">{{ item.userName }}</el-text>
+              </el-col>
+              <el-col :span="8" v-if="item.feedingType !=='org'">重量/kg:
+                <el-text>{{ item.weight }} </el-text>
+              </el-col>
+            </el-row>
+            <el-row v-for="(item2, index2) in handleDraftClick(item.id,index)" :key="index2" class="u-m-b-30">
+              <el-col :span="8">原料:
+                <el-text type="warning">{{item2.itemName}}</el-text>
+              </el-col>
+              <el-col :span="8">数量:
+                <el-text type="success">{{ item2.weight }}</el-text>
+              </el-col>
+              <el-col :span="8">单位:
+                <el-text>{{item2.unitName }} </el-text>
+              </el-col>
+            </el-row>
+          </view>
+        </u-list-item>
+      </u-list>
+      <view class="u-m-t-30 u-m-b-30"><u-line/></view>
+      <view class="u-flex justify-end">
+        <el-col :span="4" class="u-m-r-30">
+          <u-button type="info"  @click="handleUpdate(item.id)">提交</u-button>
+        </el-col>
+        <el-col :span="4">
+          <u-button type="error"  @click="handleDelete(item.id)">删除</u-button>
+        </el-col>
+      </view>
+    </view>
     <uni-fab v-if="auth.hasPermi('mes:feeding-record:create')"  ref="fab" :pattern="pattern" @fabClick="handleAdd" />
   </view>
 </template>
 
 <script setup>
-import {ref, onMounted} from 'vue';
-import {getRecordList, updateStatus, deleteById, getDetailByRecordId} from "@/api/mes/record"
-import {timestampToTime,timestampToDateTime} from "@/utils/dateUtil";
+import { ref, onMounted } from 'vue';
+import { getRecordList, updateStatus, deleteById, getDetailByRecordId } from "@/api/mes/record"
+import { timestampToTime } from "@/utils/dateUtil";
 import { pipelineTypes,feedingTypes, findTextByValue} from "@/api/system/dict/data";
-import {Tickets} from "@element-plus/icons-vue";
 import modal from "@/plugins/modal";
 import tab from "@/plugins/tab";
 import {showConfirm} from "@/utils/common";
 import auth from "@/plugins/auth";
 
+const menuList = ref([
+  {
+    name: '已提交'
+  },
+  {
+    name: '草稿'
+  }
+])
+
+const current = ref(0)
+const change = (index)=>{
+  current.value = index.index
+}
+
 //已经提交的列表
 const finishList = ref([]);
 //草稿状态的列表
@@ -129,11 +184,13 @@ function handleFinishClick(id, index){
   getDetailByRecordId(id).then(response => {
     finishList.value[index].detailList = response.data
   })
+  return finishList.value[index].detailList
 }
 function handleDraftClick(id, index){
   getDetailByRecordId(id).then(response => {
     draftList.value[index].detailList = response.data
   })
+  return  draftList.value[index].detailList
 }
 /** 提交 */
 function handleUpdate(id){
@@ -164,11 +221,30 @@ function handleAdd(){
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
 .sticky {
   background: linear-gradient(180deg, #d4e9ff 0%, #f3f9ff 100%);
   backdrop-filter: blur(27.18px);
   box-shadow: 0 1px 1px 0 rgba(0, 72, 145, 0.1),
   0 0.5px 0 0 rgba(0, 0, 0, 0.1);
 }
+.container {
+  background-color: #f1f1f1;
+  padding: 0 20rpx 20rpx 20rpx;
+  .content {
+    margin: 20rpx 0;
+    padding: 20rpx;
+    background-color: #ffffff;
+    border-radius: 10rpx;
+    .header {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      .title {
+        display: flex;
+        align-items: center;
+      }
+    }
+  }
+}
 </style>