增加 类型标签

main
岩仔88 4 weeks ago
parent c74658b8b6
commit de8c7d970e

@ -1,13 +1,10 @@
<template>
<view class="list_main">
<!-- <view style="display: flex;justify-content: space-between;">
<input class="input search_input" v-model="search" placeholder-style="color:#ccc;" placeholder="搜索" />
<view class="search_button" @click="GetList()"></view>
</view> -->
<view v-if="List.length>0">
<view class="person_list_wrapper">
<view class="person_item_wrapper" v-for="(i, k) in List" :key="k">
<view style="display: flex;align-items: center;" >
<!-- 内容区 -->
<view class="person_item_inner">
<view class="person_avatar_wrapper">
<image v-if="i.leixing == '预约'" src="@/static/images/userm.png"></image>
<image v-else src="@/static/images/userw.png"></image>
@ -21,114 +18,66 @@
<view class="person_idnumber_wrapper">{{ i.id_card_num }}</view>
</view>
</view>
<view style="display: flex; width: 300rpx;" >
<view class="person_type_wrapper" :style="{ backgroundColor: i.leixing === '预约' ? '#81d1ad' : '#d1987c' }">{{i.leixing}}</view>
<view style="display: flex; justify-content: end; width: 100%; padding-right: 20rpx;">
<view class="tools_row" @click="delClickFunc(i.id,i.leixing)">
<uni-icons type="trash" size="20"></uni-icons>
<view class="tools">删除</view>
</view>
<!-- 右上角标签 -->
<view class="item_top_right">
<view class="tag-chip" :style="{ backgroundColor: i.leixing === '预约' ? '#81d1ad' : '#d1987c' }">{{i.leixing}}</view>
<view class="tag-chip" :style="{ backgroundColor: i.type == 1 ? '#6DBFB8' : '#E6B89C' }">{{i.type == 1 ? '健康证' : '老年人'}}</view>
</view>
<!-- 右侧垂直居中删除 -->
<view class="item_right_center">
<view class="tools_row" @click="delClickFunc(i.id,i.leixing)">
<uni-icons type="trash" size="20"></uni-icons>
<view class="tools">删除</view>
</view>
</view>
</view>
</view>
</view>
<view v-else style="font-size: 28rpx;color: #666; width: 100%; text-align: center; padding-top: 200rpx;">
无数据
</view>
</view>
</template>
<script setup>
import {
ref
} from "vue"
import {
TiJianGetList,TiJianDel
} from "@/api"
import {
onLoad,
onShow
} from "@dcloudio/uni-app"
import { ref } from "vue"
import { TiJianGetList, TiJianDel } from "@/api"
import { onLoad, onShow } from "@dcloudio/uni-app"
let search = ref('');
let List = ref([]);
const GetList = () => {
List.value=[]
TiJianGetList({
info: search.value
}).then(res => {
List.value = []
TiJianGetList({ info: search.value }).then(res => {
if (res.status) {
List.value=res.data.all_list
List.value = res.data.all_list
}
console.log(List.value)
})
}
const goto = (id) => {
let userlist_type = sessionStorage.getItem('userlist_type')
let url = null;
if (userlist_type == 'expend') {
url = '/pages/user/expend?member_id=' + id
}
if (userlist_type == 'recharge') {
url = '/pages/user/recharge?member_id=' + id
}
uni.navigateTo({
url: url
})
}
const addClickFunc=()=>{
uni.navigateTo({
url:'/pages/user/person_edit'
})
}
const editClickFunc=(id)=>{
uni.navigateTo({
url:'/pages/user/person_edit?personid=' + id
})
}
const delClickFunc=(id,leixing)=>{
const delClickFunc = (id, leixing) => {
uni.showModal({
title: '提示',
content: '确定删除吗?',
success: function (res) {
if (res.confirm) {
TiJianDel({
id: id,
leixing:leixing
}).then(res => {
if (res.status) {
GetList()
}
})
} else if (res.cancel) {
console.log('用户点击取消');
TiJianDel({ id: id, leixing: leixing }).then(res => {
if (res.status) {
GetList()
}
})
}
}
});
}
const PersonClick=(person)=>{
uni.navigateTo({
url:'/pages/fenzhen/fenzhen_paidui?id_number='+person.id_number
})
}
onShow(() => {
})
onLoad((e)=>{
if(e.info.length>0){
search.value=e.info
onShow(() => {})
onLoad((e) => {
if (e.info && e.info.length > 0) {
search.value = e.info
GetList()
}
})
</script>
@ -146,21 +95,27 @@
.person_item_wrapper {
width: 690rpx;
height: 166rpx;
min-height: 166rpx;
background: #ffffff;
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(0, 0, 0, 0.04);
border-radius: 15rpx;
position: relative;
margin: 20rpx auto 0;
padding: 20rpx;
box-sizing: border-box;
}
.person_item_inner {
display: flex;
align-items: center;
margin: 20rpx auto 0;
padding-right: 20rpx;
padding-right: 120rpx;
}
.person_avatar_wrapper {
width: 105rpx;
height: 105rpx;
margin-left: 16rpx;
flex-shrink: 0;
}
.person_avatar_wrapper image {
@ -203,100 +158,42 @@
margin-top: 20rpx;
}
.person_type_wrapper {
/* 右上角标签 */
.item_top_right {
position: absolute;
width: 100rpx;
height: 46rpx;
background: #c0c0c0;
border-radius: 0rpx 15rpx 0rpx 15rpx;
right: 0;
top: 0;
font-weight: 500;
font-size: 24rpx;
color: #ffffff;
line-height: 46rpx;
text-align: center;
}
.list_left {
color: #333;
width: 280rpx;
display: flex;
font-size: 34rpx;
}
.name {}
.tel {
color: #999;
font-size: 26rpx;
margin-top: 10rpx;
}
.yue {
height: 100rpx;
line-height: 100rpx;
font-size: 34rpx;
margin-left: 20rpx;
color: #FF8A5B;
}
.tags {
height: 100rpx;
line-height: 100rpx;
font-size: 34rpx;
margin-left: 20rpx;
.tag-chip {
height: 40rpx;
line-height: 40rpx;
padding: 0 14rpx;
font-size: 22rpx;
font-weight: 500;
color: #ffffff;
text-align: center;
border-radius: 0 12rpx 0 12rpx;
white-space: nowrap;
}
.search_input {
background-color: #fff;
border-radius: 20rpx;
height: 80rpx;
margin: 10rpx 0rpx 10rpx 20rpx;
padding-left: 30rpx;
width: 500rpx;
/* 右侧垂直居中 */
.item_right_center {
position: absolute;
right: 10rpx;
top: 50%;
transform: translateY(-50%);
}
.search_button {
height: 80rpx;
line-height: 80rpx;
margin: 10rpx 20rpx 10rpx 0rpx;
background-color: #79e8e3;
text-align: center;
width: 180rpx;
border-radius: 20rpx;
}
.add_button_text_wrapper {
font-size: 31rpx;
font-weight: 500;
color: #F6FDFD;
text-align: center;
}
.add_button_wrapper {
position: fixed;
.tools_row {
display: flex;
justify-content: center;
align-items: center;
z-index: 1;
width: 580rpx;
height: 90rpx;
background: linear-gradient(-90deg, #23D3AF, #0DC5CF);
border-radius: 45rpx;
bottom: 60rpx;
left: 50%;
transform: translateX(-50%);
}
.tools{
.tools {
font-size: 28rpx;
width: 60rpx;
color:#666;
}
.tools_row{
margin-left: 20rpx;
display: flex;
color: #666;
}
</style>

@ -14,7 +14,7 @@
<title>MemberMngr</title>
<!--preload-links-->
<!--app-context-->
<script type="module" crossorigin src="/weihu/assets/index-DohXUphv.js"></script>
<script type="module" crossorigin src="/weihu/assets/index-BkkBIOib.js"></script>
<link rel="stylesheet" crossorigin href="/weihu/assets/index-Ru9h2ort.css">
</head>
<body>

Loading…
Cancel
Save