支持车辆改业主功能

wuxw
1 parent 83338dbe
Showing 4 changed files with 211 additions and 3 deletions
src/api/owner/ownerApi.js
src/components/car/changeOwnerDialog.vue
src/views/car/listOwnerCarLang.js
src/views/car/listOwnerCarList.vue
@@ -85,6 +85,27 @@ export function deleteOwner(data) {
   })
 }
+// 修改车辆所属业主
+export function changeCarOwner(data) {
+  return new Promise((resolve, reject) => {
+    data.communityId = getCommunityId()
+    request({
+      url: '/owner.changeCarOwner',
+      method: 'post',
+      data
+    }).then(response => {
+      const res = response.data
+      if (res.code == 0) {
+        resolve(res)
+      } else {
+        reject(new Error(res.msg || '修改车辆业主失败'))
+      }
+    }).catch(error => {
+      reject(error)
+    })
+  })
+}
+
 // 上传图片
 export function uploadImage(data) {
   return new Promise((resolve, reject) => {
+<template>
+  <el-dialog
+    :title="$t('listOwnerCar.changeOwner')"
+    :visible.sync="visible"
+    width="800px"
+    :close-on-click-modal="false"
+    @close="handleClose"
+  >
+    <div>
+      <el-form inline>
+        <el-form-item :label="$t('listOwnerCar.ownerName')">
+          <el-input
+            v-model.trim="searchForm.ownerName"
+            :placeholder="$t('listOwnerCar.inputOwnerName')"
+            clearable
+            style="width: 220px"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="handleQuery">
+            {{ $t('listOwnerCar.query') }}
+          </el-button>
+        </el-form-item>
+      </el-form>
+
+      <el-table
+        class="mt-10"
+        :data="ownerList"
+        border
+        v-loading="loading"
+        height="400px"
+      >
+        <el-table-column :label="$t('listOwnerCar.select')" width="80" align="center">
+          <template slot-scope="scope">
+            <el-radio v-model="selectedOwnerId" :label="scope.row.ownerId">
+              &nbsp;
+            </el-radio>
+          </template>
+        </el-table-column>
+        <el-table-column prop="name" :label="$t('listOwnerCar.ownerName')" align="center" />
+        <el-table-column prop="link" :label="$t('listOwnerCar.phoneNumber')" align="center" />
+      </el-table>
+
+      <el-pagination
+        class="mt-10"
+        :current-page="currentPage"
+        :page-size="pageSize"
+        :page-sizes="[10, 20, 30, 50]"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="total"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+      />
+    </div>
+
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="visible = false">{{ $t('listOwnerCar.cancel') }}</el-button>
+      <el-button type="primary" @click="handleConfirm">{{ $t('listOwnerCar.confirm') }}</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { queryOwners, changeCarOwner } from '@/api/owner/ownerApi'
+
+export default {
+  name: 'ChangeOwnerDialog',
+  data() {
+    return {
+      visible: false,
+      currentCar: null,
+      searchForm: {
+        ownerName: ''
+      },
+      ownerList: [],
+      loading: false,
+      selectedOwnerId: '',
+      currentPage: 1,
+      pageSize: 10,
+      total: 0
+    }
+  },
+  methods: {
+    open(car) {
+      this.currentCar = car
+      this.visible = true
+      this.selectedOwnerId = ''
+      this.searchForm.ownerName = ''
+      this.ownerList = []
+      this.currentPage = 1
+      this.total = 0
+      this.handleQuery()
+    },
+
+    async handleQuery() {
+      this.loading = true
+      try {
+        const params = {
+          name: this.searchForm.ownerName || '',
+          page: this.currentPage,
+          row: this.pageSize,
+          personRole: '', // 如需只查业主，可传 '1'
+          roomName: '',
+          link: '',
+          idCard: '',
+          personType: ''
+        }
+        const res = await queryOwners(params)
+        // res.data 为后端返回的业主列表
+        this.ownerList = res.data || []
+        this.total = res.total || 0
+      } catch (error) {
+        console.error('查询业主列表失败:', error)
+        this.$message.error(this.$t('listOwnerCar.changeOwnerQueryFailed'))
+      } finally {
+        this.loading = false
+      }
+    },
+
+    handleSizeChange(val) {
+      this.pageSize = val
+      this.currentPage = 1
+      this.handleQuery()
+    },
+
+    handleCurrentChange(val) {
+      this.currentPage = val
+      this.handleQuery()
+    },
+
+    async handleConfirm() {
+      if (!this.selectedOwnerId) {
+        this.$message.warning(this.$t('listOwnerCar.changeOwnerSelectTip'))
+        return
+      }
+      try {
+        const payload = {
+          memberId: this.currentCar.memberId,
+          newOwnerId: this.selectedOwnerId
+        }
+        await changeCarOwner(payload)
+        this.$message.success(this.$t('common.operationSuccess'))
+        this.visible = false
+        this.$emit('success')
+      } catch (error) {
+        console.error('修改业主失败:', error)
+        this.$message.error(this.$t('listOwnerCar.changeOwnerFailed'))
+      }
+    },
+
+    handleClose() {
+      this.currentCar = null
+      this.selectedOwnerId = ''
+      this.searchForm.ownerName = ''
+      this.ownerList = []
+      this.currentPage = 1
+      this.total = 0
+    }
+  }
+}
+</script>
+
@@ -88,6 +88,14 @@ export const messages = {
       iotSyncDetail: 'IoT sync details',
       confirmRelease: 'Are you sure to release the car?',
       parkingLot: 'Parking Lot',
+      changeOwner: 'Change Owner',
+      ownerName: 'Owner Name',
+      phoneNumber: 'Phone Number',
+      select: 'Select',
+      changeOwnerQueryFailed: 'Failed to query owner list, please try again later',
+      changeOwnerSelectTip: 'Please select an owner first',
+      changeOwnerTodoTip: 'The change owner operation will be completed after backend API is ready',
+      changeOwnerFailed: 'Failed to change owner, please try again later',
     }
   },
   zh: {
@@ -179,6 +187,14 @@ export const messages = {
       iotSyncDetail: '同步物联网详情',
       confirmRelease: '确认释放车辆？',
       parkingLot: '车场',
+      changeOwner: '修改业主',
+      ownerName: '业主名称',
+      phoneNumber: '手机号',
+      select: '选择',
+      changeOwnerQueryFailed: '查询业主列表失败，请稍后重试',
+      changeOwnerSelectTip: '请先选择业主',
+      changeOwnerTodoTip: '后端接口开发完成后，将在此完成修改业主操作',
+      changeOwnerFailed: '修改业主失败，请稍后重试',
     }
   }
 }
 \ No newline at end of file
-<template>
+<template>
   <div class="list-owner-car-container">
     <el-row :gutter="20">
       <el-col :span="3">
@@ -131,7 +131,7 @@
               </template>
             </el-table-column>
             <el-table-column prop="remark" :label="$t('listOwnerCar.remark')" align="center" />
-            <el-table-column :label="$t('listOwnerCar.operation')" align="center" width="280">
+            <el-table-column :label="$t('listOwnerCar.operation')" align="center" width="360">
               <template slot-scope="scope">
                 <el-button v-if="scope.row.state !== '3003' && hasPrivilege('502023032855861676')" size="mini"
                   @click="deleteCarParkingSpace(scope.row)">
@@ -148,6 +148,9 @@
                   @click="openEditOwnerCar(scope.row)">
                   {{ $t('listOwnerCar.modify') }}
                 </el-button>
+                <el-button size="mini" type="primary" @click="openChangeOwnerDialog(scope.row)">
+                  {{ $t('listOwnerCar.changeOwner') }}
+                </el-button>
                 <el-button v-if="hasPrivilege('502023032822121680')" size="mini" type="danger"
                   @click="openDelOwnerCarModel(scope.row)">
                   {{ $t('listOwnerCar.delete') }}
@@ -166,6 +169,7 @@
     <import-owner-car ref="importOwnerCar" @success="listOwnerCarData" />
     <edit-car ref="editCar" @success="listOwnerCarData" />
     <delete-owner-car ref="deleteOwnerCar" @success="listOwnerCarData" />
+    <change-owner-dialog ref="changeOwnerDialog" @success="listOwnerCarData" />
   </div>
 </template>
@@ -174,13 +178,14 @@ import { queryOwnerCars, exportData, deleteCarParkingSpace } from &#39;@/api/car/lis
 import ImportOwnerCar from '@/components/car/importOwnerCar'
 import EditCar from '@/components/car/editCar'
 import DeleteOwnerCar from '@/components/car/deleteOwnerCar'
+import ChangeOwnerDialog from '@/components/car/changeOwnerDialog'
 import { getDict } from '@/api/community/communityApi'
 import { getCommunityId } from '@/api/community/communityApi'
 export default {
   name: 'ListOwnerCar',
-  components: { ImportOwnerCar, EditCar, DeleteOwnerCar },
+  components: { ImportOwnerCar, EditCar, DeleteOwnerCar, ChangeOwnerDialog },
   data() {
     return {
       loading: false,
@@ -319,6 +324,10 @@ export default {
       this.$router.push(`/views/car/carDetail?memberId=${car.carId}&tab=carDetailMember`)
     },
+    openChangeOwnerDialog(car) {
+      this.$refs.changeOwnerDialog.open(car)
+    },
+
     getCarState(car) {
       if (car.state === '3003') {
         return this.$t('listOwnerCar.expired')