feat(goods): 增加商品可入住日期功能并优化编辑页面

- 在商品编辑页面添加可入住日期选择功能
- 实现日期范围选择和单个日期选择，并支持删除已选日期- 在保存商品信息时将日期数据加入表单
- 优化商品分类选择逻辑，根据分类显示不同字段
- 调整订单列表中下单时间列的宽度

src/views/goods/list/edit.vue

@@ -26,7 +26,7 @@
             </el-form-item>
             <el-form-item label="商品分类" prop="title">
               <div class="w-32vw">
-                <el-select class="w-[100%]" v-model="formData.productCategoryId">
+                <el-select class="w-[100%]" v-model="formData.productCategoryId" @change="handleCategory">
                   <el-option label="全部" value/>
                   <el-option
                       v-for="item in optionsData.goodsCategory"
@@ -123,6 +123,26 @@
                 />
               </div>
             </el-form-item>
+            <el-form-item label="可入住日期" v-if="showDateRange">
+              <div class="w-32vw">
+                <el-date-picker
+                  v-model="selectedDates"
+                  type="dates"
+                  range-separator="至"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  value-format="YYYY-MM-DD"
+                  placeholder="选择一个或多个日期"
+                  style="width: 100%; margin-bottom: 10px"
+                />
+                <div v-if="selectedDates.length > 0" class="selected-dates">
+                  <div class="date-tag" v-for="(date, index) in processedDates" :key="index">
+                    {{ date }}
+                    <el-icon @click="removeDate(date)" style="cursor: pointer; margin-left: 5px;"><Close /></el-icon>
+                  </div>
+                </div>
+              </div>
+            </el-form-item>
           </div>
         </div>
         <el-divider content-position="left"><span style="font-size: 18px">详细信息</span></el-divider>
@@ -140,7 +160,7 @@
             </el-form-item>
             <el-form-item label="商品视频" prop="video">
               <div class="w-32vw">
-                <material-picker v-model="formData.video" :limit="3"/>
+                <material-picker v-model="formData.video" type="video" :limit="1"/>
               </div>
             </el-form-item>
           </div>
@@ -223,6 +243,7 @@ import useMultipleTabs from '@/hooks/useMultipleTabs'
 import Editor from '@/components/editor/index.vue'
 import {goodsCategoryPage} from "@/api/goods/category";
 import {goodsEdit, goodsDetail} from "@/api/goods/list";
+import { Close } from '@element-plus/icons-vue'
 
 const route = useRoute()
 const router = useRouter()
@@ -243,7 +264,8 @@ const formData = reactive<any>({
   image: '',
   mainResourceList: null,
   video: '',
-  detail: ''
+  detail: '',
+  useDates: ''
 })
 const goodsTagOption = [{
   value: '日用品',
@@ -271,26 +293,32 @@ const rules = reactive({
   image: [{required: true, message: '添加商品图片', trigger: 'change'}]
 })
 
-// getDetails 函数修改
-const getDetails = async () => {
-  const data = await goodsDetail({
-    id: route.query.id
-  })
-  Object.keys(formData).forEach((key) => {
-    //@ts-ignore
-    formData[key] = data[key];
-    if (key == 'summary') {
-      formData[key] = Number(formData[key])
-    }
-  })
+const selectedDates = ref<string[]>([])
+const showDateRange = ref(false)
+
+// 计算处理后的所有日期（包括单个日期和日期范围）
+const processedDates = computed(() => {
+  const dates = [...selectedDates.value]
+  return dates.sort()
+})
+
+// 移除日期
+const removeDate = (date: string) => {
+  const index = selectedDates.value.indexOf(date)
+  if (index > -1) {
+    selectedDates.value.splice(index, 1)
+  }
 }
 
+// 在保存时将日期数据加入formData
 const handleSave = async () => {
   await formRef.value?.validate()
 
   const submitData = {
-    ...formData
+    ...formData,
+    availableDates: processedDates.value // 添加可入住日期数据
   }
+
   if(formData.bannerImages){
     submitData.mainResourceList = formData.bannerImages.map((item:any) => {
       return {
@@ -301,6 +329,12 @@ const handleSave = async () => {
   if(formData.tags){
     submitData.tags = formData.tags.join(',')
   }
+  if(selectedDates.value.length > 0){
+    submitData.choseDateState = 1
+    submitData.startDate = selectedDates.value[0]
+    submitData.endDate = selectedDates.value[selectedDates.value.length - 1]
+    submitData.useDates = selectedDates.value.join(',')
+  }
   feedback.msgSuccess('操作成功')
   if (route.query.id) {
     await goodsEdit(submitData)
@@ -312,6 +346,46 @@ const handleSave = async () => {
   router.back()
 }
 
+const handleCategory = (val:any) => {
+  const selectedCategory = optionsData.goodsCategory.find((item: any) => item.id === val);
+  showDateRange.value = false
+  selectedDates.value = []
+  if(selectedCategory && selectedCategory.name === '酒店民宿'){
+    showDateRange.value = true
+  }
+}
+
+// 在获取详情时处理日期数据
+const getDetails = async () => {
+  const data = await goodsDetail({
+    id: route.query.id
+  })
+  Object.keys(formData).forEach((key) => {
+    //@ts-ignore
+    formData[key] = data[key];
+    if (key == 'summary') {
+      formData[key] = Number(formData[key])
+    }
+    if(key === 'video' && !data['video']){
+      formData[key] = ''
+    }
+    if(key === 'mainResourceList' && data['mainResourceList']){
+      formData.bannerImages = data['mainResourceList'].map((item:any) => {
+        return item.resourceUrl
+      })
+    }
+    if(key === 'tags' && data['tags']){
+      formData[key] = data[key].split(',')
+    }
+    console.log(key,data[key])
+    if(key === 'useDates' && data['useDates']){
+      console.log('显示 日期')
+      showDateRange.value = true
+      selectedDates.value = data['useDates'].split(',')
+    }
+  })
+}
+
 route.query.id && getDetails()
 
 </script>
@@ -319,4 +393,21 @@ route.query.id && getDetails()
 .w-32vw {
   width: 32vw;
 }
+
+.selected-dates {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+  margin-top: 10px;
+}
+
+.date-tag {
+  background-color: #ecf5ff;
+  border: 1px solid #d9ecff;
+  border-radius: 4px;
+  padding: 4px 8px;
+  display: flex;
+  align-items: center;
+  font-size: 12px;
+}
 </style>

src/views/orders/list.vue

@@ -102,7 +102,7 @@
                 <el-table-column
                     label="下单时间"
                     prop="checkoutTime"
-                    min-width="120"
+                    min-width="130"
                 ></el-table-column>
                 <el-table-column
                     label="订单号"