czg_team/cashier_admin_app
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

first

Browse Source
This commit is contained in:
YeMingfei666
2024-09-10 10:49:08 +08:00
parent b5fd06b800
commit dd4f5938da
6391 changed files with 722800 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

122
pageInvoicing/storage-record/components/list-item.vue Normal file
View File

@@ -0,0 +1,122 @@
<template>
<view class="item bg-fff border-r-12">
<view class="u-flex u-text-left u-row-between border-bottom u-p-b-30">
<view class="">2024-07-24 14:23:09</view>
<view class="">东风</view>
</view>
<view class="u-flex u-text-left u-row-left u-m-t-30">
<view class="name">名称</view>
<view class="category u-flex u-m-l-10">
<view class="tag">分类</view>
</view>
<view class="id color-999 u-font-24 bg-gray u-m-l-10">
ID:1234
</view>
</view>
<view class="info u-flex bg-gray u-p-24 u-m-t-20 u-row-between">
<view class="u-text-right">
<view>
<text>总价值</text>
<text class="u-m-l-10">3</text>
</view>
<view class="u-m-t-10">
<text>单价</text>
<text class="u-m-l-10">2</text>
</view>
<view class="u-m-t-10">
<text>货品编码</text>
<text class="u-m-l-10">2</text>
</view>
<view class="u-m-t-10">
<text>供应商名称</text>
<text class="u-m-l-10">2</text>
</view>
<view class="u-m-t-10 u-relative">
<text>库存</text>
<text class="u-m-l-10">2</text>
<view class="u-absolute u-flex addNumber" >
<uni-icons type="arrow-right" :color="color.ColorMain" size="16"></uni-icons>
<text class="color-main u-m-l-10">3</text>
</view>
</view>
<view class="u-m-t-10">
<text>剩余库存</text>
<text class="u-m-l-10 color-main">2</text>
</view>
</view>
<view class="u-flex-1 u-flex u-row-right">
<view>
<view class="color-main font-bold">+22</view>
<!-- <view class="u-m-t-10">剩余库存</view> -->
</view>
</view>
</view>
<view class="u-flex u-row-right u-m-t-20">
<view class="u-flex u-m-r-30">
<my-button shape="circle" height="70" type="default" @tap="del">
<view class="u-p-l-30 u-p-r-30">
删除
</view>
</my-button>
</view>
<!-- <view class="u-flex">
<my-button shape="circle" height="70" plain 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'
function del(){
console.log('del');
}
const props = defineProps({
index: {
type: Number
},
data: {
type: Object,
default: () => {
return {}
}
}
})
const emits = defineEmits(['more'])
function more() {
emits('more', props.index)
}
</script>
<style lang="scss">
.item {
padding: 32rpx 32rpx 28rpx 28rpx;
.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%;
padding-left: 20rpx;
transform: translateY(-50%);
}
</style>

266
pageInvoicing/storage-record/storage-record.vue Normal file
View File

@@ -0,0 +1,266 @@
<template>
<view class="color-333 u-font-28">
<view class="fixed-top bg-fff u-flex u-p-l-30 u-row-between">
<view class="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-m-l-60 u-p-t-30 u-p-b-30 u-flex-1 u-row-center" @tap="showTypesToggle">
<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>
<view style="width: 164rpx;"></view>
<view class="search-box">
<view class="search-btn u-flex" @tap="showSearch"
:style="{width:search.show?'694rpx':'164rpx'}">
<image src="@/static/iconImg/icon-search.svg" class="input-icon" />
<view class="u-flex-1 u-p-l-10"><input v-model="search.keyword" @confirm="searchConfirm"
type="text" placeholder-style="font-size:28rpx;" placeholder="搜索" /></view>
<view @tap.stop="hideSearch" v-if="search.show">取消</view>
</view>
</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>
<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">
<list-item></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>
<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';
import listItem from './components/list-item';
import myMask from '@/components/my-components/my-mask'
import myDatePickerview from '@/components/my-components/my-date-pickerview'
import {
ref,
reactive,
computed
} from 'vue';
const search = reactive({
keyword: '',
show: false
})
function searchConfirm() {
}
function hideSearch() {
search.show = false
maskHide()
}
function showSearch() {
search.show = true
types.show=false
maskShow()
}
const page=reactive({
list:[1,2],
status:'noMore'
})
const types = reactive({
list: ['全部', '未分类'],
active: 0,
show: false,
bottomHeight: 14
})
function hideType() {
types.show = false
search.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
maskShow()
}
const filters = reactive({
time: {
start: '',
end: ''
}
})
function clearTime() {
filters.time.start = ''
filters.time.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) {
mask.value.toggle()
}
function maskShow(){
mask.value.open()
}
function maskHide(){
mask.value.close()
}
onLoad(opt => {
})
</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%);
}
}
.search-box {
background-color: #fff;
padding: 16rpx 0;
top: 0;
bottom: 0;
position: absolute;
right: 30rpx;
display: flex;
.search-btn {
padding: 0 30rpx;
box-sizing: border-box;
display: flex;
align-items: center;
// width: 164rpx;
transition: all .3s ease-in-out;
background-color: rgb(247, 247, 247);
border-radius: 100px;
}
}
.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>