增加商家和驿站的修改功能。

src/api/station.js

@@ -16,4 +16,13 @@ export function createStation(data) {
     method: 'post',
     data
   })
+}
+
+// 修改驿站
+export function updateStation(id, data) {
+  return request({
+    url: `/api/station/${id}`,
+    method: 'put',
+    data
+  })
 } 

src/views/merchant/List.vue

@@ -22,7 +22,10 @@
             {{ formatDateTime(record.create_time) }}
           </template>
           <template v-if="column.key === 'action'">
-            <a-button type="link" @click="handleManageImages(record)">管理图片</a-button>
+            <a-space>
+              <a-button type="link" @click="handleManageImages(record)">管理图片</a-button>
+              <a-button type="link" @click="handleEdit(record)">修改</a-button>
+            </a-space>
           </template>
         </template>
       </a-table>
@@ -167,6 +170,98 @@
       >
         <img :alt="previewTitle" style="width: 100%" :src="previewImage" />
       </a-modal>
+
+      <!-- 添加修改商家模态框 -->
+      <a-modal
+        v-model:visible="editModalVisible"
+        title="修改商家"
+        :confirmLoading="editLoading"
+        width="800px"
+        @cancel="handleEditCancel"
+      >
+        <template #footer>
+          <a-space>
+            <a-button @click="handleEditCancel">取消</a-button>
+            <a-button type="primary" :loading="editLoading" @click="handleEditSubmit">
+              保存
+            </a-button>
+          </a-space>
+        </template>
+
+        <a-form
+          ref="editFormRef"
+          :model="editFormState"
+          :rules="rules"
+          :label-col="{ span: 6 }"
+          :wrapper-col="{ span: 16 }"
+        >
+          <a-form-item label="商家分类" name="category_id" required>
+            <a-select
+              v-model:value="editFormState.category_id"
+              placeholder="请选择商家分类"
+              :options="categories.map(item => ({
+                value: item.id,
+                label: item.name
+              }))"
+            />
+          </a-form-item>
+
+          <a-form-item label="商家名称" name="name" required>
+            <a-input v-model:value="editFormState.name" placeholder="请输入商家名称" />
+          </a-form-item>
+
+          <a-form-item label="营业时间" name="business_hours" required>
+            <a-input v-model:value="editFormState.business_hours" placeholder="例如：10:30~20:30" />
+          </a-form-item>
+
+          <a-form-item label="联系电话" name="phone" required>
+            <a-input v-model:value="editFormState.phone" placeholder="请输入联系电话" />
+          </a-form-item>
+
+          <a-form-item label="地址搜索">
+            <a-auto-complete
+              v-model:value="editSearchAddress"
+              :options="searchOptions"
+              placeholder="输入地址搜索"
+              @change="handleSearch"
+              @select="handleEditSelect"
+              :loading="searchLoading"
+              allow-clear
+            />
+          </a-form-item>
+
+          <a-form-item label="地图选点" required>
+            <div class="map-container">
+              <div id="edit-map-container" style="height: 300px;"></div>
+            </div>
+          </a-form-item>
+
+          <a-form-item label="详细地址" name="address" required>
+            <a-input v-model:value="editFormState.address" placeholder="请输入详细地址" />
+          </a-form-item>
+
+          <a-form-item label="经纬度" required>
+            <a-input-group compact>
+              <a-input-number
+                v-model:value="editFormState.longitude"
+                :min="-180"
+                :max="180"
+                style="width: 50%"
+                placeholder="经度"
+                disabled
+              />
+              <a-input-number
+                v-model:value="editFormState.latitude"
+                :min="-90"
+                :max="90"
+                style="width: 50%"
+                placeholder="纬度"
+                disabled
+              />
+            </a-input-group>
+          </a-form-item>
+        </a-form>
+      </a-modal>
     </div>
   </page-container>
 </template>
@@ -678,6 +773,150 @@ export default defineComponent({
       resetImageManager()  // 使用重置函数
     }
 
+    // 修改商家相关
+    const editModalVisible = ref(false)
+    const editLoading = ref(false)
+    const editFormRef = ref(null)
+    const editFormState = ref({
+      name: '',
+      category_id: undefined,
+      business_hours: '',
+      address: '',
+      longitude: null,
+      latitude: null,
+      phone: ''
+    })
+    const editSearchAddress = ref('')
+    const editMap = ref(null)
+    const editMarker = ref(null)
+    const currentEditId = ref(null)
+
+    // 显示修改模态框
+    const handleEdit = async (record) => {
+      currentEditId.value = record.id
+      editFormState.value = {
+        name: record.name,
+        category_id: record.category_id,
+        business_hours: record.business_hours,
+        address: record.address,
+        longitude: record.longitude,
+        latitude: record.latitude,
+        phone: record.phone
+      }
+      
+      // 获取分类数据
+      if (categories.value.length === 0) {
+        await fetchCategories()
+      }
+      
+      editModalVisible.value = true
+      await nextTick()
+      initEditMap(record.longitude, record.latitude)
+    }
+
+    // 初始化编辑地图
+    const initEditMap = async (lng, lat) => {
+      try {
+        await loadAMap()
+        
+        if (!editMap.value) {
+          editMap.value = createMap('edit-map-container', {
+            zoom: 13,
+            viewMode: '2D'
+          })
+
+          editMap.value.on('click', async (e) => {
+            const { lng, lat } = e.lnglat
+            updateEditMarkerPosition(lng, lat)
+            
+            const geocoder = createGeocoder()
+            geocoder.getAddress([lng, lat], (status, result) => {
+              if (status === 'complete' && result.info === 'OK') {
+                const address = result.regeocode
+                editFormState.value.address = address.formattedAddress
+                editFormState.value.longitude = lng
+                editFormState.value.latitude = lat
+              } else {
+                message.error('获取地址信息失败')
+              }
+            })
+          })
+        }
+
+        // 设置中心点和标记
+        editMap.value.setCenter([lng, lat])
+        updateEditMarkerPosition(lng, lat)
+      } catch (error) {
+        console.error('初始化地图失败:', error)
+        message.error('初始化地图失败')
+      }
+    }
+
+    // 更新编辑标记位置
+    const updateEditMarkerPosition = (lng, lat) => {
+      if (editMarker.value) {
+        editMarker.value.setPosition([lng, lat])
+      } else {
+        editMarker.value = new window.AMap.Marker({
+          position: [lng, lat],
+          map: editMap.value
+        })
+      }
+    }
+
+    // 处理地址选择
+    const handleEditSelect = (value, option) => {
+      const selected = searchOptions.value.find(opt => opt.value === value)
+      if (selected && selected.location) {
+        const { lng, lat } = selected.location
+        updateEditMarkerPosition(lng, lat)
+        editMap.value.setCenter([lng, lat])
+        
+        const geocoder = createGeocoder()
+        geocoder.getAddress([lng, lat], (status, result) => {
+          if (status === 'complete' && result.info === 'OK') {
+            const address = result.regeocode
+            editFormState.value.address = address.formattedAddress
+            editFormState.value.longitude = lng
+            editFormState.value.latitude = lat
+          } else {
+            editFormState.value.address = value
+            editFormState.value.longitude = lng
+            editFormState.value.latitude = lat
+          }
+        })
+      }
+    }
+
+    // 提交修改
+    const handleEditSubmit = () => {
+      editFormRef.value.validate().then(async () => {
+        try {
+          editLoading.value = true
+          await request.put(`/api/merchant/${currentEditId.value}`, editFormState.value)
+          message.success('修改成功')
+          editModalVisible.value = false
+          fetchData()
+        } catch (error) {
+          console.error('修改商家失败:', error)
+          message.error('修改失败')
+        } finally {
+          editLoading.value = false
+        }
+      })
+    }
+
+    // 取消修改
+    const handleEditCancel = () => {
+      editFormRef.value?.resetFields()
+      editSearchAddress.value = ''
+      if (editMarker.value) {
+        editMarker.value.setMap(null)
+        editMarker.value = null
+      }
+      editModalVisible.value = false
+    }
+
     onMounted(() => {
       fetchData()
     })
@@ -718,7 +957,16 @@ export default defineComponent({
       handleRemove,
       handleSaveImages,
       handleCancelImages,
-      categories
+      categories,
+      editModalVisible,
+      editLoading,
+      editFormRef,
+      editFormState,
+      editSearchAddress,
+      handleEdit,
+      handleEditSubmit,
+      handleEditCancel,
+      handleEditSelect
     }
   }
 })

src/views/station/StationList.vue

@@ -38,6 +38,13 @@
         @change="handleTableChange"
         row-key="id"
       >
+        <template #bodyCell="{ column, record }">
+          <template v-if="column.key === 'action'">
+            <a-space>
+              <a-button type="link" @click="handleEdit(record)">修改</a-button>
+            </a-space>
+          </template>
+        </template>
       </a-table>
 
       <!-- 添加驿站模态框 -->
@@ -79,6 +86,46 @@
           </a-form-item>
         </a-form>
       </a-modal>
+
+      <!-- 添加修改驿站模态框 -->
+      <a-modal
+        v-model:visible="editModalVisible"
+        title="修改驿站"
+        :confirmLoading="editLoading"
+        width="500px"
+        @cancel="handleEditCancel"
+      >
+        <template #footer>
+          <a-space>
+            <a-button @click="handleEditCancel">取消</a-button>
+            <a-button type="primary" :loading="editLoading" @click="handleEditSubmit">
+              保存
+            </a-button>
+          </a-space>
+        </template>
+
+        <a-form
+          ref="editFormRef"
+          :model="editFormState"
+          :rules="rules"
+          :label-col="{ span: 6 }"
+          :wrapper-col="{ span: 16 }"
+          class="station-form"
+        >
+          <a-form-item label="所属小区" name="community_id" required>
+            <a-select
+              v-model:value="editFormState.community_id"
+              placeholder="请选择小区"
+              :options="communityOptions"
+              :field-names="{ label: 'name', value: 'id' }"
+            />
+          </a-form-item>
+
+          <a-form-item label="驿站名称" name="name" required>
+            <a-input v-model:value="editFormState.name" placeholder="请输入驿站名称" />
+          </a-form-item>
+        </a-form>
+      </a-modal>
     </div>
   </page-container>
 </template>
@@ -86,7 +133,7 @@
 <script>
 import { defineComponent, ref, onMounted } from 'vue'
 import { message } from 'ant-design-vue'
-import { getStationList, createStation } from '@/api/station'
+import { getStationList, createStation, updateStation } from '@/api/station'
 import { getCommunityList } from '@/api/community'
 import PageContainer from '@/components/PageContainer.vue'
 
@@ -129,6 +176,12 @@ export default defineComponent({
         dataIndex: 'community_name',
         key: 'community_name',
         width: 150
+      },
+      {
+        title: '操作',
+        key: 'action',
+        width: 120,
+        align: 'center'
       }
     ]
 
@@ -230,6 +283,54 @@ export default defineComponent({
       addModalVisible.value = false
     }
 
+    // 修改驿站相关
+    const editModalVisible = ref(false)
+    const editLoading = ref(false)
+    const editFormRef = ref(null)
+    const editFormState = ref({
+      name: '',
+      community_id: undefined
+    })
+    const currentEditId = ref(null)
+
+    // 显示修改模态框
+    const handleEdit = (record) => {
+      currentEditId.value = record.id
+      editFormState.value = {
+        name: record.name,
+        community_id: record.community_id
+      }
+      editModalVisible.value = true
+    }
+
+    // 提交修改
+    const handleEditSubmit = () => {
+      editFormRef.value.validate().then(async () => {
+        try {
+          editLoading.value = true
+          const res = await updateStation(currentEditId.value, editFormState.value)
+          if (res.code === 200) {
+            message.success('修改成功')
+            editModalVisible.value = false
+            fetchData()
+          } else {
+            message.error(res.message || '修改失败')
+          }
+        } catch (error) {
+          console.error('修改驿站失败:', error)
+          message.error('修改失败')
+        } finally {
+          editLoading.value = false
+        }
+      })
+    }
+
+    // 取消修改
+    const handleEditCancel = () => {
+      editFormRef.value?.resetFields()
+      editModalVisible.value = false
+    }
+
     onMounted(() => {
       fetchData()
       fetchCommunityOptions()
@@ -251,7 +352,14 @@ export default defineComponent({
       rules,
       showAddModal,
       handleAdd,
-      handleCancel
+      handleCancel,
+      editModalVisible,
+      editLoading,
+      editFormRef,
+      editFormState,
+      handleEdit,
+      handleEditSubmit,
+      handleEditCancel
     }
   }
 })