parent
b332158556
commit
5575c862d9
11 changed files with 234 additions and 254 deletions
@ -0,0 +1,166 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<el-card shadow="hover" class="mgb20"> |
||||||
|
<div class="flex-between"> |
||||||
|
<div class="per_title" v-preventReClick @click="back"> |
||||||
|
<i class="el-icon-arrow-left"></i> |
||||||
|
<span class="per_back">返回</span> |
||||||
|
<span class="per_school">商务经理订单</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</el-card> |
||||||
|
|
||||||
|
<el-card shadow="hover" class="mgb20"> |
||||||
|
<div> |
||||||
|
<div class="flex-center mgb20"> |
||||||
|
<p class="hr_tag"></p> |
||||||
|
<span>筛选</span> |
||||||
|
</div> |
||||||
|
<div style="text-align: right"> |
||||||
|
<el-input style="width: 300px" placeholder="请输入订单编号/产品名称" prefix-icon="el-icon-search" v-model="keyword" clearable></el-input> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</el-card> |
||||||
|
|
||||||
|
<el-card shadow="hover" class="card"> |
||||||
|
<div class="flex-between mgb20"> |
||||||
|
<div class="flex-center"> |
||||||
|
<p class="hr_tag"></p> |
||||||
|
<span>订单列表</span> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
<el-table :data="orderData" class="table" ref="table" stripe header-align="center" |
||||||
|
@selection-change="handleSelectionChange" :row-key="getRowKeys"> |
||||||
|
<el-table-column type="index" width="100" label="序号" align="center"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="orderNumber" label="订单编号" align="center"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="customerName" label="客户名称" align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
{{ customerName }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="productName" label="产品内容" align="center"></el-table-column> |
||||||
|
<el-table-column prop="totalAmount" label="订单金额（元）" align="center"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="createTime" label="订单日期" align="center"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="orderType" label="订单类型" align="center"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="orderStatus" label="订单状态" align="center"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="orderNature" label="订单性质" align="center"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="操作" align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<el-button type="text" @click="toDetail(scope.row)">查看</el-button> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
<div class="pagination"> |
||||||
|
<el-pagination background layout="total, prev, pager, next" |
||||||
|
@current-change="handleCurrentChange" :current-page="page" :total="totals"> |
||||||
|
</el-pagination> |
||||||
|
</div> |
||||||
|
</el-card> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
businessManagerId: this.$route.query.businessManagerId, |
||||||
|
customerId: this.$route.query.customerId, |
||||||
|
customerName: this.$route.query.customerName, |
||||||
|
keyword: "", |
||||||
|
orderData: [], |
||||||
|
page: 1, |
||||||
|
pageSize: 10, |
||||||
|
totals: 0, |
||||||
|
searchTimer: null |
||||||
|
}; |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
keyword: function(val) { |
||||||
|
clearTimeout(this.searchTimer); |
||||||
|
this.searchTimer = setTimeout(() => { |
||||||
|
this.initData(); |
||||||
|
}, 500); |
||||||
|
} |
||||||
|
}, |
||||||
|
created() { |
||||||
|
this.getData(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
getData() { |
||||||
|
let data = { |
||||||
|
businessManagerId: this.businessManagerId, |
||||||
|
keywords: this.keyword, |
||||||
|
customerId: this.customerId, |
||||||
|
pageNum: this.page, |
||||||
|
pageSize: this.pageSize, |
||||||
|
}; |
||||||
|
this.$post(this.api.getBusinessManagerOrder, data).then(({ data }) => { |
||||||
|
const { records } = data |
||||||
|
records.forEach(e => { |
||||||
|
e.orderType = this.orderTypeFn(e.orderType); |
||||||
|
e.orderStatus = this.orderStatusFn(e.orderStatus); |
||||||
|
e.orderNature = this.orderNatureFn(e.orderNature); |
||||||
|
}); |
||||||
|
this.orderData = records |
||||||
|
this.totals = data.total |
||||||
|
}).catch(res => {}) |
||||||
|
}, |
||||||
|
initData() { |
||||||
|
this.page = 1 |
||||||
|
this.getData() |
||||||
|
}, |
||||||
|
toDetail(row) { |
||||||
|
this.$router.push({ |
||||||
|
path:'/AddOrder', |
||||||
|
query:{ |
||||||
|
val: 'watch', |
||||||
|
orderId: row.orderId, |
||||||
|
orderStatus: row.orderStatus === '已完成' ? 1 : 0 |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
back() { |
||||||
|
this.$router.back() |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style scoped> |
||||||
|
.card { |
||||||
|
min-height: calc(100vh - 300px); |
||||||
|
} |
||||||
|
.mag { |
||||||
|
margin-right: 20px; |
||||||
|
} |
||||||
|
.cell{ |
||||||
|
white-space:pre-wrap; |
||||||
|
width: 140px; |
||||||
|
overflow: hidden; |
||||||
|
text-overflow: ellipsis; |
||||||
|
display: -webkit-box; |
||||||
|
-webkit-line-clamp: 2; |
||||||
|
line-clamp: 2; |
||||||
|
-webkit-box-orient: vertical; |
||||||
|
} |
||||||
|
.tags{ |
||||||
|
border: none; |
||||||
|
background: none;color: #000; |
||||||
|
white-space:pre-wrap; |
||||||
|
width: 140px; |
||||||
|
overflow: hidden; |
||||||
|
text-overflow: ellipsis; |
||||||
|
display: -webkit-box; |
||||||
|
-webkit-line-clamp: 2; |
||||||
|
line-clamp: 2; |
||||||
|
-webkit-box-orient: vertical; |
||||||
|
} |
||||||
|
</style> |
||||||
|
|
||||||
@ -1,193 +0,0 @@ |
|||||||
<template> |
|
||||||
<div class="join"> |
|
||||||
<el-form class="form" ref="form" :model="form" :rules="rules"> |
|
||||||
<el-form-item prop="userName" label="姓名"> |
|
||||||
<el-input v-model.trim="form.userName" placeholder="请输入姓名"></el-input> |
|
||||||
</el-form-item> |
|
||||||
<el-form-item prop="account" label="账号"> |
|
||||||
<el-input v-model.trim="form.account" placeholder="请输入账号"></el-input> |
|
||||||
</el-form-item> |
|
||||||
<el-form-item prop="phone" label="手机号"> |
|
||||||
<el-input v-model.trim="form.phone" placeholder="请输入手机号" maxlength="11"></el-input> |
|
||||||
</el-form-item> |
|
||||||
<el-form-item prop="email" label="邮箱"> |
|
||||||
<el-input v-model.trim="form.email" placeholder="请输入邮箱"></el-input> |
|
||||||
</el-form-item> |
|
||||||
</el-form> |
|
||||||
<div class="btn-wrap"> |
|
||||||
<el-button type="primary" @click="submit">提交</el-button> |
|
||||||
</div> |
|
||||||
</div> |
|
||||||
</template> |
|
||||||
|
|
||||||
<script> |
|
||||||
import util from "@/libs/util" |
|
||||||
import Setting from "@/setting" |
|
||||||
export default { |
|
||||||
data() { |
|
||||||
const accountPass = (rule, value, callback) => { |
|
||||||
if (value === '') { |
|
||||||
callback(new Error('请输入账号')) |
|
||||||
} else { |
|
||||||
const pattern = /^[A-Za-z0-9]*$/ |
|
||||||
if(pattern.test(value)){ |
|
||||||
this.accountChange() |
|
||||||
callback() |
|
||||||
}else{ |
|
||||||
callback(new Error('请输入正确账号格式')) |
|
||||||
} |
|
||||||
} |
|
||||||
} |
|
||||||
const phonePass = (rule, value, callback) => { |
|
||||||
if (value) { |
|
||||||
const pattern = /^1[3456789]\d{9}$/ |
|
||||||
if(pattern.test(value)){ |
|
||||||
this.phoneChange() |
|
||||||
callback() |
|
||||||
}else{ |
|
||||||
callback(new Error('请输入正确手机号格式')) |
|
||||||
} |
|
||||||
} else { |
|
||||||
callback(new Error('请输入手机号')) |
|
||||||
} |
|
||||||
} |
|
||||||
const emailPass = (rule, value, callback) => { |
|
||||||
if (value) { |
|
||||||
const pattern = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/ |
|
||||||
if(pattern.test(value)){ |
|
||||||
// this.emailChange() |
|
||||||
callback() |
|
||||||
}else{ |
|
||||||
callback(new Error('请输入正确邮箱格式')) |
|
||||||
} |
|
||||||
} else { |
|
||||||
callback() |
|
||||||
} |
|
||||||
} |
|
||||||
return { |
|
||||||
token: window.atob(decodeURI(this.$route.query.token)), |
|
||||||
form: { |
|
||||||
partnerClassificationId: this.$route.query.id, |
|
||||||
isTeam: 0, |
|
||||||
account: '', |
|
||||||
email: '', |
|
||||||
phone: '', |
|
||||||
userName: '' |
|
||||||
}, |
|
||||||
rules: { |
|
||||||
account: [ |
|
||||||
{ required: true, validator: accountPass, trigger: 'blur' } |
|
||||||
], |
|
||||||
userName: [ |
|
||||||
{ required: true, message: "请输入姓名", trigger: "blur" } |
|
||||||
], |
|
||||||
phone: [ |
|
||||||
{ required: true, validator: phonePass, trigger: 'blur' } |
|
||||||
], |
|
||||||
email: [ |
|
||||||
{ validator: emailPass, trigger: 'blur' } |
|
||||||
] |
|
||||||
}, |
|
||||||
submiting: false // 新增编辑防抖标识 |
|
||||||
}; |
|
||||||
}, |
|
||||||
mounted() { |
|
||||||
sessionStorage.setItem('token', this.token) |
|
||||||
this.form.token = this.token |
|
||||||
}, |
|
||||||
methods: { |
|
||||||
// 账号判重 |
|
||||||
accountChange() { |
|
||||||
const form = this.form |
|
||||||
const { account } = form |
|
||||||
if (account === this.originAccount) { |
|
||||||
this.accountReapeat = false |
|
||||||
} else { |
|
||||||
const { accountId } = form |
|
||||||
this.$post(`${this.api.checkWorkNumOrAccount}?platformId=${Setting.platformId}&type=2&account=${account}${accountId ? `&accountId=${accountId}` : ''}`).then(res => { |
|
||||||
this.accountReapeat = false |
|
||||||
}).catch(err => { |
|
||||||
this.accountReapeat = true |
|
||||||
}) |
|
||||||
} |
|
||||||
}, |
|
||||||
// 手机号判重 |
|
||||||
phoneChange() { |
|
||||||
const form = this.form |
|
||||||
const { phone } = form |
|
||||||
if (phone) { |
|
||||||
const { accountId } = form |
|
||||||
this.$post(`${this.api.checkEmailOrPhone}?phone=${phone}${accountId ? `&accountId=${accountId}` : ''}`).then(res => { |
|
||||||
this.phoneRepeat = false |
|
||||||
}).catch(err => { |
|
||||||
this.phoneRepeat = true |
|
||||||
}) |
|
||||||
} |
|
||||||
}, |
|
||||||
// 邮箱判重 |
|
||||||
emailChange() { |
|
||||||
const form = this.form |
|
||||||
const { email } = form |
|
||||||
if (email) { |
|
||||||
const { accountId } = form |
|
||||||
this.$post(`${this.api.checkEmailOrPhone}?email=${email}${accountId ? `&accountId=${accountId}` : ''}`).then(res => { |
|
||||||
this.emailRepeat = false |
|
||||||
}).catch(err => { |
|
||||||
this.emailRepeat = true |
|
||||||
}) |
|
||||||
} |
|
||||||
}, |
|
||||||
// 提交 |
|
||||||
submit() { |
|
||||||
this.$refs.form.validate((valid) => { |
|
||||||
if (valid) { |
|
||||||
if (this.submiting) return false |
|
||||||
if (this.accountReapeat) return util.warningMsg("该账号已存在") |
|
||||||
if (this.phoneRepeat) return util.warningMsg("该手机号已存在") |
|
||||||
if (this.emailRepeat) return util.warningMsg("该邮箱已存在") |
|
||||||
const { form } = this |
|
||||||
form.uniqueIdentification = Date.now() |
|
||||||
this.submiting = true |
|
||||||
this.$post(this.api.savePartnerAccount, form).then(res => { |
|
||||||
util.successMsg('加入成功！') |
|
||||||
setTimeout(location.reload, 1000) |
|
||||||
}).catch(res => { |
|
||||||
this.submiting = false |
|
||||||
}) |
|
||||||
} |
|
||||||
}) |
|
||||||
}, |
|
||||||
} |
|
||||||
}; |
|
||||||
</script> |
|
||||||
|
|
||||||
<style lang="scss" scoped> |
|
||||||
.join { |
|
||||||
.form{ |
|
||||||
width: 436px; |
|
||||||
padding: 38px 38px 60px; |
|
||||||
margin: 0 auto 0; |
|
||||||
border-radius: 6px; |
|
||||||
background-color: #fff; |
|
||||||
.title{ |
|
||||||
margin-bottom: 25px; |
|
||||||
font-size: 26px; |
|
||||||
color: #0B1D30; |
|
||||||
letter-spacing: 4px; |
|
||||||
} |
|
||||||
} |
|
||||||
/deep/.el-form-item{ |
|
||||||
margin-bottom: 20px; |
|
||||||
} |
|
||||||
/deep/.el-input__inner{ |
|
||||||
position: relative; |
|
||||||
height: 52px; |
|
||||||
padding: 0 20px 0 34px; |
|
||||||
line-height: 50px; |
|
||||||
background-color: #FBFBFB; |
|
||||||
border: 1px solid #E1E6F2; |
|
||||||
border-radius: 4px !important; |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
</style> |
|
||||||
Loading…
Reference in new issue