feat: 添加示例语句随机填充功能

src/views/Pronunciation.vue

@@ -9,6 +9,21 @@ const selectedVoice = ref("1");
 const activeCategory = ref("all");
 const isGenerating = ref(false);
 
+// 示例语句列表
+const exampleSentences = [
+  "Hello, how are you today?",
+  "The weather is beautiful today.",
+  "Practice makes perfect.",
+  "Where there is a will, there is a way.",
+  "Knowledge is power.",
+];
+
+// 添加示例语句到文本框
+const addExampleSentence = () => {
+  const randomIndex = Math.floor(Math.random() * exampleSentences.length);
+  textInput.value = exampleSentences[randomIndex];
+};
+
 // 兼容不支持 crypto.randomUUID 的浏览器
 const generateUUID = () => {
   if (typeof crypto.randomUUID === 'function') {
@@ -802,6 +817,25 @@ onUnmounted(() => {
           maxlength="500"
         ></textarea>
 
+        <div class="example-area">
+          <button class="example-btn" @click="addExampleSentence">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              fill="none"
+              viewBox="0 0 24 24"
+              stroke-width="2"
+              stroke="currentColor"
+            >
+              <path
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                d="M9.813 15.904 9 18.75l-.813-2.846a4.5 4.5 0 0 0-3.09-3.09L2.25 12l2.846-.813a4.5 4.5 0 0 0 3.09-3.09L9 5.25l.813 2.846a4.5 4.5 0 0 0 3.09 3.09L15.75 12l-2.846.813a4.5 4.5 0 0 0-3.09 3.09ZM18.259 8.715 18 9.75l-.259-1.035a3.375 3.375 0 0 0-2.455-2.456L14.25 6l1.036-.259a3.375 3.375 0 0 0 2.455-2.456L18 2.25l.259 1.035a3.375 3.375 0 0 0 2.456 2.456L21.75 6l-1.035.259a3.375 3.375 0 0 0-2.456 2.456ZM16.5 19.5 16 21l-.5-1.5-1.5-.5L15 21l.5 1.5 1.5.5Z"
+              />
+            </svg>
+            添加示例语句
+          </button>
+        </div>
+
         <div class="action-area">
           <button
             class="primary-btn"
@@ -1091,6 +1125,37 @@ onUnmounted(() => {
   border-color: var(--accent-1);
 }
 
+.example-area {
+  margin-top: 1rem;
+  display: flex;
+  gap: 0.5rem;
+}
+
+.example-btn {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  background: rgba(255, 255, 255, 0.05);
+  border: 1px solid var(--card-border);
+  color: var(--text-secondary);
+  padding: 0.5rem 1rem;
+  border-radius: 8px;
+  cursor: pointer;
+  font-size: 0.875rem;
+  transition: all 0.2s;
+}
+
+.example-btn:hover {
+  background: rgba(255, 255, 255, 0.1);
+  color: var(--text-primary);
+  border-color: var(--accent-1);
+}
+
+.example-btn svg {
+  width: 16px;
+  height: 16px;
+}
+
 .action-area {
   margin-top: 1.5rem;
   display: flex;