Skip to content

R
rs-cloud-platform-ui
Commit 95ec09fb authored by rencs's avatar rencs
Browse files
Options

Merge branch 'dev_ren' into 'dev' 

1.15 userlist

See merge request !57
parents 6755ceae 81414428
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 535 additions and 373 deletions
src/api/userManagement/index.js
View file @ 95ec09fb
......@@ -29,7 +29,7 @@ export function userInvoiceList(query) {
return fetch({
url: '/api/website/userInvoice/getList',
method: 'get',
data: query
params: query
});
}
......@@ -40,7 +40,7 @@ export function userAddressList(query) {
return fetch({
url: '/api/website/userAddress/getList',
method: 'get',
data: query
params: query
});
}
......
src/views/userManagement/addressListDialog.vue
View file @ 95ec09fb
<template>
<div class="address-main">
<el-dialog :visible.sync="isVisible" title="查看地址" @close="closeDialog">
<el-scrollbar id="resultScroll" ref="myScrollbar" style="height: 400px;overflow-y:auto;overflow-x: hidden;">
<el-scrollbar
id="resultScroll"
ref="myScrollbar"
style="height: 400px; overflow-y: auto; overflow-x: hidden"
>
<div class="addr-item" v-for="item in list" :key="item.id">
<div class="flex-aic-jcb addr-user-info">
<div class="flex-aic-jcb addr-user-info">
<div class="flex-aic">
<span style="width: 200px;margin-right: 20px;" class="ellipsis">收货人：{{item.consigneeName}}</span>
<span style="width: 200px;">手机：{{item.consigneePhone}}</span>
<span style="width: 200px; margin-right: 20px" class="ellipsis"
>收货人：{{ item.consigneeName }}</span
>
<span style="width: 200px">手机：{{ item.consigneePhone }}</span>
</div>
<div
v-if="item.label"
style="
color: #0a84ff;
font-size: 12px;
background: #d9eafa;
border-radius: 2px;
padding: 2px 5px;
"
>
{{ item.label }}
</div>
<div v-if="item.label" style="color: #0A84FF;font-size: 12px;background: #D9EAFA;border-radius: 2px;padding: 2px 5px;">{{item.label}}</div>
</div>
<div class="flex-aic-jcb">
<span style="margin-top: 10px;" class="ellipsis-2">地址：{{item.province}}{{item.city}}{{item.town}}{{item.consigneeAddress}}</span>
<span style="margin-top: 10px" class="ellipsis-2"
>地址：{{ item.province }}{{ item.city }}{{ item.town
}}{{ item.consigneeAddress }}</span
>
</div>
</div>
<div style="color: #666;font-size: 12px;text-align: center;" v-if="finished">没有更多数据了</div>
<div
style="color: #666; font-size: 12px; text-align: center"
v-if="finished"
>
没有更多数据了
</div>
</el-scrollbar>
</el-dialog>
</div>
</template>
<script type="javascript">
import { userAddressList } from 'api/userManagement/index'
export default {
name: 'userManagement',
components: {},
data() {
return {
list: [],
finished: false, // 是否已加载全部
isVisible: false,
listQuery: {
page: 1,
limit: 20,
},
}
},
mounted() {
this.isVisible = true
this.getAddressList()
// 监听滚动事件
this.$nextTick(() => {
$('#resultScroll')[0].addEventListener('scroll', this.handleScroll, true)
})
},
methods:{
/**
* 关闭弹窗
*/
closeDialog(){
this.$emit('addressEvent', false)
import { userAddressList } from "api/userManagement/index";
export default {
props: ["userId"],
name: "userManagement",
components: {},
data() {
return {
list: [],
finished: false, // 是否已加载全部
isVisible: false,
listQuery: {
page: 1,
limit: 20,
},
/**
* 滚动监听
*/
handleScroll(){
var that = this
var sh = that.$refs['myScrollbar'].$refs['wrap'].scrollHeight // 滚动条高度
var st = that.$refs['myScrollbar'].$refs['wrap'].scrollTop // 滚动条距离顶部的距离
var ch = that.$refs['myScrollbar'].$refs['wrap'].clientHeight // 滚动条外容器的高度
};
},
mounted() {
this.isVisible = true;
this.getAddressList();
// 监听滚动事件
this.$nextTick(() => {
$("#resultScroll")[0].addEventListener("scroll", this.handleScroll, true);
});
},
methods: {
/**
* 关闭弹窗
*/
closeDialog() {
this.$emit("addressEvent", false);
},
/**
* 滚动监听
*/
handleScroll() {
var that = this;
var sh = that.$refs["myScrollbar"].$refs["wrap"].scrollHeight; // 滚动条高度
var st = that.$refs["myScrollbar"].$refs["wrap"].scrollTop; // 滚动条距离顶部的距离
var ch = that.$refs["myScrollbar"].$refs["wrap"].clientHeight; // 滚动条外容器的高度
if (st + ch >= sh) {
//到底了-业务逻辑
console.log(st)
this.listQuery.page = this.listQuery.page + 1
if(!this.finished){
that.getAddressList()
}
if (st + ch >= sh) {
//到底了-业务逻辑
console.log(st);
this.listQuery.page = this.listQuery.page + 1;
if (!this.finished) {
that.getAddressList();
}
},
/**
* 获取发票列表
*/
getAddressList(){
let _this = this
userAddressList(this.listQuery).then(response => {
if(response.status == 200){
let a = response.data.data
if (0 == a.length || _this.listQuery.page > response.data.totalPage) {
_this.finished = true;
return;
}
var e = _this.listQuery.page == 1 ? [] : _this.list;
a.map(function(item) {
e.push(item);
})
_this.list = e;
} else {
this.$notify({
title: '失败',
message: response.message,
type: 'error',
duration: 2000
})
}
},
/**
* 获取发票列表
*/
getAddressList() {
let _this = this;
this.listQuery.userId = this.userId;
userAddressList(this.listQuery).then((response) => {
if (response.status == 200) {
let a = response.data.data;
if (0 == a.length || _this.listQuery.page > response.data.totalPage) {
_this.finished = true;
return;
}
})
},
}
}
var e = _this.listQuery.page == 1 ? [] : _this.list;
a.map(function (item) {
e.push(item);
});
_this.list = e;
} else {
this.$notify({
title: "失败",
message: response.message,
type: "error",
duration: 2000,
});
}
});
},
},
};
</script>
<style lang="scss">
.address-main{
.el-scrollbar__wrap{
overflow-y: auto;
overflow-x: hidden;
}
.addr-item{
background: #f5f6fa;
border: 1px solid #f5f6fa;
padding: 16px;
margin-right: 25px;
color: #413434;
font-size: 13px;
margin-bottom: 24px;
}
.address-main {
.el-scrollbar__wrap {
overflow-y: auto;
overflow-x: hidden;
}
.addr-item {
background: #f5f6fa;
border: 1px solid #f5f6fa;
padding: 16px;
margin-right: 25px;
color: #413434;
font-size: 13px;
margin-bottom: 24px;
}
}
</style>
src/views/userManagement/index.vue
View file @ 95ec09fb
This diff is collapsed.
src/views/userManagement/invoiceListDialog.vue
View file @ 95ec09fb
<template>
<div class="invoice-main">
<el-dialog :visible.sync="isVisible" title="查看发票" @close="closeDialog">
<el-scrollbar id="resultScroll" ref="myScrollbar" style="height: 400px;overflow-y:auto;overflow-x: hidden;">
<el-scrollbar
id="resultScroll"
ref="myScrollbar"
style="height: 400px; overflow-y: auto; overflow-x: hidden"
>
<div class="invoice-item" v-for="item in list" :key="item.id">
<div class="flex-aic-jcb">
<div class="invoice-item-text">{{item.titleType==1?'公司名称':"个人名称"}}：{{item.titleName}}</div>
<div style="color: #0A84FF;font-size: 12px;background: #D9EAFA;border-radius: 2px;padding: 2px 5px;">{{item.type==1?'普通发票':'增值税专用发票'}}-{{item.titleType==1?'企业':'个人'}}</div>
<div class="invoice-item-text">
{{ item.titleType == 1 ? "公司名称" : "个人名称" }}：{{
item.titleName
}}
</div>
<div
style="
color: #0a84ff;
font-size: 12px;
background: #d9eafa;
border-radius: 2px;
padding: 2px 5px;
"
>
{{ item.type == 1 ? "普通发票" : "增值税专用发票" }}-{{
item.titleType == 1 ? "企业" : "个人"
}}
</div>
</div>
<div class="invoice-item-text" v-if="item.titleType==1 && item.type == 2">地址：{{item.province}}{{item.city}}{{item.town}}{{item.address}}</div>
<div class="invoice-item-text" v-if="item.titleType==1 && item.type == 2">电话：{{item.phone}}</div>
<div class="invoice-item-text" v-if="item.titleType==1 && item.type == 2">开户行：{{item.openBank}}</div>
<div class="invoice-item-text" v-if="item.titleType==1 && item.type == 2">账号：{{item.account}}</div>
<div class="invoice-item-text" v-if="item.titleType==1">税号：{{item.taxCode}}</div>
<div
class="invoice-item-text"
v-if="item.titleType == 1 && item.type == 2"
>
地址：{{ item.province }}{{ item.city }}{{ item.town
}}{{ item.address }}
</div>
<div
class="invoice-item-text"
v-if="item.titleType == 1 && item.type == 2"
>
电话：{{ item.phone }}
</div>
<div
class="invoice-item-text"
v-if="item.titleType == 1 && item.type == 2"
>
开户行：{{ item.openBank }}
</div>
<div
class="invoice-item-text"
v-if="item.titleType == 1 && item.type == 2"
>
账号：{{ item.account }}
</div>
<div class="invoice-item-text" v-if="item.titleType == 1">
税号：{{ item.taxCode }}
</div>
</div>
<div
style="color: #666; font-size: 12px; text-align: center"
v-if="finished"
>
没有更多数据了
</div>
<div style="color: #666;font-size: 12px;text-align: center;" v-if="finished">没有更多数据了</div>
</el-scrollbar>
</el-dialog>
</div>
</template>
<script type="javascript">
import { userInvoiceList } from 'api/userManagement/index'
export default {
name: 'userManagement',
components: {},
data() {
return {
list: [],
finished: false, // 是否已加载全部
isVisible: false,
listQuery: {
page: 1,
limit: 20,
},
}
},
mounted() {
this.isVisible = true
this.getInvoiceList()
// 监听滚动事件
this.$nextTick(() => {
$('#resultScroll')[0].addEventListener('scroll', this.handleScroll, true)
})
},
methods:{
/**
* 关闭弹窗
*/
closeDialog(){
this.$emit('invoiceEvent', false)
import { userInvoiceList } from "api/userManagement/index";
export default {
props: ["userId"],
name: "userManagement",
components: {},
data() {
return {
list: [],
finished: false, // 是否已加载全部
isVisible: false,
listQuery: {
page: 1,
limit: 20,
},
/**
* 滚动监听
*/
handleScroll(){
var that = this
var sh = that.$refs['myScrollbar'].$refs['wrap'].scrollHeight // 滚动条高度
var st = that.$refs['myScrollbar'].$refs['wrap'].scrollTop // 滚动条距离顶部的距离
var ch = that.$refs['myScrollbar'].$refs['wrap'].clientHeight // 滚动条外容器的高度
};
},
mounted() {
this.isVisible = true;
this.getInvoiceList();
// 监听滚动事件
this.$nextTick(() => {
$("#resultScroll")[0].addEventListener("scroll", this.handleScroll, true);
});
},
methods: {
/**
* 关闭弹窗
*/
closeDialog() {
this.$emit("invoiceEvent", false);
},
/**
* 滚动监听
*/
handleScroll() {
var that = this;
var sh = that.$refs["myScrollbar"].$refs["wrap"].scrollHeight; // 滚动条高度
var st = that.$refs["myScrollbar"].$refs["wrap"].scrollTop; // 滚动条距离顶部的距离
var ch = that.$refs["myScrollbar"].$refs["wrap"].clientHeight; // 滚动条外容器的高度
if (st + ch >= sh) {
//到底了-业务逻辑
console.log(st)
this.listQuery.page = this.listQuery.page + 1
if(!this.finished){
that.getInvoiceList()
}
if (st + ch >= sh) {
//到底了-业务逻辑
console.log(st);
this.listQuery.page = this.listQuery.page + 1;
if (!this.finished) {
that.getInvoiceList();
}
},
/**
* 获取发票列表
*/
getInvoiceList(){
let _this = this
userInvoiceList(this.listQuery).then(response => {
if(response.status == 200){
let a = response.data.data
if (0 == a.length || _this.listQuery.page > response.data.totalPage) {
_this.finished = true;
return;
}
var e = _this.listQuery.page == 1 ? [] : _this.list;
a.map(function(item) {
e.push(item);
})
_this.list = e;
} else {
this.$notify({
title: '失败',
message: response.message,
type: 'error',
duration: 2000
})
}
},
/**
* 获取发票列表
*/
getInvoiceList() {
let _this = this;
this.listQuery.userId = this.userId;
console.log(this.listQuery.userId);
userInvoiceList(this.listQuery).then((response) => {
if (response.status == 200) {
let a = response.data.data;
if (0 == a.length || _this.listQuery.page > response.data.totalPage) {
_this.finished = true;
return;
}
})
},
}
}
var e = _this.listQuery.page == 1 ? [] : _this.list;
a.map(function (item) {
e.push(item);
});
_this.list = e;
} else {
this.$notify({
title: "失败",
message: response.message,
type: "error",
duration: 2000,
});
}
});
},
},
};
</script>
<style lang="scss">
.invoice-main{
.el-scrollbar__wrap{
overflow-y: auto;
overflow-x: hidden;
}
.invoice-item{
background: #f5f6fa;
border: 1px solid #f5f6fa;
padding: 16px;
margin-right: 25px;
margin-bottom: 24px;
color: #413434;
font-size: 13px;
.invoice-item-text{
line-height: 26px;
}
.invoice-main {
.el-scrollbar__wrap {
overflow-y: auto;
overflow-x: hidden;
}
.invoice-item {
background: #f5f6fa;
border: 1px solid #f5f6fa;
padding: 16px;
margin-right: 25px;
margin-bottom: 24px;
color: #413434;
font-size: 13px;
.invoice-item-text {
line-height: 26px;
}
}
}
</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