日志

src/views/News/index.vue

@@ -32,18 +32,38 @@
       </div>
     </div>
     <Menu/>
+    <el-dialog title="消息详情" :column="2" :close-on-click-modal="false" :visible.sync="dialogVisible" width="1000px">
+      <el-descriptions  size="medium" border>
+        <el-descriptions-item>
+          <template slot="label">发件人</template>zgj@ichunt.com
+        </el-descriptions-item>
+        <el-descriptions-item>
+          <template slot="label">收件人 </template>tl@ichunt.com
+        </el-descriptions-item>
+        <el-descriptions-item>
+          <template slot="label">时间 </template>2022-07-04
+        </el-descriptions-item>
+        <el-descriptions-item>
+          <template slot="label">大小 </template>998B
+        </el-descriptions-item>
+        <el-descriptions-item>
+          <template slot="label">附件 </template>XXX说明文档 （668 KB）
+        </el-descriptions-item>
+      </el-descriptions>
+      <p style="margin-top: 10px;">青春是一个短暂的美梦, 当你醒来时, 它早已消失无踪,少量的邪恶足以抵消全部高贵的品质, 害得人声名狼藉,头上一片晴天，心中一个想念，为了无法计算的价值，饿了别叫妈, 叫饿了么，设置分割线文案的位置	</p>
+    </el-dialog>
   </section>
 </template>
 <script>
 import Vue from 'vue';
 import Menu from "@/components/menu.vue";
-import {Autocomplete, Button, DatePicker, Dialog, Dropdown, DropdownItem, DropdownMenu, Form, FormItem, Input, Message, MessageBox, Option, Pagination, Popover, Select, Table, TableColumn, Tag, Tooltip} from 'element-ui'
+import {Divider,Descriptions,DescriptionsItem,Autocomplete, Button, DatePicker, Dialog, Dropdown, DropdownItem, DropdownMenu, Form, FormItem, Input, Message, MessageBox, Option, Pagination, Popover, Select, Table, TableColumn, Tag, Tooltip} from 'element-ui'
 
 Vue.prototype.$message = Message
 Vue.prototype.$confirm = MessageBox.confirm;
 
-Vue.use(Button).use(Form).use(Select).use(Option).use(Input).use(FormItem).use(Dialog).use(Tooltip).use(Autocomplete).use(Popover).use(Tag)
-Vue.use(DatePicker).use(Dropdown).use(DropdownMenu).use(DropdownItem).use(TableColumn).use(Table).use(Pagination)
+Vue.use(Button).use(Form).use(Select).use(Option).use(Input).use(FormItem).use(Dialog).use(Tooltip).use(Autocomplete).use(Popover).use(Tag).use(Divider);
+Vue.use(DatePicker).use(Dropdown).use(DropdownMenu).use(DropdownItem).use(TableColumn).use(Table).use(Pagination).use(Descriptions).use(DescriptionsItem);
 export default {
   name: "news",
   data() {
@@ -52,6 +72,7 @@ export default {
       page: 1,
       limit: 10,
       list: [],
+      dialogVisible: false,
       formParam: {
         msgType: '',
         time: ''
@@ -77,6 +98,7 @@ export default {
       })
     },
     viewChange(index, row) {
+      this.dialogVisible=true;
       console.log(index, row);
     },
     onSubmit() {