140 lines
3.8 KiB
Vue
140 lines
3.8 KiB
Vue
|
<template>
|
||
|
|
<t-card :bordered="false">
|
||
|
|
<div class="form-step-container">
|
||
|
|
<t-form
|
||
|
|
ref="form"
|
||
|
|
:data="formData"
|
||
|
|
:label-width="80"
|
||
|
|
@submit="onSubmit"
|
||
|
|
:style="{ marginBottom: '30px' }"
|
||
|
|
>
|
||
|
|
<t-row>
|
||
|
|
<t-col :span="5">
|
||
|
|
<t-row :gutter="[16, 24]">
|
||
|
|
<t-col :flex="2">
|
||
|
|
<t-form-item label="姓名" name="nikename">
|
||
|
|
<t-input
|
||
|
|
v-model="formData.nikename"
|
||
|
|
class="form-item-content"
|
||
|
|
type="search"
|
||
|
|
placeholder="请输入姓名"
|
||
|
|
:style="{ minWidth: '134px' }"
|
||
|
|
/>
|
||
|
|
</t-form-item>
|
||
|
|
</t-col>
|
||
|
|
|
||
|
|
<t-col :flex="2">
|
||
|
|
<t-form-item label="手机号" name="phone">
|
||
|
|
<t-input
|
||
|
|
v-model="formData.phone"
|
||
|
|
class="form-item-content"
|
||
|
|
placeholder="请输入手机号"
|
||
|
|
:style="{ minWidth: '134px' }"
|
||
|
|
/>
|
||
|
|
</t-form-item>
|
||
|
|
</t-col>
|
||
|
|
</t-row>
|
||
|
|
</t-col>
|
||
|
|
<t-col :span="2" class="operation-container">
|
||
|
|
<t-button theme="primary" type="submit" :style="{ marginLeft: '8px' }"> 查询</t-button>
|
||
|
|
</t-col>
|
||
|
|
</t-row>
|
||
|
|
</t-form>
|
||
|
|
<t-table
|
||
|
|
rowKey="index"
|
||
|
|
:data="list"
|
||
|
|
:columns="columns"
|
||
|
|
:stripe="true"
|
||
|
|
:bordered="false"
|
||
|
|
:hover="true"
|
||
|
|
size="large"
|
||
|
|
table-layout="auto"
|
||
|
|
cellEmptyContent="-"
|
||
|
|
>
|
||
|
|
<template #photo_image="{ row }">
|
||
|
|
<img :src="'http://192.168.3.130/'+row.photo_image" style="width: 50px;height: 50px">
|
||
|
|
</template>
|
||
|
|
<template #gender="{ row }">
|
||
|
|
{{row.gender==1?"男":"女"}}
|
||
|
|
</template>
|
||
|
|
<template #select="{ row }">
|
||
|
|
<t-space size="24px">
|
||
|
|
<t-button theme="default" @click="openUrl(row.member_id)">详细信息</t-button>
|
||
|
|
<!-- <t-button>编辑</t-button>-->
|
||
|
|
<t-button theme="warning">删除</t-button>
|
||
|
|
</t-space>
|
||
|
|
</template>
|
||
|
|
</t-table>
|
||
|
|
<div style="margin-top: 30px">
|
||
|
|
<t-pagination
|
||
|
|
:total="total"
|
||
|
|
:page-size="size"
|
||
|
|
@current-change="onCurrentChange"
|
||
|
|
:showPageSize="false"
|
||
|
|
></t-pagination>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</t-card>
|
||
|
|
</template>
|
||
|
|
<script lang="ts">
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
association:{},
|
||
|
|
list:[],
|
||
|
|
columns:[
|
||
|
|
{ colKey: 'member_id', title: '会员ID'},
|
||
|
|
{ colKey: 'photo_image', title: '证件照'},
|
||
|
|
{ colKey: 'nikename', title: '会员姓名'},
|
||
|
|
{ colKey: 'position_name', title: '头衔'},
|
||
|
|
{ colKey: 'gender', title: '性别'},
|
||
|
|
{ colKey: 'phone', title: '手机号'},
|
||
|
|
{ colKey: 'nation', title: '民族'},
|
||
|
|
{ colKey: 'select', title: '操作',width: 200},
|
||
|
|
],
|
||
|
|
total:0,
|
||
|
|
page:1,
|
||
|
|
size:10,
|
||
|
|
formData:{
|
||
|
|
nikename: '',
|
||
|
|
phone: ''
|
||
|
|
},
|
||
|
|
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
this.association=JSON.parse(this.$store.state.user.association);
|
||
|
|
this.getList();
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
onCurrentChange(d){
|
||
|
|
this.page=d;
|
||
|
|
this.getList();
|
||
|
|
},
|
||
|
|
openUrl(member_id){
|
||
|
|
this.$router.push('/user/user_info?id='+member_id);
|
||
|
|
},
|
||
|
|
getList() {
|
||
|
|
this.formData.page=this.page;
|
||
|
|
this.formData.size=this.size;
|
||
|
|
this.$request
|
||
|
|
.post("/member",this.formData)
|
||
|
|
.then( (res) => {
|
||
|
|
console.log(res);
|
||
|
|
this.list=res.data.ret;
|
||
|
|
this.total=res.data.count;
|
||
|
|
})
|
||
|
|
.catch((e) => {
|
||
|
|
console.log(e);
|
||
|
|
});
|
||
|
|
},
|
||
|
|
onSubmit(){
|
||
|
|
this.getList();
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<style scoped lang="less">
|
||
|
|
|
||
|
|
</style>
|