tqApp-webView/pagesBase/vehManage/module/item.vue

<template>
	<view class="box-container">
		<!-- <view class="box-head">
			{{renderItem(item,'deptName','--')}}
		</view> -->
		<view class="box-body">
			<u-row>
				<u-col :span="10">
					
					<view class="item">
						<view class="label">车牌号：</view>
						<view class="value">{{renderItem(item,'plate','--')}}</view>
					</view>
					<view class="item">
						<view class="label">所属单位：</view>
						<view class="value">{{renderItem(item,'deptName','--')}}</view>
					</view>
					
					
				</u-col>
				<u-col :span="2" class="disflex-center">
					<u-icon name="edit-pen-fill" color="#4573FC" size="22" @click="handleEdit(item)" v-if="$hasPermi('mobile:index:baseMange:vehManage:edit')"></u-icon>
					<u-icon name="trash-fill" color="#E44C4C" size="22" @click="handleDelete(item)" v-if="$hasPermi('mobile:index:baseMange:vehManage:remove')"></u-icon>
				</u-col>
			</u-row>
		</view>
		
		<!-- <view class="box-footer" v-if="item.outflowType==1">
			<u-row style="justify-content: flex-end;">
				<u-col :span="4" style="padding: 20rpx 30rpx;" v-if="item.backSts==0">
					<u-button type="info"  :custom-style="{
							width: '100%',
							height: '28px',
						  }"  @click="handleBack(item)">归还
					</u-button>
				</u-col>	
			</u-row>
		</view> -->
		
		
	</view>
</template>

<script>
import { renderItem } from '@/utils/gdtq'
import {remove} from '@/api/system/vehicle.js'

export default {
	components: {
	},
	props: {
		item: {
			type: Object,
			default: () => {}
		}
	},
	data() {
		return {}
	},
	methods: {
		handleDelete(item) {
			uni.showModal({
				title: '提示',
				content: `确认删除？`,
				showCancel:true,
				confirmText: '确定',
				success: async (res) => {
					if (res.confirm) {
						const {vehicleId} = item
						let {code} = await remove({ids: vehicleId})
						if(code == 0) {
							this.$emit('getList')
						}
					}
				}
			})	
		},
    handleEdit(item){
      const {vehicleId} = item
      uni.navigateTo({
      	url: `/pagesBase/vehManage/add?id=${vehicleId}`
      })
    }
		
	},
}
</script>

<style lang="scss" scoped>
	.box-container {
		background: #fff;
		margin: 20rpx 10rpx;
		border-radius: 10rpx;
		font-size: 24rpx;
		.box-head {
			border-bottom: 1px solid #ddd;
			padding: 20rpx;
			font-weight: 700;
		}
		.box-body {
			padding: 20rpx;
			.item {
				margin: 4rpx;
				display: flex;
				.label {
					
				}
				.value {
					flex: 1;
					 text-overflow: ellipsis;
					overflow: hidden;
					white-space: nowrap;
				}
			}
		}
		.box-footer {
			border-top: 1px solid #ddd;
			// padding: 20rpx;
		}
	}
	
	.primary {
		color: $uni-color-primary;
	}
	.disflex-center {
		display: flex;
		flex-direction: row !important;
		justify-content: space-between !important;
		align-items: center !important;
	}
</style>