parent
9c6aa04e78
commit
d2c90b0206
18 changed files with 741 additions and 144 deletions
@ -0,0 +1,62 @@ |
||||
<template> |
||||
<view class="container"> |
||||
<uni-section title="基本信息" type="line"> |
||||
<view class="form"> |
||||
<uni-forms ref="baseForm" :modelValue="form"> |
||||
<uni-forms-item label="姓名" name="contact" required> |
||||
<uni-easyinput v-model="form.contact" placeholder="请输入姓名" /> |
||||
</uni-forms-item> |
||||
<uni-forms-item label="手机号" name="contact" required> |
||||
<uni-easyinput v-model="form.contact" placeholder="请输入手机号" /> |
||||
</uni-forms-item> |
||||
</uni-forms> |
||||
<button type="primary" @click="submit('valiForm')">提交</button> |
||||
</view> |
||||
</uni-section> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
form: { |
||||
name: '', |
||||
provience: '', |
||||
city: '', |
||||
industryId: '', |
||||
age: '', |
||||
introduction: '', |
||||
sex: 2, |
||||
hobby: [5], |
||||
datetimesingle: 1627529992399 |
||||
} |
||||
} |
||||
}, |
||||
onLoad() { |
||||
console.log(getApp()) |
||||
}, |
||||
methods: { |
||||
onchange(e) { |
||||
console.log('---------onchange:', e); |
||||
}, |
||||
submit(ref) { |
||||
this.$refs[ref].validate().then(res => { |
||||
console.log('success', res); |
||||
uni.showToast({ |
||||
title: `校验通过` |
||||
}) |
||||
}).catch(err => { |
||||
console.log('err', err); |
||||
}) |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped> |
||||
.form { |
||||
padding: 15px; |
||||
background-color: #fff; |
||||
} |
||||
</style> |
@ -0,0 +1,182 @@ |
||||
<template> |
||||
<view class="container"> |
||||
<uni-section title="基本信息" type="line"> |
||||
<view class="form"> |
||||
<uni-forms ref="baseForm" :modelValue="form" label-width="100"> |
||||
<uni-forms-item label="商务经理"> |
||||
<uni-easyinput v-model="form.provience" disabled /> |
||||
</uni-forms-item> |
||||
<uni-forms-item label="客户名称" name="contact" required> |
||||
<uni-easyinput v-model="form.contact" placeholder="请选择" /> |
||||
</uni-forms-item> |
||||
<uni-forms-item label="省份"> |
||||
<uni-easyinput v-model="form.provience" disabled /> |
||||
</uni-forms-item> |
||||
<uni-forms-item label="城市"> |
||||
<uni-easyinput v-model="form.city" disabled /> |
||||
</uni-forms-item> |
||||
<uni-forms-item label="联系人"> |
||||
<uni-easyinput v-model="form.provience" disabled /> |
||||
</uni-forms-item> |
||||
<uni-forms-item label="电话"> |
||||
<uni-easyinput v-model="form.city" disabled /> |
||||
</uni-forms-item> |
||||
<uni-forms-item label="邮箱"> |
||||
<uni-easyinput v-model="form.provience" disabled /> |
||||
</uni-forms-item> |
||||
<uni-forms-item label="订单类型"> |
||||
<uni-data-checkbox v-model="form.orderType" :localdata="orderTypes"></uni-data-checkbox> |
||||
</uni-forms-item> |
||||
<uni-forms-item label="订单编号"> |
||||
<uni-easyinput v-model="form.provience" disabled /> |
||||
</uni-forms-item> |
||||
<uni-forms-item label="订单时间"> |
||||
<uni-easyinput v-model="form.city" disabled /> |
||||
</uni-forms-item> |
||||
<uni-forms-item label="订单金额(元)"> |
||||
<uni-easyinput v-model="form.provience" disabled /> |
||||
</uni-forms-item> |
||||
</uni-forms> |
||||
</view> |
||||
</uni-section> |
||||
|
||||
<uni-section title="订单产品" type="line"> |
||||
<view class="card"> |
||||
<button type="primary">添加产品</button> |
||||
</view> |
||||
</uni-section> |
||||
<view class="product"> |
||||
<view class="total"> |
||||
<text>已选()个产品</text> |
||||
<text>总成交价合计:20000(元)</text> |
||||
</view> |
||||
<view class="list"> |
||||
<view class="line">总采购成本:</view> |
||||
<view class="line">总产品利润:</view> |
||||
</view> |
||||
</view> |
||||
<uni-card :is-shadow="false" :border="false" is-full> |
||||
<button type="primary" @click="submit('valiForm')">提交</button> |
||||
</uni-card> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
orderTypes: [{ |
||||
text: '正式', |
||||
value: 0 |
||||
}, { |
||||
text: '试用', |
||||
value: 1 |
||||
}], |
||||
candidates: ['北京', '南京', '东京', '武汉', '天津', '上海', '海口'], |
||||
dataTree: [{ |
||||
text: "一年级", |
||||
value: "1-0", |
||||
children: [{ |
||||
text: "1.1班", |
||||
value: "1-1" |
||||
}, |
||||
{ |
||||
text: "1.2班", |
||||
value: "1-2" |
||||
} |
||||
] |
||||
}, |
||||
{ |
||||
text: "二年级", |
||||
value: "2-0", |
||||
children: [{ |
||||
text: "2.1班", |
||||
value: "2-1" |
||||
}, |
||||
{ |
||||
text: "2.2班", |
||||
value: "2-2" |
||||
} |
||||
] |
||||
}, |
||||
{ |
||||
text: "三年级", |
||||
value: "3-0", |
||||
disable: true |
||||
} |
||||
], |
||||
form: { |
||||
orderType: 0, |
||||
provience: '', |
||||
city: '', |
||||
industryId: '', |
||||
age: '', |
||||
introduction: '', |
||||
sex: 2, |
||||
hobby: [5], |
||||
datetimesingle: 1627529992399 |
||||
}, |
||||
sexs: [{ |
||||
text: '男', |
||||
value: 0 |
||||
}, { |
||||
text: '女', |
||||
value: 1 |
||||
}, { |
||||
text: '保密', |
||||
value: 2 |
||||
}], |
||||
} |
||||
}, |
||||
onLoad() { |
||||
console.log(getApp()) |
||||
}, |
||||
methods: { |
||||
bindPickerChange: function(e) { |
||||
console.log('picker发送选择改变,携带值为', e.detail.value) |
||||
this.index = e.detail.value |
||||
}, |
||||
onchange(e) { |
||||
console.log('---------onchange:', e); |
||||
}, |
||||
submit(ref) { |
||||
this.$refs[ref].validate().then(res => { |
||||
console.log('success', res); |
||||
uni.showToast({ |
||||
title: `校验通过` |
||||
}) |
||||
}).catch(err => { |
||||
console.log('err', err); |
||||
}) |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.form { |
||||
padding: 15px; |
||||
background-color: #fff; |
||||
} |
||||
.card { |
||||
padding: 15px; |
||||
} |
||||
.product { |
||||
margin: 10px 0; |
||||
background-color: #fff; |
||||
.total { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
padding: 10px 15px; |
||||
font-size: 13px; |
||||
border-bottom: 1px solid #ddd; |
||||
} |
||||
.list { |
||||
padding: 10px 15px; |
||||
.line { |
||||
line-height: 30px; |
||||
font-size: 12px; |
||||
} |
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,28 @@ |
||||
<template> |
||||
<view> |
||||
<uni-section title="邀请员工" type="line"> |
||||
<uni-list-item :show-extra-icon="true" showArrow :extra-icon="extraIcon" title="二维码邀请" /> |
||||
</uni-section> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
extraIcon: { |
||||
color: '#007eff', |
||||
size: '22', |
||||
type: 'icon-qrcode' |
||||
} |
||||
} |
||||
}, |
||||
methods: { |
||||
|
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style> |
||||
|
||||
</style> |
@ -0,0 +1,35 @@ |
||||
<template> |
||||
<view> |
||||
<uni-card :is-shadow="false" :border="false" is-full> |
||||
<view class="tool"> |
||||
<view class="download" @click="toPage">下载</view> |
||||
</view> |
||||
|
||||
<view class="content"> |
||||
|
||||
</view> |
||||
</uni-card> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
// 跳转 |
||||
toPage() { |
||||
this.$util.to('../send/send') |
||||
} |
||||
}; |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.tool { |
||||
.download { |
||||
font-size: 13px; |
||||
color: #1f83ff; |
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,22 @@ |
||||
<template> |
||||
<view> |
||||
|
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
|
||||
} |
||||
}, |
||||
methods: { |
||||
|
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style> |
||||
|
||||
</style> |
@ -0,0 +1,125 @@ |
||||
<template> |
||||
<view> |
||||
<view class="top"> |
||||
<uni-search-bar class="search" radius="5" placeholder="请输入方案名称" clearButton="auto" cancelButton="none" @confirm="search" /> |
||||
<uni-icons class="icon" custom-prefix="iconfont" type="icon-filter" size="18" color="#007eff"></uni-icons> |
||||
</view> |
||||
|
||||
<ul class="tab"> |
||||
<li v-for="(tab, i) in tabs" :class="{active: curTab === tab.id}" @click="tabChange(tab)">{{ tab.name }}</li> |
||||
</ul> |
||||
|
||||
<ul class="list"> |
||||
<li> |
||||
<view class="name">金融科技实验方案</view> |
||||
<view class="block"> |
||||
<view class="info"> |
||||
<view class="line"> |
||||
<view class="label">产品</view> |
||||
<view class="val">程序设计、量化投资</view> |
||||
</view> |
||||
<view class="line"> |
||||
<view class="label">更新日期</view> |
||||
<view class="val">201212</view> |
||||
</view> |
||||
<view class="line"> |
||||
<view class="label">适用专业</view> |
||||
<view class="val">金融、大数据</view> |
||||
</view> |
||||
</view> |
||||
<view class="detail" @click="toDetail">详情</view> |
||||
</view> |
||||
</li> |
||||
</ul> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
curTab: 0, |
||||
tabs: [ |
||||
{ |
||||
name: '不限', |
||||
id: 0 |
||||
}, |
||||
{ |
||||
name: '金融科技', |
||||
id: 1 |
||||
}, |
||||
{ |
||||
name: '大数据实验室', |
||||
id: 2 |
||||
} |
||||
] |
||||
} |
||||
}, |
||||
methods: { |
||||
search(res) { |
||||
uni.showToast({ |
||||
title: '搜索:' + res.value, |
||||
icon: 'none' |
||||
}) |
||||
}, |
||||
// tab切换 |
||||
tabChange(tab) { |
||||
this.curTab = tab.id |
||||
}, |
||||
// 跳转详情 |
||||
toDetail() { |
||||
this.$util.to('../detail/detail') |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.top { |
||||
display: flex; |
||||
align-items: center; |
||||
padding: 5px 15px 5px 5px; |
||||
margin-bottom: 10px; |
||||
background-color: #fff; |
||||
.search { |
||||
flex: 1; |
||||
} |
||||
} |
||||
.list { |
||||
background-color: #fff; |
||||
li { |
||||
padding: 20px; |
||||
border-bottom: 2px solid #f8f8f8; |
||||
} |
||||
.name { |
||||
font-size: 14px; |
||||
color: #333; |
||||
} |
||||
.line { |
||||
display: flex; |
||||
margin-bottom: 10px; |
||||
} |
||||
.block { |
||||
display: flex; |
||||
justify-content: space-between; |
||||
align-items: center; |
||||
margin-top: 10px; |
||||
} |
||||
.info { |
||||
margin: 5px 0; |
||||
} |
||||
.label { |
||||
width: 70px; |
||||
font-size: 12px; |
||||
color: #898989; |
||||
} |
||||
.val { |
||||
font-size: 12px; |
||||
color: #898989; |
||||
} |
||||
.detail { |
||||
font-size: 13px; |
||||
color: #1f83ff; |
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,82 @@ |
||||
<template> |
||||
<view class="container"> |
||||
<uni-card :is-shadow="false" :border="false" is-full> |
||||
<view class="form"> |
||||
<view class="line"> |
||||
<uni-data-checkbox v-model="type" :localdata="my"></uni-data-checkbox> |
||||
<text>我的邮箱</text> |
||||
<uni-easyinput v-model="form.contact" /> |
||||
</view> |
||||
<view class="line"> |
||||
<uni-data-checkbox v-model="type1" :localdata="my"></uni-data-checkbox> |
||||
<text>其他邮箱</text> |
||||
<uni-easyinput v-model="form.contact" placeholder="请输入其他邮箱" /> |
||||
</view> |
||||
<button type="primary" @click="submit('valiForm')">确认</button> |
||||
</view> |
||||
</uni-card> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
type: 0, |
||||
type1: 1, |
||||
my: [{ |
||||
text: '', |
||||
value: 0 |
||||
}], |
||||
other: [{ |
||||
text: '', |
||||
value: 1 |
||||
}], |
||||
form: { |
||||
name: '', |
||||
provience: '', |
||||
city: '', |
||||
industryId: '', |
||||
age: '', |
||||
introduction: '', |
||||
sex: 2, |
||||
hobby: [5], |
||||
datetimesingle: 1627529992399 |
||||
} |
||||
} |
||||
}, |
||||
onLoad() { |
||||
console.log(getApp()) |
||||
}, |
||||
methods: { |
||||
onchange(e) { |
||||
console.log('---------onchange:', e); |
||||
}, |
||||
submit(ref) { |
||||
this.$refs[ref].validate().then(res => { |
||||
console.log('success', res); |
||||
uni.showToast({ |
||||
title: `校验通过` |
||||
}) |
||||
}).catch(err => { |
||||
console.log('err', err); |
||||
}) |
||||
}, |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.form { |
||||
padding: 15px; |
||||
background-color: #fff; |
||||
} |
||||
.line { |
||||
display: flex; |
||||
align-items: center; |
||||
margin-bottom: 15px; |
||||
text { |
||||
margin: 0 10px 0 -20px; |
||||
} |
||||
} |
||||
</style> |
@ -0,0 +1,76 @@ |
||||
<template> |
||||
<view> |
||||
<uni-card :is-shadow="false" :border="false" is-full spacing="0" margin="20"> |
||||
<uni-search-bar class="search" radius="5" placeholder="请输入成员名称" clearButton="auto" cancelButton="none" @confirm="search" /> |
||||
</uni-card> |
||||
|
||||
<ul class="list"> |
||||
<li @click="toPage('../addMember/addMember')"> |
||||
<image class="avatar" src="../../static/avatar.jpg" mode=""></image> |
||||
<view class="info"> |
||||
<view class="name">Luna</view> |
||||
<view class="text">手机号码:1352351253</view> |
||||
<view class="text">加入时间:2020-01-02</view> |
||||
</view> |
||||
</li> |
||||
</ul> |
||||
|
||||
<uni-icons class="plus" type="plus-filled" size="60" color="#007eff" @click="toPage('../addStaff/addStaff')"></uni-icons> |
||||
</view> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
|
||||
} |
||||
}, |
||||
methods: { |
||||
search(res) { |
||||
uni.showToast({ |
||||
title: '搜索:' + res.value, |
||||
icon: 'none' |
||||
}) |
||||
}, |
||||
toPage(path) { |
||||
this.$util.to(path) |
||||
} |
||||
} |
||||
} |
||||
</script> |
||||
|
||||
<style scoped lang="scss"> |
||||
.list { |
||||
margin-top: 10px; |
||||
background-color: #fff; |
||||
li { |
||||
display: flex; |
||||
align-items: center; |
||||
padding: 10px 20px; |
||||
border-bottom: 1px solid #f7f7f7; |
||||
&:last-child { |
||||
border-bottom: 0; |
||||
} |
||||
} |
||||
.avatar { |
||||
width: 40px; |
||||
height: 40px; |
||||
margin-right: 15px; |
||||
border-radius: 50%; |
||||
} |
||||
.name { |
||||
font-size: 14px; |
||||
color: #333; |
||||
} |
||||
.text { |
||||
font-size: 13px; |
||||
color: #858585; |
||||
} |
||||
} |
||||
.plus { |
||||
position: fixed; |
||||
bottom: 20px; |
||||
right: 20px; |
||||
} |
||||
</style> |
After Width: | Height: | Size: 6.6 KiB |
Binary file not shown.
@ -1,3 +1,21 @@ |
||||
button[type=primary] { |
||||
background-color: #007eff; |
||||
} |
||||
|
||||
.tab { |
||||
display: flex; |
||||
justify-content: space-around; |
||||
padding: 10px; |
||||
margin-bottom: 10px; |
||||
background-color: #fff; |
||||
li { |
||||
padding: 0 4px; |
||||
font-size: 14px; |
||||
line-height: 30px; |
||||
border-bottom: 3px solid transparent; |
||||
} |
||||
.active { |
||||
color: $uni-primary; |
||||
border-bottom-color: $uni-primary; |
||||
} |
||||
} |
Loading…
Reference in new issue