调解员拆解

src/api/caseManagement/caseManagement.js

     data: data,
   });
 }
+// 确认调节时间
+export function confirmDate(data) {
+  return request({
+    url: "/caseApplication/confirmDate",
+    method: "post",
+    data: data,
+  });
+}

src/views/caseManagement/caseList.vue

                     <el-button size="mini" type="text" icon="el-icon-tickets" @click="selectMediator(scope.row)">预约时间</el-button>
                     <el-button size="mini" type="text" icon="el-icon-tickets" @click="secretaryConfirm(scope.row)">秘书审核</el-button>
                     <el-button size="mini" type="text" icon="el-icon-tickets" @click="department(scope.row)">部门长审核</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-tickets" @click="timeConfirm(scope.row)">确认调解时间</el-button>
                 </template>
             </el-table-column>
         </el-table>
         <confirmMediator @cancelConfirm="cancelConfirm" :confirmVisable="confirmVisable" :confirmData="confirmData" @getList="getList" :queryParams="queryParams"></confirmMediator>
         <!-- 部门长确认 -->
         <departmentMediator @cancelDepartment="cancelDepartment" :departmentVisable="departmentVisable" :departmentData="departmentData" @getList="getList" :queryParams="queryParams"></departmentMediator>
+        <!-- 秘书确认时间 -->
+        <timeConfirm @cancelTimeConfirm="cancelTimeConfirm" :timeConfirmVisable="timeConfirmVisable" :timeConfirmData="timeConfirmData" @getList="getList" :queryParams="queryParams"></timeConfirm>
     </div>
 </template>
 
 import selectMediator from './components/selectMediator.vue'
 import confirmMediator from './components/confirmMediator.vue'
 import departmentMediator from './components/departmentMediator.vue'
+import timeConfirm from './components/timeConfirm.vue'
 export default {
     name: "caseList",
     dicts: ["case_flow_node"],
         caseAcceptance,
         selectMediator,//调解员弹窗
         confirmMediator,
-        departmentMediator
+        departmentMediator,
+        timeConfirm
     },
     data() {
         return {
             tabFlag: false,
             confirmData:{},
             departmentVisable:false,
-            departmentData:{}
+            departmentData:{},
+            timeConfirmVisable:false,
+            timeConfirmData:{}
         };
     },
     created() {
                 this.payForm.caseId = res.data.id;
             });
         },
-        /** 确认时间/调解员 */
+        /** 确认调解员 */
         secretaryConfirm(val){
             this.confirmVisable = true;
             this.confirmData = val;
         },
-        /** 部门长确认时间/调解员 */
+        /** 部门长确认调解员 */
         department(val){
             this.departmentVisable = true;
             this.departmentData = val;
         },
+        /**确认时间 */
+        timeConfirm(val){
+            this.timeConfirmVisable = true;
+            this.timeConfirmData = val;
+        },
         /** 时间改变处理 */
         caseTimeChange() {
             if (this.caseTime) {
         cancelDepartment(){
             this.departmentVisable = false;
         },
+        cancelTimeConfirm(){
+            this.timeConfirmVisable = false;
+        },
         /** 搜索按钮操作 */
         handleQuery() {
             this.queryParams.pageNum = 1;

src/views/caseManagement/components/confirmMediator.vue

 <template>
     <div>
-        <el-dialog title="秘书确认时间/调解员" :visible="confirmVisable" v-if="confirmVisable" @close="cancel" center
+        <el-dialog title="秘书确认调解员" :visible="confirmVisable" v-if="confirmVisable" @close="cancel" center
             :distroy-on-close="true">
             <div style="margin-bottom: 20px;">
                 <el-radio-group v-model="confirmFlag">
                     <el-table-column prop="completeAmount" label="已办数量">
                     </el-table-column>
                 </el-table>
-                <div>
+                <!-- <div>
                     <div style="margin-top: 20px;margin-bottom: 20px;">时间</div>
                     <el-form label-position="right" label-width="80px" :model="formLabelAlign" :disabled="confirmShow">
                         <el-form-item label="时间">
                             <el-date-picker v-model="formLabelAlign.time[0]" type="datetime" placeholder="选择日期时间">
                             </el-date-picker>
-                        </el-form-item>
+                        </el-form-item> -->
                         <!-- 后期需要三个时间 -->
                         <!-- <el-form-item label="时间2">
                             <el-date-picker v-model="formLabelAlign.time[1]" type="datetime" placeholder="选择日期时间">
                             <el-date-picker v-model="formLabelAlign.time[2]" type="datetime" placeholder="选择日期时间">
                             </el-date-picker>
                         </el-form-item> -->
-                    </el-form>
-                </div>
+                    <!-- </el-form>
+                </div> -->
             </div>
             <div slot="footer" class="dialog-footer">
                 <el-button @click="cancel" class="endbutton1"><span>取 消</span></el-button>
                     id: this.confirmData.id,
                     caseFlowId: this.confirmData.caseFlowId,
                     userList: userArr,
-                    herDates: this.formLabelAlign.time
+                    // herDates: this.formLabelAlign.time
                 })
             } else {
                 if (this.multipleSelection.length > 1) {
                     id: this.confirmData.id,
                     caseFlowId: this.confirmData.caseFlowId,
                     userList: this.mediatorArr,
-                    herDates: this.formLabelAlign.time
+                    // herDates: this.formLabelAlign.time
                 })
             }
         },

src/views/caseManagement/components/departmentMediator.vue

 <template>
     <div>
-        <el-dialog title="部门长确认时间/调解员" :visible="departmentVisable" v-if="departmentVisable" @close="cancel" center
+        <el-dialog title="部门长确认调解员" :visible="departmentVisable" v-if="departmentVisable" @close="cancel" center
             :distroy-on-close="true">
             <div style="margin-bottom: 20px;">
                 <el-radio-group v-model="confirmFlag">
                     <el-table-column prop="completeAmount" label="已办数量">
                     </el-table-column>
                 </el-table>
-                <div>
+                <!-- <div>
                     <div style="margin-top: 20px;margin-bottom: 20px;">时间</div>
                     <el-form label-position="right" label-width="80px" :model="formLabelAlign" :disabled="confirmShow">
                         <el-form-item label="时间">
                             <el-date-picker v-model="formLabelAlign.time[0]" type="datetime" placeholder="选择日期时间">
                             </el-date-picker>
-                        </el-form-item>
+                        </el-form-item> -->
                         <!-- 后期需要三个时间 -->
                         <!-- <el-form-item label="时间2">
                             <el-date-picker v-model="formLabelAlign.time[1]" type="datetime" placeholder="选择日期时间">
                             <el-date-picker v-model="formLabelAlign.time[2]" type="datetime" placeholder="选择日期时间">
                             </el-date-picker>
                         </el-form-item> -->
-                    </el-form>
-                </div>
+                    <!-- </el-form>
+                </div> -->
             </div>
             <div slot="footer" class="dialog-footer">
                 <el-button @click="cancel" class="endbutton1"><span>取 消</span></el-button>
                     id: this.departmentData.id,
                     caseFlowId: this.departmentData.caseFlowId,
                     userList: userArr,
-                    herDates: this.formLabelAlign.time
+                    // herDates: this.formLabelAlign.time
                 })
             } else {
                 if (this.multipleSelection.length > 1) {
                     id: this.departmentData.id,
                     caseFlowId: this.departmentData.caseFlowId,
                     userList: this.mediatorArr,
-                    herDates: this.formLabelAlign.time
+                    // herDates: this.formLabelAlign.time
                 })
             }
         },

src/views/caseManagement/components/timeConfirm.vue

+<template>
+    <div>
+        <el-dialog title="秘书确认时间" :visible="timeConfirmVisable" v-if="timeConfirmVisable" @close="cancel" center
+            :distroy-on-close="true">
+            <div style="margin-bottom: 20px;">
+                <el-radio-group v-model="confirmFlag">
+                    <el-radio :label="1">同意</el-radio>
+                    <el-radio :label="2">拒绝</el-radio>
+                </el-radio-group>
+            </div>
+            <div>
+                <div>
+                    <div style="margin-top: 20px;margin-bottom: 20px;">时间</div>
+                    <el-form label-position="right" label-width="80px" :model="formLabelAlign" :disabled="confirmShow">
+                        <el-form-item label="时间">
+                            <el-date-picker v-if="!confirmShow" v-model="formLabelAlign.time[0]" type="datetime" placeholder="选择日期时间">
+                            </el-date-picker>
+                            <el-input v-else v-model="formLabelAlign.name"></el-input>
+                        </el-form-item>
+                    </el-form>
+                </div>
+            </div>
+            <div slot="footer" class="dialog-footer">
+                <el-button @click="cancel" class="endbutton1"><span>取 消</span></el-button>
+                <el-button @click="submitMediator" class="endbutton1"><span>确 认</span></el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+  
+<script>
+import { Message } from 'element-ui'
+import { listMediator, selectReservation,confirmDate } from '@/api/caseManagement/caseManagement.js'
+import moment from "moment";
+export default {
+    props: ["timeConfirmVisable", "timeConfirmData", "queryParams"],
+    data() {
+        return {
+            tableData: [],
+            multipleSelection: [],
+            formLabelAlign: {
+                time: [],
+                name:""
+            },
+            formTimeArr: [],
+            mediatorArr: [],
+            confirmFlag: 1,
+            confirmShow: true,
+        };
+    },
+    watch: {
+        timeConfirmVisable(val) {
+            if (val) {
+                this.confirmFlag = 1;
+                this.mediatorArr = [];
+                this.formTimeArr = [];
+                this.selectReservationFn({ id: this.timeConfirmData.id })
+            }
+        },
+        confirmFlag(val) {
+            if (val == 1) {
+                this.confirmShow = true;
+                console.log(this.timeConfirmData.id);
+                this.selectReservationFn({ id: this.timeConfirmData.id })
+            } else {
+                this.confirmShow = false;
+                listMediator().then(res => {
+                    this.tableData = res.data;
+                })
+            }
+        }
+    },
+    methods: {
+        cancel() {
+            this.$emit("cancelTimeConfirm");
+        },
+        selectReservationFn(data) {
+            selectReservation(data).then(res => {
+                this.tableData = res.data.mediatorList;
+                // this.formLabelAlign.time[0] = res.data.herDates[0];
+                this.formLabelAlign.name = res.data.herDates[0]
+            })
+        },
+        /**核实时间 */
+        verifyMediatorFn(data) {
+            confirmDate(data).then(res => {
+                this.$modal.msgSuccess("成功");
+                this.$emit("cancelTimeConfirm");
+                this.$emit('getList', this.queryParams);
+            })
+        },
+        /**提交选择结果*/
+        async submitMediator() {
+            if (this.confirmFlag == 1) {
+                let userArr = [];
+                this.tableData.forEach(item => {
+                    userArr.push({
+                        userId: item.mediatorId,
+                        userName: item.mediatorName
+                    })
+                })
+                this.verifyMediatorFn({
+                    id: this.timeConfirmData.id,
+                    caseFlowId: this.timeConfirmData.caseFlowId,
+                    // userList: userArr,
+                    herDates: this.formLabelAlign.time
+                })
+            } else {
+                if (this.multipleSelection.length > 1) {
+                    Message.error('最多选择一名调解员');
+                    return
+                } else if (this.multipleSelection.length < 1) {
+                    Message.error('至少选择一名调解员');
+                    return
+                }
+                if (this.formLabelAlign.time.length < 1) {
+                    Message.error('至少选择一个时间');
+                    return
+                }
+                this.formLabelAlign.time.forEach(item => {
+                    item = moment(
+                        item
+                    ).format("YYYY-MM-DD HH:mm:ss");
+                    this.formTimeArr.push(item)
+                })
+                this.multipleSelection.forEach(item => {
+                    this.mediatorArr.push({
+                        userId: item.mediatorId,
+                        userName: item.mediatorName
+                    })
+                })
+                this.verifyMediatorFn({
+                    id: this.timeConfirmData.id,
+                    caseFlowId: this.timeConfirmData.caseFlowId,
+                    // userList: this.mediatorArr,
+                    herDates: this.formLabelAlign.time
+                })
+            }
+        },
+        handleSelectionChange(val) {
+            this.multipleSelection = val;
+        }
+    },
+};
+</script>
+  
+<style lang="scss" scoped>
+.steps {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+::v-deep .el-step {
+    // width: 150px;
+    flex-basis: 25% !important;
+    margin-right: 20px;
+    margin-bottom: 20px;
+}
+
+::v-deep .el-dialog__body {
+    height: 500px !important;
+    overflow: auto !important;
+}
+
+::v-deep .el-dialog {
+    width: 800px;
+    background: #ffffff;
+    border-radius: 20px;
+}
+
+.timeTitle {
+    width: 1000%;
+    text-align: center;
+}
+</style>