*样式与功能更新：与会申请详情对话框

ruoyi-ui/src/views/cp/usrApply/index.scss

@@ -0,0 +1,26 @@
+.detail-content {
+  .el-row {
+    margin-bottom: 20px;
+    height: auto;
+
+    &:last-child {
+      margin-bottom: 0;
+    }
+
+    > .el-col {
+      display: flex;
+      align-items: flex-start;
+      justify-content: flex-start;
+
+      .label {
+        font-size: 14px;
+        font-weight: bolder;
+        margin-right: 12px;
+      }
+
+      .value {
+        flex: 1;
+      }
+    }
+  }
+}

ruoyi-ui/src/views/cp/usrApply/index.vue

@@ -130,7 +130,7 @@
     <el-table v-loading="loading" :data="usrApplyList" @selection-change="handleSelectionChange" style="width: 100%">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="参会人" align="center" prop="usrName" width="100" fixed />
-      <el-table-column label="联系电话" align="center" prop="tel" width="100"  fixed />
+      <el-table-column label="联系电话" align="center" prop="tel" width="120" fixed />
       <el-table-column label="参会人单位" align="center" prop="orgUnitName" width="150"  fixed show-overflow-tooltip/>
       <el-table-column label="参会人职务" align="center" prop="uniLevel"  width="150" fixed/>
       <el-table-column label="邮箱信息" align="center" prop="email" width="100"/>
@@ -139,7 +139,7 @@
           <dict-tag :options="dict.type.met_usr_type" :value="scope.row.usrType" />
         </template>
       </el-table-column>
-      <el-table-column label="现场调研" align="center" prop="conferenceFlag" width="55" v-if="this.applyType == 1">
+      <el-table-column label="现场调研" align="center" prop="conferenceFlag" width="80" v-if="this.applyType == 1">
         <template slot-scope="scope">
           <dict-tag :options="dict.type.conference_flag" :value="scope.row.conferenceFlag" />
         </template>
@@ -173,11 +173,19 @@
       </el-table-column>
       <el-table-column label="修改时间" align="center" prop="createTime" width="80">
       </el-table-column>
-      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" >
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="200" fixed="right">
         <template slot-scope="scope">
           <el-button
               size="mini"
               type="text"
+              icon="el-icon-s-order"
+              @click="detail(scope.row)"
+          >
+            详情
+          </el-button>
+          <el-button
+              size="mini"
+              type="text"
               icon="el-icon-edit"
               @click="handleUpdate(scope.row)"
               v-hasPermi="['cp:apply:modify']"
@@ -213,8 +221,8 @@
     />
 
     <!-- 添加或修改cps_usr_apply与会申请对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="700px" append-to-body>
-      <el-form ref="form" :model="form" :rules="rules" label-width="120px">
+    <el-dialog :title="title" :visible.sync="open" width="900px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="160px">
         <el-form-item label="参会人" prop="usrName">
           <el-input v-model="form.usrName" placeholder="请输入参会人" />
         </el-form-item>
@@ -250,16 +258,6 @@
             </el-radio>
           </el-radio-group>
         </el-form-item>
-<!--        <el-form-item label="申请类型" prop="applyType">-->
-<!--          <el-select v-model="form.applyType" placeholder="请选择申请类型">-->
-<!--            <el-option-->
-<!--                v-for="dict in dict.type.apply_type"-->
-<!--                :key="dict.value"-->
-<!--                :label="dict.label"-->
-<!--                :value="dict.value"-->
-<!--            ></el-option>-->
-<!--          </el-select>-->
-<!--        </el-form-item>-->
         <el-form-item label="审核状态" prop="reviewState">
           <el-radio-group v-model="form.reviewState">
             <el-radio
@@ -306,6 +304,84 @@
         <el-button @click="cancel">取 消</el-button>
       </div>
     </el-dialog>
+    <el-dialog :title="title" class="detail-content" :visible.sync="openDetail" width="900px" append-to-body>
+      <el-row type="flex" justify="start">
+        <el-col :span="12">
+          <span class="label">参会人</span>
+          <span class="value">{{ form.usrName }}</span>
+        </el-col>
+        <el-col :span="12">
+          <span class="label">联系电话</span>
+          <span class="value">{{ form.tel }}</span>
+        </el-col>
+      </el-row>
+      <el-row type="flex">
+        <el-col :span="12">
+          <span class="label">参会人单位</span>
+          <span class="value">{{ form.orgUnitName }}</span>
+        </el-col>
+        <el-col :span="12">
+          <span class="label">参会人职务</span>
+          <span class="value">{{ form.uniLevel }}</span>
+        </el-col>
+      </el-row>
+      <el-row type="flex">
+        <el-col :span="12">
+          <span class="label">邮箱信息</span>
+          <span class="value">{{ form.email }}</span>
+        </el-col>
+        <el-col :span="12">
+          <span class="label">参会人角色</span>
+          <span class="value"> <dict-tag :options="dict.type.met_usr_type" :value="form.usrType" /></span>
+        </el-col>
+      </el-row>
+      <el-row type="flex" v-if="this.applyType == 1">
+        <el-col :span="12">
+          <span class="label">现场调研</span>
+          <span class="value"> <dict-tag :options="dict.type.conference_flag" :value="form.conferenceFlag" /></span>
+        </el-col>
+        <el-col :span="12">
+          <span class="label">会场信息</span>
+          <span class="value">{{ form.contentTitle }}</span>
+        </el-col>
+      </el-row>
+      <el-row type="flex">
+        <el-col :span="12">
+          <span class="label">审核状态</span>
+          <span class="value"> <dict-tag :options="dict.type.review_state" :value="form.reviewState" /></span>
+        </el-col>
+        <el-col :span="12">
+          <span class="label">审核信息</span>
+          <span class="value">{{ form.reviewMsg }}</span>
+        </el-col>
+      </el-row>
+      <el-row type="flex">
+        <el-col :span="12">
+          <span class="label">来程方式</span>
+          <span class="value"> <dict-tag :options="dict.type.tfc_type" :value="form.wayComing" /></span>
+        </el-col>
+        <el-col :span="12">
+          <span class="label">车次/航班/高速公路出入口</span>
+          <span class="value">{{ form.comInfo }}</span>
+        </el-col>
+      </el-row>
+      <el-row type="flex">
+        <el-col :span="12">
+          <span class="label">返程方式</span>
+          <span class="value"> <dict-tag :options="dict.type.tfc_type" :value="form.wayBack" /></span>
+        </el-col>
+        <el-col :span="12">
+          <span class="label">车次/航班/高速公路出入口</span>
+          <span class="value">{{ form.backInfo }}</span>
+        </el-col>
+      </el-row>
+      <el-row type="flex">
+        <el-col :span="24">
+          <span class="label">备注</span>
+          <span class="value">{{ form.remark }}</span>
+        </el-col>
+      </el-row>
+    </el-dialog>
     <el-dialog title="拒绝用户参会申请" :visible.sync="openReject" width="700px" append-to-body>
       <el-form ref="rejectForm" :model="form" :rules="rules" label-width="120px">
         <el-form-item label="审核状态" prop="reviewState">
@@ -357,6 +433,7 @@ export default {
       // 是否显示弹出层
       open: false,
       openReject: false,
+      openDetail: false,
       // 查询参数
       queryParams: {
         pageNum: 1,
@@ -497,7 +574,7 @@ export default {
     handleAdd() {
       this.reset();
       this.open = true;
-      this.title = '添加cps_usr_apply与会申请';
+      this.title = '添加与会申请';
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
@@ -506,7 +583,16 @@ export default {
       getUsrApply(id).then(response => {
         this.form = response.data;
         this.open = true;
-        this.title = '修改cps_usr_apply与会申请';
+        this.title = '修改与会申请';
+      });
+    },
+    detail(row) {
+      this.reset();
+      const id = row.id || this.ids;
+      getUsrApply(id).then(response => {
+        this.form = response.data;
+        this.openDetail = true;
+        this.title = '与会申请详情';
       });
     },
     /** 提交按钮 */
@@ -548,3 +634,4 @@ export default {
   },
 };
 </script>
+<style lang="scss" src="./index.scss" />