duantuihe/pages/my/roleManage/index.vue

<template>
	<view class="container">
		<navBar title="主角列表" :back="true" color="#333333" background="#FFFFFF" />

		<view class='box' v-if="roleList.length!=0">
			<view class='itemBox' v-for="(item,index) in roleList" :key="index">
				<view class='item' :style="{'background-image':`url(${picBase+'card_bg2.png'})`}">
					<!-- <view class='item'> -->
					<view class='top'>
						<view class='currLabel'>
							<!-- <image class='icon'  mode="" src="" /> -->
							<view class='name'>
								{{item.name}}
							</view>
							<view class='name'>
								{{item.sex}}
							</view>
							<view class='phone'>
								{{item.age+'岁'}}
							</view>
						</view>
						<view class='center'>
						</view>
						<view class='bot'>
							<view class='left'>
								<view class='addr'>
									星座：{{item.star}}
								</view>
								<view class='des'>
									年级：{{item.level|changeLevel(item.level)}}
								</view>
							</view>
							<view class='bianjiBox'>
								<image class='bianji' mode="" src="../../../static/other/bj2.png"
									@click.stop="toPage(item)" />
							</view>
						</view>
					</view>
				</view>
				<view class='delBtn' @click="del(item.id)">
					删除
				</view>
			</view>
		</view>


		<view class="empty" style="margin-top: 50%;" v-else>
			<u-empty mode="data" />
		</view>


		<view class='btnBox' @click.stop="toPage(false)">
			<view class='btn'>
				新增主角
			</view>
		</view>
	</view>
</template>

<script>
	// import navBar from '@/components/navBar/index.vue'

	import {
		getKefu,
		getRoleparmas,
		postDelRole
	} from '@/api/index/index.js'
	export default {
		// components: {
		// 	navBar
		// },
		data() {
			return {
				picBase: this.$picBase2,
				roleList: []
			}
		},
		filters: {
			changeLevel(i) {
				if (i == 0) {
					return '幼儿园'
				} else if (i == 1) {
					return '一年级'
				} else if (i == 2) {
					return '二年级'
				} else if (i == 3) {
					return '三年级'
				} else if (i == 4) {
					return '四年级'
				} else if (i == 5) {
					return '五年级'
				} else if (i == 6) {
					return '六年级'
				}
			}
		},
		onLoad() {},
		onShow() {
			this.getRoleparmas()
		},
		methods: {
			async getRoleparmas() {
				let res1 = await getRoleparmas()
				console.log('角色列表返回值--------2', res1);
				if (res1.code == 0) {
					this.roleList = res1.data.data
				} else {
					this.$toast(res1.message)
				}
			},

			toPage(item) {
				if (item) {
					getApp().roleInfo = item
					uni.navigateTo({
						url: '/pages/my/roleManageDetail/index'
					})
				} else {
					uni.navigateTo({
						url: '/pages/my/roleManageDetail/index'
					})
				}

			},

			async del(id) {
				let res1 = await postDelRole({
					id
				})
				console.log('修改角色返回值--------2', res1);
				if (res1.code == 0) {
					let i = this.roleList.findIndex((item, index) => {
						return item.id == id
					})
					let tempList = this.roleList
					tempList.splice(i, 1)
					this.roleList = tempList
					this.$toast('删除成功', 'success')
				} else {
					this.$toast(res1.message)
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "./index.scss";
</style>