update: init
This commit is contained in:
admin
commit
883b7be35d
|
|
@ -0,0 +1,67 @@
|
|||
{
|
||||
"globals": {
|
||||
"Component": true,
|
||||
"ComponentPublicInstance": true,
|
||||
"ComputedRef": true,
|
||||
"EffectScope": true,
|
||||
"ExtractDefaultPropTypes": true,
|
||||
"ExtractPropTypes": true,
|
||||
"ExtractPublicPropTypes": true,
|
||||
"InjectionKey": true,
|
||||
"PropType": true,
|
||||
"Ref": true,
|
||||
"VNode": true,
|
||||
"WritableComputedRef": true,
|
||||
"computed": true,
|
||||
"createApp": true,
|
||||
"customRef": true,
|
||||
"defineAsyncComponent": true,
|
||||
"defineComponent": true,
|
||||
"effectScope": true,
|
||||
"getCurrentInstance": true,
|
||||
"getCurrentScope": true,
|
||||
"h": true,
|
||||
"inject": true,
|
||||
"isProxy": true,
|
||||
"isReactive": true,
|
||||
"isReadonly": true,
|
||||
"isRef": true,
|
||||
"markRaw": true,
|
||||
"nextTick": true,
|
||||
"onActivated": true,
|
||||
"onBeforeMount": true,
|
||||
"onBeforeUnmount": true,
|
||||
"onBeforeUpdate": true,
|
||||
"onDeactivated": true,
|
||||
"onErrorCaptured": true,
|
||||
"onMounted": true,
|
||||
"onRenderTracked": true,
|
||||
"onRenderTriggered": true,
|
||||
"onScopeDispose": true,
|
||||
"onServerPrefetch": true,
|
||||
"onUnmounted": true,
|
||||
"onUpdated": true,
|
||||
"provide": true,
|
||||
"reactive": true,
|
||||
"readonly": true,
|
||||
"ref": true,
|
||||
"resolveComponent": true,
|
||||
"shallowReactive": true,
|
||||
"shallowReadonly": true,
|
||||
"shallowRef": true,
|
||||
"toRaw": true,
|
||||
"toRef": true,
|
||||
"toRefs": true,
|
||||
"toValue": true,
|
||||
"triggerRef": true,
|
||||
"unref": true,
|
||||
"useAttrs": true,
|
||||
"useCssModule": true,
|
||||
"useCssVars": true,
|
||||
"useSlots": true,
|
||||
"watch": true,
|
||||
"watchEffect": true,
|
||||
"watchPostEffect": true,
|
||||
"watchSyncEffect": true
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
|
||||
|
||||
module.exports = {
|
||||
"extends": [
|
||||
'plugin:vue/vue3-essential',
|
||||
'eslint:recommended',
|
||||
'@vue/eslint-config-typescript',
|
||||
'@vue/eslint-config-prettier',
|
||||
'plugin:prettier/recommended', // 添加 prettier 插件,
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
.DS_Store
|
||||
dist
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<script>
|
||||
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') ||
|
||||
CSS.supports('top: constant(a)'))
|
||||
document.write(
|
||||
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' +
|
||||
(coverSupport ? ', viewport-fit=cover' : '') + '" />')
|
||||
</script>
|
||||
<title></title>
|
||||
<!--preload-links-->
|
||||
<!--app-context-->
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"><!--app-html--></div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,88 @@
|
|||
{
|
||||
"name": "uni-preset-vue",
|
||||
"version": "0.0.0",
|
||||
"scripts": {
|
||||
"dev:app": "uni -p app",
|
||||
"dev:app-android": "uni -p app-android",
|
||||
"dev:app-ios": "uni -p app-ios",
|
||||
"dev:custom": "uni -p",
|
||||
"dev:h5": "uni",
|
||||
"dev:h5:ssr": "uni --ssr",
|
||||
"dev:mp-alipay": "uni -p mp-alipay",
|
||||
"dev:mp-baidu": "uni -p mp-baidu",
|
||||
"dev:mp-jd": "uni -p mp-jd",
|
||||
"dev:mp-kuaishou": "uni -p mp-kuaishou",
|
||||
"dev:mp-lark": "uni -p mp-lark",
|
||||
"dev:mp-qq": "uni -p mp-qq",
|
||||
"dev:mp-toutiao": "uni -p mp-toutiao",
|
||||
"dev:mp-weixin": "uni -p mp-weixin",
|
||||
"dev:quickapp-webview": "uni -p quickapp-webview",
|
||||
"dev:quickapp-webview-huawei": "uni -p quickapp-webview-huawei",
|
||||
"dev:quickapp-webview-union": "uni -p quickapp-webview-union",
|
||||
"build:app": "uni build -p app",
|
||||
"build:app-android": "uni build -p app-android",
|
||||
"build:app-ios": "uni build -p app-ios",
|
||||
"build:custom": "uni build -p",
|
||||
"build:h5": "uni build",
|
||||
"build:h5:ssr": "uni build --ssr",
|
||||
"build:mp-alipay": "uni build -p mp-alipay",
|
||||
"build:mp-baidu": "uni build -p mp-baidu",
|
||||
"build:mp-jd": "uni build -p mp-jd",
|
||||
"build:mp-kuaishou": "uni build -p mp-kuaishou",
|
||||
"build:mp-lark": "uni build -p mp-lark",
|
||||
"build:mp-qq": "uni build -p mp-qq",
|
||||
"build:mp-toutiao": "uni build -p mp-toutiao",
|
||||
"build:mp-weixin": "uni build -p mp-weixin",
|
||||
"build:quickapp-webview": "uni build -p quickapp-webview",
|
||||
"build:quickapp-webview-huawei": "uni build -p quickapp-webview-huawei",
|
||||
"build:quickapp-webview-union": "uni build -p quickapp-webview-union",
|
||||
"type-check": "vue-tsc --noEmit"
|
||||
},
|
||||
"dependencies": {
|
||||
"@dcloudio/uni-app": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-app-plus": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-components": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-h5": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-mp-alipay": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-mp-baidu": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-mp-jd": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-mp-kuaishou": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-mp-lark": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-mp-qq": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-mp-toutiao": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-mp-weixin": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-quickapp-webview": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-ui": "^1.5.2",
|
||||
"amfe-flexible": "^2.2.1",
|
||||
"clipboard": "^2.0.11",
|
||||
"dayjs": "^1.11.10",
|
||||
"echarts": "^5.5.0",
|
||||
"esbuild": "0.17.19",
|
||||
"luch-request": "^3.1.1",
|
||||
"pinia": "2.0.33",
|
||||
"pinia-plugin-persistedstate": "^3.2.1",
|
||||
"postcss-pxtorem": "^6.0.0",
|
||||
"unplugin-auto-import": "^0.17.3",
|
||||
"uview-plus": "^3.1.41",
|
||||
"vue": "^3.2.45",
|
||||
"vue-i18n": "^9.1.9"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@dcloudio/types": "^3.3.2",
|
||||
"@dcloudio/uni-automator": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-cli-shared": "3.0.0-3081220230817001",
|
||||
"@dcloudio/uni-stacktracey": "3.0.0-3081220230817001",
|
||||
"@dcloudio/vite-plugin-uni": "3.0.0-3081220230817001",
|
||||
"@types/node": "^20.11.22",
|
||||
"@types/wechat-miniprogram": "^3.4.7",
|
||||
"@uni-helper/uni-app-types": "^0.5.12",
|
||||
"@uni-helper/uni-ui-types": "^0.5.11",
|
||||
"@vue/runtime-core": "^3.2.45",
|
||||
"@vue/tsconfig": "^0.1.3",
|
||||
"sass": "^1.69.7",
|
||||
"sass-loader": "10",
|
||||
"typescript": "^4.9.4",
|
||||
"vite": "4.1.4",
|
||||
"vue-tsc": "^1.0.24"
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,10 @@
|
|||
/// <reference types='@dcloudio/types' />
|
||||
import 'vue'
|
||||
|
||||
declare module '@vue/runtime-core' {
|
||||
type Hooks = App.AppInstance & Page.PageInstance;
|
||||
|
||||
interface ComponentCustomOptions extends Hooks {
|
||||
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
module.exports = {
|
||||
plugins: {
|
||||
"postcss-pxtorem": {
|
||||
rootValue: 37.5,
|
||||
propList: ["*"],
|
||||
},
|
||||
},
|
||||
};
|
||||
|
|
@ -0,0 +1,20 @@
|
|||
<script setup lang="ts">
|
||||
import { onLaunch, onShow, onHide } from "@dcloudio/uni-app";
|
||||
onLaunch(() => {
|
||||
console.log("App Launch");
|
||||
});
|
||||
onShow(() => {
|
||||
console.log("App Show");
|
||||
});
|
||||
onHide(() => {
|
||||
console.log("App Hide");
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/* 注意要写在第一行，同时给style标签加入lang="scss"属性 */
|
||||
@import "uview-plus/index.scss";
|
||||
body {
|
||||
font-size: 12px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,66 @@
|
|||
/* eslint-disable */
|
||||
/* prettier-ignore */
|
||||
// @ts-nocheck
|
||||
// noinspection JSUnusedGlobalSymbols
|
||||
// Generated by unplugin-auto-import
|
||||
export {}
|
||||
declare global {
|
||||
const EffectScope: typeof import('vue')['EffectScope']
|
||||
const computed: typeof import('vue')['computed']
|
||||
const createApp: typeof import('vue')['createApp']
|
||||
const customRef: typeof import('vue')['customRef']
|
||||
const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
|
||||
const defineComponent: typeof import('vue')['defineComponent']
|
||||
const effectScope: typeof import('vue')['effectScope']
|
||||
const getCurrentInstance: typeof import('vue')['getCurrentInstance']
|
||||
const getCurrentScope: typeof import('vue')['getCurrentScope']
|
||||
const h: typeof import('vue')['h']
|
||||
const inject: typeof import('vue')['inject']
|
||||
const isProxy: typeof import('vue')['isProxy']
|
||||
const isReactive: typeof import('vue')['isReactive']
|
||||
const isReadonly: typeof import('vue')['isReadonly']
|
||||
const isRef: typeof import('vue')['isRef']
|
||||
const markRaw: typeof import('vue')['markRaw']
|
||||
const nextTick: typeof import('vue')['nextTick']
|
||||
const onActivated: typeof import('vue')['onActivated']
|
||||
const onBeforeMount: typeof import('vue')['onBeforeMount']
|
||||
const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
|
||||
const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
|
||||
const onDeactivated: typeof import('vue')['onDeactivated']
|
||||
const onErrorCaptured: typeof import('vue')['onErrorCaptured']
|
||||
const onMounted: typeof import('vue')['onMounted']
|
||||
const onRenderTracked: typeof import('vue')['onRenderTracked']
|
||||
const onRenderTriggered: typeof import('vue')['onRenderTriggered']
|
||||
const onScopeDispose: typeof import('vue')['onScopeDispose']
|
||||
const onServerPrefetch: typeof import('vue')['onServerPrefetch']
|
||||
const onUnmounted: typeof import('vue')['onUnmounted']
|
||||
const onUpdated: typeof import('vue')['onUpdated']
|
||||
const provide: typeof import('vue')['provide']
|
||||
const reactive: typeof import('vue')['reactive']
|
||||
const readonly: typeof import('vue')['readonly']
|
||||
const ref: typeof import('vue')['ref']
|
||||
const resolveComponent: typeof import('vue')['resolveComponent']
|
||||
const shallowReactive: typeof import('vue')['shallowReactive']
|
||||
const shallowReadonly: typeof import('vue')['shallowReadonly']
|
||||
const shallowRef: typeof import('vue')['shallowRef']
|
||||
const toRaw: typeof import('vue')['toRaw']
|
||||
const toRef: typeof import('vue')['toRef']
|
||||
const toRefs: typeof import('vue')['toRefs']
|
||||
const toValue: typeof import('vue')['toValue']
|
||||
const triggerRef: typeof import('vue')['triggerRef']
|
||||
const unref: typeof import('vue')['unref']
|
||||
const useAttrs: typeof import('vue')['useAttrs']
|
||||
const useCssModule: typeof import('vue')['useCssModule']
|
||||
const useCssVars: typeof import('vue')['useCssVars']
|
||||
const useSlots: typeof import('vue')['useSlots']
|
||||
const watch: typeof import('vue')['watch']
|
||||
const watchEffect: typeof import('vue')['watchEffect']
|
||||
const watchPostEffect: typeof import('vue')['watchPostEffect']
|
||||
const watchSyncEffect: typeof import('vue')['watchSyncEffect']
|
||||
}
|
||||
// for type re-export
|
||||
declare global {
|
||||
// @ts-ignore
|
||||
export type { Component, ComponentPublicInstance, ComputedRef, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, VNode, WritableComputedRef } from 'vue'
|
||||
import('vue')
|
||||
}
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
|
||||
<template>
|
||||
<view class="carousel">
|
||||
<swiper
|
||||
:circular="true"
|
||||
:autoplay="true"
|
||||
:interval="3000"
|
||||
@change="onChange"
|
||||
>
|
||||
<swiper-item v-for="item in list" :key="item.id">
|
||||
<navigator :url="item.herfUrl" hover-class="none" class="navigator">
|
||||
<image mode="aspectFill" class="image" :src="item.imgUrl"></image>
|
||||
</navigator>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<!-- 指示点 -->
|
||||
<view class="indicator">
|
||||
<text
|
||||
v-for="(item, index) in list"
|
||||
:key="item.id"
|
||||
class="dot"
|
||||
:class="{ active: index === activeIndex }"
|
||||
></text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import type { BannerItem } from '@/types/home';
|
||||
|
||||
const activeIndex = ref(0)
|
||||
const onChange: UniHelper.SwiperOnChange = (ev) => {
|
||||
activeIndex.value = ev.detail.current
|
||||
}
|
||||
const props = defineProps<{
|
||||
list: BannerItem[],
|
||||
}>()
|
||||
</script>
|
||||
<style lang="scss">
|
||||
:host {
|
||||
display: block;
|
||||
height: 280rpx;
|
||||
}
|
||||
|
||||
/* 轮播图 */
|
||||
.carousel {
|
||||
// height: 100%;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
transform: translateY(0);
|
||||
background-color: #efefef;
|
||||
|
||||
.indicator {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 16rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
.dot {
|
||||
width: 30rpx;
|
||||
height: 6rpx;
|
||||
margin: 0 8rpx;
|
||||
border-radius: 6rpx;
|
||||
background-color: rgba(255, 255, 255, 0.4);
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.navigator,
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<template>
|
||||
<view class="box">
|
||||
<slot></slot>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts"></script>
|
||||
<style lang="scss">
|
||||
.box {
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 24.36rpx 25.64rpx;
|
||||
padding: 25rpx 0rpx;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,41 @@
|
|||
<template>
|
||||
<dom-echart :moduleParam="moduleParam1" :optionData="option"></dom-echart>
|
||||
</template>
|
||||
<script>
|
||||
import domEchart from "@/components/echarts.vue";
|
||||
export default {
|
||||
// 注册组件
|
||||
components: {
|
||||
domEchart,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
moduleParam1: {
|
||||
id: "moId1",
|
||||
height: "50vh",
|
||||
width: "100%",
|
||||
},
|
||||
option: {
|
||||
title: {
|
||||
text: "销售",
|
||||
},
|
||||
tooltip: {},
|
||||
legend: {
|
||||
data: ["销量"],
|
||||
},
|
||||
xAxis: {
|
||||
data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"],
|
||||
},
|
||||
yAxis: {},
|
||||
series: [
|
||||
{
|
||||
name: "销量",
|
||||
type: "bar",
|
||||
data: [5, 20, 36, 10, 10, 20],
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
@ -0,0 +1,45 @@
|
|||
<template>
|
||||
<LEchart class="echart" ref="chart" @finished="init" :customStyle="{height: height, 'z-index': 1}"></LEchart>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import LEchart from "../../uni_modules/lime-echart/components/l-echart/l-echart.vue";
|
||||
// import limeEchart from "../../uni_modules/lime-echart/components/lime-echart/lime-echart";
|
||||
|
||||
// #ifdef VUE3
|
||||
// #ifdef MP
|
||||
// 由于vue3 使用vite 不支持umd格式的包，小程序依然可以使用，但需要使用require
|
||||
const echarts = require("../../uni_modules/lime-echart/static/echarts.min");
|
||||
// #endif
|
||||
// #ifndef MP
|
||||
// 由于 vue3 使用vite 不支持umd格式的包，故引入npm的包
|
||||
import * as echarts from "echarts";
|
||||
// #endif
|
||||
// #endif
|
||||
let chart = ref(); // 获取dom
|
||||
|
||||
const props = defineProps<{
|
||||
option: object,
|
||||
height: string
|
||||
}>()
|
||||
|
||||
watchEffect(() => {
|
||||
chart.value.init(echarts, (chart: any) => {
|
||||
chart.setOption(props.option);
|
||||
});
|
||||
});
|
||||
|
||||
// 渲染完成
|
||||
const init = () => {
|
||||
console.log("渲染完成");
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.echart {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.title {
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,107 @@
|
|||
<!--
|
||||
tips:属性：1.moduleParam:传id 以及宽高的对象 2.optionData:传渲染数据
|
||||
-->
|
||||
<template>
|
||||
<view class="content">
|
||||
<!-- #ifdef APP-PLUS || H5 -->
|
||||
<view
|
||||
@click="echarts.onClick"
|
||||
:style="{ width: moduleParam.width, height: moduleParam.height }"
|
||||
:prop="optionData"
|
||||
:moduleParamProp="moduleParam"
|
||||
:change:moduleParamProp="echarts.moduleParamUp"
|
||||
:change:prop="echarts.updateEcharts"
|
||||
:id="moduleParam.id"
|
||||
class="echarts"
|
||||
></view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifndef APP-PLUS || H5 -->
|
||||
<view>非 APP、H5 环境不支持</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
props: {
|
||||
moduleParam: {
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {
|
||||
id: "myCharts",
|
||||
width: "100%",
|
||||
height: "374rpx",
|
||||
};
|
||||
},
|
||||
},
|
||||
optionData: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
onViewClick(options) {
|
||||
this.$emit("getClickData", options);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<script module="echarts" lang="renderjs">
|
||||
let myChart
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
clickData: null
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
if (typeof window.echarts === 'function') {
|
||||
this.initEcharts()
|
||||
} else {
|
||||
// 动态引入较大类库避免影响页面展示
|
||||
const script = document.createElement('script')
|
||||
// view 层的页面运行在 www 根目录，其相对路径相对于 www 计算
|
||||
script.src = 'static/js/echarts.min.js'
|
||||
script.onload = this.initEcharts.bind(this)
|
||||
document.head.appendChild(script)
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
initEcharts() {
|
||||
myChart = echarts.init(document.getElementById(this.moduleParam.id), "echartsConfig")
|
||||
// 观测更新的数据在 view 层可以直接访问到
|
||||
myChart.setOption(this.optionData)
|
||||
// 点击传参
|
||||
myChart.on('click', params => {
|
||||
this.clickData = params
|
||||
})
|
||||
},
|
||||
updateEcharts(newValue, oldValue, ownerInstance, instance) {
|
||||
// 监听 service 层数据变更
|
||||
try {
|
||||
myChart = echarts.init(document.getElementById(this.moduleParam.id), "echartsConfig")
|
||||
myChart.setOption(newValue)
|
||||
} catch (error) {}
|
||||
},
|
||||
moduleParamUp(newvalue, oldvalue) {},
|
||||
onClick(event, ownerInstance) {
|
||||
ownerInstance.callMethod('onViewClick', {
|
||||
value: this.clickData.value,
|
||||
name: this.clickData.name,
|
||||
dataIndex: this.clickData.dataIndex,
|
||||
seriesName: this.clickData.seriesName
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,70 @@
|
|||
<template>
|
||||
<u-modal :show="show" >
|
||||
<view class="slot-content">
|
||||
<view class="title"> {{ title }} </view>
|
||||
<view class="content">
|
||||
<text :class="{ isMain: isMain }">{{ content }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<template #confirmButton>
|
||||
<view class="btn-box">
|
||||
<text class="cancel" @click="handleClose(false)">取消</text>
|
||||
<text class="ok" @click="handleClose(false)">{{ okText }}</text>
|
||||
</view>
|
||||
</template>
|
||||
</u-modal>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
title: string;
|
||||
content: string;
|
||||
okText: string;
|
||||
isMain: boolean;
|
||||
show: boolean;
|
||||
}>(),
|
||||
{
|
||||
okText: "确认",
|
||||
isMain: false,
|
||||
show: false
|
||||
}
|
||||
);
|
||||
const emit = defineEmits(["handleModal"]);
|
||||
const handleClose = () => {
|
||||
emit("handleModal", false);
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.title {
|
||||
text-align: center;
|
||||
font-weight: 400;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
margin-top: 25px;
|
||||
}
|
||||
.content {
|
||||
padding-top: 25px;
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.isMain {
|
||||
color: #ec0f3e;
|
||||
}
|
||||
.btn-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 25px;
|
||||
.cancel {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.ok {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #00dcee;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,77 @@
|
|||
<template>
|
||||
<view
|
||||
:style="{
|
||||
paddingTop: navbarRect.top + 'px',
|
||||
height: navbarRect.height + 'px',
|
||||
}"
|
||||
class="navbar"
|
||||
>
|
||||
<view class="left" @click="handleMsg()">
|
||||
<view class="msg-badge">
|
||||
<up-badge max="99" :value="'99'"></up-badge>
|
||||
</view>
|
||||
|
||||
<up-image
|
||||
src="/static/img/message.png"
|
||||
width="42rpx"
|
||||
height="36rpx"
|
||||
></up-image>
|
||||
</view>
|
||||
|
||||
<view class="title">工作台</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const navbarRect = reactive({
|
||||
height: 32,
|
||||
top: 28,
|
||||
msgCount: 10,
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
// #ifdef APP-PLUS || MP-WEIXIN
|
||||
let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
|
||||
navbarRect.height = menuButtonInfo.height;
|
||||
navbarRect.top = menuButtonInfo.top;
|
||||
// #endif
|
||||
});
|
||||
const handleMsg = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/message/index", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.navbar {
|
||||
background: #f9f9f9;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.18);
|
||||
padding: 15rpx;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
.left {
|
||||
position: absolute;
|
||||
margin-top: 10px;
|
||||
.msg-badge {
|
||||
margin-left: 20rpx;
|
||||
font-size: 16rpx;
|
||||
padding: 2px 4px;
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
margin-top: -10px;
|
||||
}
|
||||
}
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
<template>
|
||||
<view
|
||||
:style="{
|
||||
paddingTop: navbarRect.top + 'px',
|
||||
height: navbarRect.height + 'px',
|
||||
}"
|
||||
class="navbar"
|
||||
>
|
||||
<view class="left" @click="handleMsg()">
|
||||
|
||||
</view>
|
||||
|
||||
<view class="title">个人中心</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const navbarRect = reactive({
|
||||
height: 32,
|
||||
top: 28,
|
||||
msgCount: 10,
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
// #ifdef APP-PLUS || MP-WEIXIN
|
||||
let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
|
||||
navbarRect.height = menuButtonInfo.height;
|
||||
navbarRect.top = menuButtonInfo.top;
|
||||
// #endif
|
||||
});
|
||||
const handleMsg = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/message/index", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.navbar {
|
||||
background: #f9f9f9;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.18);
|
||||
padding: 15rpx;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
.left {
|
||||
position: absolute;
|
||||
margin-top: 10px;
|
||||
.msg-badge {
|
||||
margin-left: 20rpx;
|
||||
font-size: 16rpx;
|
||||
padding: 2px 4px;
|
||||
position: absolute;
|
||||
z-index: 9;
|
||||
margin-top: -10px;
|
||||
}
|
||||
}
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
<template>
|
||||
<view class="search">
|
||||
<view v-if="!isShowSearch" @click="isShowSearch = true">
|
||||
<u-icon color="#C1C1C1" name="search"></u-icon
|
||||
><text>{{ name }}</text>
|
||||
</view>
|
||||
<u-search
|
||||
v-else
|
||||
:placeholder="`请输入${name}`"
|
||||
v-model="keyword"
|
||||
:focus="true"
|
||||
bgColor="#fff"
|
||||
:clearabled="true"
|
||||
:showAction="false"
|
||||
placeholderColor="#C1C1C1"
|
||||
></u-search>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const isShowSearch = ref(false);
|
||||
const keyword = ref();
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
name: string;
|
||||
}>(),
|
||||
{
|
||||
name: '搜索内容',
|
||||
}
|
||||
);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.search {
|
||||
box-shadow: 0rpx 3rpx 16rpx 5rpx rgba(0, 0, 0, 0.2);
|
||||
border-radius: 28rpx;
|
||||
background: rgba(255, 255, 255, 0.86);
|
||||
width: 80%;
|
||||
margin: 0px auto;
|
||||
margin-top: 30rpx;
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #c1c1c1;
|
||||
> view {
|
||||
line-height: 60rpx;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
text {
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,51 @@
|
|||
<template>
|
||||
<view class="box">
|
||||
<up-row>
|
||||
<up-col v-for="(item, index) in list" :span="12 / list.length">
|
||||
<view class="inner-box" :style="{ border: index === 0 ? 'none' : '' }">
|
||||
<view class="num">{{ item.num }}</view>
|
||||
<view>{{ item.name }}</view>
|
||||
</view>
|
||||
</up-col>
|
||||
</up-row>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const props = withDefaults(
|
||||
defineProps<{
|
||||
list: Array;
|
||||
}>(),
|
||||
{
|
||||
list: [],
|
||||
}
|
||||
);
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.box {
|
||||
padding: 19.23rpx;
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
align-items: center;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
}
|
||||
.inner-box {
|
||||
text-align: center;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
border-left: 1px solid #e9e9e9;
|
||||
.num {
|
||||
font-weight: bold;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
<template>
|
||||
<view class="title">
|
||||
{{ props.title }}
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const props = defineProps<{
|
||||
title:string
|
||||
}>()
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.title {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 27rpx;
|
||||
color: #000000;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
// 不同的环境变量配置
|
||||
const development = {
|
||||
VITE_APP_BASE_URL: 'http://47.100.31.83:8081',
|
||||
appid: '',
|
||||
}
|
||||
|
||||
const test = {
|
||||
VITE_APP_BASE_URL: 'http://47.100.31.83:8081',
|
||||
appid: 'wxd5xxxxee0fce1c81',
|
||||
}
|
||||
|
||||
const production = {
|
||||
VITE_APP_BASE_URL: 'http://124.70.167.140:8081',
|
||||
appid: 'wx3xxxx1ce403cab3',
|
||||
}
|
||||
|
||||
export default {
|
||||
development,
|
||||
test,
|
||||
production
|
||||
}
|
||||
|
|
@ -0,0 +1,25 @@
|
|||
/// <reference types="vite/client" />
|
||||
|
||||
// declare module '*.vue' {
|
||||
// import { DefineComponent } from 'vue'
|
||||
// // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
|
||||
// const component: DefineComponent<{}, {}, any>
|
||||
// export default component
|
||||
// }
|
||||
|
||||
declare module "*.vue" {
|
||||
import { ComponentOptions } from "vue";
|
||||
|
||||
const componentOptions: ComponentOptions;
|
||||
|
||||
export default componentOptions;
|
||||
}
|
||||
|
||||
interface ImportMetaEnv extends Readonly<Record<string, string>> {
|
||||
readonly VITE_APP_TITLE: string
|
||||
}
|
||||
|
||||
interface ImportMeta {
|
||||
readonly env: ImportMetaEnv
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
import { createSSRApp } from "vue";
|
||||
import uviewPlus from "uview-plus";
|
||||
import pinia from './store'
|
||||
import App from "./App.vue";
|
||||
|
||||
import './static/style/common.scss'
|
||||
|
||||
export function createApp() {
|
||||
const app = createSSRApp(App);
|
||||
app.use(uviewPlus);
|
||||
app.use(pinia);
|
||||
|
||||
uni.$u.setConfig({
|
||||
// 修改$u.config对象的属性
|
||||
config: {
|
||||
// 修改默认单位为rpx，相当于执行 uni.$u.config.unit = 'rpx'
|
||||
unit: 'px'
|
||||
},
|
||||
// 修改$u.props对象的属性
|
||||
props: {
|
||||
// 修改radio组件的size参数的默认值，相当于执行 uni.$u.props.radio.size = 30
|
||||
// checkbox: {
|
||||
// size: 15
|
||||
// }
|
||||
// 其他组件属性配置
|
||||
// ......
|
||||
}
|
||||
})
|
||||
return {
|
||||
app,
|
||||
pinia
|
||||
};
|
||||
}
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
{
|
||||
"name": "",
|
||||
// 应用标识 由DCloud 云端分配 （安卓 ios）
|
||||
"appid": "",
|
||||
"description": "",
|
||||
"versionName": "1.0.0",
|
||||
"versionCode": "100",
|
||||
"transformPx": false,
|
||||
/* 5+App特有相关 */
|
||||
"app-plus": {
|
||||
"usingComponents": true,
|
||||
"nvueStyleCompiler": "uni-app",
|
||||
"compilerVersion": 3,
|
||||
"splashscreen": {
|
||||
"alwaysShowBeforeRender": true,
|
||||
"waiting": true,
|
||||
"autoclose": true,
|
||||
"delay": 0
|
||||
},
|
||||
/* 模块配置 */
|
||||
"modules": {},
|
||||
/* 应用发布信息 */
|
||||
"distribute": {
|
||||
/* android打包配置 */
|
||||
"android": {
|
||||
"permissions": [
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||
]
|
||||
},
|
||||
/* ios打包配置 */
|
||||
"ios": {},
|
||||
/* SDK配置 */
|
||||
"sdkConfigs": {}
|
||||
}
|
||||
},
|
||||
|
||||
/* 快应用特有相关 */
|
||||
"quickapp": {},
|
||||
// h5
|
||||
"h5": {
|
||||
"router": {
|
||||
"base": "./"
|
||||
}
|
||||
},
|
||||
/* 小程序特有相关 */
|
||||
"mp-weixin": {
|
||||
"appid": "wx9251d74fe0e87028",
|
||||
"setting": {
|
||||
"urlCheck": false
|
||||
},
|
||||
"usingComponents": true
|
||||
},
|
||||
"mp-alipay": {
|
||||
"usingComponents": true
|
||||
},
|
||||
"mp-baidu": {
|
||||
"usingComponents": true
|
||||
},
|
||||
"mp-toutiao": {
|
||||
"usingComponents": true
|
||||
},
|
||||
"uniStatistics": {
|
||||
"enable": false
|
||||
},
|
||||
"vueVersion": "3"
|
||||
}
|
||||
|
|
@ -0,0 +1,286 @@
|
|||
{
|
||||
"easycom": {
|
||||
"autoscan": true,
|
||||
// 注意一定要放在custom里，否则无效，https://ask.dcloud.net.cn/question/131175
|
||||
"custom": {
|
||||
"^u--(.*)": "uview-plus/components/u-$1/u-$1.vue",
|
||||
"^up-(.*)": "uview-plus/components/u-$1/u-$1.vue",
|
||||
"^u-([^-].*)": "uview-plus/components/u-$1/u-$1.vue",
|
||||
// 以ava开头的组件 配置后需要重启服务
|
||||
"^Ava(.*)": "@/components/Ava$1/Ava$1.vue",
|
||||
"^uni-(.*)": "@dcloudio/uni-ui/lib/uni-$1/uni-$1.vue"
|
||||
}
|
||||
},
|
||||
"pages": [
|
||||
{
|
||||
"path": "pages/index/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom", // 控制头部是否显示
|
||||
"navigationBarTitleText": "工作台"
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
"path": "pages/launch/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
// {
|
||||
// "path": "pages/index/index",
|
||||
// "style": {
|
||||
// "navigationStyle": "custom", // 控制头部是否显示
|
||||
// "navigationBarTitleText": "工作台"
|
||||
// }
|
||||
// },
|
||||
{
|
||||
"path": "pages/index/pricing",
|
||||
"style": {
|
||||
"navigationBarTitleText": "待定价"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/tareing",
|
||||
"style": {
|
||||
"navigationBarTitleText": "待过皮重"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/payReview",
|
||||
"style": {
|
||||
"navigationBarTitleText": "付款审核"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/paying",
|
||||
"style": {
|
||||
"navigationBarTitleText": "待支付"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/shipmenting",
|
||||
"style": {
|
||||
"navigationBarTitleText": "待出货"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/grossWeight",
|
||||
"style": {
|
||||
"navigationBarTitleText": "待过毛重"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/shipmentSettlement",
|
||||
"style": {
|
||||
"navigationBarTitleText": "出货结算"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/settlement",
|
||||
"style": {
|
||||
"navigationBarTitleText": "待结算"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/login/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "登陆"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/login/forgetPwd",
|
||||
"style": {
|
||||
"navigationBarTitleText": "忘记密码"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/message/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "消息中心"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/profile/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "个人中心"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/profile/baseinfo",
|
||||
"style": {
|
||||
"navigationBarTitleText": "基础信息",
|
||||
"navigationBarBackgroundColor": "#FFFFFF"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/profile/modifyPwd",
|
||||
"style": {
|
||||
"navigationBarTitleText": "修改密码",
|
||||
"navigationBarBackgroundColor": "#FFFFFF"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "数据统计"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/receivePanel",
|
||||
"style": {
|
||||
"navigationBarTitleText": "收货汇总"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/supplierRanking",
|
||||
"style": {
|
||||
"navigationBarTitleText": "供应商排行"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/shipmentPanel",
|
||||
"style": {
|
||||
"navigationBarTitleText": "出货汇总"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/customerRanking",
|
||||
"style": {
|
||||
"navigationBarTitleText": "客户排行"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/businessOverview",
|
||||
"style": {
|
||||
"navigationBarTitleText": "经营概况"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/supplierChecking",
|
||||
"style": {
|
||||
"navigationBarTitleText": "供应商对账"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/customerChecking",
|
||||
"style": {
|
||||
"navigationBarTitleText": "客户对账"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/scenePhoto/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "现场照片"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/supplier/billDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "供应商账单详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/supplier/detail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "供应商详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/customer/billDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "客户账单详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/statistics/customer/detail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "客户详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/app/receiveSpl",
|
||||
"style": {
|
||||
"navigationBarTitleText": "收货补单"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/app/shipmentSpl",
|
||||
"style": {
|
||||
"navigationBarTitleText": "出货补单"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/app/receiveDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "收货明细"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/app/shipmentDetail",
|
||||
"style": {
|
||||
"navigationBarTitleText": "出货明细"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/app/receiveCl",
|
||||
"style": {
|
||||
"navigationBarTitleText": "收货作废"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/app/shipmentCl",
|
||||
"style": {
|
||||
"navigationBarTitleText": "出货作废"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/app/supplierMgt",
|
||||
"style": {
|
||||
"navigationBarTitleText": "供应商管理"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/app/customerMgt",
|
||||
"style": {
|
||||
"navigationBarTitleText": "客户管理"
|
||||
}
|
||||
},
|
||||
//pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
|
||||
|
||||
// {
|
||||
// "path": "pages/login/index",
|
||||
// "style": {
|
||||
// "navigationBarTitleText": "登陆注册",
|
||||
// "navigationBarBackgroundColor": "#FFF"
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// "path": "pages/formItem/index",
|
||||
// "style": {
|
||||
// "navigationBarTitleText": "form 测试",
|
||||
// "navigationBarBackgroundColor": "#FFF"
|
||||
// }
|
||||
// }
|
||||
],
|
||||
// "tabBar": {
|
||||
// // "selectedColor": "#ff7d59",
|
||||
// "list": [{
|
||||
// "pagePath": "pages/index/index",
|
||||
// "text": "首页",
|
||||
// "iconPath": "",
|
||||
// "selectedIconPath": ""
|
||||
// },
|
||||
// {
|
||||
// "pagePath": "pages/login/index",
|
||||
// "text": "登陆",
|
||||
// "iconPath": "",
|
||||
// "selectedIconPath": ""
|
||||
// }]
|
||||
// },
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "智能回收",
|
||||
"navigationBarBackgroundColor": "#F8F8F8",
|
||||
"backgroundColor": "#F8F8F8"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,81 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<view class="search">
|
||||
<u-search
|
||||
placeholder="请输入客户名称"
|
||||
v-model="keyword"
|
||||
:showAction="false"
|
||||
:bgColor="'#fff'"
|
||||
:borderColor="'rgba(0, 0, 0, 0.1)'"
|
||||
:placeholderColor="'#C1C1C1'"
|
||||
></u-search>
|
||||
<view class="btn"> 新增 </view>
|
||||
</view>
|
||||
<view class="box">
|
||||
<view v-for="item in 10" :key="item">
|
||||
<view>
|
||||
<view>客户名称</view>
|
||||
<view>联系人：张三</view>
|
||||
<view>卡号：235466566</view>
|
||||
</view>
|
||||
<view class="btn"> 删除 </view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const keyword = ref("");
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
margin: 30rpx 25rpx;
|
||||
.search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.btn {
|
||||
background: #00dcee;
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
margin-left: 50rpx;
|
||||
padding: 6rpx 30rpx;
|
||||
}
|
||||
}
|
||||
.box {
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
padding: 10rpx 25rpx;
|
||||
font-weight: 400;
|
||||
font-size: 22rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
margin-top: 30rpx;
|
||||
> view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx 0rpx;
|
||||
.btn {
|
||||
background: #ff9d55;
|
||||
border-radius: 24rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
padding: 6rpx 30rpx;
|
||||
}
|
||||
.btn_text {
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
}
|
||||
}
|
||||
> view + view {
|
||||
border-top: 1px solid rgba(233, 233, 233, 0.76);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,190 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<view class="search">
|
||||
<u-search
|
||||
placeholder="请输入供应商名称"
|
||||
v-model="keyword"
|
||||
:showAction="false"
|
||||
:bgColor="'#fff'"
|
||||
:borderColor="'rgba(0, 0, 0, 0.1)'"
|
||||
:placeholderColor="'#C1C1C1'"
|
||||
></u-search>
|
||||
</view>
|
||||
|
||||
<view class="box" v-for="item in 10" :key="item">
|
||||
<view class="base">
|
||||
<view>
|
||||
<view class="no"> 收货单号：SHD20230901132333 </view>
|
||||
<view class="supplier"> 上海奉贤两网融合（大磅） </view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="btn" @click="handleScenePhoto">现场照片</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="name">吴小勇</view>
|
||||
<view class="type">轻二</view>
|
||||
<view class="flex-box">
|
||||
<text>定价人：谭兵</text>
|
||||
<text>过磅时间：2023-09-01 13:23:33</text>
|
||||
</view>
|
||||
|
||||
<view class="more">
|
||||
<view v-for="(item, index) in gridList1" :key="index" :style="item.isCustomStyle ? 'font-size: 22rpx;color:#999' : ''">
|
||||
<text v-if="item.name">{{ item.name }}：</text
|
||||
><text
|
||||
>{{ item.isBefore ? item.unit : "" }}
|
||||
{{ item.num }}
|
||||
{{ item.isBefore ? "" : item.unit }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const keyword = ref("");
|
||||
const gridList1 = reactive([
|
||||
{
|
||||
name: "毛重",
|
||||
num: "4080.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "皮重",
|
||||
num: "3450.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "扣杂",
|
||||
num: "640.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{},
|
||||
{
|
||||
name: "净重",
|
||||
num: "640.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "单价",
|
||||
num: "2.48",
|
||||
unit: "元/千克",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "结算总价",
|
||||
num: "2.48",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "实际总价",
|
||||
num: "2.48",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "作废人",
|
||||
num: "谭兵",
|
||||
unit: "",
|
||||
isBefore: false,
|
||||
isCustomStyle: true
|
||||
},
|
||||
{
|
||||
name: "过皮",
|
||||
num: "2023-09-01 13:23:33",
|
||||
unit: "",
|
||||
isBefore: false,
|
||||
isCustomStyle: true
|
||||
},
|
||||
]);
|
||||
const handleScenePhoto = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/scenePhoto/index", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
margin: 30rpx 25rpx;
|
||||
|
||||
.box {
|
||||
margin-top: 30rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
padding: 30rpx;
|
||||
.base {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.no {
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.supplier {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.btn {
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
padding: 10rpx 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
}
|
||||
.name {
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #000000;
|
||||
margin: 15rpx 0rpx;
|
||||
text {
|
||||
background-color: #ffaf75;
|
||||
font-weight: 500;
|
||||
font-size: 16rpx;
|
||||
color: #ffffff;
|
||||
padding: 5rpx 20rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
.type {
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #ec0f3e;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.flex-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
border-bottom: 1rpx solid rgba(233, 233, 233, 0.76);
|
||||
padding-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
.more {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
flex: 1;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
padding: 25rpx 0rpx 0rpx 0rpx;
|
||||
> view {
|
||||
line-height: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,243 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<view class="search">
|
||||
<u-search
|
||||
placeholder="请输入收货单号"
|
||||
v-model="keyword"
|
||||
:showAction="false"
|
||||
:bgColor="'#fff'"
|
||||
:borderColor="'rgba(0, 0, 0, 0.1)'"
|
||||
:placeholderColor="'#C1C1C1'"
|
||||
></u-search>
|
||||
<view class="btn"> 创建 </view>
|
||||
</view>
|
||||
<view class="filter">
|
||||
<view><text>本月</text><u-icon name="arrow-down"></u-icon></view>
|
||||
<view><text>单据状态</text><u-icon name="arrow-down"></u-icon></view>
|
||||
<view><text>排序</text><u-icon name="arrow-down"></u-icon></view>
|
||||
<view class="btn">筛选</view>
|
||||
</view>
|
||||
|
||||
<view class="time">2024-01-01</view>
|
||||
|
||||
<view class="box" v-for="item in 10" :key="item">
|
||||
<view class="base">
|
||||
<view>
|
||||
<view class="no"> 收货单号：SHD20230901132333 </view>
|
||||
<view class="supplier"> 上海奉贤两网融合（大磅） </view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="btn" @click="handleScenePhoto">现场照片</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="name">吴小勇 <text>未审核</text></view>
|
||||
<view class="type">轻二</view>
|
||||
<view class="flex-box">
|
||||
<text>定价人：谭兵</text>
|
||||
<text>创建时间：2023-09-01 13:23:33</text>
|
||||
</view>
|
||||
|
||||
<view class="more">
|
||||
<view v-for="(item, index) in gridList1" :key="index" :style="item.isCustomStyle ? 'font-size: 22rpx;color:#999' : ''">
|
||||
<text v-if="item.name">{{ item.name }}：</text
|
||||
><text
|
||||
>{{ item.isBefore ? item.unit : "" }}
|
||||
{{ item.num }}
|
||||
{{ item.isBefore ? "" : item.unit }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const keyword = ref("");
|
||||
const gridList1 = reactive([
|
||||
{
|
||||
name: "毛重",
|
||||
num: "4080.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "皮重",
|
||||
num: "3450.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "扣杂",
|
||||
num: "640.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{},
|
||||
{
|
||||
name: "净重",
|
||||
num: "640.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "单价",
|
||||
num: "2.48",
|
||||
unit: "元/千克",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "结算总价",
|
||||
num: "2.48",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "实际总价",
|
||||
num: "2.48",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "过毛",
|
||||
num: "2023-09-01 13:23:33",
|
||||
unit: "",
|
||||
isBefore: false,
|
||||
isCustomStyle: true
|
||||
},
|
||||
{
|
||||
name: "过皮",
|
||||
num: "2023-09-01 13:23:33",
|
||||
unit: "",
|
||||
isBefore: false,
|
||||
isCustomStyle: true
|
||||
},
|
||||
]);
|
||||
const handleScenePhoto = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/scenePhoto/index", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
margin: 30rpx 25rpx;
|
||||
.search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.btn {
|
||||
background: #00dcee;
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
margin-left: 50rpx;
|
||||
padding: 6rpx 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.filter {
|
||||
margin-top: 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #000000;
|
||||
> view {
|
||||
display: inline-block;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
font-size: 27rpx;
|
||||
color: #00dcee;
|
||||
}
|
||||
}
|
||||
.time {
|
||||
font-weight: 400;
|
||||
font-size: 22rpx;
|
||||
color: #000000;
|
||||
margin: 30rpx 0rpx;
|
||||
}
|
||||
.box + .box {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.box {
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
padding: 30rpx;
|
||||
.base {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.no {
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.supplier {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.btn {
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
padding: 10rpx 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
}
|
||||
.name {
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #000000;
|
||||
margin: 15rpx 0rpx;
|
||||
text {
|
||||
background-color: #ffaf75;
|
||||
font-weight: 500;
|
||||
font-size: 16rpx;
|
||||
color: #ffffff;
|
||||
padding: 5rpx 20rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
.type {
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #ec0f3e;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.flex-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
border-bottom: 1rpx solid rgba(233, 233, 233, 0.76);
|
||||
padding-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
.more {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
flex: 1;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
padding: 25rpx 0rpx 0rpx 0rpx;
|
||||
> view {
|
||||
line-height: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,258 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
:rules="rules"
|
||||
ref="form"
|
||||
:labelWidth="80"
|
||||
:labelStyle="{ padding: '0rpx 10rpx' }"
|
||||
>
|
||||
<u-form-item
|
||||
:prop="`order[${item.key}]`"
|
||||
:label="item.name"
|
||||
required
|
||||
v-for="(item, index) in formAttrList"
|
||||
:key="index"
|
||||
@click="item.fn"
|
||||
>
|
||||
<u-textarea
|
||||
v-if="item.type === 'textarea'"
|
||||
v-model="(model1.order as any)[item.key]"
|
||||
:placeholder="`请输入${item.name}`"
|
||||
></u-textarea>
|
||||
<u-input
|
||||
v-if="item.type === 'select' || item.type === 'input'"
|
||||
v-model="(model1.order as any)[item.key]"
|
||||
:placeholder="`请${item.type === 'select' ? '选择' : '输入'}${
|
||||
item.name
|
||||
}`"
|
||||
:clearable="true"
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.key === 'subtractNum'">
|
||||
{{ model1.order.subtractType === 1 ? item.unit : "%" }}
|
||||
</text>
|
||||
<text v-else>
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
|
||||
</template>
|
||||
</u-input>
|
||||
<!-- @afterRead="afterRead"
|
||||
@delete="deletePic" -->
|
||||
<u-upload
|
||||
v-if="item.type === 'upload'"
|
||||
:fileList="[]"
|
||||
name="1"
|
||||
multiple
|
||||
:maxCount="10"
|
||||
></u-upload>
|
||||
|
||||
<u-radio-group
|
||||
v-if="item.type === 'radio'"
|
||||
v-model="(model1.order as any)[item.key]"
|
||||
placement="row"
|
||||
>
|
||||
<u-radio activeColor="#00DCEE" label="按固定重量" :name="1"></u-radio>
|
||||
|
||||
<u-radio activeColor="#00DCEE" label="按百分比" :name="2"></u-radio>
|
||||
</u-radio-group>
|
||||
<template #right v-if="item.type === 'select'">
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</template>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
<u-datetime-picker
|
||||
:show="contrlModalParams.isShowSplTime"
|
||||
v-model="contrlModalParams.spltime"
|
||||
mode="datetime"
|
||||
@confirm="contrlModalParams.isShowSplTime = false"
|
||||
@cancel="contrlModalParams.isShowSplTime = false"
|
||||
></u-datetime-picker>
|
||||
<u-action-sheet
|
||||
:actions="contrlModalParams.select.selectList"
|
||||
:title="contrlModalParams.select.title"
|
||||
:show="contrlModalParams.select.isShow"
|
||||
@select="contrlModalParams.select.isShow = false"
|
||||
@close="contrlModalParams.select.isShow = false"
|
||||
></u-action-sheet>
|
||||
</view>
|
||||
<view class="btn-box">
|
||||
<u-button type="primary" text="保存"></u-button>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const model1 = reactive({
|
||||
order: {
|
||||
splTime: "",
|
||||
subtractType: 1,
|
||||
},
|
||||
});
|
||||
const rules = ref({
|
||||
"userInfo.userName": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入手机号",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"userInfo.password": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入密码",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
});
|
||||
const contrlModalParams = reactive({
|
||||
isShowSplTime: false,
|
||||
spltime: "",
|
||||
select: {
|
||||
isShow: false,
|
||||
title: "标题",
|
||||
selectList: [
|
||||
{
|
||||
name: "选项一",
|
||||
},
|
||||
{
|
||||
name: "选项二",
|
||||
},
|
||||
],
|
||||
},
|
||||
});
|
||||
|
||||
const formAttrList = reactive([
|
||||
{
|
||||
name: "补单时间",
|
||||
key: "splTime",
|
||||
type: "select",
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams.isShowSplTime = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "站点磅秤",
|
||||
key: "stationScale",
|
||||
type: "select",
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams.select.isShow = true;
|
||||
contrlModalParams.select.title = "站点磅秤";
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "供应商",
|
||||
key: "supplier",
|
||||
type: "select",
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams.select.isShow = true;
|
||||
contrlModalParams.select.title = "供应商";
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "车牌号",
|
||||
key: "carNo",
|
||||
type: "input",
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "收货产品",
|
||||
key: "receiveProduct",
|
||||
type: "select",
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams.select.isShow = true;
|
||||
contrlModalParams.select.title = "收货产品";
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "毛重",
|
||||
key: "grossWeight",
|
||||
type: "input",
|
||||
unit: "KG",
|
||||
},
|
||||
{
|
||||
name: "皮重",
|
||||
key: "tare",
|
||||
type: "input",
|
||||
unit: "KG",
|
||||
},
|
||||
{
|
||||
name: "扣杂",
|
||||
key: "subtractType",
|
||||
type: "radio",
|
||||
},
|
||||
{
|
||||
name: "杂质扣除",
|
||||
key: "subtractNum",
|
||||
type: "input",
|
||||
unit: "KG",
|
||||
},
|
||||
{
|
||||
name: "净重",
|
||||
key: "netWeight",
|
||||
type: "input",
|
||||
unit: "KG",
|
||||
},
|
||||
{
|
||||
name: "单价",
|
||||
key: "unitPrice",
|
||||
type: "input",
|
||||
unit: "元/KG",
|
||||
},
|
||||
{
|
||||
name: "预估总价",
|
||||
key: "estimatedTotalPrice",
|
||||
type: "input",
|
||||
unit: "元",
|
||||
},
|
||||
{
|
||||
name: "贷款金额",
|
||||
key: "loanAmount",
|
||||
type: "input",
|
||||
unit: "元",
|
||||
},
|
||||
{
|
||||
name: "备注",
|
||||
key: "remark",
|
||||
type: "textarea",
|
||||
},
|
||||
{
|
||||
name: "货品照片",
|
||||
key: "photo",
|
||||
type: "upload",
|
||||
},
|
||||
]);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
background: #ffffff;
|
||||
// box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 30rpx 25rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
::v-deep .u-form-item {
|
||||
height: auto;
|
||||
}
|
||||
::v-deep .u-form-item + .u-form-item {
|
||||
border-top: 1rpx solid rgba(233, 233, 233, 0.76);
|
||||
}
|
||||
}
|
||||
.btn-box {
|
||||
margin-top: 60rpx;
|
||||
display: flex;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 56, 93, 0.12);
|
||||
border-radius: 13rpx 13rpx 0rpx 0rpx;
|
||||
padding: 25rpx 50rpx;
|
||||
position: sticky;
|
||||
bottom: 0rpx;
|
||||
z-index: 999;
|
||||
::v-deep button {
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,242 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<view class="search">
|
||||
<u-search
|
||||
placeholder="请输入供应商名称"
|
||||
v-model="keyword"
|
||||
:showAction="false"
|
||||
:bgColor="'#fff'"
|
||||
:borderColor="'rgba(0, 0, 0, 0.1)'"
|
||||
:placeholderColor="'#C1C1C1'"
|
||||
></u-search>
|
||||
</view>
|
||||
|
||||
<view class="box" v-for="item in 10" :key="item">
|
||||
<view class="base">
|
||||
<view>
|
||||
<view class="no"> 出货单号：SHD20230901132333 </view>
|
||||
<view class="supplier"> 上海奉贤两网融合（大磅） </view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="btn" @click="handleScenePhoto">现场照片</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="name">吴小勇 <text>未结算</text></view>
|
||||
<view class="type">轻二</view>
|
||||
|
||||
<view class="more">
|
||||
<view
|
||||
v-for="(item, index) in gridList1"
|
||||
:key="index"
|
||||
:style="{
|
||||
width: `${item.name === '创建时间' ? 'max-content' : ''}`,
|
||||
'font-size': `${item.isCustomStyle ? '22rpx' : ''}`,
|
||||
color: `${item.isCustomStyle ? '#999' : ''}`,
|
||||
}"
|
||||
>
|
||||
<text v-if="item.name">{{ item.name }}：</text
|
||||
><text
|
||||
>{{ item.isBefore ? item.unit : "" }}
|
||||
{{ item.num }}
|
||||
{{ item.isBefore ? "" : item.unit }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const keyword = ref("");
|
||||
const gridList1 = reactive([
|
||||
{
|
||||
name: "卡号",
|
||||
num: "123123",
|
||||
},
|
||||
{},
|
||||
{
|
||||
name: "创建时间",
|
||||
num: "2023-09-01 13:23:33",
|
||||
},
|
||||
{},
|
||||
{
|
||||
name: "车牌号",
|
||||
num: "123",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "送货方式",
|
||||
num: "自提",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "毛重",
|
||||
num: "4080.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "皮重",
|
||||
num: "3450.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "净重",
|
||||
num: "640.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "数量",
|
||||
num: "1",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "过毛",
|
||||
num: "2023-09-01 13:23:33",
|
||||
unit: "",
|
||||
isBefore: false,
|
||||
isCustomStyle: true,
|
||||
},
|
||||
{
|
||||
name: "过皮",
|
||||
num: "2023-09-01 13:23:33",
|
||||
unit: "",
|
||||
isBefore: false,
|
||||
isCustomStyle: true,
|
||||
},
|
||||
{
|
||||
name: "结算重量",
|
||||
num: "640.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "单价",
|
||||
num: "2.48",
|
||||
unit: "元/千克",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "结算总价",
|
||||
num: "2.48",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "实结金额",
|
||||
num: "2.48",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "应收金额",
|
||||
num: "2.48",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{},
|
||||
{
|
||||
name: "作废人",
|
||||
num: "谭兵",
|
||||
unit: "",
|
||||
isBefore: false,
|
||||
isCustomStyle: true,
|
||||
},
|
||||
{
|
||||
name: "过皮",
|
||||
num: "2023-09-01 13:23:33",
|
||||
unit: "",
|
||||
isBefore: false,
|
||||
isCustomStyle: true,
|
||||
},
|
||||
]);
|
||||
const handleScenePhoto = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/scenePhoto/index", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
margin: 30rpx 25rpx;
|
||||
.search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.btn {
|
||||
background: #00dcee;
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
margin-left: 50rpx;
|
||||
padding: 6rpx 30rpx;
|
||||
}
|
||||
}
|
||||
.box {
|
||||
margin-top: 30rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
padding: 30rpx;
|
||||
.base {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.no {
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.supplier {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.btn {
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
padding: 10rpx 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
}
|
||||
.name {
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #000000;
|
||||
margin: 15rpx 0rpx;
|
||||
text {
|
||||
background-color: #ffaf75;
|
||||
font-weight: 500;
|
||||
font-size: 16rpx;
|
||||
color: #ffffff;
|
||||
padding: 5rpx 20rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
.type {
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #ec0f3e;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
.more {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
flex: 1;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
> view {
|
||||
line-height: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,263 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<view class="search">
|
||||
<u-search
|
||||
placeholder="请输入出货单号"
|
||||
v-model="keyword"
|
||||
:showAction="false"
|
||||
:bgColor="'#fff'"
|
||||
:borderColor="'rgba(0, 0, 0, 0.1)'"
|
||||
:placeholderColor="'#C1C1C1'"
|
||||
></u-search>
|
||||
<view class="btn"> 创建 </view>
|
||||
</view>
|
||||
<view class="filter">
|
||||
<view><text>本月</text><u-icon name="arrow-down"></u-icon></view>
|
||||
<view><text>单据状态</text><u-icon name="arrow-down"></u-icon></view>
|
||||
<view><text>排序</text><u-icon name="arrow-down"></u-icon></view>
|
||||
<view class="btn">筛选</view>
|
||||
</view>
|
||||
|
||||
<view class="time">2024-01-01</view>
|
||||
|
||||
<view class="box" v-for="item in 10" :key="item">
|
||||
<view class="base">
|
||||
<view>
|
||||
<view class="no"> 出货单号：SHD20230901132333 </view>
|
||||
<view class="supplier"> 上海奉贤两网融合（大磅） </view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="btn" @click="handleScenePhoto">现场照片</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="name">吴小勇 <text>已结算</text></view>
|
||||
<view class="type">轻二</view>
|
||||
|
||||
<view class="more">
|
||||
<view
|
||||
v-for="(item, index) in gridList1"
|
||||
:key="index"
|
||||
:style="{'width': `${item.name === '创建时间' ? 'max-content' : ''}`, 'font-size': `${item.isCustomStyle ? '22rpx': ''}`, 'color': `${item.isCustomStyle ? '#999': ''}`}"
|
||||
>
|
||||
<text v-if="item.name">{{ item.name }}：</text
|
||||
><text
|
||||
>{{ item.isBefore ? item.unit : "" }}
|
||||
{{ item.num }}
|
||||
{{ item.isBefore ? "" : item.unit }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const keyword = ref("");
|
||||
const gridList1 = reactive([
|
||||
{
|
||||
name: "卡号",
|
||||
num: "123123",
|
||||
},
|
||||
{},
|
||||
{
|
||||
name: "创建时间",
|
||||
num: "2023-09-01 13:23:33",
|
||||
},
|
||||
{},
|
||||
{
|
||||
name: "车牌号",
|
||||
num: "123",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "送货方式",
|
||||
num: "自提",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "毛重",
|
||||
num: "4080.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "皮重",
|
||||
num: "3450.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "净重",
|
||||
num: "640.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "数量",
|
||||
num: "1",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "过毛",
|
||||
num: "2023-09-01 13:23:33",
|
||||
unit: "",
|
||||
isBefore: false,
|
||||
isCustomStyle: true,
|
||||
},
|
||||
{
|
||||
name: "过皮",
|
||||
num: "2023-09-01 13:23:33",
|
||||
unit: "",
|
||||
isBefore: false,
|
||||
isCustomStyle: true,
|
||||
},
|
||||
{
|
||||
name: "结算重量",
|
||||
num: "640.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "单价",
|
||||
num: "2.48",
|
||||
unit: "元/千克",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "结算总价",
|
||||
num: "2.48",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "实际金额",
|
||||
num: "2.48",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "实收金额",
|
||||
num: "2.48",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
|
||||
]);
|
||||
const handleScenePhoto = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/scenePhoto/index", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
margin: 30rpx 25rpx;
|
||||
.search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.btn {
|
||||
background: #00dcee;
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
margin-left: 50rpx;
|
||||
padding: 6rpx 30rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.filter {
|
||||
margin-top: 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #000000;
|
||||
> view {
|
||||
display: inline-block;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
font-size: 27rpx;
|
||||
color: #00dcee;
|
||||
}
|
||||
}
|
||||
.time {
|
||||
font-weight: 400;
|
||||
font-size: 22rpx;
|
||||
color: #000000;
|
||||
margin: 30rpx 0rpx;
|
||||
}
|
||||
.box + .box {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.box {
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
padding: 30rpx;
|
||||
.base {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.no {
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.supplier {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.btn {
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
padding: 10rpx 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
}
|
||||
.name {
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #000000;
|
||||
margin: 15rpx 0rpx;
|
||||
text {
|
||||
background-color: #ffaf75;
|
||||
font-weight: 500;
|
||||
font-size: 16rpx;
|
||||
color: #ffffff;
|
||||
padding: 5rpx 20rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
}
|
||||
.type {
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #ec0f3e;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
}
|
||||
.more {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
flex: 1;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
> view {
|
||||
line-height: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,274 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
:rules="rules"
|
||||
ref="form"
|
||||
:labelWidth="80"
|
||||
:labelStyle="{ padding: '0rpx 10rpx' }"
|
||||
>
|
||||
<u-form-item
|
||||
:prop="`order[${item.key}]`"
|
||||
:label="item.name"
|
||||
:required="item.required"
|
||||
v-for="(item, index) in formAttrList"
|
||||
:key="index"
|
||||
@click="item.fn"
|
||||
>
|
||||
<u-textarea
|
||||
v-if="item.type === 'textarea'"
|
||||
v-model="(model1.order as any)[item.key]"
|
||||
:placeholder="`请输入${item.name}`"
|
||||
></u-textarea>
|
||||
<u-input
|
||||
v-if="item.type === 'select' || item.type === 'input'"
|
||||
v-model="(model1.order as any)[item.key]"
|
||||
:placeholder="`请${item.type === 'select' ? '选择' : '输入'}${
|
||||
item.name
|
||||
}`"
|
||||
:clearable="true"
|
||||
:customStyle="{}"
|
||||
border="none"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.key === 'subtractNum'">
|
||||
{{ model1.order.subtractType === 1 ? item.unit : "%" }}
|
||||
</text>
|
||||
<text v-else>
|
||||
{{ item.unit }}
|
||||
</text>
|
||||
|
||||
</template>
|
||||
</u-input>
|
||||
<!-- @afterRead="afterRead"
|
||||
@delete="deletePic" -->
|
||||
<u-upload
|
||||
v-if="item.type === 'upload'"
|
||||
:fileList="[]"
|
||||
name="1"
|
||||
multiple
|
||||
:maxCount="10"
|
||||
></u-upload>
|
||||
|
||||
<u-radio-group
|
||||
v-if="item.type === 'radio'"
|
||||
v-model="(model1.order as any)[item.key]"
|
||||
placement="row"
|
||||
>
|
||||
<u-radio activeColor="#00DCEE" label="送货" :name="1"></u-radio>
|
||||
|
||||
<u-radio activeColor="#00DCEE" label="自提" :name="2"></u-radio>
|
||||
</u-radio-group>
|
||||
<template #right v-if="item.type === 'select'">
|
||||
<u-icon name="arrow-right"></u-icon>
|
||||
</template>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
<u-datetime-picker
|
||||
:show="contrlModalParams.isShowSplTime"
|
||||
v-model="contrlModalParams.spltime"
|
||||
mode="datetime"
|
||||
@confirm="contrlModalParams.isShowSplTime = false"
|
||||
@cancel="contrlModalParams.isShowSplTime = false"
|
||||
></u-datetime-picker>
|
||||
<u-action-sheet
|
||||
:actions="contrlModalParams.select.selectList"
|
||||
:title="contrlModalParams.select.title"
|
||||
:show="contrlModalParams.select.isShow"
|
||||
@select="contrlModalParams.select.isShow = false"
|
||||
@close="contrlModalParams.select.isShow = false"
|
||||
></u-action-sheet>
|
||||
</view>
|
||||
<view class="btn-box">
|
||||
<u-button type="primary" text="保存"></u-button>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const model1 = reactive({
|
||||
order: {
|
||||
splTime: "",
|
||||
takeType: 1,
|
||||
},
|
||||
});
|
||||
const rules = ref({
|
||||
"userInfo.userName": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入手机号",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"userInfo.password": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入密码",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
});
|
||||
const contrlModalParams = reactive({
|
||||
isShowSplTime: false,
|
||||
spltime: "",
|
||||
select: {
|
||||
isShow: false,
|
||||
title: "标题",
|
||||
selectList: [
|
||||
{
|
||||
name: "选项一",
|
||||
},
|
||||
{
|
||||
name: "选项二",
|
||||
},
|
||||
],
|
||||
},
|
||||
});
|
||||
|
||||
const formAttrList = reactive([
|
||||
{
|
||||
name: "补单时间",
|
||||
key: "splTime",
|
||||
type: "select",
|
||||
required: true,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams.isShowSplTime = true;
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "过磅设备",
|
||||
key: "weighDevice",
|
||||
type: "select",
|
||||
required: true,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams.select.isShow = true;
|
||||
contrlModalParams.select.title = "站点磅秤";
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "客户",
|
||||
key: "customer",
|
||||
type: "select",
|
||||
required: true,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams.select.isShow = true;
|
||||
contrlModalParams.select.title = "供应商";
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "出货产品",
|
||||
key: "shipmentProduct",
|
||||
type: "select",
|
||||
required: true,
|
||||
unit: "",
|
||||
fn: () => {
|
||||
contrlModalParams.select.isShow = true;
|
||||
contrlModalParams.select.title = "收货产品";
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "数量",
|
||||
key: "grossWeight",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "件",
|
||||
},
|
||||
{
|
||||
name: "毛重",
|
||||
key: "grossWeight",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "KG",
|
||||
},
|
||||
{
|
||||
name: "皮重",
|
||||
key: "tare",
|
||||
type: "input",
|
||||
required: true,
|
||||
unit: "KG",
|
||||
},
|
||||
{
|
||||
name: "净重",
|
||||
key: "netWeight",
|
||||
type: "input",
|
||||
unit: "KG",
|
||||
},
|
||||
{
|
||||
name: "提货方式",
|
||||
key: "takeType",
|
||||
required: true,
|
||||
type: "radio",
|
||||
},
|
||||
{
|
||||
name: "车辆信息",
|
||||
type: "text",
|
||||
},
|
||||
{
|
||||
name: "车牌号",
|
||||
key: "carNo",
|
||||
type: "input",
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "司机电话",
|
||||
key: "phone",
|
||||
type: "input",
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "集装箱",
|
||||
type: "text",
|
||||
},
|
||||
{
|
||||
name: "箱号",
|
||||
key: "boxNo",
|
||||
type: "input",
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "封号",
|
||||
key: "no",
|
||||
type: "input",
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "备注",
|
||||
key: "remark",
|
||||
type: "textarea",
|
||||
},
|
||||
{
|
||||
name: "上传照片",
|
||||
key: "photo",
|
||||
type: "upload",
|
||||
},
|
||||
]);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
background: #ffffff;
|
||||
// box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 30rpx 25rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
::v-deep .u-form-item {
|
||||
height: auto;
|
||||
}
|
||||
::v-deep .u-form-item + .u-form-item {
|
||||
border-top: 1rpx solid rgba(233, 233, 233, 0.76);
|
||||
}
|
||||
}
|
||||
.btn-box {
|
||||
margin-top: 60rpx;
|
||||
display: flex;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 56, 93, 0.12);
|
||||
border-radius: 13rpx 13rpx 0rpx 0rpx;
|
||||
padding: 25rpx 50rpx;
|
||||
position: sticky;
|
||||
bottom: 0rpx;
|
||||
z-index: 999;
|
||||
::v-deep button {
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,84 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<view class="search">
|
||||
<u-search
|
||||
placeholder="请输入供应商名称"
|
||||
v-model="keyword"
|
||||
:showAction="false"
|
||||
:bgColor="'#fff'"
|
||||
:borderColor="'rgba(0, 0, 0, 0.1)'"
|
||||
:placeholderColor="'#C1C1C1'"
|
||||
></u-search>
|
||||
<view class="btn"> 新增 </view>
|
||||
</view>
|
||||
<view class="box">
|
||||
<view>
|
||||
<view>
|
||||
<view>供应商名称</view>
|
||||
<view>卡号：235466566</view>
|
||||
</view>
|
||||
<view class="btn"> 删除 </view>
|
||||
</view>
|
||||
<view>
|
||||
<view> 送货员：111 </view>
|
||||
<view class="btn_text"> 详情 </view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const keyword = ref("");
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
margin: 30rpx 25rpx;
|
||||
.search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.btn {
|
||||
background: #00dcee;
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
margin-left: 50rpx;
|
||||
padding: 6rpx 30rpx;
|
||||
}
|
||||
}
|
||||
.box {
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
padding: 10rpx 25rpx;
|
||||
font-weight: 400;
|
||||
font-size: 22rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
margin-top: 30rpx;
|
||||
> view {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx 0rpx;
|
||||
.btn {
|
||||
background: #ff9d55;
|
||||
border-radius: 24rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #ffffff;
|
||||
padding: 6rpx 30rpx;
|
||||
}
|
||||
.btn_text {
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
}
|
||||
}
|
||||
> view + view {
|
||||
border-top: 1px solid rgba(233, 233, 233, 0.76);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,121 @@
|
|||
<template>
|
||||
<view class="c-login-container">
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
:rules="rules"
|
||||
ref="loginForm"
|
||||
:labelWidth="0"
|
||||
>
|
||||
<u-form-item prop="userInfo.name" borderBottom ref="item1">
|
||||
<u-input
|
||||
v-model="model1.userInfo.name"
|
||||
placeholder="请输入手机号"
|
||||
:shape="'circle'"
|
||||
></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item prop="userInfo.name" borderBottom ref="item1">
|
||||
<u-input
|
||||
v-model="model1.userInfo.name"
|
||||
placeholder="请输入验证码"
|
||||
:shape="'circle'"
|
||||
>
|
||||
<template #suffix>
|
||||
<text>获取验证码</text>
|
||||
</template>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
<u-form-item prop="userInfo.name" borderBottom ref="item1">
|
||||
<u-input
|
||||
v-model="model1.userInfo.name"
|
||||
placeholder="请设置密码"
|
||||
:shape="'circle'"
|
||||
:type="'password'"
|
||||
></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item>
|
||||
<view class="c-flex-space-between">
|
||||
<u-checkbox-group
|
||||
v-model="checkboxValue1"
|
||||
placement="column"
|
||||
@change="checkboxChange"
|
||||
>
|
||||
<u-checkbox
|
||||
:customStyle="{ fontSize: '8px' }"
|
||||
:key="'1'"
|
||||
:label="'记住密码'"
|
||||
:name="'记住密码'"
|
||||
/>
|
||||
</u-checkbox-group>
|
||||
<text class="f-s-15 l-h-28">无法收到验证码</text>
|
||||
</view>
|
||||
</u-form-item>
|
||||
<u-form-item>
|
||||
<view class="c-flex-space-between">
|
||||
<view style="display: flex; line-height: 28px">
|
||||
<view>
|
||||
<u-checkbox-group
|
||||
v-model="checkboxValue1"
|
||||
placement="column"
|
||||
@change="checkboxChange"
|
||||
>
|
||||
<u-checkbox :customStyle="{ fontSize: '8px' }" :key="'1'" />
|
||||
</u-checkbox-group>
|
||||
</view>
|
||||
<view>
|
||||
同意用户<a href="#">服务协议</a>和<a href="#">隐私政策</a>
|
||||
</view>
|
||||
</view>
|
||||
<text class="f-s-15 l-h-28">忘记密码</text>
|
||||
</view>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
|
||||
<u-button @click="submit">立即登录</u-button>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const loginForm = ref(null);
|
||||
const checkboxValue1 = ref([]);
|
||||
const model1 = ref({
|
||||
userInfo: {
|
||||
name: "",
|
||||
sex: "",
|
||||
},
|
||||
});
|
||||
const rules = ref({
|
||||
"userInfo.name": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请填写姓名",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"userInfo.sex": {
|
||||
type: "string",
|
||||
max: 1,
|
||||
required: true,
|
||||
message: "请选择男或女",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
});
|
||||
|
||||
const checkboxChange = (n: any) => {
|
||||
console.log("change", n);
|
||||
};
|
||||
const submit = () => {
|
||||
(loginForm.value as any).validate();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.c-login-container {
|
||||
padding: 30px;
|
||||
}
|
||||
.c-flex-space-between {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
font-size: 12px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,99 @@
|
|||
<template>
|
||||
<view class="card-box">
|
||||
<view class="top-flex-box">
|
||||
<view>
|
||||
<view>
|
||||
<text class="address">上海奉贤两网融合</text>
|
||||
<text class="type">(大磅)</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="number">收货单号：SHD20230901132333</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="name">陡其成</text>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="btn">现场照片</text>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="desc">毛重时间：2023-09-01 13:23:33</text>
|
||||
</view>
|
||||
<view class="flex-box">
|
||||
<text>皮重：2510kg</text>
|
||||
</view>
|
||||
<view class="btn-box">
|
||||
<u-button
|
||||
text="点击作废"
|
||||
color="#E8E8E8"
|
||||
:customStyle="{ color: '#999' }"
|
||||
></u-button>
|
||||
<u-button type="primary" text="点击编辑"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts"></script>
|
||||
<style lang="scss" scoped>
|
||||
.card-box {
|
||||
padding: 38rpx 50rpx;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 0rpx 25rpx;
|
||||
margin-top: 35rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
.top-flex-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.btn {
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
padding: 10rpx 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
}
|
||||
.address {
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
.type,
|
||||
.desc {
|
||||
font-size: 21rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.desc {
|
||||
margin-top: 30rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.flex-box {
|
||||
font-weight: 400;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.btn-box {
|
||||
margin-top: 60rpx;
|
||||
display: flex;
|
||||
::v-deep button {
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
::v-deep button + button {
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,73 @@
|
|||
<template>
|
||||
123
|
||||
<view class="launch-start">
|
||||
<AvaSwiper :list="bannerDate"></AvaSwiper>
|
||||
<swiper indicator-dots autoplay circular class="c-swiper-container">
|
||||
<swiper-item v-for="(item, index) in list" :key="index">
|
||||
<view class="c-text-center">
|
||||
<image mode="widthFix" :src="item.url" @tap="onPreviewImage(item.url)"/>
|
||||
</view>
|
||||
<view class="desc">
|
||||
<text>{{ item.title }}</text>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import type { BannerItem } from '@/types/home';
|
||||
|
||||
const bannerDate = ref<BannerItem[]>([
|
||||
{
|
||||
id: 1,
|
||||
herfUrl: '',
|
||||
imgUrl: "https://cdn.uviewui.com/uview/swiper/swiper1.png",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
herfUrl: '',
|
||||
imgUrl: "https://cdn.uviewui.com/uview/swiper/swiper2.png",
|
||||
}
|
||||
])
|
||||
const list = ref([
|
||||
{
|
||||
url: "https://cdn.uviewui.com/uview/swiper/swiper1.png",
|
||||
title: "智能回收，智慧未来！",
|
||||
},
|
||||
{
|
||||
url: "https://cdn.uviewui.com/uview/swiper/swiper2.png",
|
||||
title: "高效管理，安全快捷！",
|
||||
},
|
||||
{
|
||||
url: "https://cdn.uviewui.com/uview/swiper/swiper1.png",
|
||||
title: "全新系统，崭新界面！",
|
||||
},
|
||||
{
|
||||
url: "https://cdn.uviewui.com/uview/swiper/swiper3.png",
|
||||
title: "全城握手，致富从这里开始",
|
||||
},
|
||||
]);
|
||||
const onPreviewImage = (url: string) => {
|
||||
uni.previewImage({
|
||||
current: url,
|
||||
urls: list.value.map(v=>v.url),
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.launch-start {
|
||||
height: 100vh;
|
||||
padding: 40px;
|
||||
.c-swiper-container {
|
||||
height: calc(100% - 100px);
|
||||
}
|
||||
.desc {
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
bottom: 100px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,590 @@
|
|||
<template>
|
||||
<!-- 自定义工作台头部 -->
|
||||
<NavBar></NavBar>
|
||||
<view
|
||||
class="contaner"
|
||||
:style="{
|
||||
marginTop: navbarRect.height + navbarRect.top + 'px',
|
||||
height: navbarRect.safeHeight + 'px',
|
||||
}"
|
||||
>
|
||||
<!-- 数据汇总面板 -->
|
||||
<!-- `url('/static/img/${item.imgUrl}')`, -->
|
||||
<view class="summary">
|
||||
<!-- :style="{
|
||||
'background': 'url(\'/static/img/'+ item.imgUrl +'\')',
|
||||
backgroundSize: 'cover',
|
||||
}" -->
|
||||
<view class="panel" v-for="(item, index) in summaryList" :key="index">
|
||||
<image :src="`/static/img/${item.imgUrl}`" />
|
||||
<view class="box">
|
||||
<view class="num">{{ item.num }}</view>
|
||||
<view class="title">{{ item.title }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="data-detail">
|
||||
<view class="p-15">
|
||||
<!-- 收货入库 -->
|
||||
<text class="title">收货入库</text>
|
||||
<view class="data-receive">
|
||||
<up-row justify="center" gutter="10">
|
||||
<up-col span="3" v-for="(item, index) in receiveList" :key="index" @click="(item as any).fn()">
|
||||
<view
|
||||
class="box"
|
||||
:style="{
|
||||
backgroundColor: boxStyleList[index].backgroundColor,
|
||||
borderColor: boxStyleList[index].borderColor,
|
||||
boxShadow: `0rpx 7rpx 12rpx 0rpx ${boxStyleList[index].shadowColor}`,
|
||||
}"
|
||||
>
|
||||
<view
|
||||
class="num"
|
||||
:style="{ color: boxStyleList[index].numColor }"
|
||||
>
|
||||
<text>{{ item.num }}</text>
|
||||
</view>
|
||||
<view class="desc">
|
||||
<text>{{ item.title }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</up-col>
|
||||
</up-row>
|
||||
</view>
|
||||
|
||||
<!-- 出货入库 -->
|
||||
<text class="title title-shipment">出货入库</text>
|
||||
<view class="data-shipment">
|
||||
<up-row justify="center" gutter="10">
|
||||
<up-col span="3" v-for="(item, index) in shipmentList" :key="index" @click="(item as any).fn()">
|
||||
<view
|
||||
class="box"
|
||||
:style="{
|
||||
backgroundColor: boxStyleList[index].backgroundColor,
|
||||
borderColor: boxStyleList[index].borderColor,
|
||||
boxShadow: `0rpx 7rpx 12rpx 0rpx ${boxStyleList[index].shadowColor}`,
|
||||
}"
|
||||
>
|
||||
<view
|
||||
class="num"
|
||||
:style="{ color: boxStyleList[index].numColor }"
|
||||
>
|
||||
<text>{{ item.num }}</text>
|
||||
</view>
|
||||
<view class="desc">
|
||||
<text>{{ item.title }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</up-col>
|
||||
</up-row>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 线条 -->
|
||||
<view class="line"> </view>
|
||||
|
||||
<!-- 常用应用 -->
|
||||
<view class="app-list">
|
||||
<view class="name">常用应用</view>
|
||||
<u-grid :border="false" col="4">
|
||||
<u-grid-item v-for="(item, listIndex) in appList" :key="listIndex" @click="item.fn">
|
||||
<up-image
|
||||
:src="`/static/img/${item.icon}`"
|
||||
width="40rpx"
|
||||
height="40rpx"
|
||||
></up-image>
|
||||
<text class="grid-text">{{ item.title }}</text>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 工作台底部菜单 -->
|
||||
<view>
|
||||
<view class="tabBar">
|
||||
<view class="tabMenuBox">
|
||||
<view class="circle-box"></view>
|
||||
<u-grid :border="false">
|
||||
<u-grid-item
|
||||
v-for="(item, listIndex) in tabMenuList"
|
||||
:key="listIndex"
|
||||
@click="item.fn"
|
||||
>
|
||||
<up-image
|
||||
:src="`/static/img/TabMenu/${item.icon}`"
|
||||
width="33rpx"
|
||||
height="40rpx"
|
||||
mode="aspectFill"
|
||||
class="grid-icon"
|
||||
></up-image>
|
||||
<text
|
||||
class="grid-text"
|
||||
:style="{ color: listIndex === 1 ? '#fff' : '' }"
|
||||
>{{ item.title }}</text
|
||||
>
|
||||
</u-grid-item>
|
||||
</u-grid>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useMemberStore } from "@/store/index";
|
||||
import { ReceiveApi, ShipmentApi } from "@/services/index";
|
||||
const store = useMemberStore();
|
||||
const navbarRect = reactive({
|
||||
height: 32,
|
||||
top: 28,
|
||||
safeHeight: 500,
|
||||
});
|
||||
|
||||
const getSafeHeight = () => {
|
||||
// #ifdef APP-PLUS || MP-WEIXIN
|
||||
uni.getSystemInfo({
|
||||
success: (res) => {
|
||||
navbarRect.safeHeight =
|
||||
res.windowHeight -
|
||||
uni.upx2px(80) -
|
||||
navbarRect.height -
|
||||
navbarRect.top -
|
||||
40 -
|
||||
17;
|
||||
},
|
||||
});
|
||||
// #endif
|
||||
};
|
||||
const summaryList = reactive([
|
||||
{
|
||||
title: "总收货/KG",
|
||||
num: 0,
|
||||
imgUrl: "01.png",
|
||||
},
|
||||
{
|
||||
title: "收货总支出/元",
|
||||
num: 0,
|
||||
imgUrl: "02.png",
|
||||
},
|
||||
{
|
||||
title: "总出货/KG",
|
||||
num: 0,
|
||||
imgUrl: "03.png",
|
||||
},
|
||||
{
|
||||
title: "出货总收入/元",
|
||||
num: 0,
|
||||
imgUrl: "04.png",
|
||||
},
|
||||
]);
|
||||
|
||||
const boxStyleList = reactive([
|
||||
{
|
||||
borderColor: "rgba(240, 147, 107, 1)",
|
||||
backgroundColor: "#FFFAF7",
|
||||
shadowColor: "rgba(146,44,0,0.2)",
|
||||
numColor: "rgba(240, 145, 105, 1)",
|
||||
},
|
||||
{
|
||||
borderColor: "rgba(218, 193, 88, 1)",
|
||||
backgroundColor: "#FFFEF7",
|
||||
shadowColor: "rgba(138,111,0,0.2)",
|
||||
numColor: "rgba(217, 193, 88, 1)",
|
||||
},
|
||||
{
|
||||
borderColor: "rgba(88, 173, 232, 1)",
|
||||
backgroundColor: "#F7FCFF",
|
||||
shadowColor: "rgba(8, 82, 92, 0.20)",
|
||||
numColor: "rgba(88, 173, 232, 1)",
|
||||
},
|
||||
{
|
||||
borderColor: "rgba(82, 210, 207, 1)",
|
||||
backgroundColor: "#F7FFFF",
|
||||
shadowColor: "rgba(0, 106, 103, 0.20)",
|
||||
numColor: "rgba(84, 212, 208, 1)",
|
||||
},
|
||||
]);
|
||||
|
||||
const receiveList = reactive([
|
||||
{
|
||||
title: "待定价",
|
||||
num: 0,
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/pricing", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "待过皮重",
|
||||
num: 0,
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/tareing", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "付款审核",
|
||||
num: 0,
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/payReview", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "待支付",
|
||||
num: 0,
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/payReview", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
]);
|
||||
const shipmentList = reactive([
|
||||
{
|
||||
title: "待出货",
|
||||
num: 999,
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/shipmenting", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "待过毛重",
|
||||
num: 999,
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/grossWeight", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "出货结算",
|
||||
num: 999,
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/payReview", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "待结算",
|
||||
num: 999,
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/payReview", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
const appList = reactive([
|
||||
{
|
||||
icon: "app1.png",
|
||||
title: "收货补单",
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/app/receiveSpl", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "app2.png",
|
||||
title: "出货补单",
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/app/shipmentSpl", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "app4.png",
|
||||
title: "收货明细",
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/app/receiveDetail", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "app3.png",
|
||||
title: "出货明细",
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/app/shipmentDetail", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "app5.png",
|
||||
title: "收货作废",
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/app/receiveCl", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "app6.png",
|
||||
title: "出货作废",
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/app/shipmentCl", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "app7.png",
|
||||
title: "供应商管理",
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/app/supplierMgt", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "app8.png",
|
||||
title: "客户管理",
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/app/customerMgt", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
const tabMenuList = reactive([
|
||||
{
|
||||
icon: "statistics.png",
|
||||
title: "统计",
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/index", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
{
|
||||
icon: "home.png",
|
||||
title: "工作台",
|
||||
},
|
||||
{
|
||||
icon: "profile.png",
|
||||
title: "我的",
|
||||
fn: () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/profile/index", // 要跳转到的页面路径
|
||||
});
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
// 收货入库相关信息
|
||||
ReceiveApi.countOrderByMonth().then((res) => {
|
||||
if(res.code === 200) {
|
||||
const {totalReceipt, totalExpenditure, toBePriced, toBeTare, audit, toBePaid} = res.data
|
||||
summaryList[0].num = totalReceipt
|
||||
summaryList[1].num = totalExpenditure
|
||||
receiveList[0].num = toBePriced
|
||||
receiveList[1].num = toBeTare
|
||||
receiveList[2].num = audit
|
||||
receiveList[3].num = toBePaid
|
||||
}
|
||||
});
|
||||
// 出货相关信息
|
||||
ShipmentApi.countOrderByMonth().then((res) => {
|
||||
if(res.code === 200) {
|
||||
const {totalShipment, totalIncome, toBeShipped, roughWeight, shipmentReview, toBeSettled} = res.data
|
||||
summaryList[2].num = totalShipment
|
||||
summaryList[3].num = totalIncome
|
||||
shipmentList[0].num = toBeShipped
|
||||
shipmentList[1].num = roughWeight
|
||||
shipmentList[2].num = shipmentReview
|
||||
shipmentList[3].num = toBeSettled
|
||||
}
|
||||
});
|
||||
onMounted(() => {
|
||||
// #ifdef APP-PLUS || MP-WEIXIN
|
||||
let menuButtonInfo = uni.getMenuButtonBoundingClientRect();
|
||||
navbarRect.height = menuButtonInfo.height;
|
||||
navbarRect.top = menuButtonInfo.top;
|
||||
getSafeHeight();
|
||||
// #endif
|
||||
// 获取统计数据
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.contaner {
|
||||
padding: 17rpx;
|
||||
/* #ifdef H5 */
|
||||
height: calc(100vh - 67px - 70px) !important;
|
||||
/* #endif */
|
||||
overflow: auto;
|
||||
.summary {
|
||||
.panel {
|
||||
width: 50%;
|
||||
display: inline-block;
|
||||
height: 155rpx;
|
||||
position: relative;
|
||||
// background: url('/static/img/01.png');
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.box {
|
||||
position: absolute;
|
||||
padding: 20rpx 0rpx 0rpx 40rpx;
|
||||
margin-top: -155rpx;
|
||||
.num {
|
||||
font-size: 40rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
}
|
||||
.title {
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.p-15 {
|
||||
padding: 15rpx;
|
||||
}
|
||||
.data-detail {
|
||||
margin-top: 15rpx;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
position: relative;
|
||||
.title {
|
||||
font-size: 27rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
padding-left: 20rpx;
|
||||
&::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
margin-top: 6px;
|
||||
margin-left: -20rpx;
|
||||
width: 6rpx;
|
||||
height: 26rpx;
|
||||
background: #22d594;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 3rpx;
|
||||
}
|
||||
}
|
||||
.title-shipment {
|
||||
&::before {
|
||||
content: "";
|
||||
background: #ff782b;
|
||||
}
|
||||
}
|
||||
|
||||
.data-receive,
|
||||
.data-shipment {
|
||||
margin: 15rpx 15rpx 15rpx;
|
||||
.box {
|
||||
width: 141.15rpx;
|
||||
height: 141.15rpx;
|
||||
background: #fffaf7;
|
||||
border: 1px solid #f0936b;
|
||||
box-shadow: 0rpx 7rpx 12rpx 0rpx rgba(146, 44, 0, 0.2);
|
||||
border-radius: 26rpx;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
display: table-cell;
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
position: relative;
|
||||
top: 50%;
|
||||
// transform: translateY(-50%);
|
||||
.num {
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
/* #ifdef H5 */
|
||||
margin-top: 0.7rem;
|
||||
/* #endif */
|
||||
}
|
||||
.desc {
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
}
|
||||
.data-shipment {
|
||||
margin-bottom: 21rpx;
|
||||
}
|
||||
|
||||
.line {
|
||||
height: 18rpx;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
|
||||
.app-list {
|
||||
padding: 15rpx;
|
||||
padding-bottom: 0rpx;
|
||||
.name {
|
||||
text-align: center;
|
||||
font-size: 27rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
.grid-text {
|
||||
margin-top: 17rpx;
|
||||
margin-bottom: 20rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.tabBar {
|
||||
background: url("/static/img/TabMenu/bg.png");
|
||||
height: 141.28rpx;
|
||||
background-size: cover;
|
||||
position: sticky;
|
||||
width: 100%;
|
||||
bottom: 0px;
|
||||
.tabMenuBox {
|
||||
padding-top: 35rpx;
|
||||
font-size: 27rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
|
||||
.grid-text {
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.circle-box {
|
||||
width: 154rpx;
|
||||
height: 154rpx;
|
||||
background: linear-gradient(0deg, #1992ef, #00f6ff);
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 50, 100, 0.12);
|
||||
border-radius: 50%;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
position: absolute;
|
||||
margin-top: -49rpx;
|
||||
margin-left: calc(50% - 78rpx);
|
||||
}
|
||||
.normal-box {
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,209 @@
|
|||
<template>
|
||||
<view class="search">
|
||||
<view v-if="!isShowSearch" @click="isShowSearch = true">
|
||||
<u-icon color="#C1C1C1" name="search"></u-icon
|
||||
><text>请输入供应商名称</text>
|
||||
</view>
|
||||
<u-search
|
||||
v-else
|
||||
placeholder="请输入供应商名称"
|
||||
v-model="keyword"
|
||||
:focus="true"
|
||||
bgColor="#fff"
|
||||
:clearabled="true"
|
||||
:showAction="false"
|
||||
placeholderColor="#C1C1C1"
|
||||
></u-search>
|
||||
</view>
|
||||
|
||||
<view class="card-box">
|
||||
<view class="c-tab">
|
||||
<text
|
||||
v-for="(item, index) in tabList"
|
||||
:key="index"
|
||||
:class="{ active: currentTab === item.name }"
|
||||
@click="handleTab(item)"
|
||||
>
|
||||
{{ item.name }}
|
||||
</text>
|
||||
</view>
|
||||
|
||||
<block v-for="item in 10" :key="item">
|
||||
<view class="inner-box">
|
||||
<view class="top-flex-box">
|
||||
<view>
|
||||
<view>
|
||||
<text class="number">收货单号：SHD20230901132333</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="name">陡其成</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="bottom-flex-box">
|
||||
<view>
|
||||
<view>
|
||||
<text class="desc">过磅总净重：1870.00KG</text>
|
||||
</view>
|
||||
<view class="flex-box">
|
||||
<text>贷款金额：2510.00元</text>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="btn">
|
||||
<text v-if="currentTab === '等待审核'">去审核</text>
|
||||
<text v-if="currentTab === '已审未付'">去支付</text>
|
||||
<text v-if="currentTab === '已审已付'">查看</text>
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="line" v-show="item !== 10"> </view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="btn-box">
|
||||
<u-button
|
||||
text="全选/取消"
|
||||
color="#fff"
|
||||
:customStyle="{ color: '#00DCEE', border: '1px solid #00DCEE' }"
|
||||
></u-button>
|
||||
<u-button type="primary" text="批量审核"></u-button>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const keyword = ref();
|
||||
const isShowSearch = ref(false);
|
||||
const tabList = reactive([
|
||||
{
|
||||
name: "等待审核",
|
||||
},
|
||||
{
|
||||
name: "已审未付",
|
||||
},
|
||||
{
|
||||
name: "已审已付",
|
||||
},
|
||||
]);
|
||||
const currentTab = ref("等待审核");
|
||||
const handleTab = (item: any) => {
|
||||
currentTab.value = item.name;
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.search {
|
||||
box-shadow: 0rpx 3rpx 16rpx 5rpx rgba(0, 0, 0, 0.2);
|
||||
border-radius: 28rpx;
|
||||
background: rgba(255, 255, 255, 0.86);
|
||||
width: 80%;
|
||||
margin: 0px auto;
|
||||
margin-top: 30rpx;
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #c1c1c1;
|
||||
> view {
|
||||
line-height: 60rpx;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
text {
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
}
|
||||
.card-box {
|
||||
.c-tab {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #999999;
|
||||
line-height: 41rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
border-bottom: 1rpx solid rgba(233, 233, 233, 0.76);
|
||||
text {
|
||||
padding: 16rpx;
|
||||
}
|
||||
.active {
|
||||
color: $u-primary;
|
||||
border-bottom: 5rpx solid $u-primary;
|
||||
border-radius: 5rpx;
|
||||
}
|
||||
}
|
||||
.inner-box {
|
||||
padding: 40rpx 40rpx;
|
||||
.bottom-flex-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.btn {
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
padding: 10rpx 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
height: 18rpx;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 0rpx 25rpx;
|
||||
margin-top: 35rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
|
||||
.address {
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
.type,
|
||||
.desc {
|
||||
font-size: 21rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.desc {
|
||||
margin-top: 30rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.flex-box {
|
||||
font-weight: 400;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
.btn-box {
|
||||
margin-top: 60rpx;
|
||||
display: flex;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 56, 93, 0.12);
|
||||
border-radius: 13rpx 13rpx 0rpx 0rpx;
|
||||
padding: 25rpx 50rpx;
|
||||
position: sticky;
|
||||
bottom: 0rpx;
|
||||
width: calc(100vw - 100rpx);
|
||||
::v-deep button {
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
::v-deep button + button {
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<template>
|
||||
待定价
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
|
|
@ -0,0 +1,128 @@
|
|||
<template>
|
||||
<view class="card-box">
|
||||
<view class="top-flex-box">
|
||||
<view>
|
||||
<view>
|
||||
<text class="address">上海奉贤两网融合</text>
|
||||
<text class="type">(大磅)</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="number">收货单号：SHD20230901132333</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="name">陡其成</text>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="btn" @click="handleScenePhoto()">现场照片</text>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="desc">毛重时间：2023-09-01 13:23:33</text>
|
||||
</view>
|
||||
<view class="flex-box">
|
||||
<text>毛重：2510kg</text>
|
||||
<text>单价：未定价</text>
|
||||
</view>
|
||||
<view class="btn-box">
|
||||
<u-button
|
||||
text="点击作废"
|
||||
color="#E8E8E8"
|
||||
:customStyle="{ color: '#999' }"
|
||||
@click="handleModal(true)"
|
||||
></u-button>
|
||||
<u-button type="primary" text="点击定价"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<SmallModal :title="'确认作废吗？'" :content="'确认作废后，该订单不能恢复！'" :okText="'确认作废'" :isMain="true" :show="isShowCancelModal" @handleModal="(v:boolean) => {handleModal(v)}"/>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ReceiveApi } from "@/services/index";
|
||||
import SmallModal from '@/components/Modal/smallModal.vue'
|
||||
const pageList = reactive({
|
||||
total: 0,
|
||||
list: [],
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
});
|
||||
const isShowCancelModal = ref(false)
|
||||
const handleModal = (v: boolean) => {
|
||||
isShowCancelModal.value = v
|
||||
}
|
||||
const handleScenePhoto = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/scenePhoto/index", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
|
||||
ReceiveApi.getOrderPage({ pageNumber: 1, pageSize: 10 }).then((res) => {
|
||||
if (res.code === 200) {
|
||||
(pageList as any).list = res.data.list;
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.card-box {
|
||||
padding: 38rpx 50rpx;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 0rpx 25rpx;
|
||||
margin-top: 35rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
.top-flex-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.btn {
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
padding: 10rpx 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
line-height: 41rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.address {
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
.type,
|
||||
.desc {
|
||||
font-size: 21rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.desc {
|
||||
margin-top: 30rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.flex-box {
|
||||
font-weight: 400;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.btn-box {
|
||||
margin-top: 60rpx;
|
||||
display: flex;
|
||||
::v-deep button {
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
::v-deep button + button {
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<template>
|
||||
待定价
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<template>
|
||||
待定价
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
|
|
@ -0,0 +1,99 @@
|
|||
<template>
|
||||
<view class="card-box">
|
||||
<view class="top-flex-box">
|
||||
<view>
|
||||
<view>
|
||||
<text class="address">上海奉贤两网融合</text>
|
||||
<text class="type">(大磅)</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="number">收货单号：SHD20230901132333</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="name">陡其成</text>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="btn">现场照片</text>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="desc">毛重时间：2023-09-01 13:23:33</text>
|
||||
</view>
|
||||
<view class="flex-box">
|
||||
<text>皮重：2510kg</text>
|
||||
</view>
|
||||
<view class="btn-box">
|
||||
<u-button
|
||||
text="点击作废"
|
||||
color="#E8E8E8"
|
||||
:customStyle="{ color: '#999' }"
|
||||
></u-button>
|
||||
<u-button type="primary" text="点击编辑"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts"></script>
|
||||
<style lang="scss" scoped>
|
||||
.card-box {
|
||||
padding: 38rpx 50rpx;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 0rpx 25rpx;
|
||||
margin-top: 35rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
.top-flex-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.btn {
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
padding: 10rpx 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
}
|
||||
.address {
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
.type,
|
||||
.desc {
|
||||
font-size: 21rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.desc {
|
||||
margin-top: 30rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.flex-box {
|
||||
font-weight: 400;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.btn-box {
|
||||
margin-top: 60rpx;
|
||||
display: flex;
|
||||
::v-deep button {
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
::v-deep button + button {
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,100 @@
|
|||
<template>
|
||||
<view class="card-box">
|
||||
<view class="top-flex-box">
|
||||
<view>
|
||||
<view>
|
||||
<text class="address">上海奉贤两网融合</text>
|
||||
<text class="type">(大磅)</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="number">收货单号：SHD20230901132333</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="name">陡其成</text>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="btn">现场照片</text>
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="desc">毛重时间：2023-09-01 13:23:33</text>
|
||||
</view>
|
||||
<view class="flex-box">
|
||||
<text>毛重：2510kg</text>
|
||||
<text>单价：5元/kg</text>
|
||||
</view>
|
||||
<view class="btn-box">
|
||||
<u-button
|
||||
text="点击作废"
|
||||
color="#E8E8E8"
|
||||
:customStyle="{ color: '#999' }"
|
||||
></u-button>
|
||||
<u-button type="primary" text="点击编辑"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts"></script>
|
||||
<style lang="scss" scoped>
|
||||
.card-box {
|
||||
padding: 38rpx 50rpx;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 0rpx 25rpx;
|
||||
margin-top: 35rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
.top-flex-box {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
.btn {
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
padding: 10rpx 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
}
|
||||
.address {
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
.type,
|
||||
.desc {
|
||||
font-size: 21rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.desc {
|
||||
margin-top: 30rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
.name {
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
}
|
||||
.flex-box {
|
||||
font-weight: 400;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.btn-box {
|
||||
margin-top: 60rpx;
|
||||
display: flex;
|
||||
::v-deep button {
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
::v-deep button + button {
|
||||
margin-left: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,80 @@
|
|||
<template>
|
||||
<swiper
|
||||
class="swiper"
|
||||
circular
|
||||
:indicator-dots="true"
|
||||
:autoplay="false"
|
||||
:interval="2000"
|
||||
:duration="500"
|
||||
indicator-active-color="#00DCEE"
|
||||
>
|
||||
<swiper-item v-for="(item, index) in list" :key="index">
|
||||
<view class="image-box">
|
||||
<image :src="`/static/img/launch/${item.imgUrl}`"></image>
|
||||
<view class="title">
|
||||
{{ item.title }}
|
||||
</view>
|
||||
<view v-if="index === 3" class="btn-start" @click="start()">
|
||||
立即启用
|
||||
</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const list = [
|
||||
{
|
||||
title: "智能回收 智慧未来！",
|
||||
imgUrl: "1.png",
|
||||
},
|
||||
{
|
||||
title: "高效管理 安全快捷！",
|
||||
imgUrl: "2.png",
|
||||
},
|
||||
{
|
||||
title: "全新系统 崭新界面！",
|
||||
imgUrl: "3.png",
|
||||
},
|
||||
{
|
||||
title: "全城握手 致富从这里开始!",
|
||||
imgUrl: "4.png",
|
||||
},
|
||||
];
|
||||
const start = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/index", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.swiper {
|
||||
width: 100%;
|
||||
height: 80vh;
|
||||
margin-top: 10vh;
|
||||
.image-box {
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.title {
|
||||
font-size: 40rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #00d2e3;
|
||||
margin-top: 90rpx;
|
||||
}
|
||||
.btn-start {
|
||||
height: 88rpx;
|
||||
background: #00dcee;
|
||||
border-radius: 44rpx;
|
||||
line-height: 88rpx;
|
||||
font-size: 37rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
width: 80%;
|
||||
margin: 0px auto;
|
||||
margin-top: 50rpx;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<template>
|
||||
<view class="c-login-container">
|
||||
<!-- logo -->
|
||||
<view class="logo">
|
||||
<image :src="`/static/img/logo.png`" height="60rpx"></image>
|
||||
</view>
|
||||
<!-- form表单 -->
|
||||
<view class="login-form">
|
||||
<slot name="form-box"></slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.c-login-container {
|
||||
height: 80vh;
|
||||
margin-top: 10vh;
|
||||
.logo {
|
||||
text-align: center;
|
||||
image {
|
||||
width: 234.62rpx;
|
||||
height: 62.18rpx;
|
||||
}
|
||||
}
|
||||
.login-form {
|
||||
margin-top: 100rpx;
|
||||
padding: 100rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,228 @@
|
|||
<template>
|
||||
<LoginLayout>
|
||||
<template #form-box>
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
:rules="rules"
|
||||
ref="loginForm"
|
||||
:labelWidth="0"
|
||||
>
|
||||
<u-form-item
|
||||
v-for="(item, index) in formAttrList"
|
||||
:key="index"
|
||||
:prop="`userInfo.${item.modelName}`"
|
||||
>
|
||||
<view v-if="item.type === 'text'">
|
||||
<u-input
|
||||
v-model="model1.userInfo[`${item.modelName}`]"
|
||||
:placeholder="item.placeholder"
|
||||
:shape="'circle'"
|
||||
:clearable="true"
|
||||
:customStyle="{
|
||||
'border-color':
|
||||
currentFocus === item.modelName ? '#00dcee !important' : '',
|
||||
}"
|
||||
@focus="handleFocus(item.modelName)"
|
||||
@blur="handleFocus('')"
|
||||
>
|
||||
<template #suffix>
|
||||
<text v-if="item.modelName === 'code'" class="code-btn">
|
||||
<text
|
||||
v-if="seconds === 0"
|
||||
@click="handleCode"
|
||||
class="code-primary"
|
||||
>获取验证码</text
|
||||
>
|
||||
<text v-else
|
||||
>剩余<text class="code-primary">{{ seconds }}秒</text></text
|
||||
>
|
||||
</text>
|
||||
</template>
|
||||
</u-input>
|
||||
</view>
|
||||
<view v-if="item.type === 'password'">
|
||||
<u-input
|
||||
v-model="model1.userInfo[`${item.modelName}`]"
|
||||
:placeholder="item.placeholder"
|
||||
:shape="'circle'"
|
||||
:clearable="true"
|
||||
:type="item.isShowPwd ? 'text' : 'password'"
|
||||
:customStyle="{
|
||||
'border-color':
|
||||
currentFocus === item.modelName ? '#00dcee !important' : '',
|
||||
}"
|
||||
@focus="handleFocus(item.modelName)"
|
||||
@blur="handleFocus('')"
|
||||
>
|
||||
<template #suffix>
|
||||
<image
|
||||
v-if="!item.isShowPwd"
|
||||
:src="`/static/img/login/hide.png`"
|
||||
class="custom-icon"
|
||||
@click="item.isShowPwd = true"
|
||||
></image>
|
||||
<image
|
||||
v-else
|
||||
:src="`/static/img/login/show.png`"
|
||||
class="custom-icon"
|
||||
@click="item.isShowPwd = false"
|
||||
></image>
|
||||
</template>
|
||||
</u-input>
|
||||
</view>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
|
||||
<view class="login-btn">
|
||||
<u-button
|
||||
@click="submit"
|
||||
type="primary"
|
||||
:customStyle="{
|
||||
'border-radius': '43rpx',
|
||||
}"
|
||||
>保存并登录</u-button
|
||||
>
|
||||
</view>
|
||||
</template>
|
||||
</LoginLayout>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ProfileApi } from "@/services/index";
|
||||
import LoginLayout from "./components/loginLayout.vue";
|
||||
import valid from "@/utils/validate";
|
||||
const loginForm = ref(null);
|
||||
const model1 = <any>reactive({
|
||||
userInfo: {
|
||||
userName: "",
|
||||
code: "",
|
||||
passwordNew: "",
|
||||
passwordConfirm: "",
|
||||
},
|
||||
});
|
||||
// 控制focus 边框样式
|
||||
const currentFocus = ref("");
|
||||
|
||||
// 表单属性清单
|
||||
const formAttrList = ref([
|
||||
{
|
||||
modelName: "userName",
|
||||
type: "text",
|
||||
placeholder: "请输入手机号",
|
||||
},
|
||||
{
|
||||
modelName: "code",
|
||||
type: "text",
|
||||
placeholder: "请输入验证码",
|
||||
},
|
||||
{
|
||||
modelName: "passwordNew",
|
||||
type: "password",
|
||||
placeholder: "请输入新密码",
|
||||
isShowPwd: false, // 控制密码显示隐藏
|
||||
},
|
||||
{
|
||||
modelName: "passwordConfirm",
|
||||
type: "password",
|
||||
placeholder: "请输入确认密码",
|
||||
isShowPwd: false, // 控制密码显示隐藏
|
||||
},
|
||||
]);
|
||||
// 获取验证码交互
|
||||
const seconds = ref(0);
|
||||
const handleCode = () => {
|
||||
console.log(model1);
|
||||
if (model1.userInfo === undefined || !model1.userInfo.userName) {
|
||||
uni.showToast({
|
||||
title: "请输入手机号",
|
||||
icon: "error",
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (!valid.mobile.pattern.test(model1.userInfo.userName)) {
|
||||
uni.showToast({
|
||||
title: "手机号不合法",
|
||||
icon: "error",
|
||||
});
|
||||
return;
|
||||
}
|
||||
seconds.value = 120;
|
||||
let countDownTimer = setInterval(() => {
|
||||
if (seconds.value > 0) {
|
||||
--seconds.value;
|
||||
} else {
|
||||
clearInterval(countDownTimer);
|
||||
}
|
||||
}, 1000);
|
||||
};
|
||||
const rules = ref({
|
||||
"userInfo.userName": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入手机号",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"userInfo.code": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入验证码",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"userInfo.passwordNew": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入新密码",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"userInfo.passwordConfirm": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入确认密码",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
// "userInfo.sex": {
|
||||
// type: "string",
|
||||
// max: 1,
|
||||
// required: true,
|
||||
// message: "请选择男或女",
|
||||
// trigger: ["blur", "change"],
|
||||
// },
|
||||
});
|
||||
|
||||
// const checkboxChange = (n: any) => {
|
||||
// console.log("change", n);
|
||||
// };
|
||||
const handleFocus = (attr: string) => {
|
||||
currentFocus.value = attr;
|
||||
};
|
||||
const submit = () => {
|
||||
ProfileApi.loginByAccount({
|
||||
userName: "cs123",
|
||||
password: "123",
|
||||
});
|
||||
(loginForm.value as any).validate();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.custom-icon {
|
||||
width: 37.18rpx;
|
||||
height: 18.59rpx;
|
||||
}
|
||||
.login-btn {
|
||||
margin-top: 23.72rpx;
|
||||
}
|
||||
::v-deep .u-form-item__body__right__message {
|
||||
margin-left: 10px !important;
|
||||
}
|
||||
.code-btn {
|
||||
font-size: 27rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
cursor: pointer;
|
||||
.code-primary {
|
||||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,95 @@
|
|||
<template>
|
||||
<view class="c-login-container">
|
||||
<view>
|
||||
|
||||
<u-form labelPosition="left" :model="model1" :rules="rules" ref="loginForm" :labelWidth="0">
|
||||
<u-form-item prop="userInfo.name" ref="item1">
|
||||
<u-input
|
||||
v-model="model1.userInfo.name"
|
||||
placeholder="请输入手机号"
|
||||
:shape="'circle'"
|
||||
></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item prop="userInfo.name" ref="item1">
|
||||
<u-input
|
||||
v-model="model1.userInfo.name"
|
||||
placeholder="请输入验证码"
|
||||
:shape="'circle'"
|
||||
>
|
||||
<template #suffix>
|
||||
<text>获取验证码</text>
|
||||
</template>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
<u-form-item prop="userInfo.name" ref="item1">
|
||||
<u-input
|
||||
v-model="model1.userInfo.name"
|
||||
placeholder="请设置密码"
|
||||
:shape="'circle'"
|
||||
:type="'password'"
|
||||
></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item>
|
||||
<view class="c-flex-space-between">
|
||||
<u-checkbox-group
|
||||
v-model="checkboxValue1"
|
||||
placement="column"
|
||||
@change="checkboxChange"
|
||||
>
|
||||
<u-checkbox
|
||||
:customStyle="{ fontSize: '8px' }"
|
||||
:key="'1'"
|
||||
:label="'记住密码'"
|
||||
:name="'记住密码'"
|
||||
/>
|
||||
</u-checkbox-group>
|
||||
<text class="f-s-15 l-h-28">无法收到验证码</text>
|
||||
</view>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
<u-button @click="submit">立即登录</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
const loginForm = ref(null);
|
||||
const checkboxValue1 = ref([]);
|
||||
const model1 = ref({
|
||||
userInfo: {
|
||||
name: "",
|
||||
sex: "",
|
||||
},
|
||||
});
|
||||
const rules = ref({
|
||||
"userInfo.name": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请填写姓名",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"userInfo.sex": {
|
||||
type: "string",
|
||||
max: 1,
|
||||
required: true,
|
||||
message: "请选择男或女",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
});
|
||||
|
||||
const checkboxChange = (n: any) => {
|
||||
console.log("change", n);
|
||||
};
|
||||
const submit = () => {
|
||||
(loginForm.value as any).validate();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.c-flex-space-between {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
font-size: 12px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,210 @@
|
|||
<template>
|
||||
<LoginLayout>
|
||||
<template #form-box>
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
:rules="rules"
|
||||
ref="loginForm"
|
||||
:labelWidth="0"
|
||||
>
|
||||
<u-form-item prop="userInfo.userName">
|
||||
<u-input
|
||||
v-model="model1.userInfo.userName"
|
||||
placeholder="请输入手机号"
|
||||
:shape="'circle'"
|
||||
:clearable="true"
|
||||
:customStyle="{
|
||||
'border-color':
|
||||
currentFocus === 'userName' ? '#00dcee !important' : '',
|
||||
}"
|
||||
@focus="handleFocus('userName')"
|
||||
@blur="handleFocus('')"
|
||||
>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
<u-form-item prop="userInfo.password">
|
||||
<u-input
|
||||
v-model="model1.userInfo.password"
|
||||
placeholder="请输入密码"
|
||||
:shape="'circle'"
|
||||
:clearable="true"
|
||||
:type="isShowPwd ? 'text' : 'password'"
|
||||
:customStyle="{
|
||||
'border-color':
|
||||
currentFocus === 'password' ? '#00dcee !important' : '',
|
||||
}"
|
||||
@focus="handleFocus('password')"
|
||||
@blur="handleFocus('')"
|
||||
>
|
||||
<template #suffix>
|
||||
<image
|
||||
v-if="!isShowPwd"
|
||||
:src="`/static/img/login/hide.png`"
|
||||
class="custom-icon"
|
||||
@click="isShowPwd = true"
|
||||
></image>
|
||||
<image
|
||||
v-else
|
||||
:src="`/static/img/login/show.png`"
|
||||
class="custom-icon"
|
||||
@click="isShowPwd = false"
|
||||
></image>
|
||||
</template>
|
||||
</u-input>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
<view class="remember-box">
|
||||
<view>
|
||||
<u-checkbox-group v-model="checkGroup.rememberCheck">
|
||||
<u-checkbox
|
||||
:customStyle="{}"
|
||||
:key="1"
|
||||
:label="'记住密码?'"
|
||||
:name="1"
|
||||
:size="'25rpx'"
|
||||
:activeColor="'#00dcee'"
|
||||
:labelSize="'25rpx'"
|
||||
:labelColor="'#000000'"
|
||||
></u-checkbox>
|
||||
</u-checkbox-group>
|
||||
</view>
|
||||
<text @click="handleForgetPwd">忘记密码</text>
|
||||
</view>
|
||||
<view class="login-btn">
|
||||
<u-button
|
||||
@click="submit"
|
||||
type="primary"
|
||||
:customStyle="{
|
||||
'border-radius': '43rpx',
|
||||
}"
|
||||
>立即登录</u-button
|
||||
>
|
||||
</view>
|
||||
<view class="agree">
|
||||
<u-checkbox-group v-model="checkGroup.agreeCheck">
|
||||
<u-checkbox
|
||||
:key="1"
|
||||
:size="'25rpx'"
|
||||
:activeColor="'#00dcee'"
|
||||
:name="1"
|
||||
></u-checkbox>
|
||||
</u-checkbox-group>
|
||||
<view>
|
||||
我已阅读并同意用户 <text class="agree-item">《 服务协议 》</text> 和
|
||||
<text class="agree-item">《 隐私政策 》</text>
|
||||
<view> 未开通服务站点无法登录 </view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</LoginLayout>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { ProfileApi } from "@/services/index";
|
||||
import LoginLayout from "./components/loginLayout.vue";
|
||||
import { useMemberStore } from "@/store/index";
|
||||
const store = useMemberStore();
|
||||
const loginForm = ref(null);
|
||||
const model1 = reactive({
|
||||
userInfo: {
|
||||
userName: "",
|
||||
password: "",
|
||||
},
|
||||
});
|
||||
// 控制focus 边框样式
|
||||
const currentFocus = ref("");
|
||||
// 控制密码显示隐藏
|
||||
const isShowPwd = ref(false);
|
||||
// 记住密码 // 同意协议
|
||||
const checkGroup = reactive({
|
||||
rememberCheck: [],
|
||||
agreeCheck: [],
|
||||
});
|
||||
|
||||
const rules = ref({
|
||||
"userInfo.userName": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入手机号",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"userInfo.password": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入密码",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
});
|
||||
|
||||
// const checkboxChange = (n: any) => {
|
||||
// console.log("change", n);
|
||||
// };
|
||||
const handleFocus = (attr: string) => {
|
||||
currentFocus.value = attr;
|
||||
};
|
||||
const submit = () => {
|
||||
(loginForm.value as any).validate().then((res: any) => {
|
||||
if (res) {
|
||||
if (checkGroup.agreeCheck.length === 0) {
|
||||
uni.showToast({
|
||||
title: "请同意协议",
|
||||
icon: "none",
|
||||
});
|
||||
return;
|
||||
}
|
||||
ProfileApi.loginByAccount(model1.userInfo).then((res: any) => {
|
||||
if (res.code === 200) {
|
||||
store.setProfile(res.data);
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/index", // 要跳转到的页面路径
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
uni.navigateTo({
|
||||
url: "/pages/index/index", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
const handleForgetPwd = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/forgetPwd", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.custom-icon {
|
||||
width: 37.18rpx;
|
||||
height: 18.59rpx;
|
||||
}
|
||||
.remember-box {
|
||||
display: flex;
|
||||
font-size: 25rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
justify-content: space-between;
|
||||
padding: 10rpx;
|
||||
color: $u-primary;
|
||||
align-items: center;
|
||||
}
|
||||
.login-btn {
|
||||
margin-top: 23.72rpx;
|
||||
}
|
||||
.agree {
|
||||
display: flex;
|
||||
font-size: 21rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
margin-top: 10rpx;
|
||||
align-items: flex-start;
|
||||
text-align: center;
|
||||
line-height: 41rpx;
|
||||
margin-top: 26.28rpx;
|
||||
.agree-item {
|
||||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
<template>
|
||||
<view class="msg-box">
|
||||
<view class="u-page">
|
||||
<u-list @scrolltolower="scrolltolower">
|
||||
<u-list-item v-for="(item, index) in 20" :key="index">
|
||||
<u-cell>
|
||||
<view slot="title" class="u-slot-title">
|
||||
<view>
|
||||
<view class="u-cell-text title"
|
||||
>系统通知
|
||||
<text class="title-badge">
|
||||
</text>
|
||||
</view>
|
||||
<view class="u-cell-text desc">你有一笔收货单待定价！</view>
|
||||
</view>
|
||||
</view>
|
||||
<template #value>
|
||||
<text class="u-slot-value time">2024-2-21 13:15</text>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-list-item>
|
||||
</u-list>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const scrolltolower = () => {
|
||||
loadmore();
|
||||
};
|
||||
const loadmore = () => {
|
||||
console.log("****** 加载更多");
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.msg-box {
|
||||
background: #f8f8f8;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.title {
|
||||
font-size: 27rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
position: relative;
|
||||
width: fit-content;
|
||||
.title-badge {
|
||||
position: absolute;
|
||||
right: -6px;
|
||||
top: 0px;
|
||||
width: 17rpx;
|
||||
height: 17rpx;
|
||||
background: #ec0f3e;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
.desc {
|
||||
font-size: 21rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
margin-top: 12.18rpx;
|
||||
}
|
||||
.time {
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,36 @@
|
|||
<template>
|
||||
<view class="baseinfo">
|
||||
<view class="box">
|
||||
<view> 用户名： {{ profile.userName }} </view>
|
||||
<view> 手机号码： {{ profile.phone }} </view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { useMemberStore } from '@/store/index'
|
||||
const store = useMemberStore()
|
||||
const profile = store.profile.userInfo
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.baseinfo {
|
||||
background: #f8f8f8;
|
||||
height: 100vh;
|
||||
padding: 26.28rpx 25.64rpx;
|
||||
.box {
|
||||
padding: 0rpx 18.59rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
font-size: 27rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
> view {
|
||||
line-height: 80rpx;
|
||||
}
|
||||
view+view {
|
||||
border-top: 1px solid #E9E9E9;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,133 @@
|
|||
<template>
|
||||
<view class="profile">
|
||||
<view>
|
||||
<image class="bg" :src="`/static/img/profile/bg.png`" />
|
||||
</view>
|
||||
<view class="baseinfo">
|
||||
<view class="head">
|
||||
<image :src="`/static/img/profile/user.png`" class="user"></image>
|
||||
<view>
|
||||
<view>
|
||||
<text class="name">{{ profile.userName || "-" }}</text>
|
||||
</view>
|
||||
<view>
|
||||
<text class="company">{{ profile.factory_name || "-" }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content">
|
||||
<u-list :height="'130px'">
|
||||
<u-list-item v-for="(item, index) in list" :key="index">
|
||||
<u-cell
|
||||
:title="item.name"
|
||||
arrow-direction="right"
|
||||
isLink
|
||||
:url="item.path"
|
||||
:border="false"
|
||||
@click="hanldeClick(item)"
|
||||
>
|
||||
<template #icon>
|
||||
<view style="width: 40rpx">
|
||||
<image :src="`/static/img/profile/${item.icon}`" />
|
||||
</view>
|
||||
</template>
|
||||
</u-cell>
|
||||
</u-list-item>
|
||||
</u-list>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ProfileApi } from "@/services/index";
|
||||
import { reactive } from "vue";
|
||||
import { useMemberStore } from "@/store/index";
|
||||
const store = useMemberStore();
|
||||
const profile = store.profile.userInfo;
|
||||
const list = reactive([
|
||||
{
|
||||
name: "基本信息",
|
||||
icon: "baseinfo.png",
|
||||
path: "/pages/profile/baseinfo",
|
||||
},
|
||||
{
|
||||
name: "修改密码",
|
||||
icon: "modifyPwd.png",
|
||||
path: "/pages/profile/modifyPwd",
|
||||
},
|
||||
{
|
||||
name: "退出登录",
|
||||
icon: "logout.png",
|
||||
path: "",
|
||||
},
|
||||
]);
|
||||
|
||||
const hanldeClick = (item: any) => {
|
||||
if (item.name === "退出登录") {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/index", // 要跳转到的页面路径
|
||||
});
|
||||
ProfileApi.logOut().then((res: any) => {
|
||||
if (res.code === 200) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/login/index", // 要跳转到的页面路径
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.profile {
|
||||
.bg {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: -60rpx;
|
||||
z-index: -1;
|
||||
}
|
||||
.baseinfo {
|
||||
padding: 25.64rpx;
|
||||
.head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-left: 41rpx;
|
||||
.user {
|
||||
width: 110.9rpx;
|
||||
height: 110.9rpx;
|
||||
margin-right: 20.51rpx;
|
||||
}
|
||||
.name {
|
||||
font-size: 27rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #000000;
|
||||
}
|
||||
.company {
|
||||
font-size: 21rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
.content {
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
padding: 28.21rpx 21.15rpx;
|
||||
margin-top: 24.36rpx;
|
||||
image:nth-child(1) {
|
||||
width: 28.85rpx;
|
||||
height: 24.36rpx;
|
||||
}
|
||||
image:nth-child(2) {
|
||||
width: 25rpx;
|
||||
height: 32.69rpx;
|
||||
}
|
||||
image:nth-child(3) {
|
||||
width: 30.13rpx;
|
||||
height: 30.13rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,119 @@
|
|||
<template>
|
||||
<view class="baseinfo">
|
||||
<view class="box">
|
||||
<u-form
|
||||
labelPosition="left"
|
||||
:model="model1"
|
||||
:rules="rules"
|
||||
ref="loginForm"
|
||||
:labelWidth="0"
|
||||
>
|
||||
<u-form-item
|
||||
v-for="(item, index) in formAttrList"
|
||||
:key="index"
|
||||
:prop="`userInfo.${item.modelName}`"
|
||||
>
|
||||
<u-input
|
||||
:border="index === 2 ? 'none' : 'bottom'"
|
||||
v-model="model1.userInfo[`${item.modelName}`]"
|
||||
:placeholder="item.placeholder"
|
||||
:clearable="true"
|
||||
:type="'password'"
|
||||
></u-input>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</view>
|
||||
|
||||
<view class="save-btn">
|
||||
<u-button
|
||||
@click="submit"
|
||||
type="primary"
|
||||
:customStyle="{
|
||||
'border-radius': '43rpx',
|
||||
}"
|
||||
>保存</u-button
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
// 表单属性清单
|
||||
const formAttrList = ref([
|
||||
{
|
||||
modelName: "password",
|
||||
type: "password",
|
||||
placeholder: "请输入当前密码",
|
||||
},
|
||||
{
|
||||
modelName: "passwordNew",
|
||||
type: "password",
|
||||
placeholder: "请输入新密码",
|
||||
},
|
||||
{
|
||||
modelName: "passwordConfirm",
|
||||
type: "password",
|
||||
placeholder: "请确认新密码",
|
||||
},
|
||||
]);
|
||||
const model1 = <any>reactive({
|
||||
userInfo: {
|
||||
userName: "",
|
||||
password: "",
|
||||
},
|
||||
});
|
||||
const rules = ref({
|
||||
"userInfo.password": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入当前密码",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"userInfo.passwordNew": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入新密码",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
"userInfo.passwordConfirm": {
|
||||
type: "string",
|
||||
required: true,
|
||||
message: "请输入确认密码",
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
});
|
||||
|
||||
const submit = () => {};
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.baseinfo {
|
||||
background: #f8f8f8;
|
||||
height: 100vh;
|
||||
padding: 26.28rpx 25.64rpx;
|
||||
.box {
|
||||
padding: 18.59rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
font-size: 27rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #000000;
|
||||
::v-deep .u-border-bottom {
|
||||
border-color: rgb(233 233 233 / 0.76) !important;
|
||||
}
|
||||
::v-deep .u-form-item__body__right__message {
|
||||
height: 0px;
|
||||
display: none;
|
||||
}
|
||||
::v-deep .u-form-item {
|
||||
height: 45px;
|
||||
}
|
||||
}
|
||||
.save-btn {
|
||||
margin-top: 150px;
|
||||
button {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
<template>
|
||||
<view class="layout">
|
||||
<view class="name">现场照片</view>
|
||||
<view class="time">2024-01-22 14:28:36</view>
|
||||
<up-row customStyle="flex-wrap: wrap">
|
||||
<up-col span="6" v-for="(item, index) in 10" :key="item">
|
||||
<view
|
||||
class="grid-item"
|
||||
:style="{
|
||||
marginLeft: index % 2 === 1 ? '10rpx' : '',
|
||||
marginRight: index % 2 === 0 ? '10rpx' : '',
|
||||
marginBottom: '10rpx'
|
||||
}"
|
||||
>
|
||||
<text class="tip">毛重过磅</text>
|
||||
<image src="/static/img/temp/car.png" mode="'heightFix'" />
|
||||
</view>
|
||||
</up-col>
|
||||
</up-row>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts"></script>
|
||||
<style lang="scss" scoped>
|
||||
.layout {
|
||||
margin: 22.44rpx 26.54rpx;
|
||||
padding: 33rpx 18rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
.name {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
.time {
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #999999;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
.grid-item {
|
||||
position: relative;
|
||||
image {
|
||||
width: 100%;
|
||||
}
|
||||
.tip {
|
||||
background: rgba(0, 0, 0, 0.63);
|
||||
box-shadow: 0rpx 0rpx 6rpx 0rpx rgba(0, 0, 0, 0.09);
|
||||
border-radius: 0rpx 40rpx 40rpx 0rpx;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #ffffff;
|
||||
padding: 10rpx 30rpx;
|
||||
position: absolute;
|
||||
margin-top: 40rpx;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,275 @@
|
|||
<template>
|
||||
<view class="c-layout">
|
||||
<StatisticCard :list="list" />
|
||||
|
||||
<view class="card-box">
|
||||
<view class="c-tab">
|
||||
<text
|
||||
v-for="(item, index) in tabList"
|
||||
:key="index"
|
||||
:class="{ active: currentTab === item.name }"
|
||||
@click="handleTab(item)"
|
||||
>
|
||||
{{ item.name }}
|
||||
</text>
|
||||
</view>
|
||||
<view class="c-grid">
|
||||
<view class="box">
|
||||
<view v-for="(item, index) in gridList1" :key="index">
|
||||
<text>{{ item.name }}：</text><text>{{ item.isBefore ? item.unit : ''}} {{ randomNum(index)}} {{ item.isBefore ? '' : item.unit }} </text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="box">
|
||||
<view v-for="(item, index) in gridList2" :key="index">
|
||||
<text v-if="item.name">{{ item.name }}：</text><text v-if="item.num">{{ item.isBefore ? item.unit : ''}} {{ randomNum(index) }} {{ item.isBefore ? '' : item.unit }} </text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="box">
|
||||
<view v-for="(item, index) in gridList3" :key="index">
|
||||
<text>{{ item.name }}：</text><text>{{ item.isBefore ? item.unit : ''}} {{ randomNum(index) }} {{ item.isBefore ? '' : item.unit }} </text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<TimeRangeFilter :show="isShowTimeDialog" @handleDialog="handleDialog"/>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import StatisticCard from "@/components/StatisticCard/index.vue";
|
||||
import TimeRangeFilter from './components/TimeRangeFilter.vue'
|
||||
const list = reactive([
|
||||
{
|
||||
num: 8923.0,
|
||||
name: "客户应收款总额",
|
||||
},
|
||||
{
|
||||
num: 8923.0,
|
||||
name: "供应商应付款总额",
|
||||
},
|
||||
]);
|
||||
|
||||
const currentTab = ref("昨日");
|
||||
const tabList = reactive([
|
||||
{
|
||||
name: "昨日",
|
||||
},
|
||||
{
|
||||
name: "本月",
|
||||
},
|
||||
{
|
||||
name: "本年",
|
||||
},
|
||||
{
|
||||
name: "自定义",
|
||||
},
|
||||
]);
|
||||
const handleTab = (item: any) => {
|
||||
if (item.name === '自定义') {
|
||||
handleDialog(true)
|
||||
} else {
|
||||
currentTab.value = item.name;
|
||||
}
|
||||
};
|
||||
const randomNum = (index:number) => {
|
||||
return Math.floor(Math.random() * (10000 - 1 + 1)) + 1 + index
|
||||
}
|
||||
|
||||
const gridList1 = reactive([
|
||||
{
|
||||
name: "出货收入",
|
||||
num: "6000.00",
|
||||
unit: '￥',
|
||||
isBefore: true
|
||||
},
|
||||
{
|
||||
name: "实际收入",
|
||||
num: "6000.00",
|
||||
unit: '￥',
|
||||
isBefore: true
|
||||
},
|
||||
{
|
||||
name: "收货支出",
|
||||
num: "6000.00",
|
||||
unit: '￥',
|
||||
isBefore: true
|
||||
},
|
||||
{
|
||||
name: "实际支出",
|
||||
num: "6000.00",
|
||||
unit: '￥',
|
||||
isBefore: true
|
||||
},
|
||||
{
|
||||
name: "杂费支出",
|
||||
num: "6000.00",
|
||||
unit: '￥',
|
||||
isBefore: true
|
||||
},
|
||||
{
|
||||
name: "运费支出",
|
||||
num: "6000.00",
|
||||
unit: '￥',
|
||||
isBefore: true
|
||||
},
|
||||
]);
|
||||
const gridList2 = reactive([
|
||||
{
|
||||
name: "出货实收金额",
|
||||
num: "6000.00",
|
||||
unit: '￥',
|
||||
isBefore: true
|
||||
},
|
||||
{
|
||||
name: "出货应收金额",
|
||||
num: "6000.00",
|
||||
unit: '￥',
|
||||
isBefore: true
|
||||
},
|
||||
{
|
||||
name: "出货笔数",
|
||||
num: "2",
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
num: "",
|
||||
},
|
||||
{
|
||||
name: "出货总重量",
|
||||
num: "6000.00",
|
||||
unit: 'KG',
|
||||
isBefore: false
|
||||
},
|
||||
{
|
||||
name: "出货净重（客户）",
|
||||
num: "6000.00",
|
||||
unit: 'KG',
|
||||
isBefore: false
|
||||
},
|
||||
{
|
||||
name: "出货重量(已结)",
|
||||
num: "6000.00",
|
||||
unit: 'KG',
|
||||
isBefore: false
|
||||
},
|
||||
{
|
||||
name: "结算总重量",
|
||||
num: "6000.00",
|
||||
unit: 'KG',
|
||||
isBefore: false
|
||||
},
|
||||
{
|
||||
name: "出货重量(未结)",
|
||||
num: "6000.00",
|
||||
unit: 'KG',
|
||||
isBefore: false
|
||||
},
|
||||
{
|
||||
name: "结算重量(已结)",
|
||||
num: "6000.00",
|
||||
unit: 'KG',
|
||||
isBefore: false
|
||||
},
|
||||
{
|
||||
name: "净重误差",
|
||||
num: "6000.00",
|
||||
unit: 'KG',
|
||||
isBefore: false
|
||||
},
|
||||
{
|
||||
name: "结算总量(未结)",
|
||||
num: "6000.00",
|
||||
unit: 'KG',
|
||||
isBefore: false
|
||||
},
|
||||
]);
|
||||
const gridList3 = reactive([
|
||||
{
|
||||
name: "收货总重量",
|
||||
num: "6000.00",
|
||||
unit: 'KG',
|
||||
isBefore: false
|
||||
},
|
||||
{
|
||||
name: "收货笔数",
|
||||
num: "2",
|
||||
unit: '',
|
||||
isBefore: false
|
||||
},
|
||||
{
|
||||
name: "收货重量(已付)",
|
||||
num: "6000.00",
|
||||
unit: 'KG',
|
||||
isBefore: false
|
||||
},
|
||||
{
|
||||
name: "收货实付金额",
|
||||
num: "6000.00",
|
||||
unit: '￥',
|
||||
isBefore: true
|
||||
},
|
||||
{
|
||||
name: "收货重量(未付)",
|
||||
num: "6000.00",
|
||||
unit: 'KG',
|
||||
isBefore: false
|
||||
},
|
||||
{
|
||||
name: "收货应付金额",
|
||||
num: "6000.00",
|
||||
unit: '￥',
|
||||
isBefore: true
|
||||
},
|
||||
]);
|
||||
|
||||
const isShowTimeDialog = ref(false)
|
||||
const handleDialog = (v: boolean) => {
|
||||
isShowTimeDialog.value = v
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.card-box {
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin-top: 25rpx;
|
||||
.c-tab {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
color: #999999;
|
||||
line-height: 41rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
border-bottom: 1rpx solid rgba(233, 233, 233, 0.76);
|
||||
text {
|
||||
padding: 16rpx;
|
||||
}
|
||||
.active {
|
||||
color: $u-primary;
|
||||
border-bottom: 5rpx solid $u-primary;
|
||||
border-radius: 5rpx;
|
||||
}
|
||||
}
|
||||
.c-grid {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #000000;
|
||||
.box {
|
||||
padding: 30rpx;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
flex: 1;
|
||||
> view {
|
||||
line-height: 50rpx;
|
||||
}
|
||||
}
|
||||
.box + .box {
|
||||
border-top: 18rpx solid #F8F8F8;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,94 @@
|
|||
<template>
|
||||
<u-popup :show="show" mode="left" :closeable="true" @close="handleClose">
|
||||
<view class="c-dialog-filter">
|
||||
<view class="title">筛选</view>
|
||||
<u-list>
|
||||
<u-list-item>
|
||||
<u-cell :title="`供应商`" @click="handleDialog('showSupplier', true)">
|
||||
<template #right-icon> </template>
|
||||
</u-cell>
|
||||
</u-list-item>
|
||||
<u-list-item boder="none">
|
||||
<u-cell :title="`收货产品`" @click="handleDialog('showProduct', true)">
|
||||
<template #right-icon> </template>
|
||||
</u-cell>
|
||||
</u-list-item>
|
||||
</u-list>
|
||||
|
||||
<view class="btn-layout">
|
||||
<view class="btn">
|
||||
<up-button type="primary" text="确定"></up-button>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn-layout">
|
||||
<view class="btn">
|
||||
<u-button>重置</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
<!-- 供应商选择弹框 -->
|
||||
<SupplierDialog :show="showDialog.showSupplier" @handleDialog="(v:boolean) => {handleDialog('showSupplier', v)}"></SupplierDialog>
|
||||
<!-- 收货产品弹框 -->
|
||||
<ProductDialog :show="showDialog.showProduct" @handleDialog="(v:boolean) => {handleDialog('showProduct', v)}"></ProductDialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import SupplierDialog from "./SupplierDialog.vue";
|
||||
import ProductDialog from "./ProductDialog.vue";
|
||||
const props = defineProps<{
|
||||
show: boolean;
|
||||
}>();
|
||||
const emit = defineEmits(["handleDialog"]);
|
||||
const handleClose = () => {
|
||||
emit("handleDialog", false);
|
||||
};
|
||||
const showDialog = <
|
||||
{
|
||||
[key: string]: boolean
|
||||
}
|
||||
>reactive(
|
||||
{
|
||||
showProduct: false,
|
||||
showSupplier: false
|
||||
}
|
||||
)
|
||||
|
||||
const handleDialog = (key: string, v:boolean) => {
|
||||
showDialog[key] = v
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-dialog-filter {
|
||||
width: 95vw;
|
||||
padding: 25rpx;
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
}
|
||||
::v-deep .u-list {
|
||||
height: 50vh !important;
|
||||
.u-cell__title-text {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 27rpx !important;
|
||||
}
|
||||
}
|
||||
.btn-layout {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
margin-top: 35rpx;
|
||||
.btn {
|
||||
width: 80%;
|
||||
text-align: center;
|
||||
::v-deep button {
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,87 @@
|
|||
<template>
|
||||
<u-popup :show="show" mode="left" :closeable="true" @close="handleClose">
|
||||
<view class="c-dialog-filter">
|
||||
<view class="title">收货产品</view>
|
||||
<view class="dialog-product-layout">
|
||||
<text v-for="item in 20" :class="{ active: item === 2 }" :key="item"
|
||||
>钢板料{{ item }}</text
|
||||
>
|
||||
</view>
|
||||
<view class="btn-confirm">
|
||||
<view class="btn">
|
||||
<u-button type="primary" :text="'确认'"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const props = defineProps<{
|
||||
show: boolean,
|
||||
}>()
|
||||
const emit = defineEmits(['handleDialog']);
|
||||
const handleClose = () => {
|
||||
emit('handleDialog', false)
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-dialog-filter {
|
||||
width: 95vw;
|
||||
padding: 25rpx;
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
// 产品dialog
|
||||
.dialog-product-layout {
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 42rpx 25rpx;
|
||||
padding: 19rpx;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
flex-flow: row wrap;
|
||||
max-height: 70vh;
|
||||
overflow: auto;
|
||||
|
||||
text {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
background: #ffffff;
|
||||
border-radius: 6rpx;
|
||||
border: 1px solid rgba(153, 153, 153, 0.64);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
padding: 10rpx 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
margin-left: 10rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.active {
|
||||
border-color: $u-primary;
|
||||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-confirm {
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 56, 93, 0.12);
|
||||
border-radius: 13rpx 13rpx 0rpx 0rpx;
|
||||
position: absolute;
|
||||
bottom: 0rpx;
|
||||
width: 100%;
|
||||
left: 0rpx;
|
||||
padding: 27.56rpx;
|
||||
.btn {
|
||||
text-align: center;
|
||||
::v-deep button {
|
||||
width: 80%;
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,88 @@
|
|||
<template>
|
||||
<u-popup :show="show" mode="bottom" :closeable="true" @close="handleClose" :zIndex="999999999999999999">
|
||||
<view class="c-dialog-filter">
|
||||
<view class="title">收货产品</view>
|
||||
<view class="dialog-product-layout">
|
||||
<text v-for="item in 20" :class="{ active: item === 2 }" :key="item"
|
||||
>钢板料{{ item }}</text
|
||||
>
|
||||
</view>
|
||||
<view class="btn-confirm">
|
||||
<view class="btn">
|
||||
<u-button type="primary" :text="'确认'"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const props = defineProps<{
|
||||
show: boolean,
|
||||
}>()
|
||||
const emit = defineEmits(['handleDialog']);
|
||||
const handleClose = () => {
|
||||
emit('handleDialog', false)
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-dialog-filter {
|
||||
width: 95vw;
|
||||
padding: 25rpx;
|
||||
z-index: 9999999999;
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
// 产品dialog
|
||||
.dialog-product-layout {
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 42rpx 25rpx;
|
||||
padding: 19rpx;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
flex-flow: row wrap;
|
||||
max-height: 70vh;
|
||||
overflow: auto;
|
||||
|
||||
text {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
background: #ffffff;
|
||||
border-radius: 6rpx;
|
||||
border: 1px solid rgba(153, 153, 153, 0.64);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
padding: 10rpx 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
margin-left: 10rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.active {
|
||||
border-color: $u-primary;
|
||||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
|
||||
.btn-confirm {
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 56, 93, 0.12);
|
||||
border-radius: 13rpx 13rpx 0rpx 0rpx;
|
||||
position: absolute;
|
||||
bottom: 0rpx;
|
||||
width: 100%;
|
||||
left: 0rpx;
|
||||
padding: 27.56rpx;
|
||||
.btn {
|
||||
text-align: center;
|
||||
::v-deep button {
|
||||
width: 80%;
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,70 @@
|
|||
<template>
|
||||
<u-popup :show="show" mode="bottom" :closeable="true" @close="handleClose">
|
||||
<view class="c-dialog">
|
||||
<view class="box"><text>单据状态</text></view>
|
||||
<view class="box-btn"
|
||||
><text class="active">全部</text><text>已支付</text><text>已审未付</text
|
||||
><text>未审核</text></view
|
||||
>
|
||||
</view>
|
||||
</u-popup>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const props = defineProps<{
|
||||
show: boolean,
|
||||
}>()
|
||||
const emit = defineEmits(['handleDialog']);
|
||||
const handleClose = () => {
|
||||
emit('handleDialog', false)
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
::v-deep .u-popup__content {
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 32rpx 32rpx 0rpx 0rpx;
|
||||
}
|
||||
.c-dialog {
|
||||
margin: 65.38rpx 44.87rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
.box-btn,
|
||||
.box {
|
||||
line-height: 80rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.box-btn {
|
||||
line-height: 40rpx;
|
||||
margin-bottom: 30rpx;
|
||||
text {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
width: 117rpx;
|
||||
background: #ffffff;
|
||||
border-radius: 6rpx;
|
||||
border: 1px solid rgba(153, 153, 153, 0.64);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.active {
|
||||
border-color: $u-primary;
|
||||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: $u-primary;
|
||||
}
|
||||
.box-border {
|
||||
border-top: 1px solid rgba(233, 233, 233, 0.76);
|
||||
}
|
||||
.line {
|
||||
height: 18rpx;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,262 @@
|
|||
<template>
|
||||
<u-popup :show="show" mode="left" :closeable="true" @close="handleClose">
|
||||
<view class="c-dialog-filter">
|
||||
<view class="title">供应商筛选</view>
|
||||
<view class="search">
|
||||
<u-search placeholder=" 请输入供应商名称 / 卡号搜索" v-model="keyword"></u-search>
|
||||
</view>
|
||||
<view class="dialog-product-layout">
|
||||
<!-- 自定义索引列表 -->
|
||||
<view class="address-book-container">
|
||||
<!-- 左侧通讯录 -->
|
||||
<scroll-view
|
||||
class="scroll-container"
|
||||
:scroll-y="true"
|
||||
:scroll-into-view="toView"
|
||||
:scroll-with-animation="true"
|
||||
>
|
||||
<view
|
||||
class="address-book"
|
||||
v-for="(item, index) in addressBook"
|
||||
:key="index"
|
||||
:id="item.id"
|
||||
>
|
||||
<view class="address-book-index">{{ item.id }}</view>
|
||||
<view
|
||||
class="contact-container"
|
||||
v-for="(cItem, index) in item.data"
|
||||
:key="index"
|
||||
>
|
||||
<!-- <img
|
||||
class="contact-img"
|
||||
src="http://www.lixia.gov.cn/picture/0/s_97b76c734a6f40f8abba95615cbff1e1.jpg"
|
||||
alt=""
|
||||
/> -->
|
||||
<view class="contact-detail-container">
|
||||
<view class="contact-name">{{ cItem.zh_title }}</view>
|
||||
<view class="contact-address">{{ cItem.address }}</view>
|
||||
<!-- <view class="contact-phone">{{ item.phone }}</view> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
|
||||
<!-- 右侧字母导航条 -->
|
||||
<view class="letter-nav">
|
||||
<view
|
||||
class="item"
|
||||
:class="{ active: toView === item }"
|
||||
v-for="(item, index) in indexList"
|
||||
:key="index"
|
||||
@click="toSelectIndex(item)"
|
||||
>{{ item }}</view
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const props = defineProps<{
|
||||
show: boolean;
|
||||
}>();
|
||||
const emit = defineEmits(["handleDialog"]);
|
||||
const handleClose = () => {
|
||||
emit("handleDialog", false);
|
||||
};
|
||||
|
||||
const keyword = ref()
|
||||
|
||||
const indexList = [
|
||||
"A",
|
||||
"B",
|
||||
"C",
|
||||
"D",
|
||||
"E",
|
||||
"F",
|
||||
"G",
|
||||
"H",
|
||||
"I",
|
||||
"J",
|
||||
"K",
|
||||
"L",
|
||||
"M",
|
||||
"N",
|
||||
"O",
|
||||
"P",
|
||||
"Q",
|
||||
"R",
|
||||
"S",
|
||||
"T",
|
||||
"U",
|
||||
"V",
|
||||
"W",
|
||||
"X",
|
||||
"Y",
|
||||
"Z",
|
||||
];
|
||||
const toView = ref("");
|
||||
const addressBook = [
|
||||
{
|
||||
id: "A",
|
||||
data: [
|
||||
{
|
||||
zh_title: "阿联酋迪拉姆",
|
||||
en_title: "aa",
|
||||
address: "910289591",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "阿尔巴尼亚列克",
|
||||
en_title: "aaaaa",
|
||||
address: "ALL",
|
||||
phone: "222222",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "B",
|
||||
data: [
|
||||
{
|
||||
zh_title: "孟加拉国塔卡",
|
||||
en_title: "bbb",
|
||||
address: "BDT",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "保加利亚列瓦",
|
||||
en_title: "bbb",
|
||||
address: "BGN",
|
||||
phone: "222222",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "C",
|
||||
data: [
|
||||
{
|
||||
zh_title: "加拿大元",
|
||||
en_title: "ccc",
|
||||
address: "CAD",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "瑞士法郎",
|
||||
en_title: "ccc",
|
||||
address: "CHF",
|
||||
phone: "222222",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "D",
|
||||
data: [
|
||||
{
|
||||
zh_title: "丹麦克朗",
|
||||
en_title: "ddd",
|
||||
address: "DKK",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "多米尼加比索",
|
||||
en_title: "ddd",
|
||||
address: "DOP",
|
||||
phone: "222222",
|
||||
},
|
||||
{
|
||||
zh_title: "丹麦克朗",
|
||||
en_title: "ddd",
|
||||
address: "DKK",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "多米尼加比索",
|
||||
en_title: "ddd",
|
||||
address: "DOP",
|
||||
phone: "222222",
|
||||
},
|
||||
{
|
||||
zh_title: "丹麦克朗",
|
||||
en_title: "ddd",
|
||||
address: "DKK",
|
||||
phone: "111111",
|
||||
},
|
||||
{
|
||||
zh_title: "多米尼加比索",
|
||||
en_title: "ddd",
|
||||
address: "DOP",
|
||||
phone: "222222",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "Z",
|
||||
data: [
|
||||
{ zh_title: "z", en_title: "zz", address: "zzz", phone: "111111" },
|
||||
{ zh_title: "zzz", en_title: "ddd", address: "ddd", phone: "222222" },
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
const toSelectIndex = (item: any) => {
|
||||
toView.value = item;
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-dialog-filter {
|
||||
width: 95vw;
|
||||
padding: 25rpx;
|
||||
.title {
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
}
|
||||
.search {
|
||||
margin: 30rpx 0px;
|
||||
}
|
||||
}
|
||||
.dialog-product-layout {
|
||||
height: 80vh;
|
||||
.address-book-container {
|
||||
height: 100%;
|
||||
}
|
||||
.address-book-index {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.contact-img {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.scroll-container {
|
||||
height: 100%;
|
||||
}
|
||||
.letter-nav {
|
||||
position: fixed;
|
||||
right: 25rpx;
|
||||
top: 100px;
|
||||
font-size: 22rpx;
|
||||
text-align: center;
|
||||
.item:hover,
|
||||
.active {
|
||||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
.contact-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 2%;
|
||||
}
|
||||
.contact-detail-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 80%;
|
||||
font-size: 22rpx;
|
||||
.contact-address {
|
||||
color: rgba(0,0,0,0.65);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,96 @@
|
|||
<template>
|
||||
<u-popup :show="show" mode="bottom" :closeable="true" @close="handleClose">
|
||||
<view class="c-dialog">
|
||||
<view class="box"><text>常用时间选择</text></view>
|
||||
<view class="box-btn"
|
||||
><text class="active">今日</text><text>昨日</text><text>本月</text
|
||||
><text>本年</text></view
|
||||
>
|
||||
<view class="box box-border"
|
||||
><text>其它时间选择</text
|
||||
><text class="btn" @click="showCalendar = true">自定义</text></view
|
||||
>
|
||||
|
||||
<view v-if="showCalendar">
|
||||
<view class="line"></view>
|
||||
<view class="box">
|
||||
<text @click="showCalendar = false">取消</text>
|
||||
<text class="btn" @click="showCalendar = false">完成</text>
|
||||
</view>
|
||||
<uni-calendar
|
||||
:insert="true"
|
||||
:lunar="true"
|
||||
:start-date="'2014-1-1'"
|
||||
:end-date="'2099-1-1'"
|
||||
:range="true"
|
||||
@change="handleChangeDate"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const props = defineProps<{
|
||||
show: boolean,
|
||||
}>()
|
||||
const emit = defineEmits(['handleDialog']);
|
||||
const handleClose = () => {
|
||||
emit('handleDialog', false)
|
||||
}
|
||||
|
||||
const showCalendar = ref(false)
|
||||
const handleChangeDate = (v: any) => {
|
||||
console.log(v);
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
::v-deep .u-popup__content {
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 32rpx 32rpx 0rpx 0rpx;
|
||||
}
|
||||
.c-dialog {
|
||||
margin: 65.38rpx 44.87rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
.box-btn,
|
||||
.box {
|
||||
line-height: 80rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.box-btn {
|
||||
line-height: 40rpx;
|
||||
margin-bottom: 30rpx;
|
||||
text {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
width: 117rpx;
|
||||
background: #ffffff;
|
||||
border-radius: 6rpx;
|
||||
border: 1px solid rgba(153, 153, 153, 0.64);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.active {
|
||||
border-color: $u-primary;
|
||||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: $u-primary;
|
||||
}
|
||||
.box-border {
|
||||
border-top: 1px solid rgba(233, 233, 233, 0.76);
|
||||
}
|
||||
.line {
|
||||
height: 18rpx;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,85 @@
|
|||
<template>
|
||||
<u-popup :show="show" mode="bottom" :closeable="false" @close="handleClose">
|
||||
<view class="c-dialog">
|
||||
<view>
|
||||
<view class="box">
|
||||
<text @click="handleClose">取消</text>
|
||||
<text class="btn" @click="handleClose">完成</text>
|
||||
</view>
|
||||
<uni-calendar
|
||||
:insert="true"
|
||||
:lunar="true"
|
||||
:start-date="'2014-1-1'"
|
||||
:end-date="'2099-1-1'"
|
||||
:range="true"
|
||||
@change="handleChangeDate"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
||||
</u-popup>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const props = defineProps<{
|
||||
show: boolean,
|
||||
}>()
|
||||
const emit = defineEmits(['handleDialog']);
|
||||
const handleClose = () => {
|
||||
emit('handleDialog', false)
|
||||
}
|
||||
|
||||
const showCalendar = ref(false)
|
||||
const handleChangeDate = (v: any) => {
|
||||
console.log(v);
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
||||
::v-deep .u-popup__content {
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 32rpx 32rpx 0rpx 0rpx;
|
||||
}
|
||||
.c-dialog {
|
||||
margin: 30rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
.box-btn,
|
||||
.box {
|
||||
line-height: 80rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.box-btn {
|
||||
line-height: 40rpx;
|
||||
margin-bottom: 30rpx;
|
||||
text {
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
width: 117rpx;
|
||||
background: #ffffff;
|
||||
border-radius: 6rpx;
|
||||
border: 1px solid rgba(153, 153, 153, 0.64);
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.active {
|
||||
border-color: $u-primary;
|
||||
color: $u-primary;
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: $u-primary;
|
||||
}
|
||||
.box-border {
|
||||
border-top: 1px solid rgba(233, 233, 233, 0.76);
|
||||
}
|
||||
.line {
|
||||
height: 18rpx;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<view v-for="item in 10" :key="item" @click="getDetail()">
|
||||
<view class="bill">
|
||||
<view>收货单号：CHD2024012212314</view>
|
||||
<view>应收金额：<text class="num">¥1800.00</text></view>
|
||||
</view>
|
||||
<view class="time"> 2024-01-22 14:28:36 </view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const getDetail = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/customer/detail", // 要跳转到的页面路径
|
||||
});
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
margin: 30rpx 25rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
padding: 20rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #000000;
|
||||
> view {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
justify-content: space-between;
|
||||
padding: 15rpx 0rpx;
|
||||
.num {
|
||||
color: rgba(236, 15, 62, 1);
|
||||
}
|
||||
.bill {
|
||||
view {
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
.time {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
> view + view {
|
||||
border-top: 1px solid rgba(233, 233, 233, 0.76);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,222 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<view class="top">
|
||||
<view class="left">
|
||||
<view>上海奉贤两网融合（大磅）</view>
|
||||
<view>重一</view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="btn" @click="handleScenePhoto()">现场照片</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content">
|
||||
<view class="baseinfo">
|
||||
<view class="time"> 过磅时间：2023-09-01 13:23:33 </view>
|
||||
<view class="person">
|
||||
<view>定价人：谭兵</view>
|
||||
<view>审核人：谭兵</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="padding: 30rpx 0rpx">
|
||||
<view> <text>收货单号：</text><text> SHD20230901132333 </text></view>
|
||||
<view class="box">
|
||||
<view v-for="(item, index) in gridList1" :key="index">
|
||||
<text v-if="item.name">{{ item.name }}：</text
|
||||
><text
|
||||
>{{ item.isBefore ? item.unit : "" }}
|
||||
{{ item.num }}
|
||||
{{ item.isBefore ? "" : item.unit }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="moreInfo">
|
||||
<view class="baseinfo">
|
||||
<view>客户收货</view>
|
||||
<view class="time"> 收货时间：2023-09-01 13:23:33 </view>
|
||||
</view>
|
||||
<view class="box">
|
||||
<view v-for="(item, index) in gridList2" :key="index">
|
||||
<text v-if="item.name">{{ item.name }}：</text
|
||||
><text
|
||||
>{{ item.isBefore ? item.unit : "" }}
|
||||
{{ item.num }}
|
||||
{{ item.isBefore ? "" : item.unit }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { reactive } from "vue";
|
||||
|
||||
const gridList1 = reactive([
|
||||
{
|
||||
name: "毛重",
|
||||
num: "4080.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "皮重",
|
||||
num: "3450.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "净重",
|
||||
num: "640.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
]);
|
||||
const gridList2 = reactive([
|
||||
{
|
||||
name: "结算重量",
|
||||
num: "640.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "结算单价",
|
||||
num: "2.48",
|
||||
unit: "元/KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "预估总价",
|
||||
num: "1587.00",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "货款金额",
|
||||
num: "1587.00",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "杂费",
|
||||
num: "0",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "运费",
|
||||
num: "0",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "实际收入",
|
||||
num: "1587.00",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{},
|
||||
{
|
||||
name: "净重误差",
|
||||
num: "0.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{},
|
||||
{
|
||||
name: "结算状态",
|
||||
num: "未结算",
|
||||
unit: "",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "应收金额",
|
||||
num: "1587.00",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
|
||||
]);
|
||||
const handleScenePhoto = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/scenePhoto/index", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
margin: 30rpx 25rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
border-bottom: 18rpx solid #f8f8f8;
|
||||
.left {
|
||||
view {
|
||||
line-height: 40rpx;
|
||||
&:nth-child(2) {
|
||||
color: rgba(236, 15, 62, 1);
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
padding: 10rpx 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: 30rpx;
|
||||
.baseinfo {
|
||||
.time {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #999999;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.person {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
.box {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
flex: 1;
|
||||
> view {
|
||||
line-height: 50rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.moreInfo {
|
||||
margin-top: 20rpx;
|
||||
padding: 20rpx 0rpx;
|
||||
border-top: 18rpx solid rgba(248, 248, 248, 1);
|
||||
.box {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,64 @@
|
|||
<template>
|
||||
<Search :name="'客户名称'" />
|
||||
<view class="c-card">
|
||||
<StatisticCard :list="list" />
|
||||
<view class="detail">
|
||||
<view v-for="(item, index) in 10" :key="index" @click="getDetail(item)">
|
||||
<text>张小明{{ item }}</text>
|
||||
<text class="num">¥1800.00 <text class="tip">欠</text></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import Search from "@/components/Search/index.vue";
|
||||
import StatisticCard from "@/components/StatisticCard/index.vue";
|
||||
const list = reactive([
|
||||
{
|
||||
num: 2,
|
||||
name: "欠款客户",
|
||||
},
|
||||
{
|
||||
num: 8923,
|
||||
name: "欠款金额",
|
||||
},
|
||||
]);
|
||||
const getDetail = (item: any) => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/customer/billDetail", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 30rpx 25rpx;
|
||||
}
|
||||
.detail {
|
||||
border-top: 18rpx solid #f8f8f8;
|
||||
padding: 20rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #000000;
|
||||
> view {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx 10rpx;
|
||||
.num {
|
||||
color: #EC0F3E;
|
||||
}
|
||||
.tip {
|
||||
color: $u-primary;
|
||||
margin-left: 20rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
> view + view {
|
||||
border-top: 1px solid rgba(233, 233, 233, 0.76);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,133 @@
|
|||
<template>
|
||||
<view class="layout-box">
|
||||
<view class="filter">
|
||||
<u-input
|
||||
v-model="params.startTime"
|
||||
disabled
|
||||
disabledColor="#ffffff"
|
||||
placeholder="请选择开始时间"
|
||||
></u-input>
|
||||
<text>-</text>
|
||||
<u-input
|
||||
v-model="params.endTime"
|
||||
disabled
|
||||
disabledColor="#ffffff"
|
||||
placeholder="请选择结束时间"
|
||||
></u-input>
|
||||
<u-icon
|
||||
name="arrow-down-fill"
|
||||
@click="handleDialog('showTime', true)"
|
||||
></u-icon>
|
||||
|
||||
<text class="btn" @click="handleDialog('showFilter', true)"
|
||||
>出货产品</text
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<c-echarts :option="option" :height="'90vh'" />
|
||||
<!-- 单据弹框 -->
|
||||
<ProductTypeDialog :show="showDialog.showFilter" @handleDialog="(v:boolean) => {handleDialog('showFilter', v)}"/>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
|
||||
import CEcharts from "../../components/Echarts/echarts.vue";
|
||||
import ProductTypeDialog from './components/ProductTypeDialog.vue'
|
||||
const option = ref({
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
type: "cross",
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
left: "10px",
|
||||
right: "20px",
|
||||
top: "10px",
|
||||
bottom: "30px",
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
type: "value",
|
||||
boundaryGap: [0, 0.01],
|
||||
},
|
||||
yAxis: {
|
||||
type: "category",
|
||||
data: [1, 2, 3, 4, 5],
|
||||
axisLabel: {
|
||||
// inside: true,
|
||||
// color: '#fff'
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: "#83bff6",
|
||||
},
|
||||
},
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: [100, 110, 113, 126, 143, 158, 165, 167, 152, 102, ,],
|
||||
type: "bar",
|
||||
areaStyle: {
|
||||
show: true,
|
||||
},
|
||||
barWidth: 24,
|
||||
},
|
||||
],
|
||||
color: ["#00D2E3"],
|
||||
});
|
||||
|
||||
const params = reactive({
|
||||
startTime: "2024-01-01",
|
||||
endTime: "2024-01-01",
|
||||
});
|
||||
const showDialog = <
|
||||
{
|
||||
[key: string]: boolean;
|
||||
}
|
||||
>reactive({
|
||||
showTime: false,
|
||||
showFilter: false,
|
||||
});
|
||||
const handleDialog = (key: string, v: boolean) => {
|
||||
showDialog[key] = v;
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.layout-box {
|
||||
margin: 35.9rpx 25.64rpx;
|
||||
.filter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-items: center;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 27rpx;
|
||||
color: #000000;
|
||||
::v-deep .u-input {
|
||||
padding: 0rpx 16.03rpx !important;
|
||||
input {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx !important;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
text {
|
||||
margin: 0px 5rpx;
|
||||
}
|
||||
.status {
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
.btn {
|
||||
color: $u-primary;
|
||||
margin-left: 40rpx;
|
||||
margin-right: 0rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,166 @@
|
|||
<template>
|
||||
<Box>
|
||||
<view v-for="(item, index) in list" :key="index">
|
||||
<view class="title">
|
||||
<Title :title="item.title" />
|
||||
</view>
|
||||
<view class="box-content">
|
||||
<view v-for="(child, index) in item.child" :key="index" @click="(child as any).fn(child)">
|
||||
<view>
|
||||
<up-image
|
||||
:src="`/static/img/statistic/${child.icon}`"
|
||||
:width="child.width"
|
||||
:height="child.height"
|
||||
mode="aspectFill"
|
||||
></up-image>
|
||||
</view>
|
||||
<view>{{ child.title }}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="line" v-show="index < list.length -1"></view>
|
||||
</view>
|
||||
</Box>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import Box from "../../components/Box/index.vue";
|
||||
import Title from "../../components/Title/index.vue";
|
||||
const list = reactive([
|
||||
{
|
||||
title: "收货",
|
||||
child: [
|
||||
{
|
||||
icon: "1-1.png",
|
||||
width: "42.31rpx",
|
||||
height: "50rpx",
|
||||
title: "收货汇总",
|
||||
fn: (item: any) => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/receivePanel", // 要跳转到的页面路径
|
||||
})
|
||||
}
|
||||
},
|
||||
{
|
||||
icon: "1-2.png",
|
||||
width: "44.23rpx",
|
||||
height: "44.23rpx",
|
||||
title: "供应商排行",
|
||||
fn: (item: any) => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/supplierRanking", // 要跳转到的页面路径
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "出货",
|
||||
child: [
|
||||
{
|
||||
icon: "2-1.png",
|
||||
width: "42.31rpx",
|
||||
height: "50rpx",
|
||||
title: "出货汇总",
|
||||
fn: (item: any) => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/shipmentPanel", // 要跳转到的页面路径
|
||||
})
|
||||
}
|
||||
},
|
||||
{
|
||||
icon: "2-2.png",
|
||||
width: "46.15rpx",
|
||||
height: "46.15rpx",
|
||||
title: "客户排行",
|
||||
fn: (item: any) => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/customerRanking", // 要跳转到的页面路径
|
||||
})
|
||||
}
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "账本",
|
||||
child: [
|
||||
{
|
||||
icon: "3-1.png",
|
||||
width: "46.15rpx",
|
||||
height: "46.79rpx",
|
||||
title: "经营概况",
|
||||
fn: (item: any) => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/businessOverview", // 要跳转到的页面路径
|
||||
})
|
||||
}
|
||||
},
|
||||
{
|
||||
icon: "3-2.png",
|
||||
width: "48.08rpx",
|
||||
height: "44.23rpx",
|
||||
title: "供应商对账",
|
||||
fn: (item: any) => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/supplierChecking", // 要跳转到的页面路径
|
||||
})
|
||||
}
|
||||
},
|
||||
{
|
||||
icon: "3-3.png",
|
||||
width: "43.59rpx",
|
||||
height: "43.59rpx",
|
||||
title: "客户对账",
|
||||
fn: (item: any) => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/customerChecking", // 要跳转到的页面路径
|
||||
})
|
||||
}
|
||||
},
|
||||
],
|
||||
},
|
||||
]);
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.title {
|
||||
line-height: 80rpx;
|
||||
padding: 0rpx 19.87rpx;
|
||||
}
|
||||
.box-content {
|
||||
display: flex;
|
||||
margin: 21rpx 0rpx;
|
||||
padding: 0rpx 19.87rpx;
|
||||
> view {
|
||||
width: 141rpx;
|
||||
height: 141rpx;
|
||||
background: #f9f9f9;
|
||||
border-radius: 26rpx;
|
||||
// text-align: center;
|
||||
// vertical-align: middle;
|
||||
// display: grid;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-evenly;
|
||||
flex-direction: column;
|
||||
> view {
|
||||
display: grid;
|
||||
place-content: center;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
> view + view {
|
||||
margin-left: 32.05rpx;
|
||||
}
|
||||
::v-deep .u-transition {
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.line {
|
||||
height: 18rpx;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,236 @@
|
|||
<template>
|
||||
<view class="layout-box">
|
||||
<view class="filter">
|
||||
<u-input
|
||||
v-model="params.startTime"
|
||||
disabled
|
||||
disabledColor="#ffffff"
|
||||
placeholder="请选择开始时间"
|
||||
></u-input>
|
||||
<text>-</text>
|
||||
<u-input
|
||||
v-model="params.endTime"
|
||||
disabled
|
||||
disabledColor="#ffffff"
|
||||
placeholder="请选择结束时间"
|
||||
></u-input>
|
||||
<u-icon name="arrow-down-fill" @click="handleDialog('showTime',true)"></u-icon>
|
||||
<text class="status">单据状态</text>
|
||||
<u-icon name="arrow-down-fill" @click="handleDialog('showStatus', true)"></u-icon>
|
||||
<text class="btn" @click="handleDialog('showFilter', true)">筛选</text>
|
||||
</view>
|
||||
|
||||
<view class="box">
|
||||
<up-row>
|
||||
<up-col span="4">
|
||||
<view class="inner-box" style="border: none">
|
||||
<view class="num">892339.9</view>
|
||||
<view>收货总量/kg</view>
|
||||
</view>
|
||||
</up-col>
|
||||
<up-col span="4">
|
||||
<view class="inner-box">
|
||||
<view class="num">892339.9</view>
|
||||
<view>已付/kg</view>
|
||||
</view>
|
||||
</up-col>
|
||||
<up-col span="4">
|
||||
<view class="inner-box">
|
||||
<view class="num">892339.9</view>
|
||||
<view>未付/kg</view>
|
||||
</view>
|
||||
</up-col>
|
||||
</up-row>
|
||||
</view>
|
||||
|
||||
<view class="box">
|
||||
<up-row>
|
||||
<up-col span="4">
|
||||
<view class="inner-box" style="border: none">
|
||||
<view class="num">892339.9</view>
|
||||
<view>结算金额/元</view>
|
||||
</view>
|
||||
</up-col>
|
||||
<up-col span="4">
|
||||
<view class="inner-box">
|
||||
<view class="num">892339.9</view>
|
||||
<view>实收金额</view>
|
||||
</view>
|
||||
</up-col>
|
||||
<up-col span="4">
|
||||
<view class="inner-box">
|
||||
<view class="num">892339.9</view>
|
||||
<view>应付金额</view>
|
||||
</view>
|
||||
</up-col>
|
||||
</up-row>
|
||||
</view>
|
||||
<view class="box">
|
||||
<up-row>
|
||||
<up-col span="6">
|
||||
<view class="inner-box" style="border: none">
|
||||
<view class="num">892339.9</view>
|
||||
<view>收货单</view>
|
||||
</view>
|
||||
</up-col>
|
||||
<up-col span="6">
|
||||
<view class="inner-box">
|
||||
<view class="num">892339.9</view>
|
||||
<view>均价（元/kg）</view>
|
||||
</view>
|
||||
</up-col>
|
||||
</up-row>
|
||||
</view>
|
||||
|
||||
<view class="box">
|
||||
<uni-table stripe emptyText="暂无更多数据">
|
||||
<!-- 表头行 -->
|
||||
<uni-tr>
|
||||
<uni-th v-for="(item, index) in tableTitleList" :key="index">{{
|
||||
item.name
|
||||
}}</uni-th>
|
||||
</uni-tr>
|
||||
<!-- 表格数据行 -->
|
||||
<uni-tr v-for="(item, index) in 10" :key="index">
|
||||
<uni-td>轻一</uni-td>
|
||||
<uni-td>1636.00</uni-td>
|
||||
<uni-td>5646.00</uni-td>
|
||||
<uni-td>5636.00</uni-td>
|
||||
<uni-td>5636.00</uni-td>
|
||||
</uni-tr>
|
||||
</uni-table>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 时间弹框 -->
|
||||
<TimeDialog ref="timeDialog" :show="showDialog.showTime" @handleDialog="(v:boolean) => {handleDialog('showTime', v)}"/>
|
||||
|
||||
<!-- 单据弹框 -->
|
||||
<StatusDialog :show="showDialog.showStatus" @handleDialog="(v:boolean) => {handleDialog('showStatus', v)}"/>
|
||||
|
||||
<!-- 筛选弹框 -->
|
||||
<FilterDialog :show="showDialog.showFilter" @handleDialog="(v:boolean) => {handleDialog('showFilter', v)}"/>
|
||||
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import TimeDialog from './components/TimeDialog.vue'
|
||||
import StatusDialog from './components/StatusDialog.vue'
|
||||
import FilterDialog from './components/FilterDialog.vue'
|
||||
const params = reactive({
|
||||
startTime: "2024-01-01",
|
||||
endTime: "2024-01-01",
|
||||
});
|
||||
|
||||
const tableTitleList = reactive([
|
||||
{
|
||||
name: "收货产品",
|
||||
},
|
||||
{
|
||||
name: "收货总量/kg",
|
||||
},
|
||||
{
|
||||
name: "总金额",
|
||||
},
|
||||
{
|
||||
name: "收货单数",
|
||||
},
|
||||
{
|
||||
name: "均价（元/kg）",
|
||||
},
|
||||
]);
|
||||
const showDialog = <
|
||||
{
|
||||
[key: string]: boolean
|
||||
}
|
||||
>reactive(
|
||||
{
|
||||
showTime: false,
|
||||
showStatus: false,
|
||||
showFilter: false
|
||||
}
|
||||
)
|
||||
|
||||
const handleDialog = (key: string, v:boolean) => {
|
||||
showDialog[key] = v
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.layout-box {
|
||||
margin: 35.9rpx 25.64rpx;
|
||||
.filter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-items: center;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 27rpx;
|
||||
color: #000000;
|
||||
::v-deep .u-input {
|
||||
padding: 0rpx 16.03rpx !important;
|
||||
input {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx !important;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
text {
|
||||
margin: 0px 5rpx;
|
||||
}
|
||||
.status {
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
.btn {
|
||||
color: $u-primary;
|
||||
margin-left: 40rpx;
|
||||
margin-right: 0rpx;
|
||||
}
|
||||
}
|
||||
.box {
|
||||
padding: 19.23rpx;
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
align-items: center;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.inner-box {
|
||||
text-align: center;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
border-left: 1px solid #e9e9e9;
|
||||
.num {
|
||||
font-weight: bold;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
}
|
||||
::v-deep .uni-table {
|
||||
min-width: auto !important;
|
||||
.uni-table-th {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 22rpx;
|
||||
color: #000000;
|
||||
padding: 5px 5px;
|
||||
}
|
||||
.uni-table-td {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,236 @@
|
|||
<template>
|
||||
<view class="layout-box">
|
||||
<view class="filter">
|
||||
<u-input
|
||||
v-model="params.startTime"
|
||||
disabled
|
||||
disabledColor="#ffffff"
|
||||
placeholder="请选择开始时间"
|
||||
></u-input>
|
||||
<text>-</text>
|
||||
<u-input
|
||||
v-model="params.endTime"
|
||||
disabled
|
||||
disabledColor="#ffffff"
|
||||
placeholder="请选择结束时间"
|
||||
></u-input>
|
||||
<u-icon name="arrow-down-fill" @click="handleDialog('showTime',true)"></u-icon>
|
||||
<text class="status">单据状态</text>
|
||||
<u-icon name="arrow-down-fill" @click="handleDialog('showStatus', true)"></u-icon>
|
||||
<text class="btn" @click="handleDialog('showFilter', true)">筛选</text>
|
||||
</view>
|
||||
|
||||
<view class="box">
|
||||
<up-row>
|
||||
<up-col span="4">
|
||||
<view class="inner-box" style="border: none">
|
||||
<view class="num">892339.9</view>
|
||||
<view>出货总量/kg</view>
|
||||
</view>
|
||||
</up-col>
|
||||
<up-col span="4">
|
||||
<view class="inner-box">
|
||||
<view class="num">892339.9</view>
|
||||
<view>已收/kg</view>
|
||||
</view>
|
||||
</up-col>
|
||||
<up-col span="4">
|
||||
<view class="inner-box">
|
||||
<view class="num">892339.9</view>
|
||||
<view>未收/kg</view>
|
||||
</view>
|
||||
</up-col>
|
||||
</up-row>
|
||||
</view>
|
||||
|
||||
<view class="box">
|
||||
<up-row>
|
||||
<up-col span="4">
|
||||
<view class="inner-box" style="border: none">
|
||||
<view class="num">892339.9</view>
|
||||
<view>结算金额/kg</view>
|
||||
</view>
|
||||
</up-col>
|
||||
<up-col span="4">
|
||||
<view class="inner-box">
|
||||
<view class="num">892339.9</view>
|
||||
<view>实收金额</view>
|
||||
</view>
|
||||
</up-col>
|
||||
<up-col span="4">
|
||||
<view class="inner-box">
|
||||
<view class="num">892339.9</view>
|
||||
<view>应收金额</view>
|
||||
</view>
|
||||
</up-col>
|
||||
</up-row>
|
||||
</view>
|
||||
<view class="box">
|
||||
<up-row>
|
||||
<up-col span="6">
|
||||
<view class="inner-box" style="border: none">
|
||||
<view class="num">892339.9</view>
|
||||
<view>出货单</view>
|
||||
</view>
|
||||
</up-col>
|
||||
<up-col span="6">
|
||||
<view class="inner-box">
|
||||
<view class="num">892339.9</view>
|
||||
<view>均价(元/kg)</view>
|
||||
</view>
|
||||
</up-col>
|
||||
</up-row>
|
||||
</view>
|
||||
|
||||
<view class="box">
|
||||
<uni-table stripe emptyText="暂无更多数据">
|
||||
<!-- 表头行 -->
|
||||
<uni-tr>
|
||||
<uni-th align="center" v-for="(item, index) in tableTitleList" :key="index">{{
|
||||
item.name
|
||||
}}</uni-th>
|
||||
</uni-tr>
|
||||
<!-- 表格数据行 -->
|
||||
<uni-tr v-for="(item, index) in 10" :key="index">
|
||||
<uni-td>张家港华仁再生</uni-td>
|
||||
<uni-td>1636.00</uni-td>
|
||||
<uni-td>5646.00</uni-td>
|
||||
<uni-td>5636.00</uni-td>
|
||||
<uni-td>5636.00</uni-td>
|
||||
</uni-tr>
|
||||
</uni-table>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 时间弹框 -->
|
||||
<TimeDialog ref="timeDialog" :show="showDialog.showTime" @handleDialog="(v:boolean) => {handleDialog('showTime', v)}"/>
|
||||
|
||||
<!-- 单据弹框 -->
|
||||
<StatusDialog :show="showDialog.showStatus" @handleDialog="(v:boolean) => {handleDialog('showStatus', v)}"/>
|
||||
|
||||
<!-- 筛选弹框 -->
|
||||
<FilterDialog :show="showDialog.showFilter" @handleDialog="(v:boolean) => {handleDialog('showFilter', v)}"/>
|
||||
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import TimeDialog from './components/TimeDialog.vue'
|
||||
import StatusDialog from './components/StatusDialog.vue'
|
||||
import FilterDialog from './components/FilterDialog.vue'
|
||||
const params = reactive({
|
||||
startTime: "2024-01-01",
|
||||
endTime: "2024-01-01",
|
||||
});
|
||||
|
||||
const tableTitleList = reactive([
|
||||
{
|
||||
name: "客户",
|
||||
},
|
||||
{
|
||||
name: "结算重量",
|
||||
},
|
||||
{
|
||||
name: "结算金额",
|
||||
},
|
||||
{
|
||||
name: "实收款",
|
||||
},
|
||||
{
|
||||
name: "数量",
|
||||
},
|
||||
]);
|
||||
const showDialog = <
|
||||
{
|
||||
[key: string]: boolean
|
||||
}
|
||||
>reactive(
|
||||
{
|
||||
showTime: false,
|
||||
showStatus: false,
|
||||
showFilter: false
|
||||
}
|
||||
)
|
||||
|
||||
const handleDialog = (key: string, v:boolean) => {
|
||||
showDialog[key] = v
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.layout-box {
|
||||
margin: 35.9rpx 25.64rpx;
|
||||
.filter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-items: center;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 27rpx;
|
||||
color: #000000;
|
||||
::v-deep .u-input {
|
||||
padding: 0rpx 16.03rpx !important;
|
||||
input {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx !important;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
text {
|
||||
margin: 0px 5rpx;
|
||||
}
|
||||
.status {
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
.btn {
|
||||
color: $u-primary;
|
||||
margin-left: 40rpx;
|
||||
margin-right: 0rpx;
|
||||
}
|
||||
}
|
||||
.box {
|
||||
padding: 19.23rpx;
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
align-items: center;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
text-align: center;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.inner-box {
|
||||
text-align: center;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
border-left: 1px solid #e9e9e9;
|
||||
.num {
|
||||
font-weight: bold;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
}
|
||||
::v-deep .uni-table {
|
||||
min-width: auto !important;
|
||||
.uni-table-th {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 22rpx;
|
||||
color: #000000;
|
||||
padding: 5px 5px;
|
||||
}
|
||||
.uni-table-td {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,54 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<view v-for="item in 10" :key="item" @click="getDetail()">
|
||||
<view class="bill">
|
||||
<view>收货单号：CHD2024012212314</view>
|
||||
<view>应付金额：<text class="num">¥1800.00</text></view>
|
||||
</view>
|
||||
<view class="time"> 2024-01-22 14:28:36 </view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const getDetail = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/supplier/detail", // 要跳转到的页面路径
|
||||
});
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
margin: 30rpx 25rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
padding: 20rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #000000;
|
||||
> view {
|
||||
display: flex;
|
||||
align-items: baseline;
|
||||
justify-content: space-between;
|
||||
padding: 15rpx 0rpx;
|
||||
.num {
|
||||
color: rgba(236, 15, 62, 1);
|
||||
}
|
||||
.bill {
|
||||
view {
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
.time {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
> view + view {
|
||||
border-top: 1px solid rgba(233, 233, 233, 0.76);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,169 @@
|
|||
<template>
|
||||
<view class="c-card">
|
||||
<view class="top">
|
||||
<view class="left">
|
||||
<view>上海奉贤两网融合（大磅）</view>
|
||||
<view>重一</view>
|
||||
</view>
|
||||
<view>
|
||||
<text class="btn" @click="handleScenePhoto()">现场照片</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content">
|
||||
<view class="baseinfo">
|
||||
<view class="time"> 过磅时间：2023-09-01 13:23:33 </view>
|
||||
<view class="person">
|
||||
<view>定价人：谭兵</view>
|
||||
<view>审核人：谭兵</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="padding: 30rpx 0rpx">
|
||||
<view> <text>收货单号：</text><text> SHD20230901132333 </text></view>
|
||||
<view class="box">
|
||||
<view v-for="(item, index) in gridList1" :key="index">
|
||||
<text v-if="item.name">{{ item.name }}：</text
|
||||
><text
|
||||
>{{ item.isBefore ? item.unit : "" }}
|
||||
{{ item.num }}
|
||||
{{ item.isBefore ? "" : item.unit }}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
const gridList1 = reactive([
|
||||
{
|
||||
name: "毛重",
|
||||
num: "4080.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "皮重",
|
||||
num: "3450.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "扣杂",
|
||||
num: "0.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "",
|
||||
num: "",
|
||||
unit: "",
|
||||
},
|
||||
{
|
||||
name: "净重",
|
||||
num: "640.00",
|
||||
unit: "KG",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "单价",
|
||||
num: "2.48",
|
||||
unit: "元/kg",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "预估总价",
|
||||
num: "1587.00",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "货款金额",
|
||||
num: "1587.00",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "付款状态",
|
||||
num: "未支付",
|
||||
isBefore: false,
|
||||
},
|
||||
{
|
||||
name: "应付金额",
|
||||
num: "1587.00",
|
||||
unit: "元",
|
||||
isBefore: false,
|
||||
},
|
||||
]);
|
||||
const handleScenePhoto = () => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/scenePhoto/index", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
margin: 30rpx 25rpx;
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #000000;
|
||||
.top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
border-bottom: 18rpx solid #f8f8f8;
|
||||
.left {
|
||||
view {
|
||||
line-height: 40rpx;
|
||||
&:nth-child(2) {
|
||||
color: rgba(236, 15, 62, 1);
|
||||
font-weight: 400;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn {
|
||||
border-radius: 24rpx;
|
||||
border: 1px solid #00dcee;
|
||||
padding: 10rpx 30rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #00dcee;
|
||||
line-height: 41rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: 30rpx;
|
||||
.baseinfo {
|
||||
.time {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #999999;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.person {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
.box {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
flex: 1;
|
||||
> view {
|
||||
line-height: 50rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,64 @@
|
|||
<template>
|
||||
<Search :name="'供应商名称'" />
|
||||
<view class="c-card">
|
||||
<StatisticCard :list="list" />
|
||||
<view class="detail">
|
||||
<view v-for="(item, index) in 10" :key="index" @click="getDetail(item)">
|
||||
<text>华明基地{{ item }}</text>
|
||||
<text class="num">¥1800.00 <text class="tip">付</text></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import Search from "@/components/Search/index.vue";
|
||||
import StatisticCard from "@/components/StatisticCard/index.vue";
|
||||
const list = reactive([
|
||||
{
|
||||
num: 2,
|
||||
name: "应付供应商",
|
||||
},
|
||||
{
|
||||
num: 8923,
|
||||
name: "应付金额",
|
||||
},
|
||||
]);
|
||||
const getDetail = (item: any) => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/statistics/supplier/billDetail", // 要跳转到的页面路径
|
||||
});
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.c-card {
|
||||
background: #ffffff;
|
||||
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(5, 68, 37, 0.12);
|
||||
border-radius: 13rpx;
|
||||
margin: 30rpx 25rpx;
|
||||
}
|
||||
.detail {
|
||||
border-top: 18rpx solid #f8f8f8;
|
||||
padding: 20rpx;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx;
|
||||
color: #000000;
|
||||
> view {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx 10rpx;
|
||||
.num {
|
||||
color: #ec0f3e;
|
||||
}
|
||||
.tip {
|
||||
color: $u-primary;
|
||||
margin-left: 20rpx;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
> view + view {
|
||||
border-top: 1px solid rgba(233, 233, 233, 0.76);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,133 @@
|
|||
<template>
|
||||
<view class="layout-box">
|
||||
<view class="filter">
|
||||
<u-input
|
||||
v-model="params.startTime"
|
||||
disabled
|
||||
disabledColor="#ffffff"
|
||||
placeholder="请选择开始时间"
|
||||
></u-input>
|
||||
<text>-</text>
|
||||
<u-input
|
||||
v-model="params.endTime"
|
||||
disabled
|
||||
disabledColor="#ffffff"
|
||||
placeholder="请选择结束时间"
|
||||
></u-input>
|
||||
<u-icon
|
||||
name="arrow-down-fill"
|
||||
@click="handleDialog('showTime', true)"
|
||||
></u-icon>
|
||||
|
||||
<text class="btn" @click="handleDialog('showFilter', true)"
|
||||
>收货产品</text
|
||||
>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<c-echarts :option="option" :height="'90vh'" />
|
||||
<!-- 单据弹框 -->
|
||||
<ProductTypeDialog :show="showDialog.showFilter" @handleDialog="(v:boolean) => {handleDialog('showFilter', v)}"/>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
|
||||
import CEcharts from "../../components/Echarts/echarts.vue";
|
||||
import ProductTypeDialog from './components/ProductTypeDialog.vue'
|
||||
const option = ref({
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
type: "cross",
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
left: "10px",
|
||||
right: "20px",
|
||||
top: "10px",
|
||||
bottom: "30px",
|
||||
containLabel: true,
|
||||
},
|
||||
xAxis: {
|
||||
type: "value",
|
||||
boundaryGap: [0, 0.01],
|
||||
},
|
||||
yAxis: {
|
||||
type: "category",
|
||||
data: [1, 2, 3, 4, 5],
|
||||
axisLabel: {
|
||||
// inside: true,
|
||||
// color: '#fff'
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: "#83bff6",
|
||||
},
|
||||
},
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: [100, 110, 113, 126, 143, 158, 165, 167, 152, 102, ,],
|
||||
type: "bar",
|
||||
areaStyle: {
|
||||
show: true,
|
||||
},
|
||||
barWidth: 24,
|
||||
},
|
||||
],
|
||||
color: ["#00D2E3"],
|
||||
});
|
||||
|
||||
const params = reactive({
|
||||
startTime: "2024-01-01",
|
||||
endTime: "2024-01-01",
|
||||
});
|
||||
const showDialog = <
|
||||
{
|
||||
[key: string]: boolean;
|
||||
}
|
||||
>reactive({
|
||||
showTime: false,
|
||||
showFilter: false,
|
||||
});
|
||||
const handleDialog = (key: string, v: boolean) => {
|
||||
showDialog[key] = v;
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.layout-box {
|
||||
margin: 35.9rpx 25.64rpx;
|
||||
.filter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-items: center;
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 27rpx;
|
||||
color: #000000;
|
||||
::v-deep .u-input {
|
||||
padding: 0rpx 16.03rpx !important;
|
||||
input {
|
||||
font-family: Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 21rpx !important;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
text {
|
||||
margin: 0px 5rpx;
|
||||
}
|
||||
.status {
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
.btn {
|
||||
color: $u-primary;
|
||||
margin-left: 40rpx;
|
||||
margin-right: 0rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,48 @@
|
|||
// 存放路径: src/services/home.ts
|
||||
|
||||
import { http } from '@/utils/http'
|
||||
|
||||
/**
|
||||
* 首页-广告区域-小程序
|
||||
* @param distributionSite 广告区域展示位置（投放位置 投放位置，1为首页，2为分类商品页） 默认是1
|
||||
*/
|
||||
export const getHomeBannerAPI = (distributionSite = 1) => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/home/banner',
|
||||
data: {
|
||||
distributionSite,
|
||||
},
|
||||
})
|
||||
}
|
||||
// services/home.ts
|
||||
/**
|
||||
* 首页-前台分类-小程序
|
||||
*/
|
||||
export const getHomeCategoryAPI = () => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/home/category/mutli',
|
||||
})
|
||||
}
|
||||
// services/home.ts
|
||||
/**
|
||||
* 首页-热门推荐-小程序
|
||||
*/
|
||||
export const getHomeHotAPI = () => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/home/hot/mutli',
|
||||
})
|
||||
}
|
||||
// src/services/home.ts
|
||||
/**
|
||||
* 猜你喜欢-小程序
|
||||
*/
|
||||
export const getHomeGoodsGuessLikeAPI = (data: any) => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/home/goods/guessLike',
|
||||
data,
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
export * as ProfileApi from './profile'
|
||||
export * as ReceiveApi from './receive'
|
||||
export * as ShipmentApi from './shipment'
|
||||
|
|
@ -0,0 +1,96 @@
|
|||
// 存放路径: src/services/home.ts
|
||||
|
||||
import { http } from "@/utils/http";
|
||||
|
||||
// 登陆
|
||||
export const loginByAccount = (data: {
|
||||
userName: string;
|
||||
password: string;
|
||||
}) => {
|
||||
return http({
|
||||
method: "POST",
|
||||
url: "/api/user/login",
|
||||
data,
|
||||
});
|
||||
};
|
||||
// 登陆
|
||||
export const logOut = () => {
|
||||
return http({
|
||||
method: "POST",
|
||||
url: "/api/user/logOut",
|
||||
});
|
||||
};
|
||||
|
||||
// 验证码登录
|
||||
export const loginPhone = (data: { phone: string; code: string }) => {
|
||||
return http({
|
||||
method: "GET",
|
||||
url: "/api/user/loginPhone",
|
||||
data,
|
||||
});
|
||||
};
|
||||
|
||||
// 发送验证码
|
||||
export const sendMsg = (data: { phone: string }) => {
|
||||
return http({
|
||||
method: "GET",
|
||||
url: "/api/user/sendMsg",
|
||||
data,
|
||||
});
|
||||
};
|
||||
|
||||
// 创建角色
|
||||
export const addRole = (data: { roleCode: string; roleName: string }) => {
|
||||
return http({
|
||||
method: "POST",
|
||||
url: "/api/role/addRole",
|
||||
data,
|
||||
});
|
||||
};
|
||||
// 修改角色
|
||||
export const updateRole = (data: {
|
||||
id: string;
|
||||
roleCode: string;
|
||||
roleName: string;
|
||||
isDeleted: string;
|
||||
}) => {
|
||||
return http({
|
||||
method: "POST",
|
||||
url: "/api/role/updateRole",
|
||||
data,
|
||||
});
|
||||
};
|
||||
|
||||
// 发送验证码
|
||||
export const getRoleList = () => {
|
||||
return http({
|
||||
method: "GET",
|
||||
url: "/api/role/getRoleList",
|
||||
});
|
||||
};
|
||||
// 验证角色是否重复 1=code 2=名称 3=全部
|
||||
export const verifyRole = (data: {
|
||||
roleCode: string;
|
||||
roleName: string;
|
||||
type: string;
|
||||
}) => {
|
||||
return http({
|
||||
method: "GET",
|
||||
url: "/api/role/verifyRole",
|
||||
data,
|
||||
});
|
||||
};
|
||||
// 添加角色菜单权限
|
||||
export const addMenusRole = (data: {
|
||||
id: number;
|
||||
list: {
|
||||
menusId: number;
|
||||
state: number; // 状态1=开启0=关闭
|
||||
}[];
|
||||
}) => {
|
||||
return http({
|
||||
method: "POST",
|
||||
url: "/api/role/addMenusRole",
|
||||
data,
|
||||
});
|
||||
};
|
||||
|
|
@ -0,0 +1,128 @@
|
|||
// 存放路径: src/services/home.ts
|
||||
import type { Result } from '@/types/global'
|
||||
|
||||
import { http } from "@/utils/http";
|
||||
|
||||
type PageParams = {
|
||||
pageNumber: number,
|
||||
pageSize: number,
|
||||
pricingUserId?: string, // 定价人
|
||||
userId?: string, // 供应商id
|
||||
productId?: string, // 产品id
|
||||
repairFlag?: boolean, // 是否为补单,true 是未补单，false是补单
|
||||
scaleStatus?: number, // 磅单状态:0：待定价1：待过皮2：待审核3：已审核待支付4：已支付
|
||||
}
|
||||
|
||||
interface ReceiveOrderPage<T> {
|
||||
total: number,
|
||||
list: T,
|
||||
pageNum: number,
|
||||
pageSize: number
|
||||
}
|
||||
type ReceiveOrder = {
|
||||
id: number,
|
||||
deviceId: number, // 设备id
|
||||
deviceName: string, // 设备名称
|
||||
userId: number, // 用户id
|
||||
cardId: number, //库存卡id
|
||||
cardNumber: number, // 库存卡号
|
||||
userName: string, // 用户名称：关联用户表得到
|
||||
productId: number, // 品类id
|
||||
productName: string, // 品类名称：关联品类表得到
|
||||
imagesId: string,
|
||||
imageUrls: string,
|
||||
carNumber: string, // 车牌号
|
||||
receiptNumber: string, // 收货单号
|
||||
grossWeight: number, // 毛重
|
||||
tare: number, // 皮重
|
||||
grossTime: string, // 过毛日期
|
||||
tareTime: string, // 过皮日期
|
||||
netWeight: string, // 净重（净重=净重*（1-扣点）-扣杂)
|
||||
buttonType: string, // 扣杂状态：0扣杂1扣点
|
||||
points: string, // 扣点
|
||||
buckleMiscellaneous: string, //扣杂
|
||||
price: string, // 单价
|
||||
balanceTotalPrice: string, //结算总价
|
||||
totalPrice: string, //实际总价
|
||||
weighingMethod: string, //称重方式：0：有皮重 1：零皮重
|
||||
multiCategory: string, // 多品类：0：单品类 1：多品类
|
||||
|
||||
}
|
||||
|
||||
// 收库单分页查询
|
||||
export const getOrderPage = (data: PageParams) => {
|
||||
return http<ReceiveOrderPage<ReceiveOrder>>({
|
||||
method: "GET",
|
||||
url: "/api/orderIn/getOrderPage",
|
||||
data,
|
||||
});
|
||||
};
|
||||
|
||||
// 获取收货单集合
|
||||
export const getList = () => {
|
||||
return http<Result>({
|
||||
method: "GET",
|
||||
url: "/api/orderIn/getList"
|
||||
});
|
||||
};
|
||||
|
||||
//根据id获取收货单详情
|
||||
export const getDetailById = (data: {id: number}) => {
|
||||
return http<Result>({
|
||||
method: "GET",
|
||||
url: "/api/orderIn/getOne",
|
||||
data
|
||||
});
|
||||
};
|
||||
|
||||
// 新增收货单
|
||||
export const addOrderIn = (data: any) => {
|
||||
return http<Result>({
|
||||
method: "POST",
|
||||
url: "/api/orderIn/addOrderIn",
|
||||
data,
|
||||
});
|
||||
};
|
||||
// 批量修改收货单
|
||||
export const updateOrderIn = (data: any) => {
|
||||
return http<Result>({
|
||||
method: "POST",
|
||||
url: "/api/orderIn/updateOrderIn",
|
||||
data,
|
||||
});
|
||||
};
|
||||
// 用于过皮和零皮重
|
||||
export const getTare = (data: any) => {
|
||||
return http<Result>({
|
||||
method: "POST",
|
||||
url: "/api/orderIn/getTare",
|
||||
data,
|
||||
});
|
||||
};
|
||||
|
||||
// 用于单个或批量作废收货单
|
||||
export const deleteOrder = (data: any) => {
|
||||
return http<Result>({
|
||||
method: "POST",
|
||||
url: "/api/orderIn/delete",
|
||||
data,
|
||||
});
|
||||
};
|
||||
// 统计首页的本月总收获以及总支出
|
||||
// 收货类型
|
||||
type ReceiveSummary = {
|
||||
totalReceipt: number, // 本月总出货
|
||||
totalExpenditure: number, // 本月总收入
|
||||
toBePriced: number, // 待收货
|
||||
toBeTare: number, // 待过皮重
|
||||
audit: number, // 付款审核
|
||||
toBePaid: number, // 待支付
|
||||
}
|
||||
export const countOrderByMonth = () => {
|
||||
return http<ReceiveSummary>({
|
||||
method: "GET",
|
||||
url: "/api/orderIn/countOrderByMonth"
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
|
||||
import { http } from '@/utils/http'
|
||||
|
||||
type ShipmentSummary = {
|
||||
totalShipment: number, // 总出货
|
||||
totalIncome: number, // 出货总收入
|
||||
toBeShipped: number, // 待出货
|
||||
roughWeight: number, // 待过毛重
|
||||
shipmentReview: number, // 出货结算
|
||||
toBeSettled: number, // 待结算
|
||||
}
|
||||
// 统计首页的本月收入以及待出库
|
||||
export const countOrderByMonth = () => {
|
||||
return http<ShipmentSummary>({
|
||||
method: "GET",
|
||||
url: "/api/orderOut/countOrderByMonth"
|
||||
});
|
||||
};
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
export {}
|
||||
|
||||
declare module "vue" {
|
||||
type Hooks = App.AppInstance & Page.PageInstance;
|
||||
interface ComponentCustomOptions extends Hooks {}
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 25 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.9 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 5.6 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 6.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 270 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 237 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 277 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 89 KiB |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue