查看 | 历史 | 提交 | 提交对比
long
2022-01-24 c40e9437492f6973e631f42d8859d50182f777df
提交 | 用户 | age
2f7798 1 <template>
L 2   <div class="app-container">
3     <!-- 返回按钮和标题 -->
4     <el-page-header class="mb20" :content="objectName+'详情'" @back="$router.go(-1)" />
5
6     <el-descriptions title="基本信息" :column="3" label-class-name="my-label" class="mb20">
7       <template slot="extra">
8         <el-button type="primary" size="small">操作</el-button>
9       </template>
10       <el-descriptions-item label="用户名">kooriookami</el-descriptions-item>
11       <el-descriptions-item label="手机号">18100000000</el-descriptions-item>
12       <el-descriptions-item label="居住地">苏州市</el-descriptions-item>
13       <el-descriptions-item label="备注">
14         <el-tag size="small">学校</el-tag>
15       </el-descriptions-item>
16       <el-descriptions-item label="联系地址">江苏省苏州市吴中区吴中大道 1188 号</el-descriptions-item>
17     </el-descriptions>
18
19     <!-- upload放大图片 -->
20     <el-dialog :visible.sync="uploadPreviewVisible" style="text-align:center">
21       <img style="max-width:100%" :src="uploadPreviewUrl" alt="">
22     </el-dialog>
23
24     <back-to-top :visibility-height="300" :back-position="50" transition-name="fade" />
25   </div>
26 </template>
27
28 <script>
29 import mixin_Upload from '@/mixins/upload.js'
30 import BackToTop from '@/components/BackToTop'
31 export default {
32   name: 'Demo',
33   components: { BackToTop },
34   mixins: [mixin_Upload],
35   data() {
36     return {
37       id: this.$route.query.id || '',
38       showSearch: true, // 是否显示搜索区
39       keyWord: '', // 搜索区字段，可自行扩展其余字段
40
41       // TODO
42       objectName: 'xx', // 对象名称，用于删除提示、启用提示、弹窗标题等
43
44       // 数据
45       detail: '',
46
47       // 表单校验
48       rules: {}
49     }
50   },
51   mounted() {
52     this.init()
53   },
54   methods: {
55     // 初始化
56     init() {
57       this.getDetail()
58     },
59
60     // 获取列表
61     getDetail() {
62       var { id } = this
63       this.postFN({
64         url: 'admin/student/see',
65         params: {
66           id: id
67         },
68         mockData: {
69           code: 100,
70           msg: '',
71           data: {
72             allergyData: '["花生"]',
73             birthday: '2017-07-13',
74             createTime: '2021-06-10 14:49:15',
75             dayStatus: 0,
76             dayTime: null,
77             fatherName: '黄大大',
78             headImg: 'https://phitab20.oss-cn-shenzhen.aliyuncs.com/imagesUrl/IMG/5162a280-6ed5-4cfb-bb3c-02fc90d30209.jpg',
79             id: 'f8b32dc8c9b711ebb79300163e0133f7',
80             inTime: '2021-06-10 00:00:00',
81             isDel: 0,
82             isUp: 1,
83             linkTel1: '15999971794',
84             linkTel2: '13631419717',
85             motherName: '陈晓晓',
86             name: '黄小雯',
87             numberNo: '0000010',
88             outTime: '2023-07-01 00:00:00',
89             remark: '1111',
90             schoolClassId: '1',
91             sexType: 2,
92             status: 0
93           }
94         }
95       }, (inf) => {
96         this.detail = inf
97       })
98     },
99
100     // 删除
101     handleDelete(item) {
102       // 打开二次确认弹窗
103       this.$confirm('是否确认删除该' + this.objectName + '?', '提示', {
104         confirmButtonText: '确定',
105         cancelButtonText: '取消',
106         type: 'warning'
107       }).then(() => {
108         // 确定回调
109         // TODO url
110         this.postFN({
111           url: 'xxx',
112           params: {
113             id: item.id
114           },
115           mockData: {
116             code: 100,
117             msg: '',
118             data: {}
119           }
120         }, () => {
121           this.getList()
122           this.$messageSuc('删除成功')
123         })
124       }).catch(() => {})
125     },
126     // 修改是否上架
127     handleUpChange(item) {
128       const text = item.isUp === 1 ? '上架' : '下架'
129       this.$confirm('确认要' + text + '该' + this.objectName + '吗?', '提示', {
130         confirmButtonText: '确定',
131         cancelButtonText: '取消',
132         type: 'warning'
133       }).then(() => {
134         // TODO url
135         this.postFN({
136           url: 'xxx',
137           params: {
138             id: item.id,
139             isUp: item.isUp
140           },
141           mockData: {
142             code: 100,
143             msg: '',
144             data: {}
145           }
146         }, () => {
147           this.$messageSuc(text + '成功')
148         }, (res) => {
149           item.isUp = item.isUp === 1 ? 0 : 1
150           this.$messageError(res.msg)
151         })
152       }).catch(() => {
153         item.isUp = item.isUp === 1 ? 0 : 1
154       })
155     }
156   }
157 }
158 </script>
159
160 <style lang="scss" scoped>
161 .my-label{
162   white-space: nowrap;
163   font-weight: bold
164 }
165 </style>