展演样式

src/main/vue/src/router.js

@@ -609,6 +609,15 @@ const router = new Router({
                         title: '考级专业考官编辑'
                     }
                 },
+                {
+                    path: '/programmeShow',
+                    name: 'ProgrammeShow',
+                    component: () =>
+                        import(/* webpackChunkName: "programmeShow" */ '@/views/performance/ProgrammeShow.vue'),
+                    meta: {
+                        title: '节目详情'
+                    }
+                },
                 {
                     path: '/programmeEdit',
                     name: 'ProgrammeEdit',

src/main/vue/src/views/performance/PerformanceEdit.vue

@@ -182,7 +182,6 @@ export default {
         };
     },
     computed: {
-        ...mapState(['userInfo']),
         saveOtherJson() {
             const schedules = [...this.schedules]
                 .filter(item => {
@@ -249,14 +248,6 @@ export default {
                     }
                 });
         },
-        getAdmin() {
-            let data = this.userInfo.authorities;
-            data.forEach(element => {
-                if (element.name === 'ROLE_ADMIN') {
-                    this.display = true;
-                }
-            });
-        },
         onAddOtherForm() {
             this.schedules.push({
                 content: '',

src/main/vue/src/views/performance/PerformanceShow.vue

@@ -10,16 +10,11 @@
             style="max-width: 700px;"
         >
             <el-timeline>
-                <el-timeline-item placement="top" size="normal">
+                <el-timeline-item placement="top" size="normal" timestamp="基本信息">
                     <el-card shadow="hover" :body-style="{ padding: '20px' }">
                         <div>
                             <el-form-item prop="year" label="年度">
-                                <el-select
-                                    v-model="formData.year"
-                                    style="width: 300px"
-                                    @change="getName"
-                                    :disabled="edit"
-                                >
+                                <el-select v-model="formData.year" style="width: 300px" disabled>
                                     <el-option
                                         v-for="item in years"
                                         :key="item"
@@ -29,11 +24,7 @@
                                 </el-select>
                             </el-form-item>
                             <el-form-item prop="name" label="名称" v-if="formData.year">
-                                <el-input
-                                    v-model="formData.name"
-                                    :readonly="!display || edit"
-                                    style="width: 300px"
-                                ></el-input>
+                                <el-input v-model="formData.name" style="width: 300px" readonly></el-input>
                             </el-form-item>
                             <el-form-item label="报名起始时间">
                                 <el-date-picker
@@ -44,12 +35,12 @@
                                     end-placeholder="请选择结束时间"
                                     range-separator="至"
                                     style="width: 300px"
-                                    :readonly="!display || edit"
+                                    readonly
                                 >
                                 </el-date-picker>
                             </el-form-item>
                             <el-form-item prop="online" label="展演形式">
-                                <el-radio-group v-model="formData.online">
+                                <el-radio-group v-model="formData.online" disabled>
                                     <el-radio :label="true">线上</el-radio>
                                     <el-radio :label="false">线下</el-radio>
                                 </el-radio-group>
@@ -60,14 +51,14 @@
                     <!-- content -->
                 </el-timeline-item>
 
-                <el-timeline-item placement="top" size="normal">
+                <el-timeline-item placement="top" size="normal" timestamp="计划安排">
                     <el-card shadow="hover" :body-style="{ padding: '20px' }">
                         <div v-for="(item, index) in schedules" :key="index">
                             <div v-if="!item.del">
                                 <el-row>
                                     <el-col :span="11">
                                         <el-form-item prop="content" label="活动内容">
-                                            <el-input v-model="item.content"></el-input>
+                                            <el-input v-model="item.content" readonly></el-input>
                                         </el-form-item>
                                     </el-col>
                                     <el-col :span="11">
@@ -77,6 +68,7 @@
                                                 type="date"
                                                 value-format="yyyy-MM-dd"
                                                 placeholder="选择日期"
+                                                readonly
                                             >
                                             </el-date-picker>
                                         </el-form-item>
@@ -85,7 +77,7 @@
                                 <el-row>
                                     <el-col :span="20">
                                         <el-form-item label="活动地点">
-                                            <el-input v-model="item.address"></el-input>
+                                            <el-input v-model="item.address" readonly></el-input>
                                         </el-form-item>
                                     </el-col>
                                 </el-row>
@@ -94,18 +86,18 @@
                     </el-card>
                 </el-timeline-item>
 
-                <el-timeline-item placement="top" size="normal">
+                <el-timeline-item placement="top" size="normal" timestamp="咨询电话">
                     <el-card shadow="hover" :body-style="{ padding: '20px' }">
                         <div v-for="(item, index) in phones" :key="index">
                             <el-row>
                                 <el-col :span="10">
                                     <el-form-item label="联系人">
-                                        <el-input v-model="item.name"></el-input>
+                                        <el-input v-model="item.name" readonly></el-input>
                                     </el-form-item>
                                 </el-col>
                                 <el-col :span="10">
                                     <el-form-item label="电话">
-                                        <el-input v-model="item.phone"></el-input>
+                                        <el-input v-model="item.phone" readonly></el-input>
                                     </el-form-item>
                                 </el-col>
                             </el-row>
@@ -113,14 +105,14 @@
                     </el-card>
                 </el-timeline-item>
 
-                <el-timeline-item placement="top" size="normal">
+                <el-timeline-item placement="top" size="normal" timestamp="其他信息">
                     <el-card shadow="hover" :body-style="{ padding: '20px' }">
                         <div>
                             <el-form-item prop="email" label="活动邮箱">
-                                <el-input v-model="formData.email" style="width: 300px"></el-input>
+                                <el-input v-model="formData.email" style="width: 300px" readonly></el-input>
                             </el-form-item>
                             <el-form-item prop="annex" label="活动方案">
-                                <file-upload v-model="formData.annex"></file-upload>
+                                <file-upload v-model="formData.annex" :readonly="true"></file-upload>
                             </el-form-item>
                             <el-form-item prop="codeImg" label="活动工作群">
                                 <el-image
@@ -136,11 +128,7 @@
             </el-timeline>
 
             <el-form-item>
-                <el-button @click="onSave" :loading="saving" type="primary" v-if="display">保存</el-button>
-                <el-button @click="onDelete" :loading="saving" type="danger" v-if="formData.id && display">
-                    删除
-                </el-button>
-                <el-button @click="$router.go(-1)">取消</el-button>
+                <el-button @click="$router.go(-1)">返回</el-button>
             </el-form-item>
         </el-form>
     </div>
@@ -152,12 +140,9 @@ export default {
     created() {
         if (this.$route.query.id) {
             this.$http
-                .get('performance/backGet/' + this.$route.query.id)
+                .get('performance/get/' + this.$route.query.id)
                 .then(res => {
                     this.formData = res;
-                    if (res.programmeNum > 0) {
-                        this.edit = true;
-                    }
                     if (typeof res.performanceEnquiries != 'undefined') {
                         this.phones = res.performanceEnquiries;
                     }
@@ -195,131 +180,16 @@ export default {
             years: ['2020', '2021', '2022', '2023', '2024'],
             schedules: [],
             phones: [],
-            performanceId: '',
-            edit: false
+            performanceId: ''
         };
-    },
-    computed: {
-        ...mapState(['userInfo']),
-        saveOtherJson() {
-            const schedules = [...this.schedules]
-                .filter(item => {
-                    return !!item.content || !!item.date || !!item.address;
-                })
-                .map(item => {
-                    return {
-                        ...item,
-                        performanceId: this.performanceId
-                    };
-                });
-            return JSON.stringify(schedules);
-        }
-    },
-    methods: {
-        onSave() {
-            this.$refs.form.validate(valid => {
-                if (valid) {
-                    this.submit();
-                } else {
-                    return false;
-                }
-            });
-        },
-        submit() {
-            let data = { ...this.formData };
-            data.startDate = this.dateRange[0];
-            data.endDate = this.dateRange[1];
-            data.performanceEnquiries = this.phones;
-            this.saving = true;
-            this.$http
-                .post('/performance/save', data, { body: 'json' })
-                .then(res => {
-                    this.saving = false;
-
-                    this.performanceId = res.id;
-                    this.$nextTick(() => {
-                        this.$http.post('/performanceSchedule/batchSave', {
-                            schedules: this.saveOtherJson
-                        });
-                    });
-                    this.$message.success('成功');
-                    this.$router.go(-1);
-                })
-                .catch(e => {
-                    console.log(e);
-                    this.saving = false;
-                    this.$message.error(e.error);
-                });
-        },
-        onDelete() {
-            this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'error' })
-                .then(() => {
-                    return this.$http.post(`/performance/del/${this.formData.id}`);
-                })
-                .then(() => {
-                    this.$message.success('删除成功');
-                    this.$router.go(-1);
-                })
-                .catch(e => {
-                    if (e !== 'cancel') {
-                        console.log(e);
-                        this.$message.error((e || {}).error || '删除失败');
-                    }
-                });
-        },
-        getAdmin() {
-            let data = this.userInfo.authorities;
-            data.forEach(element => {
-                if (element.name === 'ROLE_ADMIN') {
-                    this.display = true;
-                }
-            });
-        },
-        onAddOtherForm() {
-            this.schedules.push({
-                content: '',
-                date: '',
-                address: ''
-            });
-        },
-        onAddPhoneForm() {
-            this.phones.push({
-                name: '',
-                phone: ''
-            });
-        },
-        onDeleteOtherForm(info, index) {
-            this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'warning' })
-                .then(() => {
-                    const schedules = [...this.schedules];
-                    if (info.id) {
-                        info.del = true;
-                        schedules[index] = info;
-                    } else {
-                        schedules.splice(index, 1);
-                    }
-                    this.schedules = schedules;
-                    this.$message.success('删除成功');
-                })
-                .catch(e => {});
-        },
-        onDeletePhoneForm(info, index) {
-            this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'warning' })
-                .then(() => {
-                    const phones = [...this.phones];
-                    phones.splice(index, 1);
-                    this.phones = phones;
-                    this.$message.success('删除成功');
-                })
-                .catch(e => {});
-        },
-        getName(value) {
-            this.formData.name = value + '“宁艺之星”社会艺术水平考级展演';
-        }
     }
 };
 </script>
 <style lang="less" scoped>
+.edit-view {
+    padding: 0 0;
+    background-color: transparent;
+}
 .add-con {
     background-color: #f7f7f7;
     width: 100%;
@@ -333,8 +203,7 @@ export default {
     background-color: #ffffff;
     color: #606266;
 }
-.edit-view {
-    padding: 0 0;
-    background-color: transparent;
+/deep/.el-radio__input.is-disabled + span.el-radio__label {
+    color: #606266; // #409EFF;
 }
 </style>

src/main/vue/src/views/performance/ProgrammeList.vue

@@ -13,25 +13,78 @@
                 >导出EXCEL
             </el-button> -->
             <el-form :model="form" inline size="mini">
-                <el-form-item label="考级机构名称">
-                    <el-input placeholder="考级机构名称" v-model="search" clearable></el-input>
-                </el-form-item>
-                <el-form-item label="承办单位名称">
-                    <el-input placeholder="承办单位名称" v-model="search" clearable></el-input>
-                </el-form-item>
-                <el-form-item label="考级点名称">
-                    <el-input placeholder="考级点名称" v-model="search" clearable></el-input>
-                </el-form-item>
-                <br />
-                <el-form-item label="考级机构名称">
-                    <el-input placeholder="考级机构名称" v-model="search" clearable></el-input>
-                </el-form-item>
-                <el-form-item label="承办单位名称">
-                    <el-input placeholder="承办单位名称" v-model="search" clearable></el-input>
-                </el-form-item>
-                <el-form-item label="考级点名称">
-                    <el-input placeholder="考级点名称" v-model="search" clearable></el-input>
-                </el-form-item>
+                <el-row>
+                    <el-col :span="8"
+                        ><el-form-item label="考级机构名称">
+                            <el-input placeholder="考级机构名称" v-model="search" clearable></el-input> </el-form-item
+                    ></el-col>
+                    <el-col :span="8"
+                        ><el-form-item label="承办单位名称">
+                            <el-input placeholder="承办单位名称" v-model="search" clearable></el-input> </el-form-item
+                    ></el-col>
+                    <el-col :span="8"
+                        ><el-form-item label="考级点名称">
+                            <el-input placeholder="考级点名称" v-model="search" clearable></el-input> </el-form-item
+                    ></el-col>
+                </el-row>
+                <el-row>
+                    <el-col :span="8"
+                        ><el-form-item label="参赛专业">
+                            <el-input placeholder="参赛专业" v-model="search" clearable></el-input> </el-form-item
+                    ></el-col>
+                    <el-col :span="8"
+                        ><el-form-item label="参赛组别">
+                            <el-select v-model="competitionGroup" clearable filterable placeholder="请选择">
+                                <el-option
+                                    v-for="item in competitionGroupOptions"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                >
+                                </el-option>
+                            </el-select> </el-form-item
+                    ></el-col>
+                    <el-col :span="8"
+                        ><el-form-item label="参赛级别" v-if="competitionGroup">
+                            <el-select
+                                v-model="levelSettingId"
+                                clearable
+                                filterable
+                                placeholder="请选择"
+                                style="width: 100%"
+                                v-if="competitionGroup == 'SINGLE'"
+                            >
+                                <el-option
+                                    v-for="item in levelSingleOptions"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                >
+                                    <span style="float: left">{{ item.label }}</span>
+                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.desc }}</span>
+                                </el-option>
+                            </el-select>
+                            <el-select
+                                v-model="levelSettingId"
+                                clearable
+                                filterable
+                                placeholder="请选择"
+                                style="width: 100%"
+                                v-else
+                            >
+                                <el-option
+                                    v-for="item in levelCollectiveOptions"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                >
+                                    <span style="float: left">{{ item.label }}</span>
+                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.desc }}</span>
+                                </el-option>
+                            </el-select>
+                        </el-form-item></el-col
+                    >
+                </el-row>
                 <br />
                 <el-form-item>
                     <el-button @click="getData" type="primary" icon="el-icon-search">搜索 </el-button>
@@ -53,7 +106,7 @@
             :height="tableHeight"
         >
             <el-table-column v-if="multipleMode" align="center" type="selection" width="50"> </el-table-column>
-            <el-table-column prop="id" label="ID" width="100"> </el-table-column>
+            <!-- <el-table-column prop="id" label="ID" width="100"> </el-table-column> -->
             <el-table-column prop="name" label="节目名称"> </el-table-column>
             <el-table-column prop="specialtyId" label="参赛专业"> </el-table-column>
             <el-table-column prop="competitionGroup" label="参赛组别" :formatter="competitionGroupFormatter">
@@ -64,12 +117,15 @@
             <el-table-column prop="contact" label="联系人"> </el-table-column>
             <el-table-column prop="phone" label="联系电话"> </el-table-column>
             <el-table-column prop="gradingOrganizationId" label="考级机构"> </el-table-column>
+            <el-table-column prop="gradingOrganizationId" label="承办单位"> </el-table-column>
             <el-table-column prop="examPoint" label="考级点"> </el-table-column>
             <el-table-column prop="video" label="节目视频"> </el-table-column>
-            <el-table-column label="操作" align="center" fixed="right" min-width="150">
+            <el-table-column label="操作" align="center" fixed="right" min-width="280">
                 <template slot-scope="{ row }">
-                    <el-button @click="editRow(row)" type="primary" size="mini" plain>编辑</el-button>
-                    <el-button @click="deleteRow(row)" type="danger" size="mini" plain>删除</el-button>
+                    <el-button @click="showRow(row)" size="mini" plain>查看</el-button>
+                    <el-button type="warning" size="mini" plain>浏览视频</el-button>
+                    <el-button @click="showCode(row)" type="primary" size="mini" plain>查看二维码</el-button>
+                    <!-- <el-button @click="deleteRow(row)" type="danger" size="mini" plain>删除</el-button> -->
                 </template>
             </el-table-column>
         </el-table>
@@ -94,11 +150,18 @@
             >
             </el-pagination>
         </div>
+
+        <el-dialog title="二维码" :visible.sync="dialogCode" width="400px" center>
+            <div style="margin-left: 70px;">
+                <qrcode-vue :value="dialogUrl" :size="200" level="H" />
+            </div>
+        </el-dialog>
     </div>
 </template>
 <script>
 import { mapState } from 'vuex';
 import pageableTable from '@/mixins/pageableTable';
+import QrcodeVue from 'qrcode.vue';
 
 export default {
     name: 'ProgrammeList',
@@ -113,9 +176,54 @@ export default {
                 { label: '个人', value: 'SINGLE' },
                 { label: '集体', value: 'COLLECTIVE' }
             ],
-            form: {}
+            form: {},
+            competitionGroup: '',
+            levelSingleOptions: [],
+            levelCollectiveOptions: [],
+            levelSettingId: '',
+            dialogUrl: '',
+            dialogCode: false
         };
     },
+    created() {
+        this.$http
+            .post('/setting/byFlag', { flag: 3 })
+            .then(res => {
+                if (res.length > 0) {
+                    res.forEach(item => {
+                        this.levelSingleOptions.push({
+                            label: item.name,
+                            value: item.id,
+                            desc: item.code
+                        });
+                    });
+                }
+            })
+            .catch(e => {
+                console.log(e);
+                this.$message.error(e.error);
+            });
+        this.$http
+            .post('/setting/byFlag', { flag: 4 })
+            .then(res => {
+                if (res.length > 0) {
+                    res.forEach(item => {
+                        this.levelCollectiveOptions.push({
+                            label: item.name,
+                            value: item.id,
+                            desc: item.code
+                        });
+                    });
+                }
+            })
+            .catch(e => {
+                console.log(e);
+                this.$message.error(e.error);
+            });
+    },
+    components: {
+        QrcodeVue
+    },
     computed: {
         selection() {
             return this.$refs.table.selection.map(i => i.id);
@@ -146,9 +254,9 @@ export default {
                 }
             });
         },
-        editRow(row) {
+        showRow(row) {
             this.$router.push({
-                path: '/programmeEdit',
+                path: '/programmeShow',
                 query: {
                     id: row.id
                 }
@@ -201,8 +309,20 @@ export default {
                         this.$message.error(e.error);
                     }
                 });
+        },
+        showCode(row) {
+            this.dialogCode = true;
+            this.dialogUrl =
+                'http://wljtest.izouma.com/h5/home?performanceId=' +
+                row.performanceId +
+                '&performanceApplyId=' +
+                row.id;
         }
     }
 };
 </script>
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.right {
+    float: right;
+}
+</style>

src/main/vue/src/views/performance/ProgrammeShow.vue

@@ -0,0 +1,444 @@
+<template>
+    <div class="edit-view">
+        <el-form
+            :model="formData"
+            :rules="rules"
+            ref="form"
+            label-width="80px"
+            label-position="right"
+            size="small"
+            style="max-width: 700px;"
+        >
+            <el-timeline>
+                <el-timeline-item placement="top" size="normal" timestamp="节目信息">
+                    <el-card shadow="hover" :body-style="{ padding: '20px' }">
+                        <el-form-item prop="name" label="节目名称">
+                            <el-input v-model="formData.name" class="width"></el-input>
+                        </el-form-item>
+                        <el-form-item prop="specialtyId" label="参赛专业">
+                            <el-cascader
+                                class="width"
+                                ref="artCascader"
+                                v-model="formData.specialtyId"
+                                :props="optionProps"
+                                :options="artTypes"
+                                :show-all-levels="false"
+                                placeholder="请选择专业"
+                            >
+                            </el-cascader>
+                        </el-form-item>
+                        <el-form-item prop="competitionGroup" label="参赛组别">
+                            <el-select
+                                v-model="formData.competitionGroup"
+                                class="width"
+                                clearable
+                                filterable
+                                placeholder="请选择"
+                            >
+                                <el-option
+                                    v-for="item in competitionGroupOptions"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                >
+                                </el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item prop="levelSettingId" label="参赛级别" v-if="formData.competitionGroup">
+                            <el-select
+                                v-model="formData.levelSettingId"
+                                clearable
+                                filterable
+                                placeholder="请选择"
+                                class="width"
+                                v-if="formData.competitionGroup == 'SINGLE'"
+                            >
+                                <el-option
+                                    v-for="item in levelSingleOptions"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                >
+                                    <span style="float: left">{{ item.label }}</span>
+                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.desc }}</span>
+                                </el-option>
+                            </el-select>
+                            <el-select
+                                v-model="formData.levelSettingId"
+                                clearable
+                                filterable
+                                placeholder="请选择"
+                                class="width"
+                                v-else
+                            >
+                                <el-option
+                                    v-for="item in levelCollectiveOptions"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                >
+                                    <span style="float: left">{{ item.label }}</span>
+                                    <span style="float: right; color: #8492a6; font-size: 13px">{{ item.desc }}</span>
+                                </el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item prop="durationOfWork" label="作品时长">
+                            <el-input v-model="formData.durationOfWork" class="width"></el-input>
+                        </el-form-item>
+                        <el-form-item prop="instructor" label="指导老师">
+                            <el-input v-model="formData.instructor" class="width"></el-input>
+                        </el-form-item>
+                        <el-form-item prop="video" label="作品视频">
+                            <video-upload v-model="formData.video" class="width"></video-upload>
+                        </el-form-item>
+                    </el-card>
+                </el-timeline-item>
+
+                <el-timeline-item placement="top" size="normal" timestamp="单位信息">
+                    <el-card shadow="hover" :body-style="{ padding: '20px' }">
+                        <el-form-item prop="gradingOrganizationId" label="考级机构">
+                            <el-select
+                                v-model="formData.gradingOrganizationId"
+                                clearable
+                                filterable
+                                placeholder="请选择"
+                                class="width"
+                            >
+                                <el-option
+                                    v-for="item in gradingOrganizationIdOptions"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                >
+                                </el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item prop="organizationId" label="承办单位">
+                            <el-select
+                                v-model="formData.organizationId"
+                                clearable
+                                filterable
+                                placeholder="请选择"
+                                class="width"
+                            >
+                                <el-option
+                                    v-for="item in organizationIdOptions"
+                                    :key="item.value"
+                                    :label="item.label"
+                                    :value="item.value"
+                                >
+                                </el-option>
+                            </el-select>
+                        </el-form-item>
+                        <el-form-item prop="examPoint" label="考级点">
+                            <el-input v-model="formData.examPoint" class="width"></el-input>
+                        </el-form-item>
+                        <el-form-item prop="contact" label="联系人">
+                            <el-input v-model="formData.contact" class="width"></el-input>
+                        </el-form-item>
+                        <el-form-item prop="phone" label="联系电话">
+                            <el-input v-model="formData.phone" class="width"></el-input>
+                        </el-form-item>
+                    </el-card>
+                </el-timeline-item>
+
+                <el-timeline-item placement="top" size="normal" timestamp="参演人员">
+                    <el-card shadow="hover" :body-style="{ padding: '20px' }">
+                        <el-table
+                            :data="participants"
+                            ref="table"
+                            header-row-class-name="table-header-row"
+                            header-cell-class-name="table-header-cell"
+                            row-class-name="table-row"
+                            cell-class-name="table-cell"
+                        >
+                            <el-table-column prop="name" label="姓名" min-width="100"> </el-table-column>
+                            <el-table-column prop="birthday" label="出生年月" min-width="100"> </el-table-column>
+                            <el-table-column prop="sex" label="性别" min-width="70"> </el-table-column>
+                            <el-table-column prop="phone" label="联系方式" min-width="100"> </el-table-column>
+                            <el-table-column prop="img" label="照片">
+                                <template slot-scope="{ row }">
+                                    <el-image
+                                        style="width: 30px; height: 30px;"
+                                        :src="row.img"
+                                        fit="cover"
+                                        :preview-src-list="[row.img]"
+                                    ></el-image>
+                                </template>
+                            </el-table-column>
+                        </el-table>
+                    </el-card>
+                </el-timeline-item>
+            </el-timeline>
+
+            <el-form-item>
+                <el-button @click="$router.go(-1)">返回</el-button>
+            </el-form-item>
+        </el-form>
+    </div>
+</template>
+<script>
+import delChild from '@/mixins/delChild';
+import { mapState } from 'vuex';
+export default {
+    name: 'ProgrammeShow',
+    mixins: [delChild],
+    created() {
+        if (this.$route.query.id) {
+            this.$http
+                .get('programme/get/' + this.$route.query.id)
+                .then(res => {
+                    this.formData = res;
+
+                    this.$http
+                        .post(
+                            '/participant/all',
+                            { size: 100, query: { programmeId: this.$route.query.id } },
+                            { body: 'json' }
+                        )
+                        .then(res => {
+                            this.participants = res.content;
+                        });
+                })
+                .catch(e => {
+                    console.log(e);
+                    this.$message.error(e.error);
+                });
+        } else if (this.organization) {
+            this.formData.organizationId = this.organization.id;
+            this.formData.contact = this.organization.owner;
+            this.formData.phone = this.organization.ownerPhone;
+            if (this.organization.gradingOrganizationId.length > 0) {
+                this.formData.gradingOrganizationId = this.organization.gradingOrganizationId[0];
+            }
+        }
+        this.$http
+            .post('/setting/byFlag', { flag: 3 })
+            .then(res => {
+                if (res.length > 0) {
+                    res.forEach(item => {
+                        this.levelSingleOptions.push({
+                            label: item.name,
+                            value: item.id,
+                            desc: item.code
+                        });
+                    });
+                }
+            })
+            .catch(e => {
+                console.log(e);
+                this.$message.error(e.error);
+            });
+        this.$http
+            .post('/setting/byFlag', { flag: 4 })
+            .then(res => {
+                if (res.length > 0) {
+                    res.forEach(item => {
+                        this.levelCollectiveOptions.push({
+                            label: item.name,
+                            value: item.id,
+                            desc: item.code
+                        });
+                    });
+                }
+            })
+            .catch(e => {
+                console.log(e);
+                this.$message.error(e.error);
+            });
+        this.$http
+            .post('/gradingOrganization/all', { size: 1000, query: { del: false } }, { body: 'json' })
+            .then(res => {
+                if (res.content.length > 0) {
+                    res.content.forEach(item => {
+                        this.gradingOrganizationIdOptions.push({
+                            label: item.name,
+                            value: item.id
+                        });
+                    });
+                }
+            })
+            .catch(e => {
+                console.log(e);
+                this.$message.error(e.error);
+            });
+        this.$http
+            .post('/organization/all', { size: 1000, query: { del: false } }, { body: 'json' })
+            .then(res => {
+                if (res.content.length > 0) {
+                    res.content.forEach(item => {
+                        this.organizationIdOptions.push({
+                            label: item.name,
+                            value: item.id
+                        });
+                    });
+                }
+            })
+            .catch(e => {
+                console.log(e);
+                this.$message.error(e.error);
+            });
+        this.$http
+            .post('/artType/allList')
+            .then(res => {
+                this.artTypes = this.delChild(res);
+            })
+            .catch(e => {
+                console.log(e);
+            });
+    },
+    data() {
+        return {
+            saving: false,
+            formData: {},
+            rules: {
+                phone: [
+                    {
+                        pattern: /^1[3-9]\d{9}$/,
+                        message: '请输入正确的手机号',
+                        trigger: 'blur'
+                    }
+                ]
+            },
+            competitionGroupOptions: [
+                { label: '个人', value: 'SINGLE' },
+                { label: '集体', value: 'COLLECTIVE' }
+            ],
+            levelSingleOptions: [],
+            levelCollectiveOptions: [],
+            gradingOrganizationIdOptions: [],
+            organizationIdOptions: [],
+            artTypes: [],
+            optionProps: {
+                value: 'id',
+                label: 'name',
+                children: 'children',
+                multiple: false,
+                emitPath: false,
+                checkStrictly: true,
+                expandTrigger: 'hover'
+            },
+            participants: [],
+            programmeId: ''
+        };
+    },
+    computed: {
+        ...mapState(['organization']),
+        saveOtherJson() {
+            return [...this.participants]
+                .filter(item => {
+                    return !!item.name || !!item.sex || !!item.phone;
+                })
+                .map(item => {
+                    return {
+                        ...item,
+                        programmeId: this.programmeId
+                    };
+                });
+
+            // return JSON.stringify(participants);
+        }
+    },
+    methods: {
+        onSave() {
+            this.$refs.form.validate(valid => {
+                if (valid) {
+                    this.submit();
+                } else {
+                    return false;
+                }
+            });
+        },
+        submit() {
+            let data = { ...this.formData };
+
+            this.saving = true;
+            this.$http
+                .post('/programme/save', data, { body: 'json' })
+                .then(res => {
+                    this.saving = false;
+
+                    this.programmeId = res.id;
+                    this.$nextTick(() => {
+                        this.$http.post('/participant/batchSave', this.saveOtherJson, { body: 'json' });
+                    });
+                    this.$message.success('成功');
+                    this.$router.go(-1);
+                })
+                .catch(e => {
+                    console.log(e);
+                    this.saving = false;
+                    this.$message.error(e.error);
+                });
+        },
+        onDelete() {
+            this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'error' })
+                .then(() => {
+                    return this.$http.post(`/programme/del/${this.formData.id}`);
+                })
+                .then(() => {
+                    this.$message.success('删除成功');
+                    this.$router.go(-1);
+                })
+                .catch(e => {
+                    if (e !== 'cancel') {
+                        console.log(e);
+                        this.$message.error((e || {}).error || '删除失败');
+                    }
+                });
+        },
+        onAddOtherForm() {
+            console.log(this.participants.length);
+            if (this.formData.competitionGroup == 'SINGLE' && this.participants.length > 0) {
+                this.$alert('单人组别只能添加一个参赛人员信息', '提示', {
+                    confirmButtonText: '确定',
+                    callback: action => {
+                        this.$message({
+                            type: 'info',
+                            message: '添加失败'
+                        });
+                    }
+                });
+            } else {
+                this.participants.push({
+                    name: '',
+                    sex: '',
+                    birthday: '',
+                    phone: '',
+                    img: ''
+                });
+            }
+        },
+        onDeleteOtherForm(info, index) {
+            this.$alert('删除将无法恢复，确认要删除么？', '警告', { type: 'warning' })
+                .then(() => {
+                    const schedules = [...this.schedules];
+                    if (info.id) {
+                        info.del = true;
+                        schedules[index] = info;
+                    } else {
+                        schedules.splice(index, 1);
+                    }
+                    this.schedules = schedules;
+                    this.$message.success('删除成功');
+                })
+                .catch(e => {});
+        }
+    }
+};
+</script>
+<style lang="less" scoped>
+.edit-view {
+    padding: 0 0;
+    background-color: transparent;
+}
+.add-con {
+    background-color: #f7f7f7;
+    width: 100%;
+    margin: 7px 0;
+    padding-top: 14px;
+}
+.width {
+    width: 260px;
+}
+</style>

src/main/vue/src/views/record/RecordList.vue

@@ -87,7 +87,7 @@
             <el-table-column prop="recordTime" label="备案时间" min-width="90"></el-table-column>
             <el-table-column label="操作" align="center" fixed="right" min-width="75">
                 <template slot-scope="{ row }">
-                    <el-button @click="editRow(row)" type="primary" size="mini" plain>查看</el-button>
+                    <el-button @click="editRow(row)" size="mini" plain>查看</el-button>
                     <!-- <el-button @click="openRoom(row)" type="warning" size="mini" plain>考场</el-button> -->
                     <!-- <el-button @click="deleteRow(row)" type="danger" size="mini" plain>删除</el-button> -->
                 </template>