1
This commit is contained in:
parent
2973b7c1a5
commit
d7c5f60db8
@ -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()
|
||||
|
@ -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;
|
||||
|
@ -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>
|
||||
|
@ -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 {
|
||||
|
@ -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'
|
||||
|
2
uni_modules/uni-section/changelog.md
Normal file
2
uni_modules/uni-section/changelog.md
Normal file
@ -0,0 +1,2 @@
|
||||
## 0.0.1(2022-07-22)
|
||||
- 初始化
|
167
uni_modules/uni-section/components/uni-section/uni-section.vue
Normal file
167
uni_modules/uni-section/components/uni-section/uni-section.vue
Normal file
@ -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>
|
87
uni_modules/uni-section/package.json
Normal file
87
uni_modules/uni-section/package.json
Normal file
@ -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"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
8
uni_modules/uni-section/readme.md
Normal file
8
uni_modules/uni-section/readme.md
Normal file
@ -0,0 +1,8 @@
|
||||
## Section 标题栏
|
||||
> **组件名:uni-section**
|
||||
> 代码块: `uSection`
|
||||
|
||||
uni-section 组件主要用于文章、列表详情等标题展示
|
||||
|
||||
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-section)
|
||||
#### 如使用过程中有任何问题,或者您对uni-ui有一些好的建议,欢迎加入 uni-ui 交流群:871950839
|
Loading…
Reference in New Issue
Block a user