update: 修改使用el-descriptions展示详情

src/views/system/sms/smsLog/index.vue

@@ -174,92 +174,70 @@
       @pagination="getList"
     />
     <!-- 短信日志详细 -->
-    <el-dialog title="短信日志详细" v-model="open" width="700px" append-to-body>
-      <el-form ref="formRef" :model="formData" label-width="140px">
-        <el-row>
-          <el-col :span="24">
-            <el-form-item label="日志主键：">{{ formData.id }}</el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="短信渠道：">
-              {{ formatChannelSignature(formData.channelId) }}
-              <dict-tag :type="DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE" :value="formData.channelCode" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="短信模板：">
-              {{ formData.templateId }} | {{ formData.templateCode }}
-              <dict-tag :type="DICT_TYPE.SYSTEM_SMS_TEMPLATE_TYPE" :value="formData.templateType" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="API 的模板编号：">{{ formData.apiTemplateId }}</el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="用户信息："
-              >{{ formData.mobile }}
-              <span v-if="formData.userType && formData.userId">
-                <dict-tag :type="DICT_TYPE.USER_TYPE" :value="formData.userType" />({{
-                  formData.userId
-                }})
-              </span>
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="短信内容：">{{ formData.templateContent }}</el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="短信参数：">{{ formData.templateParams }}</el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="创建时间：">{{ parseTime(formData.createTime) }}</el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="发送状态：">
-              <dict-tag :type="DICT_TYPE.SYSTEM_SMS_SEND_STATUS" :value="formData.sendStatus" />
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="发送时间：">{{ parseTime(formData.sendTime) }}</el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="发送结果："
-              >{{ formData.sendCode }} | {{ formData.sendMsg }}
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="API 发送结果："
-              >{{ formData.apiSendCode }} | {{ formData.apiSendMsg }}</el-form-item
-            >
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="API 短信编号：">{{ formData.apiSerialNo }}</el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="API 请求编号：">{{ formData.apiRequestId }}</el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="接收状态：">
-              <dict-tag
-                :type="DICT_TYPE.SYSTEM_SMS_RECEIVE_STATUS"
-                :value="formData.receiveStatus"
-              />
-            </el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="接收时间：">{{ parseTime(formData.receiveTime) }}</el-form-item>
-          </el-col>
-          <el-col :span="24">
-            <el-form-item label="API 接收结果："
-              >{{ formData.apiReceiveCode }} | {{ formData.apiReceiveMsg }}
-            </el-form-item>
-          </el-col>
-        </el-row>
-      </el-form>
+    <Dialog title="短信日志详情" v-model="open">
+      <el-descriptions border :column="1">
+        <el-descriptions-item label-align="right" width="50px" label="日志主键：">{{
+          formData.id
+        }}</el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="短信渠道：">
+          {{ formatChannelSignature(formData.channelId) }}
+          <dict-tag :type="DICT_TYPE.SYSTEM_SMS_CHANNEL_CODE" :value="formData.channelCode" />
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="短信模板：">
+          {{ formData.templateId }} | {{ formData.templateCode }}
+          <dict-tag :type="DICT_TYPE.SYSTEM_SMS_TEMPLATE_TYPE" :value="formData.templateType" />
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="API 的模板编号：">
+          {{ formData.apiTemplateId }}
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="用户信息：">
+          {{ formData.mobile }}
+          <span v-if="formData.userType && formData.userId">
+            <dict-tag :type="DICT_TYPE.USER_TYPE" :value="formData.userType" />
+            ({{ formData.userId }})
+          </span>
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="短信内容：">
+          {{ formData.templateContent }}
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="短信参数：">
+          {{ formData.templateParams }}
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="创建时间：">
+          {{ parseTime(formData.createTime) }}
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="发送状态：">
+          <dict-tag :type="DICT_TYPE.SYSTEM_SMS_SEND_STATUS" :value="formData.sendStatus" />
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="发送时间：">
+          {{ parseTime(formData.sendTime) }}
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="发送结果：">
+          {{ formData.sendCode }} | {{ formData.sendMsg }}
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="API 发送结果：">
+          {{ formData.apiSendCode }} | {{ formData.apiSendMsg }}
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="API 短信编号：">
+          {{ formData.apiSerialNo }}
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="API 请求编号：">
+          {{ formData.apiRequestId }}
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="接收状态：">
+          <dict-tag :type="DICT_TYPE.SYSTEM_SMS_RECEIVE_STATUS" :value="formData.receiveStatus" />
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="接收时间：">
+          {{ parseTime(formData.receiveTime) }}
+        </el-descriptions-item>
+        <el-descriptions-item label-align="right" width="50px" label="API 接收结果：">
+          {{ formData.apiReceiveCode }} | {{ formData.apiReceiveMsg }}
+        </el-descriptions-item>
+      </el-descriptions>
       <template #footer>
         <el-button @click="open = false">关 闭</el-button>
       </template>
-    </el-dialog>
+    </Dialog>
   </content-wrap>
 </template>
 <script setup lang="ts" name="smsLog">