topnuomi
/
xx-applets
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

新增独立表单页面、优化页面

This commit is contained in:
TOP糯米 2023-02-16 23:28:32 +08:00
parent 738bc1c708
commit d9c1e31312
14 changed files with 351 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/App.vue
View File

@ -51,6 +51,7 @@ export default {
.order-placeholder {
color: #909090;
}
.form-input-placeholder,
.address-placeholder {
color: #c9c9c9;
}
@ -111,21 +112,40 @@ export default {
width: 710rpx;
background-color: #fff;
margin: 20rpx auto 0 auto;
.input-item {
.input-item,
.textarea-item {
width: 100%;
height: 105rpx;
border-bottom: 2rpx solid #e8e7e7;
display: flex;
align-items: center;
padding: 0 30rpx;
box-sizing: border-box;
line-height: 30rpx;
.title-box {
width: 150rpx;
font-size: 30rpx;
line-height: 30rpx;
color: #2d2d2d;
}
}
.textarea-item {
padding: 30rpx;
.textarea-box {
width: 100%;
box-sizing: border-box;
border: 2rpx solid #D8D8D8;
margin-top: 30rpx;
}
.textarea {
width: 100%;
box-sizing: border-box;
height: 170rpx;
padding: 10rpx;
font-size: 28rpx;
}
}
.input-item {
height: 105rpx;
border-bottom: 2rpx solid #e8e7e7;
display: flex;
align-items: center;
padding: 0 30rpx;
line-height: 30rpx;
// input
.input-box {
width: 500rpx;

4
src/components/widgets/count-modify.vue
View File

@ -37,11 +37,11 @@ export default {
} else {
this.number = 0;
}
this.$emit("onSub", this.number);
this.$emit("change", this.number);
},
add() {
this.number++;
this.$emit("onAdd", this.number);
this.$emit("change", this.number);
},
},
};

14
src/pages/address/address.vue
View File

@ -49,7 +49,10 @@
<view class="btn get-wechat-address" @click="getWechatAddress">
<text class="text">获取微信收货地址</text>
</view>
<view class="btn add-address" @click="addAddress">
<view
class="btn add-address"
@click="$utils.toPage('/pages/address/edit')"
>
<text class="text">新增地址</text>
</view>
</view>
@ -148,15 +151,8 @@ export default {
});
// #endif
},
addAddress() {
uni.navigateTo({
url: "/pages/address/edit",
});
},
editAddress(id) {
uni.navigateTo({
url: "/pages/address/edit?id=" + id,
});
this.$utils.toPage("/pages/address/edit?id=" + id);
},
deleteAddress(id, index) {
uni.showModal({

6
src/pages/address/edit.vue
View File

@ -33,7 +33,7 @@
class="input"
v-model="detail"
placeholder="请输入详细地址，如8栋5单元18a"
placeholder-class="address-placeholder"
placeholder-class="form-input-placeholder"
/>
</view>
</view>
@ -46,7 +46,7 @@
class="input"
v-model="name"
placeholder="请输入姓名"
placeholder-class="address-placeholder"
placeholder-class="form-input-placeholder"
/>
</view>
</view>
@ -82,7 +82,7 @@
class="input"
v-model="mobile"
placeholder="请输入手机号码"
placeholder-class="address-placeholder"
placeholder-class="form-input-placeholder"
/>
</view>
</view>

9
src/pages/index/index.vue
View File

@ -83,6 +83,7 @@
class="service-item"
v-for="(item, index) in bussinessServiceList"
:key="index"
@click="$utils.toPage(item.page)"
>
<image
class="service-icon"
@ -219,14 +220,14 @@ export default {
{
id: 14,
icon: require("@/static/temp/index/b1.png"),
title: "管道疏通",
page: "",
title: "工程安装",
page: "/pages/single/project",
},
{
id: 15,
icon: require("@/static/temp/index/b2.png"),
title: "货物配送",
page: "",
title: "企业合作安装",
page: "/pages/single/business",
},
],
};

25
src/pages/member/member.vue
View File

@ -18,7 +18,7 @@
</view>
<view class="menu-container">
<view class="form-widget-group">
<view class="widget-item" @click="addressPage">
<view class="widget-item" @click="$utils.toPage('/pages/address/address?openType=list')">
<text class="iconfont icon-dingwei icon"></text>
<text class="title limit-line clamp-1">我的地址</text>
<text class="iconfont icon-jinru more"></text>
@ -45,12 +45,18 @@
<text class="title limit-line clamp-1">我是师傅</text>
<text class="iconfont icon-jinru more"></text>
</view>
<view class="widget-item" @click="projectPage">
<view
class="widget-item"
@click="$utils.toPage('/pages/single/project')"
>
<text class="iconfont icon-cailiaogongcheng icon"></text>
<text class="title limit-line clamp-1">工程安装</text>
<text class="iconfont icon-jinru more"></text>
</view>
<view class="widget-item">
<view
class="widget-item"
@click="$utils.toPage('/pages/single/business')"
>
<text class="iconfont icon-qiye icon"></text>
<text class="title limit-line clamp-1">企业安装合作</text>
<text class="iconfont icon-jinru more"></text>
@ -87,18 +93,7 @@ export default {
onReady() {},
onReachBottom() {},
onPullDownRefresh() {},
methods: {
addressPage() {
uni.navigateTo({
url: "/pages/address/address?openType=list",
});
},
projectPage() {
uni.navigateTo({
url: "/pages/single/project",
});
},
},
methods: {},
};
</script>

20
src/pages/order/create.vue
View File

@ -136,17 +136,17 @@ export default {
},
selectAddress() {
const that = this;
uni.navigateTo({
url:
"/pages/address/address?openType=choose&id=" +
that.addressId,
events: {
setAddress(address) {
that.addressId = address.id;
that.addressText = address.address + address.detail;
this.$utils.toPage(
"/pages/address/address?openType=choose&id=" + that.addressId,
{
events: {
setAddress(address) {
that.addressId = address.id;
that.addressText = address.address + address.detail;
},
},
},
});
}
);
},
selectDateTime() {
console.log("选择时间");

4
src/pages/service/cate.vue
View File

@ -93,9 +93,7 @@ export default {
onPullDownRefresh() {},
methods: {
clickItem(id) {
uni.navigateTo({
url: "/pages/service/list?id=" + id,
});
this.$utils.toPage("/pages/service/list?id=" + id);
},
},
};

7
src/pages/service/detail.vue
View File

@ -128,7 +128,8 @@ export default {
require("@/static/temp/cate/5.png"),
require("@/static/temp/cate/5.png"),
],
content: "<p>这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容</p>",
content:
"<p>这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容这是服务内容</p>",
},
};
},
@ -157,9 +158,7 @@ export default {
});
},
createOrder() {
uni.navigateTo({
url: "/pages/order/create",
});
this.$utils.toPage("/pages/order/create");
},
changeTab(e) {
this.tabIndex = e.detail.current;

8
src/pages/service/list.vue
View File

@ -118,14 +118,10 @@ export default {
onPullDownRefresh() {},
methods: {
createOrder() {
uni.navigateTo({
url: "/pages/order/create",
});
this.$utils.toPage("/pages/order/create");
},
clickItem(id) {
uni.navigateTo({
url: "/pages/service/detail?id=" + id,
});
this.$utils.toPage("/pages/service/detail?id=" + id);
},
},
};

119
src/pages/single/business.vue
View File

@ -1,6 +1,70 @@
<template>
<app-layout headerBackgroundColor="#00418c" textColor="light">
<app-layout
headerBackgroundColor="#F6F6F6"
title="企业合作安装"
textColor="dark"
backgroundColor="#F6F6F6"
>
<view class="background">
<image class="image" :src="background" mode="widthFix" />
</view>
<view class="form-container">
<view class="input-item">
<view class="title-box">
<text>品牌</text>
</view>
<view class="input-box">
<input
class="input"
v-model="brand"
placeholder="请输入贵公司品牌"
placeholder-class="form-input-placeholder"
/>
</view>
</view>
<view class="input-item">
<view class="title-box">
<text>联系人</text>
</view>
<view class="input-box">
<input
class="input"
v-model="name"
placeholder="请输入姓名"
placeholder-class="form-input-placeholder"
/>
</view>
</view>
<view class="input-item">
<view class="title-box">
<text>联系手机</text>
</view>
<view class="input-box">
<input
class="input"
v-model="mobile"
placeholder="请输入您的手机号"
placeholder-class="form-input-placeholder"
/>
</view>
</view>
<view class="textarea-item">
<view class="title-box">
<text>合作内容</text>
</view>
<view class="textarea-box">
<textarea
v-model="content"
class="textarea"
placeholder="请输入合作内容"
placeholder-class="form-input-placeholder"
/>
</view>
</view>
</view>
<view class="save-form-btn">
<view class="btn" @click="save">保存</view>
</view>
</app-layout>
</template>
@ -9,7 +73,13 @@ import AppLayout from "@/components/layout/layout";
export default {
name: "single-business",
data() {
return {};
return {
background: require("@/static/temp/single/2.png"),
brand: "",
name: "",
mobile: "",
content: "",
};
},
components: {
AppLayout,
@ -19,8 +89,47 @@ export default {
onReady() {},
onReachBottom() {},
onPullDownRefresh() {},
methods: {},
methods: {
save() {
console.log("保存");
},
},
};
</script>
<style lang="less" scoped></style>
<style lang="less" scoped>
.background {
z-index: 5;
width: 100%;
line-height: 0;
.image {
width: 100%;
}
}
.form-container {
z-index: 10;
position: relative;
margin-top: -85rpx;
}
.carry-style,
.count-style {
.title-box {
width: 200rpx;
}
.input-box {
width: auto;
}
}
.carry-style {
.input-box {
padding-left: 15rpx;
}
}
.count-style {
justify-content: space-between;
}
.save-form-btn {
margin-top: 40rpx;
padding-bottom: 100rpx;
}
</style>

174
src/pages/single/project.vue
View File

@ -1,26 +1,190 @@
<template>
<app-layout headerBackgroundColor="#00418c" textColor="light">
<app-layout
headerBackgroundColor="#F6F6F6"
title="工程安装"
textColor="dark"
backgroundColor="#F6F6F6"
>
<view class="background">
<image class="image" :src="background" mode="widthFix" />
</view>
<view class="form-container">
<view class="input-item">
<view class="title-box">
<text>工程类型</text>
</view>
<view class="input-box">
<input
class="input"
v-model="projectType"
placeholder="请输入工程的类型，例如：酒店"
placeholder-class="form-input-placeholder"
/>
</view>
</view>
<view class="input-item">
<view class="title-box">
<text>产品类型</text>
</view>
<view class="input-box">
<input
class="input"
v-model="productType"
placeholder="请输入产品类型"
placeholder-class="form-input-placeholder"
/>
</view>
</view>
<view class="input-item">
<view class="title-box">
<text>联系人</text>
</view>
<view class="input-box">
<input
class="input"
v-model="name"
placeholder="请输入姓名"
placeholder-class="form-input-placeholder"
/>
</view>
</view>
<view class="input-item">
<view class="title-box">
<text>联系手机</text>
</view>
<view class="input-box">
<input
class="input"
v-model="mobile"
placeholder=" 请输入联系手机号"
placeholder-class="form-input-placeholder"
/>
</view>
</view>
<view class="input-item count-style">
<view class="title-box">
<text>需要师傅数量</text>
</view>
<view class="input-box">
<widget-count-modify
:initNumber="number"
@change="changeNumber"
/>
</view>
</view>
<view class="input-item carry-style">
<view class="title-box">
<text>是否需要搬运</text>
</view>
<view class="input-box">
<view class="checkbox">
<view
class="checkbox-item"
:class="[needCarry == 1 ? 'active' : '']"
@click="needCarry = 1"
>
<text>是</text>
</view>
<view
class="checkbox-item"
:class="[needCarry == 0 ? 'active' : '']"
@click="needCarry = 0"
>
<text>否</text>
</view>
</view>
</view>
</view>
<view class="textarea-item">
<view class="title-box">
<text>补充说明</text>
</view>
<view class="textarea-box">
<textarea
v-model="content"
class="textarea"
placeholder="请输入补充说明"
placeholder-class="form-input-placeholder"
/>
</view>
</view>
</view>
<view class="save-form-btn">
<view class="btn" @click="save">保存</view>
</view>
</app-layout>
</template>
<script>
import AppLayout from "@/components/layout/layout";
import WidgetCountModify from "@/components/widgets/count-modify";
export default {
name: "single-project",
data() {
return {};
return {
background: require("@/static/temp/single/1.png"),
projectType: "",
productType: "",
number: 1,
name: "",
mobile: "",
needCarry: 1,
content: "",
};
},
components: {
AppLayout,
WidgetCountModify,
},
onLoad() {},
onShow() {},
onReady() {},
onReachBottom() {},
onPullDownRefresh() {},
methods: {},
methods: {
changeNumber(data) {
this.number = data;
},
save() {
console.log("保存");
},
},
};
</script>
<style lang="less" scoped></style>
<style lang="less" scoped>
.background {
z-index: 5;
width: 100%;
line-height: 0;
.image {
width: 100%;
}
}
.form-container {
z-index: 10;
position: relative;
margin-top: -130rpx;
}
.carry-style,
.count-style {
.title-box {
width: 200rpx;
}
.input-box {
width: auto;
}
}
.carry-style {
.input-box {
padding-left: 15rpx;
}
}
.count-style {
justify-content: space-between;
}
.save-form-btn {
margin-top: 40rpx;
padding-bottom: 100rpx;
}
</style>

BIN
src/static/temp/single/1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 147 KiB

BIN
src/static/temp/single/2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 129 KiB