Skip to content

S
self-support
Commit 5e061739 authored by Damon's avatar Damon
Browse files
Options

merge

parents 73936f54 692113d9
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 1621 additions and 20 deletions
src/components/createCom/XhParts.vue 0 → 100644
View file @ 5e061739
<!-- ******************* 配件选择 ******************* -->
<template>
<view class="complete-part">
<view v-if="status === 1">
<select-parts :lists="lists" @change="partsChange" :disabled="disabled"></select-parts>
</view>
<view v-else-if="status === 2">
<view class="content">
暂无配件信息，<text class="tips" @click="toParts">可选择备件仓配件></text>
</view>
</view>
<view v-else>
<view class="content">
<text class="tips" @click="toHandle">有未处理的配件申请单，不可完工，请点击处理></text>
</view>
</view>
</view>
</template>
<script>
import selectParts from "@/components/parts/index"
import arrMixin from './arrMixin'
export default {
name: 'XhParts',
components: {
selectParts
},
mixins: [arrMixin],
props: {
status: {
type: Number,
default: 1
}
},
data() {
return {
lists: [
{
id: 1,
name: "正泰漏保",
num: 1,
min: 1,
max: 100,
},
{
id: 1,
name: "挚达广汽充电桩",
num: 3,
min: 1,
max: 5,
},
]
}
},
methods: {
partsChange(val) {
console.log("val", val)
},
toParts() {
// uni.navigateTo({
// url: '/pages/'
// })
},
toHandle() {
}
}
}
</script>
<style lang="scss" scoped>
.complete-part {
.content {
padding: 100rpx 50rpx;
text-align: center;
font-size: 26rpx;
color: #aaa;
.tips {
color: #2271FF;
}
}
}
</style>
src/components/parts/index.vue 0 → 100644
View file @ 5e061739
<template>
<view class="parts">
<view class="u-flex u-col-center u-row-around lists" v-if="showTitle">
<view v-if="showChecked && !disabled" class="check">
</view>
<view class="u-flex-1">
<text class="txt">配件名称</text>
</view>
<view class="num">
<text class="txt">数量</text>
</view>
</view>
<view class="u-flex u-col-center u-row-around lists" v-for="(item, index) in val" :key="index">
<view v-if="showChecked && !disabled" class="check">
<u-checkbox v-model="item.checked" :name="index" @change="checkChange"></u-checkbox>
</view>
<view class="u-flex-1 name">
{{item.name}}
</view>
<view class="num">
<u-number-box v-if="!disabled" v-model="item.num" :min="item.min" :max="item.max" :index="index" @change="numChange"></u-number-box>
<text class="nums" v-else>*{{ item.num || 1 }}</text>
</view>
</view>
</view>
</template>
<script>
export default {
props: {
lists: { // 数据列表
default () {
return []
}
},
showChecked: { // 是否需要勾选
type: Boolean,
default () {
return false
}
},
showTitle: { // 是否显示标题
type: Boolean,
default () {
return false
}
},
disabled: {
type: Boolean,
default () {
return false
}
}
},
data() {
return {
val: []
}
},
created() {
this.val = this.lists.map(v => {
if(this.showChecked) v.checked = v.checked || false
return v
})
},
methods: {
checkChange(event) {
this.$set(this.val[event.name], 'checked', event.value)
this.valueChange()
},
numChange(event) {
this.$set(this.val[event.index], 'num', event.value)
this.valueChange()
},
valueChange() {
const lists = this.showChecked ? this.val.filter(v => v.checked) : this.val
this.$emit('change', lists)
}
}
}
</script>
<style scoped lang="scss">
.parts{
padding: 0 20rpx;
.lists {
padding: 10rpx 0;
.txt {
font-size: 28rpx;
color: #2271FF;
}
.check {
width: 80rpx;
text-align: center;
}
.name {
font-size: 26rpx;
}
.num {
width: 200rpx;
text-align: center;
.nums {
color: #F59A23;
}
}
}
}
</style>
src/components/parts/readme.md 0 → 100644
View file @ 5e061739
## 配件组件使用说明
```
该组件用于仓库配件的选择与数量调整
```
## API
### Props
| 属性名 | 类型 | 默认值 | 可选值 | 说明 |
| :---------: | :-----: | :----: | :--------: | :---------------------: |
| showChecked | Boolean | false | true/false | 是否需要复选框 |
| showTitle | Boolean | false | true/false | 是否显示标题 |
| disabled | Boolean | true | true/false | 是否禁用 |
| lists | Array | [] | - | 列表数据 **格式见下文** |
### lists 格式
```json
[
{
name: '正泰漏保', // 配件名称
num: 1, // 配件数量
min: 1, // 数量最小值
max: 100, // 数量最大值
checked: false // 勾选状态，如果需要回显勾选状态需传
}
]
```
### Events
| 事件称名 | 说明 | 返回值 |
| :------: | :----------------------------------: | :-----------------------------------------------------: |
| @change | 数据发生改变时（勾选或改变数量）返回 | 改变后的数据(如有勾选，只返回勾选的数据) **格式见下文** |
### 返回数据格式
```json
[
{
name: '正泰漏保',
num: 1,
min: 1,
max: 100,
checked: true
}
]
```
## 组件用法
### 基础用法
```html
<select-parts
:lists="lists"
:show-checked="true"
:show-title="true"
@change="partsChange"
></select-parts>
```
```js
import selectParts from "@/components/parts/index"
export default {
components: {
selectParts
},
data() {
return {
lists: [
{
id: 1,
name: "正泰漏保",
num: 1,
min: 1,
max: 100,
},
{
id: 1,
name: "挚达广汽充电桩",
num: 3,
min: 1,
max: 5,
},
]
}
},
methods: {
partsChange(val) {
console.log("val", val)
},
},
};
```
src/components/uni-list-item/uni-list-item.vue 0 → 100644
View file @ 5e061739
This diff is collapsed.
src/components/uni-list/readme.md 0 → 100644
View file @ 5e061739
This diff is collapsed.
src/components/uni-list/uni-list.vue 0 → 100644
View file @ 5e061739
<template>
<!-- #ifndef APP-NVUE -->
<view class="uni-list uni-border-top-bottom">
<view v-if="border" class="uni-list--border-top"></view>
<slot />
<view v-if="border" class="uni-list--border-bottom"></view>
</view>
<!-- #endif -->
<!-- #ifdef APP-NVUE -->
<list class="uni-list" :class="{ 'uni-list--border': border }" :enableBackToTop="enableBackToTop" loadmoreoffset="15"><slot /></list>
<!-- #endif -->
</template>
<script>
/**
* List 列表
* @description 列表组件
* @tutorial https://ext.dcloud.net.cn/plugin?id=24
* @property {String} border = [true|false] 标题
*/
export default {
name: 'uniList',
'mp-weixin': {
options: {
multipleSlots: false
}
},
props: {
enableBackToTop: {
type: [Boolean, String],
default: false
},
scrollY: {
type: [Boolean, String],
default: false
},
border: {
type: Boolean,
default: true
}
},
// provide() {
// return {
// list: this
// };
// },
created() {
this.firstChildAppend = false;
},
methods: {
loadMore(e) {
this.$emit('scrolltolower');
}
}
};
</script>
<style lang="scss">
.uni-list {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
background-color: $uni-bg-color;
position: relative;
flex-direction: column;
}
.uni-list--border {
position: relative;
/* #ifdef APP-NVUE */
border-top-color: $uni-border-color;
border-top-style: solid;
border-top-width: 0.5px;
border-bottom-color: $uni-border-color;
border-bottom-style: solid;
border-bottom-width: 0.5px;
/* #endif */
z-index: -1;
}
/* #ifndef APP-NVUE */
.uni-list--border-top {
position: absolute;
top: 0;
right: 0;
left: 0;
height: 1px;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
background-color: $uni-border-color;
z-index: 1;
}
.uni-list--border-bottom {
position: absolute;
bottom: 0;
right: 0;
left: 0;
height: 1px;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
background-color: $uni-border-color;
}
/* #endif */
</style>
src/pages.json
View file @ 5e061739
......@@ -331,24 +331,36 @@
"enablePullDownRefresh": false,
"disableScroll": true
}
},
{
"path": "applyParts",
"style": {
"navigationBarTitleText": "配件申请",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"disableScroll": true
}
},
{
"path": "document-tag",
"style": {
"navigationBarTitleText": "", // 合作商或品牌标签列表
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"disableScroll": true
}
},
{
"path": "applyParts",
"style": {
"navigationBarTitleText": "配件申请",
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"disableScroll": true
}
},
{
"path": "document-tag",
"style": {
"navigationBarTitleText": "", // 合作商或品牌标签列表
"navigationStyle": "custom",
"enablePullDownRefresh": false,
"disableScroll": true
}
},
{
"path": "parts",
"style": {
"navigationBarTitleText": "备件仓可用的配件"
}
},
{
"path": "partsList",
"style": {
"navigationBarTitleText": "配件选择"
}
}
]
},
......
src/pages/order/complete.vue
View file @ 5e061739
......@@ -108,8 +108,8 @@
import XhScan from '@/components/createCom/XhScan.vue'
import XhTime from '@/components/createCom/XhTime.vue'
import XhServiceMeasure from '@/components/createCom/XhServiceMeasure.vue'
import XhServiceMore from "../../components/createCom/XhServiceMore"
import XhLabel from "../../components/createCom/XhLabel"
import XhServiceMore from "@/components/createCom/XhServiceMore"
import XhLabel from "@/components/createCom/XhLabel"
import takePhoto from '@/components/take/index.vue'
import baseFile from '@/components/upload/index'
......
src/pages/order/parts.vue 0 → 100644
View file @ 5e061739
<template>
<view class="det-wrap">
<view class="content">
<scroll-view v-if="lists.length > 0" style="height: 70vh;" scroll-y="true">
<select-parts
:lists="lists"
:show-checked="true"
:show-title="true"
@change="partsChange"
></select-parts>
</scroll-view>
<view v-else class="empty">暂无可用备件</view>
</view>
<view class="bottom" v-if="lists.length > 0">
<button class="btn" @click="submit">
<text class="button-text">保存，继续完工</text>
</button>
</view>
</view>
</template>
<script>
import selectParts from "@/components/parts/index"
export default {
components: {
selectParts
},
data() {
return {
lists: [
{
id: 1,
name: "正泰漏保",
num: 1,
min: 1,
max: 100,
},
{
id: 1,
name: "挚达广汽充电桩",
num: 3,
min: 1,
max: 5,
}
],
val: []
}
},
methods: {
partsChange(val) {
this.val = val
},
submit() {
console.log("this.val", this.val)
}
}
}
</script>
<style lang="scss" scoped>
.det-wrap {
margin: 30rpx;
.content {
border-radius: 12rpx;
background: #fff;
padding: 30rpx;
min-height: 70vh;
}
.empty {
text-align: center;
font-size: 26rpx;
color: #aaa;
}
.bottom {
width: 100%;
padding: 0 40rpx;
font-size: 28rpx;
position: fixed;
bottom: 100rpx;
left: 50%;
margin-left: -50%;
.btn {
padding: 30rpx;
border-radius: 52rpx;
line-height: 44rpx;
font-size: 32rpx;
text-align: center;
background-color: #2272ff;
color: #fff;
&::after {
content: '';
height: 0;
border: none;
}
}
}
}
</style>
src/pages/order/partsList.vue 0 → 100644
View file @ 5e061739
<template>
<view class="u-flex content">
<view class="search">
<u-search
:clearabled="true"
:action-style="searchStyle"
@custom="searchParts"
@search="searchParts"
></u-search>
</view>
<view class="categary">
<view class="u-flex u-col-center u-row-around">
<view class="label-title">品类：</view>
<view class="label-content">
<view
v-for="(item, index) in categary"
:key="index"
class="label-item"
>
<view
:class="['label-normal', { selected: item.id === categaryId }]"
@click="changeCategary(item)"
>
<text class="label-text">{{ item.name }}</text>
</view>
</view>
</view>
</view>
<view class="u-flex u-col-center u-row-around">
<view class="label-title">品牌：</view>
<view class="label-content">
<view v-for="(item, index) in brand" :key="index" class="label-item">
<view
:class="['label-normal', { selected: item.id === brandId }]"
@click="changeBrand(item)"
>
<text class="label-text">{{ item.name }}</text>
</view>
</view>
</view>
</view>
</view>
<view class="lists">
<scroll-view
style="height:100%;"
:scroll-top="scrollTop"
scroll-y="true"
class="scroll-Y"
@scrolltolower="loadMore"
>
<uni-list-item
v-for="(item, index) in lists"
:key="index"
:title="item.title"
:note="item.desc"
showArrow
:thumb="item.img"
thumb-size="lg"
:rightText="item.price"
/>
<view class="load-more">
<u-loadmore :status="loadStatus" @loadmore="loadMore" />
</view>
</scroll-view>
</view>
</view>
</template>
<script>
const categary = [
{
id: 1,
name: "充电桩",
children: [
{
id: 1,
parentId: 1,
name: "沃尔沃",
},
{
id: 2,
parentId: 1,
name: "宝马",
},
{
id: 3,
parentId: 1,
name: "奔驰",
},
],
},
{
id: 2,
name: "空调",
children: [
{
id: 3,
parentId: 2,
name: "美的",
},
{
id: 4,
parentId: 2,
name: "格力",
},
],
},
];
const lists = [
{
title: "空开盒子",
desc: "NO.202006060000",
img:
"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png",
price: "10元",
},
{
title: "空开盒子",
desc: "NO.202006060000",
img:
"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png",
price: "10元",
},
{
title: "空开盒子",
desc: "NO.202006060000",
img:
"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png",
price: "10元",
},{
title: "空开盒子",
desc: "NO.202006060000",
img:
"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png",
price: "10元",
},
{
title: "空开盒子",
desc: "NO.202006060000",
img:
"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png",
price: "10元",
},
{
title: "空开盒子",
desc: "NO.202006060000",
img:
"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png",
price: "10元",
},
{
title: "空开盒子",
desc: "NO.202006060000",
img:
"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png",
price: "10元",
},
{
title: "空开盒子",
desc: "NO.202006060000",
img:
"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png",
price: "10元",
},
{
title: "空开盒子",
desc: "NO.202006060000",
img:
"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png",
price: "10元",
},
{
title: "空开盒子",
desc: "NO.202006060000",
img:
"https://vkceyugu.cdn.bspapp.com/VKCEYUGU-dc-site/460d46d0-4fcc-11eb-8ff1-d5dcf8779628.png",
price: "10元",
}
];
import uniList from "@/components/uni-list/uni-list.vue";
import uniListItem from "@/components/uni-list-item/uni-list-item.vue";
export default {
components: {
uniList,
uniListItem,
},
data() {
return {
categary: categary,
brand: [],
categaryId: "",
brandId: "",
loadStatus: "loadmore",
lists: lists,
size: 10,
page: 1,
count: 1
};
},
computed: {
searchStyle() {
return {
background: "#2272FF",
color: "#FFFFFF",
padding: "10rpx 20rpx",
width: "110rpx",
"border-radius": "10rpx",
};
},
},
methods: {
getPartsList() {
this.page++;
this.loadStatus = "loading";
const data = []
// 模拟加载更多效果
setTimeout(() => {
if (lists.length < this.size || this.count === 3) {
this.loadStatus = "nomore";
} else {
this.lists = this.lists.concat(lists);
this.count++
this.loadStatus = "loadmore"
}
}, 1000)
},
searchParts(val) {
console.log("val", val);
},
changeCategary(item) {
this.categaryId = item.id;
this.brand = item.children || [];
},
changeBrand(item) {
this.brandId = item.id;
},
loadMore() {
if (this.loadStatus !== "nomore") {
this.getPartsList();
}
},
},
};
</script>
<style lang="scss" scoped>
.content {
background: #fff;
padding: 30rpx;
flex-direction: column;
height: 100vh;
.search {
width: 100%;
}
.categary {
width: 100%;
padding-top: 40rpx;
.label-title {
width: 100rpx;
}
.label-content {
width: 100%;
display: flex;
align-items: center;
overflow-x: auto;
min-height: 104rpx;
flex: 1;
.label-item {
padding-right: 20rpx;
flex-shrink: 0;
.label-normal {
height: 70rpx;
width: 160rpx;
font-size: 26rpx;
color: #333;
background-color: #fff;
border: 2rpx solid #797979;
border-radius: 8rpx;
padding-left: 30rpx;
padding-right: 30rpx;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
.label-text {
word-break: break-all;
}
&.selected {
color: #fff;
background-color: #2272ff;
border-color: #2272ff;
}
}
}
}
}
.lists {
width: 100%;
flex: 1;
overflow-y: auto;
.load-more {
padding: 50rpx 0;
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment