|
@@ -1,67 +1,99 @@
|
|
|
<template>
|
|
<template>
|
|
|
- <FlexCol :padding="30">
|
|
|
|
|
- <FlexRow justify="space-between">
|
|
|
|
|
- <SearchBar
|
|
|
|
|
- v-model="searchText"
|
|
|
|
|
- placeholder="搜一搜"
|
|
|
|
|
- :innerStyle="{ width: '460rpx' }"
|
|
|
|
|
- @confirm="search"
|
|
|
|
|
- />
|
|
|
|
|
- <NButton type="primary" @click="newData">+ 新增</NButton>
|
|
|
|
|
- </FlexRow>
|
|
|
|
|
- <FlexCol :gap="20" :margin="[20,0,0,0]">
|
|
|
|
|
|
|
+ <CommonRoot>
|
|
|
|
|
+ <FlexCol :padding="30">
|
|
|
|
|
+ <FlexRow justify="space-between">
|
|
|
|
|
+ <SearchBar
|
|
|
|
|
+ v-model="searchText"
|
|
|
|
|
+ placeholder="搜一搜"
|
|
|
|
|
+ :innerStyle="{ width: '460rpx' }"
|
|
|
|
|
+ @confirm="search"
|
|
|
|
|
+ />
|
|
|
|
|
+ <NButton type="primary" @click="newData">+ 新增</NButton>
|
|
|
|
|
+ </FlexRow>
|
|
|
|
|
+ <FlexCol :gap="20" :margin="[20,0,0,0]">
|
|
|
|
|
+
|
|
|
|
|
+ <button class="remove-button-style" open-type="share">
|
|
|
|
|
+ <Touchable
|
|
|
|
|
+ direction="column"
|
|
|
|
|
+ center
|
|
|
|
|
+ :padding="20"
|
|
|
|
|
+ :height="300"
|
|
|
|
|
+ :innerStyle="{
|
|
|
|
|
+ backgroundImage: `url('https://mn.wenlvti.net/app_static/xiangyuan/images/share-btn.jpg')`,
|
|
|
|
|
+ backgroundSize: 'cover',
|
|
|
|
|
+ }"
|
|
|
|
|
+ >
|
|
|
|
|
+ <FlexCol position="relative">
|
|
|
|
|
+ <Icon icon="smile-filling" color="primary" :size="156" />
|
|
|
|
|
+ <Icon icon="share" color="warning" :size="56" :innerStyle="{ position: 'absolute', bottom: 0, right: '-40rpx' }" />
|
|
|
|
|
+ </FlexCol>
|
|
|
|
|
+ <Height :height="20" />
|
|
|
|
|
+ <Text :fontSize="26" color="primary" text="分享给志愿者注册,加入志愿者队伍" />
|
|
|
|
|
+ </Touchable>
|
|
|
|
|
+ </button>
|
|
|
|
|
|
|
|
- <button class="remove-button-style" open-type="share">
|
|
|
|
|
- <Touchable
|
|
|
|
|
- direction="column"
|
|
|
|
|
- center
|
|
|
|
|
|
|
+ <FlexRow
|
|
|
|
|
+ v-for="item in listLoader.list.value"
|
|
|
|
|
+ :key="item.id"
|
|
|
|
|
+ backgroundColor="white"
|
|
|
|
|
+ radius="20"
|
|
|
|
|
+ justify="space-between"
|
|
|
|
|
+ align="center"
|
|
|
:padding="20"
|
|
:padding="20"
|
|
|
- :height="300"
|
|
|
|
|
- :innerStyle="{
|
|
|
|
|
- backgroundImage: `url('https://mn.wenlvti.net/app_static/xiangyuan/images/share-btn.jpg')`,
|
|
|
|
|
- backgroundSize: 'cover',
|
|
|
|
|
- }"
|
|
|
|
|
- @click=""
|
|
|
|
|
|
|
+ :gap="20"
|
|
|
>
|
|
>
|
|
|
- <FlexCol position="relative">
|
|
|
|
|
- <Icon icon="smile-filling" color="primary" :size="156" />
|
|
|
|
|
- <Icon icon="share" color="warning" :size="56" :innerStyle="{ position: 'absolute', bottom: 0, right: '-40rpx' }" />
|
|
|
|
|
- </FlexCol>
|
|
|
|
|
- <Height :height="20" />
|
|
|
|
|
- <Text :fontSize="26" color="primary" text="分享给志愿者注册,加入志愿者队伍" />
|
|
|
|
|
- </Touchable>
|
|
|
|
|
- </button>
|
|
|
|
|
-
|
|
|
|
|
- <FlexRow
|
|
|
|
|
- v-for="item in listLoader.list.value"
|
|
|
|
|
- :key="item.id"
|
|
|
|
|
- backgroundColor="white"
|
|
|
|
|
- radius="20"
|
|
|
|
|
- justify="space-between"
|
|
|
|
|
- :padding="20"
|
|
|
|
|
- :gap="20"
|
|
|
|
|
- >
|
|
|
|
|
- <Image :src="item.image" width="150rpx" height="150rpx" round radius="30" />
|
|
|
|
|
- <FlexCol>
|
|
|
|
|
- <Text :fontSize="36" bold :text="`${item.name} ${item.sex === 0 ? '男' : '女'}`" />
|
|
|
|
|
- <Text :fontSize="26" :text="`手机:${item.mobile}`" />
|
|
|
|
|
- <Text :fontSize="26" :text="`地址:${item.address || ''}`" />
|
|
|
|
|
- <Text :fontSize="26" :text="`可采编:${item.collectModuleText || '暂无'}`" />
|
|
|
|
|
- </FlexCol>
|
|
|
|
|
- <FlexRow align="center" :flexShrink="0">
|
|
|
|
|
- <NButton @click="goDetail(item.id, true)">改密码</NButton>
|
|
|
|
|
- <NButton type="primary" @click="goDetail(item.id)">编辑</NButton>
|
|
|
|
|
|
|
+ <FlexRow :gap="20">
|
|
|
|
|
+ <Image
|
|
|
|
|
+ :src="item.image"
|
|
|
|
|
+ width="100rpx"
|
|
|
|
|
+ height="100rpx"
|
|
|
|
|
+ :defaultImage="UserHead"
|
|
|
|
|
+ :failedImage="UserHead"
|
|
|
|
|
+ round
|
|
|
|
|
+ />
|
|
|
|
|
+ <FlexCol>
|
|
|
|
|
+ <Text :fontSize="36" bold :text="`${item.name} ${item.sex === 0 ? '男' : '女'}`" />
|
|
|
|
|
+ <Text :fontSize="26" :text="`手机:${item.mobile}`" />
|
|
|
|
|
+ <Text :fontSize="26" :text="`地址:${item.address || ''}`" />
|
|
|
|
|
+ <Text :fontSize="26" :text="`可采编:${item.collectModuleText || '暂无'}`" />
|
|
|
|
|
+ </FlexCol>
|
|
|
|
|
+ </FlexRow>
|
|
|
|
|
+
|
|
|
|
|
+ <BubbleBox
|
|
|
|
|
+ :innerStyle="{ left: '0' }"
|
|
|
|
|
+ position="bottom"
|
|
|
|
|
+ :items="[
|
|
|
|
|
+ {
|
|
|
|
|
+ icon: 'edit-filling',
|
|
|
|
|
+ text: '编辑信息',
|
|
|
|
|
+ onClick: () => goDetail(item.id),
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ icon: 'browse',
|
|
|
|
|
+ text: '修改密码',
|
|
|
|
|
+ onClick: () => goDetail(item.id, true),
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ icon: 'trash',
|
|
|
|
|
+ text: '删除账号',
|
|
|
|
|
+ textColor: 'danger',
|
|
|
|
|
+ onClick: () => doDeleteUser(item as unknown as VolunteerInfo),
|
|
|
|
|
+ },
|
|
|
|
|
+ ]"
|
|
|
|
|
+ >
|
|
|
|
|
+ <NButton type="primary" icon="edit-filling" :radius="40" />
|
|
|
|
|
+ </BubbleBox>
|
|
|
</FlexRow>
|
|
</FlexRow>
|
|
|
- </FlexRow>
|
|
|
|
|
|
|
+ </FlexCol>
|
|
|
|
|
+ <SimplePageListLoader :loader="listLoader" :noEmpty="true">
|
|
|
|
|
+ <template #empty>
|
|
|
|
|
+ <Empty image="search" text="暂无数据,点击按钮新增数据">
|
|
|
|
|
+ <NButton type="primary" @click="newData">+ 新增数据</NButton>
|
|
|
|
|
+ </Empty>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </SimplePageListLoader>
|
|
|
</FlexCol>
|
|
</FlexCol>
|
|
|
- <SimplePageListLoader :loader="listLoader" :noEmpty="true">
|
|
|
|
|
- <template #empty>
|
|
|
|
|
- <Empty image="search" text="暂无数据,点击按钮新增数据">
|
|
|
|
|
- <Button type="primary" @click="newData">+ 新增数据</Button>
|
|
|
|
|
- </Empty>
|
|
|
|
|
- </template>
|
|
|
|
|
- </SimplePageListLoader>
|
|
|
|
|
- </FlexCol>
|
|
|
|
|
|
|
+ </CommonRoot>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script setup lang="ts">
|
|
<script setup lang="ts">
|
|
@@ -69,7 +101,9 @@ import { ref } from 'vue';
|
|
|
import { navTo } from '@/components/utils/PageAction';
|
|
import { navTo } from '@/components/utils/PageAction';
|
|
|
import { useLoadQuerys } from '@/common/composeabe/LoadQuerys';
|
|
import { useLoadQuerys } from '@/common/composeabe/LoadQuerys';
|
|
|
import { useSimplePageListLoader } from '@/common/composeabe/SimplePageListLoader';
|
|
import { useSimplePageListLoader } from '@/common/composeabe/SimplePageListLoader';
|
|
|
-import VillageApi from '@/api/inhert/VillageApi';
|
|
|
|
|
|
|
+import { onShareAppMessage } from '@dcloudio/uni-app';
|
|
|
|
|
+import { alert, confirm, toast } from '@/components/dialog/CommonRoot';
|
|
|
|
|
+import VillageApi, { VolunteerInfo } from '@/api/inhert/VillageApi';
|
|
|
import SimplePageListLoader from '@/common/components/SimplePageListLoader.vue';
|
|
import SimplePageListLoader from '@/common/components/SimplePageListLoader.vue';
|
|
|
import NButton from '@/components/basic/Button.vue';
|
|
import NButton from '@/components/basic/Button.vue';
|
|
|
import Icon from '@/components/basic/Icon.vue';
|
|
import Icon from '@/components/basic/Icon.vue';
|
|
@@ -81,13 +115,16 @@ import FlexCol from '@/components/layout/FlexCol.vue';
|
|
|
import FlexRow from '@/components/layout/FlexRow.vue';
|
|
import FlexRow from '@/components/layout/FlexRow.vue';
|
|
|
import Touchable from '@/components/feedback/Touchable.vue';
|
|
import Touchable from '@/components/feedback/Touchable.vue';
|
|
|
import Height from '@/components/layout/space/Height.vue';
|
|
import Height from '@/components/layout/space/Height.vue';
|
|
|
-import { onShareAppMessage } from '@dcloudio/uni-app';
|
|
|
|
|
|
|
+import BubbleBox from '@/components/feedback/BubbleBox.vue';
|
|
|
|
|
+import CommonRoot from '@/components/dialog/CommonRoot.vue';
|
|
|
|
|
+import UserHead from '@/static/images/user/avatar.png';
|
|
|
|
|
|
|
|
const { querys } = useLoadQuerys({
|
|
const { querys } = useLoadQuerys({
|
|
|
id: 0,
|
|
id: 0,
|
|
|
name: '',
|
|
name: '',
|
|
|
points: 0,
|
|
points: 0,
|
|
|
level: 0,
|
|
level: 0,
|
|
|
|
|
+ villageId: 0,
|
|
|
villageVolunteerId: 0,
|
|
villageVolunteerId: 0,
|
|
|
}, () => {
|
|
}, () => {
|
|
|
listLoader.loadData(undefined, true);
|
|
listLoader.loadData(undefined, true);
|
|
@@ -131,6 +168,27 @@ function goDetail(id: number, onlyPassword: boolean = false) {
|
|
|
onlyPassword,
|
|
onlyPassword,
|
|
|
});
|
|
});
|
|
|
}
|
|
}
|
|
|
|
|
+function doDeleteUser(item: VolunteerInfo) {
|
|
|
|
|
+ confirm({
|
|
|
|
|
+ title: '确认要删除用户?',
|
|
|
|
|
+ content: `请注意:删除${item.name}后将无法继续登录,请确认此账号不再继续使用。`,
|
|
|
|
|
+ confirmColor: 'danger',
|
|
|
|
|
+ confirmCountDown: 10,
|
|
|
|
|
+ }).then((res) => {
|
|
|
|
|
+ if (res) {
|
|
|
|
|
+ VillageApi.deleteVolunteer(item.id, querys.value.villageId).then(() => {
|
|
|
|
|
+ listLoader.loadData(undefined, true);
|
|
|
|
|
+ toast({ content: '删除成功' })
|
|
|
|
|
+ }).catch((e) => {
|
|
|
|
|
+ alert({
|
|
|
|
|
+ title: '删除失败',
|
|
|
|
|
+ content: '请联系管理员处理。' + e,
|
|
|
|
|
+ icon: 'delete-filling',
|
|
|
|
|
+ })
|
|
|
|
|
+ });
|
|
|
|
|
+ }
|
|
|
|
|
+ });
|
|
|
|
|
+}
|
|
|
function search() {
|
|
function search() {
|
|
|
listLoader.loadData(undefined, true);
|
|
listLoader.loadData(undefined, true);
|
|
|
}
|
|
}
|