cloud
/
cloud_admin
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

个人车辆列表编辑选择用户名9.14

Browse Source
master
zz 2 months ago
parent 94f61c4a16
commit ccaef7cca7
2 changed files with 160 additions and 106 deletions
Show Stats Download Patch File Download Diff File

7
src/views/system/vehicleManagement/personalVehicle/vehiclesList/index.vue
Unescape View File

@ -92,6 +92,7 @@
<dict-tag :type="DICT_TYPE.CARTYPE" :value="scope.row.vehicleType" />
</template>
</el-table-column>
<el-table-column label="用户名" align="center" prop="possessor" />
<el-table-column label="车牌号" align="center" prop="vehicleNo" />
<!-- <el-table-column label="车辆VIN码" align="center" prop="vehicleVin" /> -->
<!-- <el-table-column label="mac地址" align="center" prop="mac" width="90"/>
@ -268,8 +269,10 @@ const resetQuery = () => {
/** 添加/修改操作 */
const formRef = ref()
const openForm = (type: string, id?: number) => {
formRef.value.open(type, id)
const openForm = (type: string, row?: any) => {
formRef.value.open(type, row)
// const openForm = (type: string, id?: number) => {
// formRef.value.open(type, id)
}
/** 删除按钮操作 */

255
src/views/system/vehicleManagement/personalVehicle/vehiclesList/vehiclesListForm.vue
Unescape View File

@ -8,37 +8,7 @@
v-loading="formLoading"
label-position="top"
>
<!--
<el-table-column label="所有人" align="center" prop="producer" />
<el-table-column label="车辆性质" align="center" prop="vehicleProperty" >
<template #default="scope">
<span v-if="scope.row.vehicleProperty==1">私人车辆</span>
<span v-if="scope.row.vehicleProperty==2">车队车辆 </span>
</template>
</el-table-column>
<el-table-column label="车辆外观 " align="center" prop="vehicleApc" />
<el-table-column label="营业结束时间" align="center" prop="startTime" width="150"/>
<el-table-column label="营业结束时间" align="center" prop="endTime" width="150"/>
<el-table-column label="是否允许离线换电" align="center" prop="canOffline" width="180">
<template #default="scope">
<span v-if="scope.row.canOffline==1">允许</span>
<span v-if="scope.row.canOffline==0">不允许 </span>
</template>
</el-table-column>
<el-table-column label="创建时间" align="center" prop="createTime" :formatter="dateFormatter"
width="180px" />
<el-table-column label="状态" align="center" prop="status" >
<template #default="scope">
<span v-if="scope.row.status==0">禁用</span>
<span v-if="scope.row.status==1">启用 </span>
<span v-if="scope.row.status==2">黑名单 </span>
<span v-if="scope.row.status==3">白名单</span>
</template>
</el-table-column>-->
<el-row :gutter="24">
<el-col :span="12">
<el-form-item label="车辆型号" prop="vehicleType">
@ -57,38 +27,26 @@
</el-select>
</el-form-item>
</el-col>
<!-- <el-button type="primary" :disabled="formLoading" @click="dialogVisible_binding = true" >选择用户</el-button> -->
<el-col :span="12" v-if="formType === 'create'">
<el-form-item label="用户名" prop="possessor">
<el-input v-model="formData.possessor" readonly @click="openUser" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="车牌号" prop="vehicleNo">
<el-input v-model="formData.vehicleNo" placeholder="请输入车牌号" />
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="24">
<el-col :span="12">
<el-form-item label="车辆VIN码" prop="vehicleVin">
<el-input v-model="formData.vehicleVin" placeholder="请输入车辆VIN码" />
</el-form-item>
</el-col>
<!-- <el-col :span="12">
<el-form-item label="mac地址" prop="mac">
<el-input v-model="formData.mac" placeholder="请输入mac地址" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="rfid" prop="rfid">
<el-input v-model="formData.rfid" placeholder="请输入rfid" />
</el-form-item>
</el-col> -->
<!-- <el-col :span="12">
<el-form-item label="品牌" prop="brand">
<el-input v-model="formData.brand" placeholder="请输入品牌" />
</el-form-item>
</el-col> -->
<!-- <el-col :span="12">
<el-form-item label="车辆外观" prop="vehicleApc">
<el-input v-model="formData.vehicleApc" placeholder="请输入车辆外观" />
</el-form-item>
</el-col> -->
<el-col :span="12">
<el-form-item label="车辆性质" prop="vehicleProperty">
<el-select v-model="formData.vehicleProperty" clearable placeholder="请选择状态" style="width: 100%;">
@ -101,46 +59,6 @@
</el-select>
</el-form-item>
</el-col>
</el-row>
<!-- <el-col :span="12">
<el-form-item label="底盘号码" prop="chassisNumber">
<el-input v-model="formData.chassisNumber" placeholder="请输入底盘号码" />
</el-form-item>
</el-col> -->
<!-- <el-col :span="12">
<el-form-item label="电动机号码" prop="engineNumber">
<el-input v-model="formData.engineNumber" placeholder="请输入电动机号码" />
</el-form-item>
</el-col> -->
<!-- <el-col :span="12">
<el-form-item label="购车日期" prop="purchaseDate">
<el-input v-model="formData.purchaseDate" placeholder="请输入购车日期" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="车辆厂家" prop="producer">
<el-input v-model="formData.producer" placeholder="请输入车辆厂家" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="所有人" prop="possessor">
<el-input v-model="formData.possessor" placeholder="请输入所有人" />
</el-form-item>
</el-col> -->
<el-row :gutter="24">
<!--
<el-col :span="12">
<el-form-item label="营业开始时间" prop="vehiclestartTimeApc">
<el-input v-model="formData.startTime" placeholder="请输入营业开始时间" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="营业结束时间" prop="endTime">
<el-input v-model="formData.endTime" placeholder="请输入营业结束时间" />
</el-form-item>
</el-col> -->
<el-col :span="12">
<el-form-item label="是否允许离线换电" prop="canOffline">
<el-select v-model="formData.canOffline" clearable placeholder="请选择状态" style="width: 100%;">
@ -165,18 +83,12 @@
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row type="flex" justify="center">
<el-col :span="12">
<el-form-item label="车辆外观" prop="vehicleApc">
<UploadImgs v-model:modelValue="formData.vehicleApc" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
@ -184,20 +96,99 @@
<el-button @click="dialogVisible = false">取 消</el-button>
</template>
</Dialog>
<!-- 用户选择 -->
<el-dialog v-model="dialogVisible_binding" title="用户选择" width="1200">
<div style="display: flex; flex-direction: column; justify-content: space-between">
<el-form
class="-mb-15px"
:model="bind_queryParams"
ref="bind_queryFormRef"
:inline="true"
label-width="68px"
>
<el-form-item label="用户ID" prop="id">
<el-input
v-model="bind_queryParams.id"
placeholder="请输入"
clearable
@keyup.enter="get_team_list"
class="!w-240px"
/>
</el-form-item>
<el-form-item label="用户昵称" prop="nickname">
<el-input
v-model="bind_queryParams.nickname"
placeholder="请输入"
clearable
@keyup.enter="get_team_list"
class="!w-240px"
/>
</el-form-item>
<el-form-item>
<el-button @click="get_team_list"
><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button
>
<el-button @click="bind_resetQuery"
><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button
>
</el-form-item>
</el-form>
<!-- -->
<el-table
ref="singleTableRef"
:data="userIdlist"
border
style="width: 100%; margin-top: 15px"
max-height="500"
highlight-current-row
@current-change="selectionChange"
>
<el-table-column label="用户ID" align="center" prop="id" />
<el-table-column label="用户昵称" align="center" prop="nickname" />
<el-table-column label="用户头像" align="center" prop="avatar" >
<template #default="scope">
<div style="display: flex; align-items: center; justify-content: center">
<el-image :src="scope.row.avatar" style="width: 160px; height: 90px" />
</div>
</template>
</el-table-column>
</el-table>
<div>
<Pagination
:total="bind_total"
v-model:page="bind_queryParams.pageNo"
v-model:limit="bind_queryParams.pageSize"
@pagination="get_team_list"
/>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="dialogVisible_binding = false">取消</el-button>
<el-button type="primary" @click="submit_bind"> 确认 </el-button>
</div>
</template>
</el-dialog>
</template>
<script setup lang="ts">
import * as vehiclesListApi from '@/api/system/vehicleManagement/personalVehicle/vehiclesList'
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
import { UserApi, UserVO } from '@/api/member/driver'
const { t } = useI18n() // 国际化
const message = useMessage() // 消息弹窗
const dialogVisible_binding = ref(false) // 绑定车队的弹窗
const dialogVisible = ref(false) // 弹窗的是否展示
const dialogTitle = ref('') // 弹窗的标题
const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
const formType = ref('') // 表单的类型：create - 新增；update - 修改
const userIdlist=ref([])
const bind_total = ref(0)
const selectUser=ref({})
const formData = ref({
id: undefined,
userId:undefined,
vehicleType: undefined,
vehicleNo: undefined,
vehicleVin: undefined,
@ -216,14 +207,59 @@ const formData = ref({
canOffline: undefined,
status: undefined
})
const singleTableRef=ref()
const submit_bind=()=>{
formData.value={...formData.value,userId:selectUser.value.id,possessor:selectUser.value.nickname}
dialogVisible_binding.value= false
}
const bind_queryParams = reactive({
// pageNo: 1,
// pageSize: 10,
// id:undefined,
// nickname:undefined,
// avatar:undefined,
Type:2,
})
const formRules = reactive({
vehicleVin: [{ required: true, message: '车辆VIN码不能为空', trigger: 'blur' }],
status: [{ required: true, message: '状态不能为空', trigger: 'blur' }]
})
const formRef = ref() // 表单 Ref
const openUser=()=>{
dialogVisible_binding.value=true
get_team_list()
}
const get_team_list = async () => {
try {
const data2 = await UserApi.getUserPage(bind_queryParams)
userIdlist.value=data2.list
if(formData.value.userId){
userIdlist.value.forEach(item=>{
if(item.id==formData.value.userId){
singleTableRef.value!.setCurrentRow(item)
}
})
}
bind_total.value = data2.total
} finally {
}
}
// he
const currentRow_id = ref([])
const selectionChange = (rows: UserVO[]) => {
selectUser.value=rows
// let array = []
// array = rows.map((item) => item.id)
// // console.log(array, 'array')
// currentRow_id.value = array
}
/** 打开弹窗 */
const open = async (type: string, id?: number) => {
// const open = async (type: string, id?: number) => {
const open = async (type: string, id?:any) => {
dialogVisible.value = true
dialogTitle.value = t('action.' + type)
formType.value = type
@ -265,7 +301,12 @@ const submitForm = async () => {
formLoading.value = false
}
}
const bind_queryFormRef = ref() // 搜索的表单
// 用户选择列表重置
const bind_resetQuery = () => {
bind_queryFormRef.value.resetFields()
get_team_list()
}
/** 重置表单 */
const resetForm = () => {
formData.value = {
@ -290,5 +331,15 @@ const resetForm = () => {
}
formRef.value?.resetFields()
}
/** 选中行操作 */
const currentRow = ref({}) // 选中行
const handleCurrentChange = (row) => {
currentRow.value = row
}
// onMounted(() => {
// // getList()
// get_team_list()
// })
</script>
Write Preview
Loading…
Cancel
Save