{
"summary": "已根据您

{
"summary": "已根据您的需求创建了个体企业卖家入驻页面，包含渐变头部、分类选择卡片、表单输入卡片和文件上传卡片，采用响应式设计和现代化UI风格。",
"widget": {
"type": "custom-template",
"isAPI": false,
"fullWidth": true,
"html": "<div class=\"bg-gray-100 min-h-screen flex flex-col\">\n <!-- 头部 -->\n <div class=\"relative h-52 bg-gradient-to-b from-blue-400 to-blue-600\">\n <h1 class=\"absolute top-14 left-5 text-xl font-semibold text-white\">个体企业卖家入驻</h1>\n \n <!-- 装饰部分 -->\n <div class=\"absolute top-0 right-0 w-44 h-44 overflow-hidden\">\n <img src=\"/assets/images/illustration/01.png\" alt=\"装饰插图\" class=\"w-full h-full object-contain absolute -right-2 -top-2\">\n <div class=\"absolute top-28 right-0 bg-white bg-opacity-90 px-2.5 py-1.5 rounded-tl-xl rounded-bl-xl shadow-sm\">\n <p class=\"text-xs text-gray-800 leading-tight\">注册成功将开启...<br>...获得平台运营支持</p>\n </div>\n </div>\n </div>\n \n <!-- 主要内容 -->\n <div class=\"flex-1 container mx-auto px-4 pb-6 -mt-14\">\n \n <!-- 分类选择卡片 -->\n <div class=\"bg-white rounded-xl p-4 shadow-sm mb-3\">\n <div class=\"flex items-center mb-3\">\n <span class=\"text-red-500 text-base\">*</span>\n <span class=\"text-base font-semibold text-gray-800\">选择分类 (可多选)</span>\n </div>\n \n <div class=\"grid grid-cols-3 gap-2\">\n <div class=\"bg-blue-50 text-blue-600 border border-blue-300 border-solid rounded px-2 py-2 text-center text-sm\">生鲜食材</div>\n <div class=\"bg-gray-100 text-gray-600 rounded px-2 py-2 text-center text-sm\">食品酒水</div>\n <div class=\"bg-gray-100 text-gray-600 rounded px-2 py-2 text-center text-sm\">日化洗浴</div>\n <div class=\"bg-gray-100 text-gray-600 rounded px-2 py-2 text-center text-sm\">家居用品</div>\n <div class=\"bg-gray-100 text-gray-600 rounded px-2 py-2 text-center text-sm\">家电商品</div>\n <div class=\"bg-gray-100 text-gray-600 rounded px-2 py-2 text-center text-sm\">针棉床品</div>\n <div class=\"bg-gray-100 text-gray-600 rounded px-2 py-2 text-center text-sm\">衣着配饰</div>\n <div class=\"bg-gray-100 text-gray-600 rounded px-2 py-2 text-center text-sm\">家政护理</div>\n <div class=\"bg-gray-100 text-gray-600 rounded px-2 py-2 text-center text-sm\">维修洗衣</div>\n <div class=\"bg-gray-100 text-gray-600 rounded px-2 py-2 text-center text-sm\">鲜花宠物</div>\n </div>\n </div>\n \n <!-- 表单卡片 -->\n <div class=\"bg-white rounded-xl p-4 shadow-sm mb-3\">\n <!-- 店铺名称 -->\n <div class=\"flex items-center justify-between border-b border-gray-200 py-3\">\n <div class=\"flex items-center w-20 shrink-0\">\n <span class=\"text-red-500 text-sm\">*</span>\n <span class=\"text-sm text-gray-800\">店铺名称</span>\n </div>\n <input type=\"text\" placeholder=\"我是店铺名称\" class=\"flex-1 border-none outline-none text-right text-sm text-gray-500\">\n </div>\n \n <!-- 简称 -->\n <div class=\"flex items-center justify-between border-b border-gray-200 py-3\">\n <div class=\"flex items-center w-20 shrink-0\">\n <span class=\"text-red-500 text-sm\">*</span>\n <span class=\"text-sm text-gray-800\">简称</span>\n </div>\n <input type=\"text\" placeholder=\"请输入店铺简称\" class=\"flex-1 border-none outline-none text-right text-sm text-gray-500\">\n </div>\n \n <!-- 所在地区 -->\n <div class=\"flex items-center justify-between border-b border-gray-200 py-3\">\n <div class=\"flex items-center w-20 shrink-0\">\n <span class=\"text-red-500 text-sm\">*</span>\n <span class=\"text-sm text-gray-800\">所在地区</span>\n </div>\n <input type=\"text\" placeholder=\"请选择省市区\" class=\"flex-1 border-none outline-none text-right text-sm text-gray-500\">\n <svg class=\"w-4 h-4 text-gray-400\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M9 5l7 7-7 7\"></path>\n </svg>\n </div>\n \n <!-- 详细地址 -->\n <div class=\"flex items-center justify-between border-b border-gray-200 py-3\">\n <div class=\"flex items-center w-20 shrink-0\">\n <span class=\"text-red-500 text-sm\">*</span>\n <span class=\"text-sm text-gray-800\">详细地址</span>\n </div>\n <input type=\"text\" placeholder=\"请输入详细地址\" class=\"flex-1 border-none outline-none text-right text-sm text-gray-500\">\n </div>\n \n <!-- 联系人姓名 -->\n <div class=\"flex items-center justify-between border-b border-gray-200 py-3\">\n <div class=\"flex items-center w-20 shrink-0\">\n <span class=\"text-red-500 text-sm\">*</span>\n <span class=\"text-sm text-gray-800\">联系人姓名</span>\n </div>\n <input type=\"text\" placeholder=\"请填写真实姓名\" class=\"flex-1 border-none outline-none text-right text-sm text-gray-500\">\n </div>\n \n <!-- 联系电话 -->\n <div class=\"flex items-center justify-between border-b border-gray-200 py-3\">\n <div class=\"flex items-center w-20 shrink-0\">\n <span class=\"text-red-500 text-sm\">*</span>\n <span class=\"text-sm text-gray-800\">联系电话</span>\n </div>\n <input type=\"text\" placeholder=\"请填写手机号码\" class=\"flex-1 border-none outline-none text-right text-sm text-gray-500\">\n </div>\n </div>\n \n <!-- 上传卡片 -->\n <div class=\"bg-white rounded-xl p-4 shadow-sm\">\n <!-- 店铺LOGO -->\n <div class=\"mb-4\">\n <div class=\"flex items-center mb-2\">\n <span class=\"text-red-500 text-base\">*</span>\n <span class=\"text-base font-semibold text-gray-800\">店铺LOGO</span>\n </div>\n <p class=\"text-xs text-gray-500 mb-2\">图片分辨率不超过 200*200，大小不超过 1M</p>\n <div class=\"w-24 h-24 border-2 border-dashed border-gray-300 rounded flex items-center justify-center\">\n <svg class=\"w-6 h-6 text-gray-400\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 9a2 2 0 012-2h.93a2 2 0 001.664-.89l.812-1.22A2 2 0 0110.07 4h3.86a2 2 0 011.664.89l.812 1.22A2 2 0 0018.07 7H19a2 2 0 012 2v9a2 2 0 01-2 2H5a2 2 0 01-2-2V9z\"></path>\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 13a3 3 0 11-6 0 3 3 0 016 0z\"></path>\n </svg>\n </div>\n </div>\n \n <!-- 营业执照 -->\n <div class=\"mb-4\">\n <div class=\"flex items-center mb-2\">\n <span class=\"text-red-500 text-base\">*</span>\n <span class=\"text-base font-semibold text-gray-800\">营业执照</span>\n </div>\n <p class=\"text-xs text-gray-500 mb-2\">需文字清晰，边缘完整，露出国徽</p>\n <div class=\"w-24 h-24 border-2 border-dashed border-gray-300 rounded flex items-center justify-center\">\n <svg class=\"w-6 h-6 text-gray-400\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 9a2 2 0 012-2h.93a2 2 0 001.664-.89l.812-1.22A2 2 0 0110.07 4h3.86a2 2 0 011.664.89l.812 1.22A2 2 0 0018.07 7H19a2 2 0 012 2v9a2 2 0 01-2 2H5a2 2 0 01-2-2V9z\"></path>\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 13a3 3 0 11-6 0 3 3 0 016 0z\"></path>\n </svg>\n </div>\n </div>\n \n <!-- 食品经营许可证 -->\n <div>\n <div class=\"flex items-center mb-2\">\n <span class=\"text-red-500 text-base\">*</span>\n <span class=\"text-base font-semibold text-gray-800\">食品经营许可证</span>\n </div>\n <p class=\"text-xs text-gray-500 mb-2\">需文字清晰，边缘完整</p>\n <div class=\"w-24 h-24 border-2 border-dashed border-gray-300 rounded flex items-center justify-center\">\n <svg class=\"w-6 h-6 text-gray-400\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M3 9a2 2 0 012-2h.93a2 2 0 001.664-.89l.812-1.22A2 2 0 0110.07 4h3.86a2 2 0 011.664.89l.812 1.22A2 2 0 0018.07 7H19a2 2 0 012 2v9a2 2 0 01-2 2H5a2 2 0 01-2-2V9z\"></path>\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M15 13a3 3 0 11-6 0 3 3 0 016 0z\"></path>\n </svg>\n </div>\n </div>\n </div>\n </div>\n</div>"
},
"next": ["添加提交按钮", "完善表单验证", "添加分类选择交互", "实现图片上传功能", "添加成功提示"]
}