From d7c5f60db879845da34a5fcf63945deae6bc46ea Mon Sep 17 00:00:00 2001
From: Vinjor <vinjorm@gmail.com>
Date: Fri, 25 Oct 2024 18:52:01 +0800
Subject: [PATCH] 1

---
 pages-order/orderDetail/orderDetail.vue       |   2 +-
 pages-warehouse/home/home.vue                 |  17 +-
 .../inOutWarehouse/inOutWarehouse.vue         | 116 +++++----
 pages-warehouse/inOutWarehouse/part.vue       | 245 ++++++++----------
 pages/index/index.vue                         |  19 +-
 uni_modules/uni-section/changelog.md          |   2 +
 .../components/uni-section/uni-section.vue    | 167 ++++++++++++
 uni_modules/uni-section/package.json          |  87 +++++++
 uni_modules/uni-section/readme.md             |   8 +
 9 files changed, 469 insertions(+), 194 deletions(-)
 create mode 100644 uni_modules/uni-section/changelog.md
 create mode 100644 uni_modules/uni-section/components/uni-section/uni-section.vue
 create mode 100644 uni_modules/uni-section/package.json
 create mode 100644 uni_modules/uni-section/readme.md

diff --git a/pages-order/orderDetail/orderDetail.vue b/pages-order/orderDetail/orderDetail.vue
index 096d7af..4e510f0 100644
--- a/pages-order/orderDetail/orderDetail.vue
+++ b/pages-order/orderDetail/orderDetail.vue
@@ -494,7 +494,7 @@ export default {
           title: '操作成功',
           icon: 'none'
         })
-        if("done"==this.nowChooseOperate || "check"==this.nowChooseOperate || "callCus"==this.nowChooseOperate){
+        if("done"==this.nowChooseOperate || "check"==this.nowChooseOperate || "callCus"==this.nowChooseOperate || "out"==this.nowChooseOperate){
           //移交总检需要返回| 总检拍照后需要返回
           setTimeout(() => {
             uni.navigateBack()
diff --git a/pages-warehouse/home/home.vue b/pages-warehouse/home/home.vue
index 31412e0..141c256 100644
--- a/pages-warehouse/home/home.vue
+++ b/pages-warehouse/home/home.vue
@@ -95,7 +95,8 @@ import {
   getToken,
   getUserInfo,
   getStrData,
-  getTenantId
+  getTenantId,
+  setJSONData
 } from '@/utils/auth'
 import {getDictTextByCodeAndValue,formatDate,formatTimestamp} from "@/utils/utils";
 
@@ -167,10 +168,7 @@ export default {
       })
     } else {
       //直接取缓存中的用户信息
-      this.userInfo = getUserInfo() || {
-        nickname: '用户',
-        roleNames: '角色'
-      }
+      this.userInfo = getUserInfo()
       this.onRefresherrefresh()
       this.getNoReadNum()
       this.getNoticeList()
@@ -255,10 +253,11 @@ export default {
     /**
      * 配件出库
      */
-    inOutWareHouse(formData,isBack){
-      formData.isBack = isBack
+    inOutWareHouse(formData,isReceive){
+      formData.isReceive = isReceive
+      setJSONData("applyWaresForm",formData)
       uni.navigateTo({
-        url: '/pages-warehouse/inOutWarehouse/inOutWarehouse?formData='+encodeURIComponent(JSON.stringify(formData))
+        url: '/pages-warehouse/inOutWarehouse/inOutWarehouse'
       })
     },
 
@@ -658,7 +657,7 @@ export default {
     background: #FFFFFF;
     border-radius: 8rpx 8rpx 8rpx 8rpx;
     padding: 0 30rpx 30rpx;
-
+    margin-bottom: 20rpx;
     .order-top {
       padding: 30rpx 0;
       display: flex;
diff --git a/pages-warehouse/inOutWarehouse/inOutWarehouse.vue b/pages-warehouse/inOutWarehouse/inOutWarehouse.vue
index 62107c4..58998bf 100644
--- a/pages-warehouse/inOutWarehouse/inOutWarehouse.vue
+++ b/pages-warehouse/inOutWarehouse/inOutWarehouse.vue
@@ -12,25 +12,34 @@
           <view class="repairName">{{ item.waresName }}</view>
           <view class="repairBottom">
             <text class="repairDesc">单位：
-              <text class="repairUnit">{{ item.unitStr }}</text>
+              <text class="repairUnit">{{ item.wares.unit }}</text>
             </text>
-            <text class="repairDesc">库存：
-              <text class="repairUnit">{{ item.wares.stock }}</text>
+            <text class="repairDesc">申请数量：
+              <text class="repairUnit">{{ item.waresCount }}</text>
             </text>
             <view class="repairBtns">
               <u-icon name="minus-circle-fill" size="24" @click="delNum(item)"></u-icon>
-              <text class="repairNum">{{ item.waresCount }}</text>
+              <text class="repairNum">{{ item.thisNum }}</text>
               <u-icon color="#0174F6" name="plus-circle-fill" size="24" @click="addNum(item)"></u-icon>
             </view>
           </view>
+          <view class="repairBottom">
+            <text class="repairDesc">库存：
+              <text class="repairUnit">{{ item.wares.stock }}</text>
+            </text>
+            <text class="repairDesc">已领取：
+              <text class="repairUnit">{{ item.waresAlreadyCount }}</text>
+            </text>
+            <view class="repairBtns"></view>
+          </view>
         </view>
       </view>
     </view>
     <view class="footer">
       <text class="label"></text>
       <text class="repairNum"></text>
-      <view class="submit" v-if="type" @click="toPart">采购</view>
-      <view class="submit" @click="submit">{{type?'通知领料':'通知退料'}}</view>
+      <view class="submit"  @click="toPart">采购</view>
+      <view class="submit" @click="submit">{{isReceive?'通知领料':'通知退料'}}</view>
     </view>
   </view>
 </template>
@@ -38,6 +47,9 @@
 <script>
 import VNavigationBar from "@/components/VNavigationBar.vue";
 import request from '@/utils/request';
+import {
+  getJSONData,setJSONData
+} from '@/utils/auth'
 import {getDictTextByCodeAndValue,createUniqueCodeByHead} from "@/utils/utils";
 
 export default {
@@ -48,24 +60,20 @@ export default {
       twId:'',
       //配件列表
       wares:[],
-      //01零配件、02退配件
-      type:true,
+      //true 领料 ，false  退料
+      isReceive:true,
       //父组件传入的数据
       formData:{},
-      repairList: [],
-      selectedRepairList: [
-        {name: '炫驰全合成机油S7 4L/ALL', num: 3, unit: '桶', id: 3}
-      ],
       active: ''
     };
   },
   onLoad(data) {
-    if (data.formData){
-      this.formData = JSON.parse(decodeURIComponent(data.formData))
-      this.type = this.formData.isBack
+    if(getJSONData("applyWaresForm")){
+      this.formData = getJSONData("applyWaresForm")
+      this.isReceive = this.formData.isReceive
       this.twId = this.formData.id
+      this.init()
     }
-    this.init()
   },
 
   computed: {},
@@ -82,28 +90,44 @@ export default {
         method: 'get',
         params: params
       }).then((res)=>{
-        const items = res.data;
-        items.map((item)=>{
-          const count = item.waresAlreadyCount ? parseInt(item.waresCount) - parseInt(item.waresAlreadyCount) : item.waresCount
-          item.waresCount = this.type ? count : item.waresAlreadyCount
-          item.isStock = this.type ? count <= item.wares.stock : true
-          getDictTextByCodeAndValue("repair_unit",item.wares.unit).then(value => {
-            item.unitStr = value
-          }).catch(error => {
-            item.unitStr = "未知"
-          });
+        res.data.map((item)=>{
+          if(!item.waresAlreadyCount){
+            item.waresAlreadyCount = 0
+          }
+          if(!item.wares.stock){
+            item.wares.stock=0
+          }
+          if(this.isReceive){
+            //领料，最大可领取数量为申请数量-已领取数量，同时不能大于库存数量，默认数量就是最大可领取数量
+            item.maxNum = parseInt(item.waresCount) - parseInt(item.waresAlreadyCount)
+            if(item.maxNum >item.wares.stock){
+              item.maxNum = item.wares.stock
+            }
+            item.thisNum = item.maxNum
+          }else{
+            //退料，最大数量为已领取数量，最小数量为0,默认数量为0
+            item.maxNum = item.waresAlreadyCount
+            item.thisNum = 0
+          }
         })
-        this.wares = items;
+        this.wares = res.data;
       })
     },
     /**
      *
      */
     addNum(repair) {
-      this.$set(repair, 'waresCount', repair.waresCount + 1)
-      const find = this.wares.find(f => f.id === repair.id)
+      if((repair.thisNum+1) > repair.maxNum){
+        uni.showToast({
+          title: '超过库存数量或最大申请数量！',
+          icon: 'none'
+        })
+        return
+      }
+      this.$set(repair, 'thisNum', repair.thisNum + 1)
+      const find = this.wares.find(f => f.id == repair.id)
       if (find) {
-        find.waresCount = repair.waresCount
+        find.thisNum = repair.thisNum
       } else {
         this.wares.push(JSON.parse(JSON.stringify(repair)))
       }
@@ -113,15 +137,16 @@ export default {
      * 减
      */
     delNum(repair) {
-      if (repair.waresCount <= 0) {
+      if (repair.thisNum == 0) {
+        //已经等于0了，没法再减了
         return
       }
-      this.$set(repair, 'waresCount', repair.waresCount - 1)
-      const findIndex = this.wares.findIndex(f => f.id === repair.id)
-      if (findIndex > -1 && repair.num <= 0) {
-        this.wares.splice(findIndex, 1)
-      } else if (repair.num > 0) {
-        this.$set(this.wares[findIndex], 'waresCount', repair.waresCount)
+      this.$set(repair, 'thisNum', repair.thisNum - 1)
+      const find = this.wares.find(f => f.id == repair.id)
+      if (find) {
+        find.thisNum = repair.thisNum
+      } else {
+        this.wares.push(JSON.parse(JSON.stringify(repair)))
       }
     },
     /**
@@ -129,20 +154,20 @@ export default {
      */
     submit() {
       this.formData.repairSo = {
-        soType:this.type?'02':'04',
-        soNo:createUniqueCodeByHead(this.type?'LL':'TL'),
+        soType:this.isReceive?'02':'04',
+        soNo:createUniqueCodeByHead(this.isReceive?'LL':'TL'),
         userId:this.formData.repairId,
         userName:this.formData.repairName,
-        soStatus:this.type?'04':'07'
+        soStatus:this.isReceive?'04':'07'
       }
       this.formData.repairSois = [...this.wares.map(item =>{
         return {
-          soiType: this.type ? '02' : "04",
+          soiType: this.isReceive ? '02' : "04",
           goodsId: item.waresId,
-          goodsCount: item.waresCount,
+          goodsCount: item.thisNum,
         }
       })]
-      if (this.type){
+      if (this.isReceive){
         this.formData.items = [...this.wares.map(item => {
           return {
             id: item.id,
@@ -172,8 +197,9 @@ export default {
     toPart(){
       const formData = this.formData;
       formData.items = this.wares;
+      setJSONData("applyWaresForm",formData)
       uni.navigateTo({
-        url: '/pages-warehouse/inOutWarehouse/part?formData='+encodeURIComponent(JSON.stringify(formData))
+        url: '/pages-warehouse/inOutWarehouse/part'
       })
     }
 
@@ -278,6 +304,7 @@ export default {
     }
 
     .repairBtns {
+      width: 65px;
       display: flex;
       align-items: center;
       column-gap: 10rpx;
@@ -306,6 +333,7 @@ export default {
     line-height: 72rpx;
     font-size: 32rpx;
     color: #FFFFFF;
+    margin-left: 20rpx;
   }
 }
 </style>
diff --git a/pages-warehouse/inOutWarehouse/part.vue b/pages-warehouse/inOutWarehouse/part.vue
index bcc46e6..b615dee 100644
--- a/pages-warehouse/inOutWarehouse/part.vue
+++ b/pages-warehouse/inOutWarehouse/part.vue
@@ -1,56 +1,36 @@
 <template>
   <view class="container">
     <VNavigationBar background-color="#fff" title="采购单" title-color="#333"></VNavigationBar>
-
     <view class="listBox">
       <view class="list">
-        <view v-for="(item, index) in partList" :key="index" class="listItem">
-          <view class="repairName">{{ item.name }}</view>
-          <view class="repairBottom">
-            <text class="repairDesc">上次价格：
-              <text class="repairUnit">{{ item.purPrice }}</text>
-            </text>
-            <text class="repairDesc">单价：
-              <text class="repairUnit">
-                <u--input type="number"
-                  placeholder="请输入内容"
-                  border="surround"
-                  v-model="item.newPrice"/>
-              </text>
-            </text>
-            <text class="repairDesc">数量：
-              <text class="repairUnit">
-                <u--input
-                    type="number"
-                    placeholder="请输入内容"
-                    border="surround"
-                    v-model="item.count"/>
-              </text>
-            </text>
-
-
-            <!--<view class="repairBtns">-->
-<!--              <u-icon name="minus-circle-fill" size="24" @click="delNum(item)"></u-icon>-->
-<!--              <text class="repairNum">{{ item.waresCount }}</text>-->
-<!--              <u-icon color="#0174F6" name="plus-circle-fill" size="24" @click="addNum(item)"></u-icon>-->
-<!--            </view>-->
-          </view>
+        <view class="formItem">
+          <text class="formLabel">供应商</text>
+          <input type="text" style="text-align: right" v-model="serviceName" placeholder="请选择供应商"/>
+          <view @click="searchService">查询</view>
         </view>
-        <u--input
-            placeholder="备注"
-            border="surround"
-            type="text"
-            v-model="remark"
-            clearable
-        ></u--input>
+        <view class="formItem">
+          <text class="formLabel">备注</text>
+          <text class="formValue"></text>
+        </view>
+        <view style="padding-bottom: 60rpx;border-bottom: 1px solid #ddd;" class="formItem">
+          <textarea style="height: 50px" auto-height placeholder="请输入备注" v-model="remark" />
+        </view>
+        <uni-card v-for="(item, index) in partList" :key="index" :title="item.name" :extra="'上次价格：'+item.purPrice">
+          <view class="formItem">
+            <text class="formLabel">单价</text>
+            <input type="number" style="text-align: right" v-model="item.newPrice" placeholder="请输入单价"/>
+          </view>
+          <view class="formItem">
+            <text class="formLabel">数量</text>
+            <input type="number" style="text-align: right" v-model="item.count" placeholder="请输入数量"/>
+          </view>
+        </uni-card>
       </view>
-
     </view>
-
     <view class="footer">
       <text class="label"></text>
       <text class="repairNum"></text>
-      <view class="submit" @click="submit">结算</view>
+      <view class="submit" @click="submit">保存</view>
     </view>
   </view>
 </template>
@@ -59,7 +39,7 @@
 import VNavigationBar from "@/components/VNavigationBar.vue";
 import request from '@/utils/request';
 import {getDictTextByCodeAndValue,createUniqueCodeByHead} from "@/utils/utils";
-import {getUserInfo} from '@/utils/auth.js'
+import {getUserInfo,getJSONData} from '@/utils/auth.js'
 
 export default {
   components: {VNavigationBar},
@@ -80,12 +60,16 @@ export default {
       selectedRepairList: [
         {name: '炫驰全合成机油S7 4L/ALL', num: 3, unit: '桶', id: 3}
       ],
-      active: ''
+      active: '',
+      //供应商名称
+      serviceName:"",
+      //供应商id
+      serviceId:"",
     };
   },
-  onLoad(data) {
-    if (data.formData){
-      this.formData = JSON.parse(decodeURIComponent(data.formData))
+  onLoad() {
+    if (getJSONData("applyWaresForm")){
+      this.formData = getJSONData("applyWaresForm")
       this.wares = this.formData.items
     }
     this.init()
@@ -95,6 +79,41 @@ export default {
 
   },
   methods: {
+    /**
+     * 查询供应商
+     */
+    searchService(){
+      if(""==this.serviceName){
+        uni.showToast({
+          title: '请输入供应商名称！',
+          icon: 'none'
+        })
+        return
+      }
+      //查询供应商
+      request({
+        url: '/admin-api/supplier/baseSupplier/searchList',
+        method: 'get',
+        params: {name:this.serviceName}
+      }).then((res) => {
+        console.log(res)
+        if (res.code == 200 && res.data.length>0) {
+          uni.showActionSheet({
+            itemList: res.data.map(m => m.name),
+            success: ({ tapIndex }) => {
+              this.serviceName = res.data[tapIndex].name
+              this.serviceId = res.data[tapIndex].id
+            }
+          })
+        }else{
+          //未查询到符合条件的供应商
+          uni.showToast({
+            title: '未查询到符合条件的供应商，您可以直接使用，系统将自动保存为新供应商！',
+            icon: 'none'
+          })
+        }
+      })
+    },
     /**
      * 初始化配件数据
      */
@@ -150,7 +169,9 @@ export default {
         itemCount:this.partList.length,
         totalPrice:this.partList.reduce((x, y) => {return x + y.totalPrice}, 0),
         soStatus:'03',
-        remark:this.remark
+        remark:this.remark,
+        supplierId:this.serviceId,
+        supplierName:this.serviceName
       }
       data.goodsList = [...this.partList.map(item => {
         return {
@@ -163,6 +184,8 @@ export default {
           remark: item.remark
         }
       })]
+      console.log(data)
+      debugger
       request({
         url: '/admin-api/repair/so/create',
         method: 'post',
@@ -191,101 +214,55 @@ export default {
   display: flex;
   flex-direction: column;
 }
-
-.search {
-  padding: 0 40rpx;
-  background-color: #fff;
-
-  & > .searchBox {
-    height: 84rpx;
-    background: #F3F5F7;
-    border-radius: 12rpx 12rpx 12rpx 12rpx;
-    margin: 0 auto;
-    padding: 0 30rpx;
-    font-size: 28rpx;
-    color: #0174F6;
-
-    display: flex;
-    align-items: center;
-  }
-
-  .searchInput {
-    flex: 1;
-    width: 0;
-    color: #333;
-  }
-}
-
-.tabs {
-  background-color: #fff;
-  padding: 30rpx 40rpx;
-  margin: 0 auto;
-  display: flex;
-  align-items: center;
-  column-gap: 30rpx;
-  overflow: auto;
-
-  .tab-item {
-    flex-shrink: 0;
-    padding: 16rpx 30rpx;
-    font-size: 28rpx;
-    color: #113A68;
-    background: #F2F2F7;
-    border-radius: 30rpx 30rpx 30rpx 30rpx;
-
-    &.active {
-      background: #0174F6;
-      color: #fff;
-    }
-
-  }
-}
-
 .listBox {
-  padding: 30rpx 32rpx;
+  padding: 30 rpx 32 rpx;
   flex: 1;
   height: 0;
+}
+.list {
+  background-color: #fff;
+  padding: 0 30rpx;
+  height: 100%;
+  overflow: auto;
+}
+.formItem {
+  box-sizing: border-box;
+  margin: 0 auto;
+  padding: 20rpx;
 
-  .list {
-    background-color: #fff;
-    padding: 0 30rpx;
-    height: 100%;
-    overflow: auto;
-  }
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  column-gap: 20rpx;
 
-  .listItem {
-    padding: 30rpx 0;
-    border-bottom: 2rpx solid #DDDDDD;
-    &:last-child {
-      border-bottom: none;
-    }
-    .repairName {
-      font-size: 32rpx;
-      color: #333333;
-      margin-bottom: 20rpx;
-    }
+  border-bottom: 1rpx solid #DDDDDD;
+}
 
-    .repairBottom {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-    }
+.formLabel {
+  font-size: 32rpx;
+  color: #333333;
+}
 
-    .repairDesc {
-      font-size: 28rpx;
-      color: #858BA0;
-    }
+.formValue {
+  flex: 1;
+  width: 0;
+  text-align: right;
+  font-size: 32rpx;
+  color: #999999;
+}
+.repairBottom {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
 
-    .repairUnit {
-      color: #333333;
-    }
+.repairDesc {
+  font-size: 28rpx;
+  color: #858BA0;
+}
 
-    .repairBtns {
-      display: flex;
-      align-items: center;
-      column-gap: 10rpx;
-    }
-  }
+.repairUnit {
+  color: #333333;
 }
 
 .footer {
diff --git a/pages/index/index.vue b/pages/index/index.vue
index 5d75175..08b7164 100644
--- a/pages/index/index.vue
+++ b/pages/index/index.vue
@@ -5,9 +5,7 @@
 </template>
 
 <script>
-	import {
-		getToken
-	} from "@/utils/auth";
+	import {getToken,getUserInfo} from "@/utils/auth";
 
 	export default {
 		data() {
@@ -18,9 +16,18 @@
 		onLoad() {
       if(getToken()){
         //跳转首页
-        uni.navigateTo({
-          url: '/pages-home/home/home'
-        })
+        //判断是否是仓管，仓管需要跳单独的首页
+        let userInfo = getUserInfo()
+        if(userInfo.roleCodes.includes('repair_warehouse')){
+          //仓管
+          uni.navigateTo({
+            url: '/pages-warehouse/home/home'
+          })
+        }else{
+          uni.navigateTo({
+            url: '/pages-home/home/home'
+          })
+        }
       }else{
         uni.navigateTo({
           url: '/pages/login/login'
diff --git a/uni_modules/uni-section/changelog.md b/uni_modules/uni-section/changelog.md
new file mode 100644
index 0000000..738f2b3
--- /dev/null
+++ b/uni_modules/uni-section/changelog.md
@@ -0,0 +1,2 @@
+## 0.0.1（2022-07-22）
+- 初始化
diff --git a/uni_modules/uni-section/components/uni-section/uni-section.vue b/uni_modules/uni-section/components/uni-section/uni-section.vue
new file mode 100644
index 0000000..9a52e0b
--- /dev/null
+++ b/uni_modules/uni-section/components/uni-section/uni-section.vue
@@ -0,0 +1,167 @@
+<template>
+	<view class="uni-section">
+		<view class="uni-section-header" @click="onClick">
+				<view class="uni-section-header__decoration" v-if="type" :class="type" />
+        <slot v-else name="decoration"></slot>
+
+        <view class="uni-section-header__content">
+          <text :style="{'font-size':titleFontSize,'color':titleColor}" class="uni-section__content-title" :class="{'distraction':!subTitle}">{{ title }}</text>
+          <text v-if="subTitle" :style="{'font-size':subTitleFontSize,'color':subTitleColor}" class="uni-section-header__content-sub">{{ subTitle }}</text>
+        </view>
+
+        <view class="uni-section-header__slot-right">
+          <slot name="right"></slot>
+        </view>
+		</view>
+
+		<view class="uni-section-content" :style="{padding: _padding}">
+			<slot />
+		</view>
+	</view>
+</template>
+
+<script>
+
+	/**
+	 * Section 标题栏
+	 * @description 标题栏
+	 * @property {String} type = [line|circle|square] 标题装饰类型
+	 * 	@value line 竖线
+	 * 	@value circle 圆形
+	 * 	@value square 正方形
+	 * @property {String} title 主标题
+	 * @property {String} titleFontSize 主标题字体大小
+	 * @property {String} titleColor 主标题字体颜色
+	 * @property {String} subTitle 副标题
+	 * @property {String} subTitleFontSize 副标题字体大小
+	 * @property {String} subTitleColor 副标题字体颜色
+	 * @property {String} padding 默认插槽 padding
+	 */
+
+	export default {
+		name: 'UniSection',
+    emits:['click'],
+		props: {
+			type: {
+				type: String,
+				default: ''
+			},
+			title: {
+				type: String,
+				required: true,
+				default: ''
+			},
+      titleFontSize: {
+        type: String,
+        default: '14px'
+      },
+			titleColor:{
+				type: String,
+				default: '#333'
+			},
+			subTitle: {
+				type: String,
+				default: ''
+			},
+      subTitleFontSize: {
+        type: String,
+        default: '12px'
+      },
+      subTitleColor: {
+        type: String,
+        default: '#999'
+      },
+			padding: {
+				type: [Boolean, String],
+				default: false
+			}
+		},
+    computed:{
+      _padding(){
+        if(typeof this.padding === 'string'){
+          return this.padding
+        }
+
+        return this.padding?'10px':''
+      }
+    },
+		watch: {
+			title(newVal) {
+				if (uni.report && newVal !== '') {
+					uni.report('title', newVal)
+				}
+			}
+		},
+    methods: {
+			onClick() {
+				this.$emit('click')
+			}
+		}
+	}
+</script>
+<style lang="scss" >
+	$uni-primary: #2979ff !default;
+
+	.uni-section {
+		background-color: #fff;
+    .uni-section-header {
+      position: relative;
+      /* #ifndef APP-NVUE */
+      display: flex;
+      /* #endif */
+      flex-direction: row;
+      align-items: center;
+      padding: 12px 10px;
+      font-weight: normal;
+
+      &__decoration{
+        margin-right: 6px;
+        background-color: $uni-primary;
+        &.line {
+          width: 4px;
+          height: 12px;
+          border-radius: 10px;
+        }
+
+        &.circle {
+          width: 8px;
+          height: 8px;
+          border-top-right-radius: 50px;
+          border-top-left-radius: 50px;
+          border-bottom-left-radius: 50px;
+          border-bottom-right-radius: 50px;
+        }
+
+        &.square {
+          width: 8px;
+          height: 8px;
+        }
+      }
+
+      &__content {
+        /* #ifndef APP-NVUE */
+        display: flex;
+        /* #endif */
+        flex-direction: column;
+        flex: 1;
+        color: #333;
+
+        .distraction {
+          flex-direction: row;
+          align-items: center;
+        }
+        &-sub {
+          margin-top: 2px;
+        }
+      }
+
+      &__slot-right{
+        font-size: 14px;
+      }
+    }
+
+    .uni-section-content{
+      font-size: 14px;
+    }
+	}
+</style>
diff --git a/uni_modules/uni-section/package.json b/uni_modules/uni-section/package.json
new file mode 100644
index 0000000..0a31fb5
--- /dev/null
+++ b/uni_modules/uni-section/package.json
@@ -0,0 +1,87 @@
+{
+  "id": "uni-section",
+  "displayName": "uni-section 标题栏",
+  "version": "0.0.1",
+  "description": "标题栏组件",
+  "keywords": [
+    "uni-ui",
+    "uniui",
+    "标题栏"
+],
+  "repository": "https://github.com/dcloudio/uni-ui",
+  "engines": {
+    "HBuilderX": ""
+  },
+  "directories": {
+    "example": "../../temps/example_temps"
+  },
+  "dcloudext": {
+    "category": [
+      "前端组件",
+      "通用组件"
+    ],
+    "sale": {
+      "regular": {
+        "price": "0.00"
+      },
+      "sourcecode": {
+        "price": "0.00"
+      }
+    },
+    "contact": {
+      "qq": ""
+    },
+    "declaration": {
+      "ads": "无",
+      "data": "无",
+      "permissions": "无"
+    },
+    "npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
+  },
+  "uni_modules": {
+    "dependencies": [
+      "uni-scss"
+    ],
+    "encrypt": [],
+    "platforms": {
+      "cloud": {
+        "tcb": "y",
+        "aliyun": "y"
+      },
+      "client": {
+        "App": {
+          "app-vue": "y",
+          "app-nvue": "y"
+        },
+        "H5-mobile": {
+          "Safari": "y",
+          "Android Browser": "y",
+          "微信浏览器(Android)": "y",
+          "QQ浏览器(Android)": "y"
+        },
+        "H5-pc": {
+          "Chrome": "y",
+          "IE": "y",
+          "Edge": "y",
+          "Firefox": "y",
+          "Safari": "y"
+        },
+        "小程序": {
+          "微信": "y",
+          "阿里": "y",
+          "百度": "y",
+          "字节跳动": "y",
+          "QQ": "y"
+        },
+        "快应用": {
+          "华为": "u",
+          "联盟": "u"
+        },
+        "Vue": {
+            "vue2": "y",
+            "vue3": "y"
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/uni_modules/uni-section/readme.md b/uni_modules/uni-section/readme.md
new file mode 100644
index 0000000..d47faab
--- /dev/null
+++ b/uni_modules/uni-section/readme.md
@@ -0,0 +1,8 @@
+## Section 标题栏
+> **组件名：uni-section**
+> 代码块： `uSection`
+
+uni-section 组件主要用于文章、列表详情等标题展示
+
+### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-section)
+#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839