first
This commit is contained in:
369
pageInvoicing/category-management/add-products.vue
Normal file
369
pageInvoicing/category-management/add-products.vue
Normal file
@@ -0,0 +1,369 @@
|
||||
<template>
|
||||
<view class="min-page bg-gray u-p-30 u-font-28 color-333">
|
||||
|
||||
<view class=" ">
|
||||
<uni-forms ref="refform" label-position="left" :model="form" label-align="left" label-width="300"
|
||||
:rules="rules">
|
||||
<view class="">
|
||||
<text class="">货品信息</text>
|
||||
</view>
|
||||
<view class="form">
|
||||
<view class="border-bottom u-p-b-10">
|
||||
<uni-forms-item required label="" name="name">
|
||||
<template #label>
|
||||
<view class="u-text-left">
|
||||
<text class="color-333 u-font-28">货品名称</text>
|
||||
<!-- <text class="color-red">*</text> -->
|
||||
</view>
|
||||
</template>
|
||||
<view class="u-flex-1">
|
||||
<uni-easyinput :inputBorder="false" paddingNone v-model="form.name"
|
||||
placeholder="填写货品名称"></uni-easyinput>
|
||||
</view>
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
<view class="border-bottom u-p-b-10 u-p-t-10">
|
||||
<uni-forms-item required label="" name="code">
|
||||
<template #label>
|
||||
<view class="u-text-left">
|
||||
<text class="color-333 u-font-28">货品编码</text>
|
||||
<!-- <text class="color-red">*</text> -->
|
||||
</view>
|
||||
</template>
|
||||
<view class="u-flex-1 ">
|
||||
<uni-easyinput :inputBorder="false" paddingNone v-model="form.code"
|
||||
placeholder="填写货品编码"></uni-easyinput>
|
||||
</view>
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
<view class="border-bottom u-p-b-10 u-p-t-10">
|
||||
<uni-forms-item required label="" name="category">
|
||||
<template #label>
|
||||
<view class="u-text-left ">
|
||||
<text class="color-333 u-font-28">货品类别</text>
|
||||
<!-- <text class="color-red">*</text> -->
|
||||
</view>
|
||||
</template>
|
||||
<picker @change="categoryChange" :value="categoryCurrent" range-key="name"
|
||||
:range="category">
|
||||
<view class=" u-flex u-row-between u-relative ">
|
||||
<view class="zhezhao u-absolute position-all" style="z-index: 1;"></view>
|
||||
<!-- <view>
|
||||
<text class="" v-if="form.category!==''">{{category[form.category].name}}</text>
|
||||
<text class="color-999 " v-else>选择分类</text>
|
||||
</view> -->
|
||||
<view class="u-flex-1">
|
||||
<uni-easyinput :inputBorder="false" paddingNone v-model="form.category"
|
||||
placeholder="未分类"></uni-easyinput>
|
||||
</view>
|
||||
<uni-icons type="right" size="18" color="#999"></uni-icons>
|
||||
</view>
|
||||
|
||||
</picker>
|
||||
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
<view class="border-bottom u-p-b-10">
|
||||
<uni-forms-item required label="" name="unit">
|
||||
<template #label>
|
||||
<view class="u-text-left">
|
||||
<text class="color-333 u-font-28">计量单位</text>
|
||||
<!-- <text class="color-red">*</text> -->
|
||||
</view>
|
||||
</template>
|
||||
<view class="u-flex-1">
|
||||
<uni-easyinput :inputBorder="false" paddingNone v-model="form.unit"
|
||||
placeholder="填写计量单位"></uni-easyinput>
|
||||
</view>
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
|
||||
<view class="border-bottom u-p-b-10">
|
||||
<uni-forms-item required label="" name="">
|
||||
<template #label>
|
||||
<view class="u-text-left">
|
||||
<text class="color-333 u-font-28">入库数量</text>
|
||||
<!-- <text class="color-red">*</text> -->
|
||||
</view>
|
||||
</template>
|
||||
<view class="u-flex-1">
|
||||
<uni-easyinput type="digit" :inputBorder="false" paddingNone v-model="form.inNumber"
|
||||
placeholder="选填"></uni-easyinput>
|
||||
</view>
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
|
||||
<view class="border-bottom u-p-b-10">
|
||||
<uni-forms-item required label="" name="unit">
|
||||
<template #label>
|
||||
<view class="u-text-left">
|
||||
<text class="color-333 u-font-28">总价值</text>
|
||||
<!-- <text class="color-red">*</text> -->
|
||||
</view>
|
||||
</template>
|
||||
<view class="u-flex">
|
||||
<view class="u-flex-1">
|
||||
<uni-easyinput type="digit" :inputBorder="false" paddingNone v-model="form.allPrice"
|
||||
placeholder="选填"></uni-easyinput>
|
||||
</view>
|
||||
<view class="u-p-l-30">元</view>
|
||||
</view>
|
||||
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
|
||||
<view class=" u-p-b-10">
|
||||
<uni-forms-item required label="" name="price">
|
||||
<template #label>
|
||||
<view class="u-text-left">
|
||||
<text class="color-333 u-font-28">平均单价</text>
|
||||
<!-- <text class="color-red">*</text> -->
|
||||
</view>
|
||||
</template>
|
||||
<view class="u-flex-1">
|
||||
<uni-easyinput type="digit" :inputBorder="false" paddingNone v-model="form.price"
|
||||
placeholder="0"></uni-easyinput>
|
||||
</view>
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="u-m-t-32">
|
||||
<text class="">供应商信息(选填)</text>
|
||||
</view>
|
||||
<div class="form">
|
||||
<view class="border-bottom u-p-b-10">
|
||||
<uni-forms-item required label="" >
|
||||
<template #label>
|
||||
<view class="u-text-left">
|
||||
<text class="color-333 u-font-28">供应商名称</text>
|
||||
<!-- <text class="color-red">*</text> -->
|
||||
</view>
|
||||
</template>
|
||||
<view class="u-flex-1">
|
||||
<uni-easyinput :inputBorder="false" paddingNone v-model="form.supplierShopName"
|
||||
placeholder="填写供应商名称"></uni-easyinput>
|
||||
</view>
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
<view class="border-bottom u-p-b-10">
|
||||
<uni-forms-item required label="" >
|
||||
<template #label>
|
||||
<view class="u-text-left">
|
||||
<text class="color-333 u-font-28">联系人</text>
|
||||
<!-- <text class="color-red">*</text> -->
|
||||
</view>
|
||||
</template>
|
||||
<view class="u-flex-1">
|
||||
<uni-easyinput :inputBorder="false" paddingNone v-model="form.supplierName"
|
||||
placeholder="填写联系人"></uni-easyinput>
|
||||
</view>
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
<view class=" u-p-b-10">
|
||||
<uni-forms-item required label="" name="name">
|
||||
<template #label>
|
||||
<view class="u-text-left">
|
||||
<text class="color-333 u-font-28">联系电话</text>
|
||||
<!-- <text class="color-red">*</text> -->
|
||||
</view>
|
||||
</template>
|
||||
<view class="u-flex-1">
|
||||
<uni-easyinput :inputBorder="false" paddingNone v-model="form.supplierPhone"
|
||||
placeholder="填写联系号码"></uni-easyinput>
|
||||
</view>
|
||||
</uni-forms-item>
|
||||
</view>
|
||||
</div>
|
||||
|
||||
</uni-forms>
|
||||
</view>
|
||||
<view style="height: 200rpx;">
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="fixed-b u-flex u-row-right">
|
||||
<view><my-button shape="circle" type="cancel" height="56" @tap="cancel">
|
||||
<view class="u-p-r-30 u-p-l-30 color-999">取消</view>
|
||||
</my-button></view>
|
||||
<view class="u-m-l-30"><my-button shape="circle" height="56" @tap="submit">
|
||||
<view class="u-p-r-30 u-p-l-30">保存</view>
|
||||
</my-button></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onLoad,
|
||||
onReady,
|
||||
onShow,
|
||||
onPageScroll,
|
||||
onPullDownRefresh
|
||||
} from '@dcloudio/uni-app';
|
||||
import myButton from '../../components/my-components/my-button';
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue';
|
||||
const units = reactive({
|
||||
list: [{
|
||||
name: '件',
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
name: '杯',
|
||||
value: 2
|
||||
},
|
||||
{
|
||||
name: '个',
|
||||
value: 3
|
||||
}
|
||||
],
|
||||
current: ''
|
||||
})
|
||||
const category = reactive([{
|
||||
name: '分类1',
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
name: '分类2',
|
||||
value: 2
|
||||
},
|
||||
{
|
||||
name: '分类3',
|
||||
value: 3
|
||||
}
|
||||
])
|
||||
let categoryCurrent = ref('')
|
||||
|
||||
function categoryChange(e) {
|
||||
console.log(e);
|
||||
categoryCurrent.value = e.detail.value
|
||||
form.category = category[e.detail.value].name
|
||||
}
|
||||
|
||||
function unitChange(e) {
|
||||
units.current = e.detail.value
|
||||
form.unit = units.list[e.detail.value].name
|
||||
}
|
||||
|
||||
const refform = ref(null)
|
||||
const form = reactive({
|
||||
name: '',
|
||||
code: '',
|
||||
category: '',
|
||||
price: 0,
|
||||
inNumber: 0,
|
||||
unit: '',
|
||||
number: 0,
|
||||
inNumber: 0,
|
||||
allPrice:0,
|
||||
supplierShopName:'',
|
||||
supplierName:'',
|
||||
supplierPhone:'',
|
||||
})
|
||||
// 校验规则
|
||||
const rules = {
|
||||
name: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '菜品名称不能为空'
|
||||
}]
|
||||
},
|
||||
code: {
|
||||
rules: [{
|
||||
required: true,
|
||||
}]
|
||||
},
|
||||
category: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '请选择菜品分类'
|
||||
}]
|
||||
},
|
||||
price: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '请输入价格'
|
||||
}]
|
||||
},
|
||||
unit: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '请选择单位'
|
||||
}]
|
||||
},
|
||||
price: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '请填写下单数量'
|
||||
}]
|
||||
},
|
||||
}
|
||||
|
||||
function submit() {
|
||||
refform.value.validate(res => {
|
||||
console.log(res)
|
||||
}).catch(err => {
|
||||
console.log(err);
|
||||
})
|
||||
}
|
||||
const page = reactive({
|
||||
type: 'add'
|
||||
})
|
||||
function cancel(){
|
||||
uni.navigateBack()
|
||||
}
|
||||
onLoad(opt => {
|
||||
if (JSON.stringify(opt) != '{}' && opt.hasOwnProperty('type')) {
|
||||
page.type = opt.type
|
||||
}
|
||||
uni.setNavigationBarTitle({
|
||||
title: page.type === 'add' ? '添加货品' : '编辑货品'
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.form {
|
||||
margin-top: 32rpx;
|
||||
background-color: #fff;
|
||||
padding: 32rpx 24rpx 32rpx 24rpx;
|
||||
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
||||
|
||||
.u-text-left {
|
||||
min-width: 160rpx;
|
||||
}
|
||||
|
||||
// background-color: transparent;
|
||||
}
|
||||
|
||||
::v-deep.uni-forms-item {
|
||||
min-height: inherit;
|
||||
}
|
||||
|
||||
::v-deep.uni-forms-item .uni-forms-item__label {
|
||||
font-size: 28rpx !important;
|
||||
}
|
||||
|
||||
::v-deep.uni-easyinput__placeholder-class {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
::v-deep.uni-forms-item__error {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.fixed-b {
|
||||
position: fixed;
|
||||
left: 0;
|
||||
right: 0;
|
||||
background-color: #fff;
|
||||
padding-top: 28rpx;
|
||||
padding-right: 28rpx;
|
||||
padding-left: 28rpx;
|
||||
padding-bottom: calc(env(safe-area-inset-bottom) + 44rpx);
|
||||
bottom: 0;
|
||||
}
|
||||
</style>
|
||||
69
pageInvoicing/category-management/category-management.vue
Normal file
69
pageInvoicing/category-management/category-management.vue
Normal file
@@ -0,0 +1,69 @@
|
||||
<template>
|
||||
<view class="min-page bg-gray">
|
||||
<template v-if="page.list.length">
|
||||
<view class="u-m-b-28 " v-for="(item,index) in page.list" :key="index">
|
||||
<list-item @more="moreShow"></list-item>
|
||||
</view>
|
||||
<uni-load-more :status="page.status" />
|
||||
</template>
|
||||
<template v-else>
|
||||
<view class="" style="margin-top: 150rpx;">
|
||||
<my-empty tips="暂无出库记录"></my-empty>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
<view class="u-fix bottom">
|
||||
<my-button shape="circle" type="primary" @tap="toAddCategory">添加类别</my-button>
|
||||
</view>
|
||||
<my-action-sheet @itemClick="sheetClick" ref="refMoreSheet" :list="actionSheet.list"></my-action-sheet>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import go from '@/commons/utils/go.js'
|
||||
import myButton from '@/components/my-components/my-button';
|
||||
import myActionSheet from '@/components/my-components/my-action-sheet';
|
||||
import myEmpty from '../components/empty.vue';
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue';
|
||||
import listItem from './components/list-item';
|
||||
const page = reactive({
|
||||
list: [1, 2],
|
||||
status: 'noMore'
|
||||
})
|
||||
let refMoreSheet = ref(null)
|
||||
const actionSheet = reactive({
|
||||
list: ['编辑', '删除']
|
||||
})
|
||||
|
||||
function moreShow() {
|
||||
refMoreSheet.value.open()
|
||||
}
|
||||
|
||||
function toAddCategory() {
|
||||
go.to('PAGES_CATEGORY_CONTROL_EDIT')
|
||||
}
|
||||
|
||||
function sheetClick(e) {
|
||||
if (e === 0) {
|
||||
return go.to('PAGES_CATEGORY_CONTROL_EDIT', {
|
||||
title: '分类:测试分类',
|
||||
type:'edit',
|
||||
id: 1
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.min-page {
|
||||
padding: 32rpx 28rpx;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
bottom: calc(env(safe-area-inset-bottom) + 84rpx);
|
||||
left: 110rpx;
|
||||
right: 110rpx;
|
||||
}
|
||||
</style>
|
||||
120
pageInvoicing/category-management/components/list-item.vue
Normal file
120
pageInvoicing/category-management/components/list-item.vue
Normal file
@@ -0,0 +1,120 @@
|
||||
<template>
|
||||
|
||||
<view class="item bg-fff border-r-12 u-font-28">
|
||||
<view class="">
|
||||
<view class="">食物</view>
|
||||
</view>
|
||||
<view class="u-font-24 u-flex u-m-t-10">
|
||||
<view class="u-m-r-10">炒面</view>
|
||||
<view class="u-m-r-10">米饭</view>
|
||||
<view>鸡蛋</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="u-flex u-row-right u-m-t-20">
|
||||
<view class="u-flex ">
|
||||
<my-button shape="circle" height="56" type="cancel" @tap="toRcored">
|
||||
<view class="color-999">查看记录</view>
|
||||
</my-button>
|
||||
</view>
|
||||
<view class="u-flex u-m-l-30">
|
||||
<my-button shape="circle" height="56" type="primary" @tap="more">更多操作</my-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import myButton from '@/components/my-components/my-button';
|
||||
import go from '@/commons/utils/go.js'
|
||||
import color from '@/commons/color.js'
|
||||
import {
|
||||
reactive
|
||||
} from 'vue';
|
||||
function toRcored(){
|
||||
go.to('PAGES_CATEGORY_MAN_RECORDS',{
|
||||
title:'分类:测试分类',
|
||||
id:1
|
||||
})
|
||||
}
|
||||
function retract() {
|
||||
console.log('retract');
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定删除该记录?删除后,将恢复改动前的数量',
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
console.log('用户点击确定');
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消');
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
const props = defineProps({
|
||||
index: {
|
||||
type: Number
|
||||
},
|
||||
data: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {}
|
||||
}
|
||||
}
|
||||
})
|
||||
const emits = defineEmits(['more'])
|
||||
|
||||
function more() {
|
||||
emits('more', props.index)
|
||||
}
|
||||
|
||||
let state = reactive({
|
||||
showRemark: false
|
||||
})
|
||||
|
||||
function toggleRemark() {
|
||||
state.showRemark = !state.showRemark
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.item {
|
||||
padding: 32rpx 32rpx 28rpx 28rpx;
|
||||
|
||||
.title-min-width {
|
||||
min-width: 132rpx;
|
||||
}
|
||||
|
||||
.tag {
|
||||
color: $my-main-color;
|
||||
background-color: rgb(234, 244, 255);
|
||||
border-radius: 8rpx;
|
||||
padding: 2rpx 10rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.id {
|
||||
padding: 2rpx 10rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.info {}
|
||||
}
|
||||
|
||||
.addNumber {
|
||||
position: absolute;
|
||||
left: 100%;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.icon-down {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.icon-up {
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
</style>
|
||||
62
pageInvoicing/category-management/edit-category.vue
Normal file
62
pageInvoicing/category-management/edit-category.vue
Normal file
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<view class="u-p-30 bg-gray min-page color-333 u-font-28">
|
||||
<view class="border-r-12 bg-fff u-p-30">
|
||||
<view>
|
||||
<view>类别名称</view>
|
||||
<view class="u-m-t-16 u-p-b-10 border-bottom">
|
||||
<uni-easyinput paddingNone :inputBorder="false" v-model="value"
|
||||
placeholder="填写类别名称"></uni-easyinput>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-m-t-24">
|
||||
<view>类别名称</view>
|
||||
<view class="u-m-t-16 u-m-t-10">
|
||||
<uni-easyinput type="textarea" v-model="value" placeholder="填写类别描述内容"></uni-easyinput>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bottom">
|
||||
<view class="">
|
||||
<my-button shape="circle" type="primary">保存</my-button>
|
||||
</view>
|
||||
<view class="u-m-t-20">
|
||||
<my-button type="cancel">
|
||||
<view class="color-999">取消</view>
|
||||
</my-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onLoad,
|
||||
onReady,
|
||||
onShow,
|
||||
onPageScroll,
|
||||
onPullDownRefresh
|
||||
} from '@dcloudio/uni-app';
|
||||
import myButton from '@/components/my-components/my-button';
|
||||
import {
|
||||
reactive
|
||||
} from 'vue';
|
||||
|
||||
const page = reactive({
|
||||
type: 'add'
|
||||
})
|
||||
onLoad(opt => {
|
||||
if (JSON.stringify(opt) != '{}' && opt.hasOwnProperty('type')) {
|
||||
page.type = opt.type
|
||||
}
|
||||
uni.setNavigationBarTitle({
|
||||
title: page.type==='add'?'添加类别':'编辑类别'
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.bottom {
|
||||
padding: 84rpx 80rpx;
|
||||
}
|
||||
</style>
|
||||
210
pageInvoicing/category-management/look-records.vue
Normal file
210
pageInvoicing/category-management/look-records.vue
Normal file
@@ -0,0 +1,210 @@
|
||||
<template>
|
||||
<view class="color-333 u-font-28">
|
||||
<view class="fixed-top bg-fff u-flex">
|
||||
<view class="u-flex u-p-t-30 u-p-b-30 u-flex-1 u-row-center" @tap="timeToggle">
|
||||
<text class="u-m-r-12">筛选时间</text>
|
||||
<image src="/pageInvoicing/static/images/icon-arrow-down-fill.svg" class="icon-arrow-down-fill" mode="">
|
||||
</image>
|
||||
</view>
|
||||
<view class="u-flex u-p-t-30 u-p-b-30 u-flex-1 u-row-center" @tap="toggleMask">
|
||||
<text class="u-m-r-12">类型</text>
|
||||
<image src="/pageInvoicing/static/images/icon-arrow-down-fill.svg" class="icon-arrow-down-fill" mode="">
|
||||
</image>
|
||||
</view>
|
||||
|
||||
<view :style="{height:types.show?typesHeight:0}" class="tranistion types overflow-hide">
|
||||
<view @tap="changeTypesActive(index)" class="u-flex u-p-l-30 lh30 u-p-r-30 u-row-between"
|
||||
v-for="(item,index) in types.list" :key="index">
|
||||
<view>{{item}}</view>
|
||||
<uni-icons v-if="types.active===index" type="checkmarkempty" :color="color.ColorMain"></uni-icons>
|
||||
</view>
|
||||
<view :style="{height: types.bottomHeight+'px'}"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class=" min-page bg-gray list u-p-30">
|
||||
<view class="u-flex u-m-b-30" v-if="filters.time.start&&filters.time.end">
|
||||
<view class="time-area u-font-24 color-main u-flex">
|
||||
<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="filters.time.start"></uni-dateformat>
|
||||
<text class="u-p-l-10 u-p-r-10">至</text>
|
||||
<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="filters.time.end"></uni-dateformat>
|
||||
<view class="u-m-l-10 u-flex" @tap="clearTime">
|
||||
<uni-icons type="clear" size="18" :color="color.ColorMain"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="recoreds color-fff ">
|
||||
<view class="u-font-32">统计</view>
|
||||
<view class="u-flex u-row-between u-m-t-48">
|
||||
<view class="u-flex u-flex-col u-row-center u-col-center">
|
||||
<view>入库数量</view>
|
||||
<view class="u-font-32 u-m-t-10 font-bold">0</view>
|
||||
</view>
|
||||
<view class="u-flex u-flex-col u-row-center u-col-center">
|
||||
<view>出库数量</view>
|
||||
<view class="u-font-32 u-m-t-10 font-bold">0</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-flex u-row-between u-m-t-24">
|
||||
<view class="u-flex u-flex-col u-row-center u-col-center">
|
||||
<view>清点次数</view>
|
||||
<view class="u-font-32 u-m-t-10 font-bold">0</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<template v-if="page.list.length">
|
||||
<view class="u-m-b-28 u-m-t-28" v-for="(item,index) in page.list" :key="index">
|
||||
</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<view class="" style="margin-top: 150rpx;">
|
||||
<my-empty tips="亲,你还没有记录哦~"></my-empty>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
<my-date-pickerview @confirm="datePickerConfirm" ref="datePicker"></my-date-pickerview>
|
||||
<my-mask ref="mask" @close="hideType"></my-mask>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onLoad,
|
||||
onReady,
|
||||
onShow,
|
||||
onPageScroll,
|
||||
onPullDownRefresh
|
||||
} from '@dcloudio/uni-app';
|
||||
import color from '@/commons/color';
|
||||
import myEmpty from '../components/empty.vue';
|
||||
import myMask from '@/components/my-components/my-mask'
|
||||
import myDatePickerview from '@/components/my-components/my-date-pickerview'
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
computed
|
||||
} from 'vue';
|
||||
|
||||
const page=reactive({
|
||||
list:[]
|
||||
})
|
||||
|
||||
|
||||
const types = reactive({
|
||||
list: ['全部', '入库', '出库', '清点'],
|
||||
active: 0,
|
||||
show: false,
|
||||
bottomHeight: 14
|
||||
})
|
||||
|
||||
function hideType() {
|
||||
types.show = false
|
||||
}
|
||||
const typesHeight = computed(() => {
|
||||
return 30 * types.list.length + types.bottomHeight + 'px'
|
||||
})
|
||||
|
||||
function changeTypesActive(i) {
|
||||
types.active = i
|
||||
types.show = false
|
||||
toggleMask()
|
||||
}
|
||||
|
||||
function showTypesToggle() {
|
||||
types.show = !types.show
|
||||
}
|
||||
|
||||
|
||||
const filters = reactive({
|
||||
time: {
|
||||
start: '',
|
||||
end: ''
|
||||
}
|
||||
})
|
||||
|
||||
function clearTime() {
|
||||
filters.time = ''
|
||||
filters.end = ''
|
||||
}
|
||||
|
||||
const datePicker = ref(null)
|
||||
|
||||
function datePickerConfirm(e) {
|
||||
console.log(e);
|
||||
filters.time.start = e.start
|
||||
filters.time.end = e.end
|
||||
}
|
||||
|
||||
function timeToggle() {
|
||||
datePicker.value.toggle()
|
||||
}
|
||||
|
||||
|
||||
const mask = ref(null)
|
||||
|
||||
function toggleMask(show) {
|
||||
types.show = !types.show
|
||||
mask.value.toggle()
|
||||
}
|
||||
|
||||
onLoad(opt => {
|
||||
console.log(opt);
|
||||
uni.setNavigationBarTitle({
|
||||
title: opt.title || ''
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.fixed-top {
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.recoreds {
|
||||
background: linear-gradient(127deg, #33A0FF 0%, #6699FF 100%);
|
||||
box-shadow: 0rpx 20rpx 60rpx 2rpx rgba(92, 112, 248, 0.2);
|
||||
border-radius: 14rpx 14rpx 14rpx 14rpx;
|
||||
padding: 32rpx 40rpx 40rpx 48rpx;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
&::after{
|
||||
content: '';
|
||||
top: -112rpx;
|
||||
border-radius: 50%;
|
||||
display: block;
|
||||
position: absolute;right: 56rpx;
|
||||
width: 224rpx;
|
||||
box-shadow: 0 0 1px #666;
|
||||
height: 224rpx;
|
||||
background: linear-gradient( 180deg, rgba(103,204,254,0.6) 0%, rgba(144,87,255,0) 100%);
|
||||
}
|
||||
}
|
||||
|
||||
.types {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 10;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.time-area {
|
||||
background: #E6F0FF;
|
||||
border-radius: 100px;
|
||||
padding: 10rpx 20rpx;
|
||||
}
|
||||
|
||||
.icon-arrow-down-fill {
|
||||
width: 16rpx;
|
||||
height: 10rpx;
|
||||
}
|
||||
|
||||
.list {
|
||||
margin-top: 52px;
|
||||
}
|
||||
</style>
|
||||
240
pageInvoicing/category-management/warehouse-entry.vue
Normal file
240
pageInvoicing/category-management/warehouse-entry.vue
Normal file
@@ -0,0 +1,240 @@
|
||||
<template>
|
||||
<view class="min-page bg-gray u-p-30 u-font-28 color-333">
|
||||
|
||||
<view class="form color-333 u-font-32">
|
||||
<view class="u-flex border">
|
||||
<view class="u-flex-1 u-p-l-24">
|
||||
<uni-easyinput :inputBorder="false" paddingNone v-model="form.name"
|
||||
placeholder="请输入货品编码"></uni-easyinput>
|
||||
</view>
|
||||
<view class="u-p-l-30">
|
||||
<image src="/pageInvoicing/static/images/icon-saoma.svg" class="icon-saoma" mode=""></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-flex border u-m-t-32">
|
||||
<view class="label">货品名称</view>
|
||||
<view class="u-flex-1 u-p-l-32">
|
||||
<uni-easyinput :inputBorder="false" paddingNone v-model="form.name"
|
||||
placeholder="请输入货品编码"></uni-easyinput>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-flex border u-m-t-32">
|
||||
<view class="label">入库数量</view>
|
||||
<view class="u-flex-1 u-p-l-32">
|
||||
<uni-easyinput :inputBorder="false" paddingNone v-model="form.name"
|
||||
placeholder="请输入货品编码"></uni-easyinput>
|
||||
</view>
|
||||
<view class="u-p-r-24 u-p-l-24">单位</view>
|
||||
</view>
|
||||
<view class="u-flex border u-m-t-32">
|
||||
<view class="label">总价值</view>
|
||||
<view class="u-flex-1 u-p-l-32">
|
||||
<uni-easyinput :inputBorder="false" paddingNone v-model="form.name"
|
||||
placeholder="请输入货品编码"></uni-easyinput>
|
||||
</view>
|
||||
<view class="u-p-r-24 u-p-l-24">元</view>
|
||||
</view>
|
||||
<view class="u-flex border u-m-t-32">
|
||||
<view class="label">单价</view>
|
||||
<view class="u-flex-1 u-p-l-32 u-p-r-32">
|
||||
单价 元/单位
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom ">
|
||||
<view class=""><my-button shape="circle" @tap="submit">
|
||||
<view >保存</view>
|
||||
</my-button></view>
|
||||
<view class="u-m-t-10"><my-button shape="circle" type="cancel" @tap="cancel">
|
||||
<view class="color-999">取消</view>
|
||||
</my-button></view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
onLoad,
|
||||
onReady,
|
||||
onShow,
|
||||
onPageScroll,
|
||||
onPullDownRefresh
|
||||
} from '@dcloudio/uni-app';
|
||||
import myButton from '../../components/my-components/my-button';
|
||||
import {
|
||||
reactive,
|
||||
ref
|
||||
} from 'vue';
|
||||
const units = reactive({
|
||||
list: [{
|
||||
name: '件',
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
name: '杯',
|
||||
value: 2
|
||||
},
|
||||
{
|
||||
name: '个',
|
||||
value: 3
|
||||
}
|
||||
],
|
||||
current: ''
|
||||
})
|
||||
const category = reactive([{
|
||||
name: '分类1',
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
name: '分类2',
|
||||
value: 2
|
||||
},
|
||||
{
|
||||
name: '分类3',
|
||||
value: 3
|
||||
}
|
||||
])
|
||||
let categoryCurrent = ref('')
|
||||
|
||||
function categoryChange(e) {
|
||||
console.log(e);
|
||||
categoryCurrent.value = e.detail.value
|
||||
form.category = category[e.detail.value].name
|
||||
}
|
||||
|
||||
function unitChange(e) {
|
||||
units.current = e.detail.value
|
||||
form.unit = units.list[e.detail.value].name
|
||||
}
|
||||
|
||||
const refform = ref(null)
|
||||
const form = reactive({
|
||||
name: '',
|
||||
code: '',
|
||||
category: '',
|
||||
price: 0,
|
||||
inNumber: 0,
|
||||
unit: '',
|
||||
number: 0,
|
||||
inNumber: 0,
|
||||
allPrice: 0,
|
||||
supplierShopName: '',
|
||||
supplierName: '',
|
||||
supplierPhone: '',
|
||||
})
|
||||
// 校验规则
|
||||
const rules = {
|
||||
name: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '菜品名称不能为空'
|
||||
}]
|
||||
},
|
||||
code: {
|
||||
rules: [{
|
||||
required: true,
|
||||
}]
|
||||
},
|
||||
category: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '请选择菜品分类'
|
||||
}]
|
||||
},
|
||||
price: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '请输入价格'
|
||||
}]
|
||||
},
|
||||
unit: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '请选择单位'
|
||||
}]
|
||||
},
|
||||
price: {
|
||||
rules: [{
|
||||
required: true,
|
||||
errorMessage: '请填写下单数量'
|
||||
}]
|
||||
},
|
||||
}
|
||||
|
||||
function submit() {
|
||||
refform.value.validate(res => {
|
||||
console.log(res)
|
||||
}).catch(err => {
|
||||
console.log(err);
|
||||
})
|
||||
}
|
||||
const page = reactive({
|
||||
type: 'add'
|
||||
})
|
||||
|
||||
function cancel() {
|
||||
uni.navigateBack()
|
||||
}
|
||||
onLoad(opt => {})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.form {
|
||||
background-color: #fff;
|
||||
padding: 32rpx 24rpx;
|
||||
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.u-text-left {
|
||||
min-width: 160rpx;
|
||||
}
|
||||
|
||||
// background-color: transparent;
|
||||
}
|
||||
|
||||
::v-deep.uni-forms-item {
|
||||
min-height: inherit;
|
||||
}
|
||||
|
||||
::v-deep.uni-forms-item .uni-forms-item__label {
|
||||
font-size: 32rpx !important;
|
||||
}
|
||||
|
||||
::v-deep.uni-easyinput__placeholder-class {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
::v-deep.uni-forms-item__error {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.bottom {
|
||||
padding-top: 84rpx;
|
||||
padding-right: 80rpx;
|
||||
padding-left: 80rpx;
|
||||
}
|
||||
|
||||
.border {
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
border: 2rpx solid #F9F9F9;
|
||||
}
|
||||
|
||||
.icon-saoma {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
|
||||
.label {
|
||||
height: 84rpx;
|
||||
min-width: 190rpx;
|
||||
text-align: left;
|
||||
font-size: 32rpx;
|
||||
padding-left: 24rpx;
|
||||
padding-right: 24rpx;
|
||||
line-height: 84rpx;
|
||||
background: #F9F9F9;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user