Parcourir la source

✨ feat(carousel): 优化轮播图组件并启用首页广告轮播

- 调整轮播图图片容器样式,使用flex布局实现图片居中显示
- 修改图片宽度为自适应,保持高度不变,避免图片拉伸变形
- 首页恢复使用Carousel组件展示广告轮播,替代原生Swiper实现

✨ feat(goods): 新增商品简介输入功能

- 在商品管理组件中添加商品简介文本框
- 支持在商品编辑表单中输入和修改商品简介信息
- 同步更新两个商品管理UI包的表单配置
yourname il y a 1 mois
Parent
commit
b6a2bbeee8

+ 2 - 2
mini/src/components/ui/carousel.tsx

@@ -170,13 +170,13 @@ export function Carousel({
         {items.map((item, index) => (
           <SwiperItem key={index} className="w-full h-full">
             <View
-              className="w-full h-full relative"
+              className="w-full h-full flex items-center justify-center"
               onClick={() => handleItemClick(item, index)}
             >
               <Image
                 src={item.src}
                 mode={imageMode}
-                className="w-full h-full"
+                className="w-auto h-full"
                 lazyLoad
                 showLoading
                 showError

+ 12 - 36
mini/src/pages/index/index.tsx

@@ -238,42 +238,18 @@ const HomePage: React.FC = () => {
                 <Text className="error-text">广告加载失败</Text>
               </View>
             ) : finalImgSrcs && finalImgSrcs.length > 0 ? (
-
-              <Swiper
-              className="w-full"
-              style={{ height: '800rpx', width: '100%' }}
-              autoplay={true}
-              circular={true}
-              indicatorDots={true}
-              indicatorColor="rgba(0, 0, 0, .3)"
-              indicatorActiveColor="#000"
-            >
-              {finalImgSrcs.filter(item => item.imageFile?.fullUrl).map((item, index) => (
-                <SwiperItem key={index} className="w-full h-full">
-                  <View className="w-full h-full flex items-center justify-center bg-gray-100">
-                    <Image
-                      src={item.imageFile!.fullUrl}
-                      mode="heightFix"
-                      style={{ height: '800rpx', width: 'auto' }}
-                      lazyLoad
-                    />
-                  </View>
-                </SwiperItem>
-              ))}
-            </Swiper>
-
-              // <Carousel
-              //   items={finalImgSrcs.filter(item => item.imageFile?.fullUrl).map(item => ({
-              //     src: item.imageFile!.fullUrl,
-              //     title: item.title || '',
-              //     description: item.description || ''
-              //   }))}
-              //   height={800}
-              //   autoplay={true}
-              //   interval={4000}
-              //   circular={true}
-              //   imageMode="heightFix"
-              // />
+              <Carousel
+                items={finalImgSrcs.filter(item => item.imageFile?.fullUrl).map(item => ({
+                  src: item.imageFile!.fullUrl,
+                  title: item.title || '',
+                  description: item.description || ''
+                }))}
+                height={800}
+                autoplay={true}
+                interval={4000}
+                circular={true}
+                imageMode="heightFix"
+              />
             ) : (
               <View className="empty-container">
                 <Text className="empty-text">暂无广告</Text>

+ 18 - 0
packages/goods-management-ui-mt/src/components/GoodsManagement.tsx

@@ -743,6 +743,24 @@ export const GoodsManagement: React.FC = () => {
                     </FormItem>
                   )}
                 />
+                
+                <FormField
+                  control={updateForm.control}
+                  name="instructions"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>商品简介</FormLabel>
+                      <FormControl>
+                        <Textarea
+                          placeholder="请输入商品简介"
+                          className="resize-none"
+                          {...field}
+                        />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
 
                 <DialogFooter>
                   <Button

+ 19 - 0
packages/goods-management-ui/src/components/GoodsManagement.tsx

@@ -744,6 +744,25 @@ export const GoodsManagement: React.FC = () => {
                   )}
                 />
 
+                
+                <FormField
+                  control={updateForm.control}
+                  name="instructions"
+                  render={({ field }) => (
+                    <FormItem>
+                      <FormLabel>商品简介</FormLabel>
+                      <FormControl>
+                        <Textarea
+                          placeholder="请输入商品简介"
+                          className="resize-none"
+                          {...field}
+                        />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  )}
+                />
+
                 <DialogFooter>
                   <Button
                     type="button"