diff --git a/src/views/Design/components/Questions/MartrixQuestion.vue b/src/views/Design/components/Questions/MartrixQuestion.vue
index 8d99461..90b2550 100644
--- a/src/views/Design/components/Questions/MartrixQuestion.vue
+++ b/src/views/Design/components/Questions/MartrixQuestion.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { /* useTemplateRef, */ ref, computed, type Component } from 'vue';
+import { type Component, computed, defineModel } from 'vue';
 import MatrixCheckbox from '@/views/Design/components/Questions/MatrixCheckbox.vue';
 import MatrixText from '@/views/Design/components/Questions/MatrixText.vue';
 import MatrixRadio from '@/views/Design/components/Questions/MatrixRadio.vue';
@@ -10,6 +10,9 @@ const question = defineModel<question>('element', {
     return {};
   }
 });
+const rowRecord = defineModel<unknown[]>('rowRecord', { required: false, default: () => [] });
+const isPreview = defineModel<boolean>('isPreview', { required: false, default: false });
+
 // eslint-disable-next-line
 const activeComponent = computed<Component>(() => {
   switch (question.value.question_type) {
@@ -24,16 +27,19 @@ const activeComponent = computed<Component>(() => {
 
 if (question.value?.list) question.value.options = question.value?.list;
 // 行标签
-const rows = ref(question.value?.options[0] ?? []);
+const rows = defineModel<questionOptionType[]>('rows', { required: false, default: () => [] });
+rows.value.length < 1 && (rows.value = question.value?.options[0] ?? []);
 // 列标签
-const cols = ref(question.value?.options[1] ?? []);
+const cols = defineModel<questionOptionType[]>('cols', { required: false, default: () => [] });
+cols.value.length < 1 && (cols.value = question.value?.options[1] ?? []);
 
 // console.log(rows.value, cols.value);
 // const columnLabels = useTemplateRef<HTMLElement[]>('columnLabels');
 
 // 注意, element.options 里面的东西是数组，第一项内容是行标签内容，第二项内容是列标签内容
 // 类型 AI 生成 切勿盲目相信，以实际为准
-/* const props = */ defineProps<{
+/* const props = */
+defineProps<{
   index: number;
   active: boolean;
 }>();
@@ -62,54 +68,16 @@ const emitValue = () => {
     </template>
 
     <template #input>
-      <!--      <div style="width: 1000px; overflow: scroll">-->
-      <Component :is="activeComponent" v-model:rows="rows" v-model:cols="cols" />
-      <!--      </div>-->
+      <Component
+        :is="activeComponent"
+        v-model:rowRecord="rowRecord"
+        v-model:element="question"
+        v-model:rows="rows"
+        v-model:cols="cols"
+        :isPreview="isPreview"
+        style="overflow: scroll; width: 88vw"
+      />
     </template>
-    <!-- 使用 label 插槽来自定义标题 -->
-    <!--    <template #input>-->
-    <!--      <table class="matrix-table">-->
-    <!--        <thead>-->
-    <!--          <tr>-->
-    <!--            &lt;!&ndash; 第一行内容为空 &ndash;&gt;-->
-    <!--            <th></th>-->
-    <!--            &lt;!&ndash; 第二行内容开始填充 &ndash;&gt;-->
-    <!--            <td v-for="col in element.options[1]" :key="col.option" ref="columnLabels">-->
-    <!--              <contenteditable-->
-    <!--                v-model="col.option"-->
-    <!--                :active="active"-->
-    <!--                @blur="emitValue"-->
-    <!--              ></contenteditable>-->
-    <!--            </td>-->
-    <!--          </tr>-->
-    <!--        </thead>-->
-    <!--        <tbody>-->
-    <!--          <tr v-for="row in element.options[0]" :key="row.option">-->
-    <!--            &lt;!&ndash; 编辑状态，单次点击出输入框，失焦后关闭 &ndash;&gt;-->
-    <!--            <td>-->
-    <!--              <contenteditable-->
-    <!--                v-model="row.option"-->
-    <!--                :active="active"-->
-    <!--                @blur="emitValue"-->
-    <!--              ></contenteditable>-->
-    <!--            </td>-->
-    <!--            <td v-for="col in element.options[1]" :key="col.option" class="td-input">-->
-    <!--              &lt;!&ndash; 编辑状态，单次点击出输入框，失焦后关闭 &ndash;&gt;-->
-    <!--              <input :id="col.option" :type="tableInputTypeMapping()" :name="row.option" />-->
-    <!--            </td>-->
-
-    <!--            <td v-if="element.config.is_limit_right_content === 1">-->
-    <!--              <contenteditable-->
-    <!--                v-model="row.option_config.limit_right_content"-->
-    <!--                :active="active"-->
-    <!--                @blur="emitValue"-->
-    <!--              >-->
-    <!--              </contenteditable>-->
-    <!--            </td>-->
-    <!--          </tr>-->
-    <!--        </tbody>-->
-    <!--      </table>-->
-    <!--    </template>-->
   </van-field>
 </template>
 <style lang="scss" scoped>
diff --git a/src/views/Design/components/Questions/MatrixRadio.vue b/src/views/Design/components/Questions/MatrixRadio.vue
index 94d0934..d241b32 100644
--- a/src/views/Design/components/Questions/MatrixRadio.vue
+++ b/src/views/Design/components/Questions/MatrixRadio.vue
@@ -1,58 +1,82 @@
 <template>
-  <table class="matrix-table">
-    <thead>
-      <tr>
-        <th></th>
-        <th v-for="col in cols" :key="col.option">
-          <contenteditable v-model="col.option" :active="active" @blur="emitValue" />
-          <!-- 编辑状态，单次点击出输入框，失焦后关闭 -->
-          <!--          <input-->
-          <!--            v-if="col.editor"-->
-          <!--            v-model="col.option"-->
-          <!--            v-focus-->
-          <!--            type="text"-->
-          <!--            @focusout="col.editor = false"-->
-          <!--            @click="handleRowNameChange(col.option!)"-->
-          <!--          />-->
-          <!--          <span v-else @click="handleRowNameChange(col.option!)" v-html="col.option"></span>-->
-        </th>
-      </tr>
-    </thead>
-    <tbody>
-      <tr v-for="(row, rowIndex) in rows" :key="rowIndex">
-        <contenteditable v-model="row.option" :active="active" @blur="emitValue" />
-        <td v-for="(col, colIndex) in cols" :key="colIndex">
-          <input
-            type="radio"
-            class="van-icon matrix-radio"
-            :name="`R${rowIndex + 1}`"
-            :value="`${rowIndex + 1}_${colIndex + 1}`"
-            :checked="isOptionChecked(rowIndex, colIndex)"
-            @change="handleMatrixRadioChange(rowIndex, colIndex)"
-          />
-        </td>
-      </tr>
-    </tbody>
-  </table>
+  <!--  <table class="matrix-table">-->
+  <!--    <thead>-->
+  <!--      <tr>-->
+  <!--        <th></th>-->
+  <!--        <th v-for="col in cols" :key="col.option">-->
+  <!--          <contenteditable-->
+  <!--            v-if="col.option"-->
+  <!--            v-model="col.option"-->
+  <!--            :active="active"-->
+  <!--            @blur="emitValue"-->
+  <!--          />-->
+  <!--          <van-field v-else placeholder="请输入" v-model="col.option" v-focus />-->
+  <!--        </th>-->
+  <!--      </tr>-->
+  <!--    </thead>-->
+  <!--    <tbody>-->
+  <!--      <tr v-for="(row, rowIndex) in rows" :key="rowIndex">-->
+  <!--        <contenteditable v-model="row.option" :active="active" @blur="emitValue" />-->
+  <!--        <td v-for="(col, colIndex) in cols" :key="colIndex">-->
+  <!--          <input-->
+  <!--            type="radio"-->
+  <!--            class="van-icon matrix-radio"-->
+  <!--            :name="`R${rowIndex + 1}`"-->
+  <!--            :value="`${rowIndex + 1}_${colIndex + 1}`"-->
+  <!--            :checked="isOptionChecked(rowIndex, colIndex)"-->
+  <!--            @change="handleMatrixRadioChange(rowIndex, colIndex)"-->
+  <!--          />-->
+  <!--        </td>-->
+  <!--      </tr>-->
+  <!--    </tbody>-->
+  <!--  </table>-->
+  <el-table :data="rows" style="width: 100%">
+    <el-table-column width="140">
+      <template #header></template>
+      <template #default="{ row /*, column, $index*/ }"> <div v-html="row.option"></div></template>
+    </el-table-column>
+    <el-table-column v-for="(col, colIndex) in cols" :key="col.option" width="100">
+      <template #header>
+        <contenteditable
+          v-if="col.option"
+          v-model="col.option"
+          :active="active"
+          @blur="emitValue"
+        />
+        <van-field v-else v-model="col.option" placeholder="请输入"></van-field>
+      </template>
+      <template #default="{ /*row, column, */ $index: rowIndex }">
+        <input
+          type="radio"
+          :name="`R${rowIndex + 1}`"
+          :checked="isOptionChecked(rowIndex, colIndex)"
+          @change="handleMatrixRadioChange(rowIndex, colIndex)"
+        />
+      </template>
+    </el-table-column>
+  </el-table>
 </template>
 
 <script setup lang="ts">
-// import { defineProps } from 'vue';
-// import { vFocus } from '@/utils/directives/useVFocus';
-
 // 记录行和列的索引
+// import { getDomText } from '@/utils/utils';
+
 const rowRecord = defineModel<number[]>('rowRecord', { required: false, default: () => [] });
-// const matrixAnswer = defineModel<{ [key: string]: 1 }>('matrixAnswer', { required: false, default: () => ({}) });
 // 检查 rowRecord 是否存在
 // console.log(`rowRecord:`, rowRecord.value);
 
 /* const isPreview =  */ defineModel<boolean>('isPreview', { required: false, default: false });
 
-const rows = defineModel<number[]>('rows', { required: false, default: () => [] });
-const cols = defineModel<number[]>('cols', { required: false, default: () => [] });
-const active = defineModel<boolean>('active', { required: false, default: true });
-// console.log(rows.value, cols.value);
-// const emits = defineEmits(['update:matrixAnswer', 'update:rowRecord']);
+const rows = defineModel<questionOptionType[]>('rows', { required: false, default: () => [] });
+const cols = defineModel<questionOptionType[]>('cols', { required: false, default: () => [] });
+/* const active = */ defineModel<boolean>('active', { required: false, default: true });
+const element = defineModel<question>('element', {
+  required: false,
+  default: () => {
+    /**/
+  }
+});
+const emit = defineEmits(['update:matrixAnswer', 'update:rowRecord', 'update:element']);
 
 // 判断是否选中
 const isOptionChecked = (rowIndex: number, colIndex: number): boolean => {
@@ -93,7 +117,8 @@ function handleMatrixRadioChange(row: number, col: number) {
 // emits('update:matrixAnswer', props.matrixAnswer);
 // emits('update:rowRecord', props.rowRecord);
 // };
-const emitValue = () => {
+const emitValue = (val: unknown) => {
+  console.log(val);
   emit('update:element', element.value);
 };
 </script>
diff --git a/src/views/Design/components/Questions/MatrixText.vue b/src/views/Design/components/Questions/MatrixText.vue
index 96cfb6b..5fd142a 100644
--- a/src/views/Design/components/Questions/MatrixText.vue
+++ b/src/views/Design/components/Questions/MatrixText.vue
@@ -46,10 +46,10 @@ const rowRecord = defineModel<string[][]>('rowRecord', { required: false, defaul
 const active = defineModel<boolean>('active', { required: false, default: true });
 
 /* const isPreview =  */ defineModel<boolean>('isPreview', { required: false, default: false });
-const rows = defineModel<number[]>('rows', { required: false, default: () => [] });
-const cols = defineModel<number[]>('cols', { required: false, default: () => [] });
+const rows = defineModel<questionOptionType[]>('rows', { required: false, default: () => [] });
+const cols = defineModel<questionOptionType[]>('cols', { required: false, default: () => [] });
 
-// const emits = defineEmits(['update:matrixAnswer', 'update:rowRecord']);
+const emit = defineEmits(['update:matrixAnswer', 'update:rowRecord', 'update:element']);
 
 // const handleRowNameChange = (/* value: string */) => {
 // console.log(`row change: ${value}`);
@@ -94,6 +94,9 @@ function handleMatrixTextChange(row: number, col: number, e: Event) {
 // emits('update:matrixAnswer', props.matrixAnswer);
 // emits('update:rowRecord', props.rowRecord);
 // };
+const emitValue = () => {
+  emit('update:element', element.value);
+};
 </script>
 
 <style scoped lang="scss">
diff --git a/src/views/Design/components/Questions/types/question.d.ts b/src/views/Design/components/Questions/types/question.d.ts
index 860a635..55de005 100644
--- a/src/views/Design/components/Questions/types/question.d.ts
+++ b/src/views/Design/components/Questions/types/question.d.ts
@@ -11,7 +11,7 @@ interface OptionConfigType {
   limit_right_content?: string;
 }
 
-interface OptionType {
+interface questionOptionType {
   // 包含 HTML 标签的字符串，例如 "<p>选项1</p>"
   option?: string;
   is_other?: number;
@@ -34,7 +34,7 @@ type questionsList = {
   relation_last_scope: number;
   relation_first_scope: number;
   relation_question_index: number;
-  options?: OptionType[];
+  options?: questionOptionType[];
 };
 
 type question = {
diff --git a/src/views/Survey/views/Preview/Index.vue b/src/views/Survey/views/Preview/Index.vue
index f835479..eb895a4 100644
--- a/src/views/Survey/views/Preview/Index.vue
+++ b/src/views/Survey/views/Preview/Index.vue
@@ -183,6 +183,7 @@
           v-else-if="question.question_type === 8"
           v-model:answer="question.answer"
           :list="question.list"
+          :questionIndex="question.question_index"
           :config="question.config"
           :stem="question.stem"
           :question="question"
@@ -195,6 +196,7 @@
           v-else-if="question.question_type === 9"
           v-model:answer="question.answer"
           :list="question.list"
+          :questionIndex="question.question_index"
           :config="question.config"
           :stem="question.stem"
           :answerSn="questionsData.answer.sn"
@@ -669,9 +671,9 @@ async function answer(callback, callbackBeforePage) {
           question.error = translatedText.value.ThisIsARequiredQuestion;
         }
       } else if (
-        answer &&
-        questionType === 1 &&
-        Object.keys(answer).findIndex((value) => !answer[value]) !== -1
+        answer
+        && questionType === 1
+        && Object.keys(answer).findIndex((value) => !answer[value]) !== -1
       ) {
         // 单选题
         isError = true;
@@ -846,52 +848,52 @@ async function answer(callback, callbackBeforePage) {
         const { value } = answer;
         const newValue = value.replace(/\n|\r|\r\n/g, '');
         switch (config.text_type) {
-          // 字母
-          case 3:
-            // eslint-disable-next-line
+        // 字母
+        case 3:
+          // eslint-disable-next-line
             const reg =
               /^[a-zA-Z·~！@#￥%…&*（）—\-+={}|《》？：“”【】、；‘’，。`!$^()_<>?:",./;'\\[\]]+$/;
-            isError =
-              config.include_mark === 1
-                ? !reg.test(newValue) || !newValue.length
-                : !/^[a-zA-Z]+$/.test(newValue) || !newValue.length;
-            question.error = isError ? translatedText.value.PleaseEnterEnglishLetters : '';
-            break;
+          isError
+              = config.include_mark === 1
+              ? !reg.test(newValue) || !newValue.length
+              : !/^[a-zA-Z]+$/.test(newValue) || !newValue.length;
+          question.error = isError ? translatedText.value.PleaseEnterEnglishLetters : '';
+          break;
           // 中文
-          case 4:
-            isError =
-              config.include_mark === 1
-                ? !/^(?:[\u3400-\u4DB5\u4E00-\u9FEA\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0]|[a-zA-Z·~！@#￥%…&*（）—\-+={}|《》？：“”【】、；‘’，。`!$^()_<>?:",./;'\\[\]])+$/.test(
-                    newValue
-                  ) || !newValue.length
-                : !/^(?:[\u3400-\u4DB5\u4E00-\u9FEA\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0])+$/.test(
-                    newValue
-                  ) || !newValue.length;
-            question.error = isError ? translatedText.value.PleaseEnterChineseWords : '';
-            break;
+        case 4:
+          isError
+              = config.include_mark === 1
+              ? !/^(?:[\u3400-\u4DB5\u4E00-\u9FEA\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0]|[a-zA-Z·~！@#￥%…&*（）—\-+={}|《》？：“”【】、；‘’，。`!$^()_<>?:",./;'\\[\]])+$/.test(
+                newValue
+              ) || !newValue.length
+              : !/^(?:[\u3400-\u4DB5\u4E00-\u9FEA\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0])+$/.test(
+                newValue
+              ) || !newValue.length;
+          question.error = isError ? translatedText.value.PleaseEnterChineseWords : '';
+          break;
           // 邮箱
-          case 5:
-            isError =
-              !/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3})|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
-                value
-              );
-            question.error = isError ? translatedText.value.PleaseEnterACorrectEmail : '';
-            break;
+        case 5:
+          isError
+              = !/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3})|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
+              value
+            );
+          question.error = isError ? translatedText.value.PleaseEnterACorrectEmail : '';
+          break;
           // 手机号
-          case 6:
-            isError = !/^(?:(?:\+|00)86)?1[3-9]\d{9}$/.test(value);
-            question.error = isError ? translatedText.value.PleaseEnterACorrectPhone : '';
-            break;
+        case 6:
+          isError = !/^(?:(?:\+|00)86)?1[3-9]\d{9}$/.test(value);
+          question.error = isError ? translatedText.value.PleaseEnterACorrectPhone : '';
+          break;
           // 身份证号
-          case 7:
-            isError =
-              !/^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\d|30|31)\d{3}[\dXx]$/.test(
-                value
-              );
-            question.error = isError ? translatedText.value.PleaseEnterACorrectID : '';
-            break;
-          default:
-            break;
+        case 7:
+          isError
+              = !/^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\d|30|31)\d{3}[\dXx]$/.test(
+              value
+            );
+          question.error = isError ? translatedText.value.PleaseEnterACorrectID : '';
+          break;
+        default:
+          break;
         }
         if (!isError && value.length < config.min && ![1, 2].includes(config.text_type)) {
           isError = true;
@@ -903,54 +905,54 @@ async function answer(callback, callbackBeforePage) {
         Object.keys(answer).forEach((key) => {
           const value = answer[key];
           switch (config.text_type) {
-            // 字母
-            case 3:
-              if (
-                !/^[a-zA-Z·~！@#￥%…&*（）—\-+={}|《》？：“”【】、；‘’，。`!$^()_<>?:",./;'\\[\]]+$/.test(
-                  value
-                )
-              ) {
-                question.error = translatedText.value.PleaseEnterEnglishLetters;
-              }
-              break;
+          // 字母
+          case 3:
+            if (
+              !/^[a-zA-Z·~！@#￥%…&*（）—\-+={}|《》？：“”【】、；‘’，。`!$^()_<>?:",./;'\\[\]]+$/.test(
+                value
+              )
+            ) {
+              question.error = translatedText.value.PleaseEnterEnglishLetters;
+            }
+            break;
             // 中文
-            case 4:
-              if (
-                !/^(?:[\u3400-\u4DB5\u4E00-\u9FEA\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0]|[·~！@#￥%…&*（）—\-+={}|《》？：“”【】、；‘’，。`!$^()_<>?:",./;'\\[\]])+$/.test(
-                  value
-                )
-              ) {
-                question.error = translatedText.value.PleaseEnterChineseWords;
-              }
-              break;
+          case 4:
+            if (
+              !/^(?:[\u3400-\u4DB5\u4E00-\u9FEA\uFA0E\uFA0F\uFA11\uFA13\uFA14\uFA1F\uFA21\uFA23\uFA24\uFA27-\uFA29]|[\uD840-\uD868\uD86A-\uD86C\uD86F-\uD872\uD874-\uD879][\uDC00-\uDFFF]|\uD869[\uDC00-\uDED6\uDF00-\uDFFF]|\uD86D[\uDC00-\uDF34\uDF40-\uDFFF]|\uD86E[\uDC00-\uDC1D\uDC20-\uDFFF]|\uD873[\uDC00-\uDEA1\uDEB0-\uDFFF]|\uD87A[\uDC00-\uDFE0]|[·~！@#￥%…&*（）—\-+={}|《》？：“”【】、；‘’，。`!$^()_<>?:",./;'\\[\]])+$/.test(
+                value
+              )
+            ) {
+              question.error = translatedText.value.PleaseEnterChineseWords;
+            }
+            break;
             // 邮箱
-            case 5:
-              if (
-                !/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
-                  value
-                )
-              ) {
-                question.error = translatedText.value.PleaseEnterACorrectEmail;
-              }
-              break;
+          case 5:
+            if (
+              !/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test(
+                value
+              )
+            ) {
+              question.error = translatedText.value.PleaseEnterACorrectEmail;
+            }
+            break;
             // 手机号
-            case 6:
-              if (!/^(?:(?:\+|00)86)?1[3-9]\d{9}$/.test(value)) {
-                question.error = translatedText.value.PleaseEnterACorrectPhone;
-              }
-              break;
+          case 6:
+            if (!/^(?:(?:\+|00)86)?1[3-9]\d{9}$/.test(value)) {
+              question.error = translatedText.value.PleaseEnterACorrectPhone;
+            }
+            break;
             // 身份证号
-            case 7:
-              if (
-                !/^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\d|30|31)\d{3}[\dXx]$/.test(
-                  value
-                )
-              ) {
-                question.error = translatedText.value.PleaseEnterACorrectID;
-              }
-              break;
-            default:
-              break;
+          case 7:
+            if (
+              !/^[1-9]\d{5}(?:18|19|20)\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\d|30|31)\d{3}[\dXx]$/.test(
+                value
+              )
+            ) {
+              question.error = translatedText.value.PleaseEnterACorrectID;
+            }
+            break;
+          default:
+            break;
           }
           if (!question.error && value.length < config.min && ![1, 2].includes(config.text_type)) {
             question.error = translatedText.value.PleaseEnterMoreThanOneCharacters(config.min);
@@ -1027,14 +1029,14 @@ async function answer(callback, callbackBeforePage) {
               currentQuestions.forEach((question, index) => {
                 if (index >= warnStart && index < warnEnd) {
                   if (repeat.repeat_type) {
-                    question.warning =
-                      translatedText.value.TheAnswerIsRepeatedMoreThanOneTimesPleaseRevise(
+                    question.warning
+                      = translatedText.value.TheAnswerIsRepeatedMoreThanOneTimesPleaseRevise(
                         repeat.allow_repeat_num,
                         repeat.repeat_type
                       );
                   } else {
-                    question.error =
-                      translatedText.value.TheAnswerIsRepeatedMoreThanOneTimesPleaseRevise(
+                    question.error
+                      = translatedText.value.TheAnswerIsRepeatedMoreThanOneTimesPleaseRevise(
                         repeat.allow_repeat_num,
                         repeat.repeat_type
                       );
@@ -1381,8 +1383,8 @@ function updateAnswer(auto) {
       const evt1 = {};
 
       if ([1].includes(question.question_type)) {
-        evt1.value =
-          Object.keys(question.answer)
+        evt1.value
+          = Object.keys(question.answer)
             .map((key) => (question.answer[key] ? key : undefined))
             .filter((i) => !!i)?.[0] || undefined;
         evt1.options = question.list.flatMap((i) => i.options);
diff --git a/src/views/Survey/views/Preview/components/questions/PreviewMatrixRadio.vue b/src/views/Survey/views/Preview/components/questions/PreviewMatrixRadio.vue
index 2373cde..ee285b3 100644
--- a/src/views/Survey/views/Preview/components/questions/PreviewMatrixRadio.vue
+++ b/src/views/Survey/views/Preview/components/questions/PreviewMatrixRadio.vue
@@ -1,16 +1,19 @@
 <template>
-  <matrix-radio
+  <MartrixQuestion
     v-model:rowRecord="rowRecord"
-    v-model:matrix-radio-answer="answer!"
     :rows="rows"
     :cols="cols"
+    :index="questionIndex"
+    :element="question"
     :is-preview="true"
-  ></matrix-radio>
+    :active="false"
+  />
 </template>
 
 <script setup lang="ts">
-import matrixRadio from '@/views/Design/components/Questions/MatrixRadio.vue';
 import { computed, ref, watch } from 'vue';
+
+import MartrixQuestion from '@/views/Design/components/Questions/MartrixQuestion.vue';
 // const questionType = defineModel<number>('questionType', { required: false });
 
 // 矩阵单选的答案类型
@@ -23,6 +26,8 @@ type answerType = {
 // const list = defineModel<questionsList[]>('list', { required: false });
 // const config = defineModel<OptionConfigType>('config', { required: false });
 const question = defineModel<question>('question');
+const questionIndex = defineModel<number>('questionIndex', { required: false, default: 0 });
+// console.log(question.value);
 const emit = defineEmits(['changeAnswer', 'previous', 'next']);
 // 示例
 // {