Add team and project selection to Create Short URL form, including validation for required fields and domain input.

app/create-shorturl/page.tsx

@@ -5,6 +5,8 @@ import { useRouter } from 'next/navigation';
 import { useAuth } from '@/lib/auth';
 import { ProtectedRoute } from '@/lib/auth';
 import { limqRequest } from '@/lib/api';
+import { TeamSelector } from '@/app/components/ui/TeamSelector';
+import { ProjectSelector } from '@/app/components/ui/ProjectSelector';
 
 interface ShortUrlData {
   originalUrl: string;
@@ -12,6 +14,9 @@ interface ShortUrlData {
   title: string;
   description?: string;
   tags?: string[];
+  teamId: string;
+  projectId: string;
+  domain: string;
 }
 
 export default function CreateShortUrlPage() {
@@ -32,6 +37,9 @@ function CreateShortUrlForm() {
     title: '',
     description: '',
     tags: [],
+    teamId: '',
+    projectId: '',
+    domain: 'googleads.link',
   });
   
   const [tagInput, setTagInput] = useState('');
@@ -94,6 +102,18 @@ function CreateShortUrlForm() {
         throw new Error('标题是必填项');
       }
       
+      if (!formData.teamId) {
+        throw new Error('团队是必填项');
+      }
+      
+      if (!formData.projectId) {
+        throw new Error('项目是必填项');
+      }
+      
+      if (!formData.domain) {
+        throw new Error('域名是必填项');
+      }
+      
       // 按照API要求构建请求数据
       const requestData = {
         type: "shorturl",
@@ -106,11 +126,11 @@ function CreateShortUrlForm() {
           slug: formData.customSlug || undefined,
           title: formData.title,
           name: formData.title,
-          description: formData.description || ""
+          description: formData.description || "",
+          domain: formData.domain
         },
-        // 如果有team或project ID也可以添加
-        // teamId: "your-team-id",
-        // projectId: "your-project-id",
+        teamId: formData.teamId,
+        projectId: formData.projectId,
         tagIds: formData.tags && formData.tags.length > 0 ? formData.tags : undefined
       };
       
@@ -217,7 +237,7 @@ function CreateShortUrlForm() {
             </label>
             <div className="flex mt-1 rounded-md shadow-sm">
               <span className="inline-flex items-center px-3 py-2 text-sm text-gray-500 border border-r-0 border-gray-300 rounded-l-md bg-gray-50">
-                shorturl.com/
+                {formData.domain}/
               </span>
               <input
                 type="text"
@@ -234,6 +254,62 @@ function CreateShortUrlForm() {
             </p>
           </div>
           
+          {/* 域名 */}
+          <div>
+            <label htmlFor="domain" className="block text-sm font-medium text-gray-700">
+              域名 <span className="text-red-500">*</span>
+            </label>
+            <input
+              type="text"
+              id="domain"
+              name="domain"
+              value={formData.domain}
+              onChange={handleChange}
+              placeholder="例如：googleads.link"
+              className="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm"
+              required
+            />
+          </div>
+          
+          {/* 团队选择 */}
+          <div>
+            <label htmlFor="teamId" className="block text-sm font-medium text-gray-700">
+              团队 <span className="text-red-500">*</span>
+            </label>
+            <div className="mt-1">
+              <TeamSelector 
+                value={formData.teamId}
+                onChange={(teamId) => {
+                  setFormData(prev => ({
+                    ...prev,
+                    teamId: teamId as string,
+                    // 当团队变更时清除已选项目
+                    projectId: ''
+                  }));
+                }}
+              />
+            </div>
+          </div>
+
+          {/* 项目选择 */}
+          <div>
+            <label htmlFor="projectId" className="block text-sm font-medium text-gray-700">
+              项目 <span className="text-red-500">*</span>
+            </label>
+            <div className="mt-1">
+              <ProjectSelector 
+                teamId={formData.teamId}
+                value={formData.projectId}
+                onChange={(projectId) => {
+                  setFormData(prev => ({
+                    ...prev,
+                    projectId: projectId as string
+                  }));
+                }}
+              />
+            </div>
+          </div>
+          
           {/* 描述 */}
           <div>
             <label htmlFor="description" className="block text-sm font-medium text-gray-700">