选择调解员，时间

src/api/caseManagement/caseManagement.js

       method: "post",
       data: data,
     });
+  }
+  //获取调解员列表
+  export function listMediator(data) {
+    return request({
+      url: "caseApplication/listMediator",
+      method: "get",
+      params: data,
+    });
+  }
+//   确认仲裁员以及时间
+export function updateBooking(data) {
+    return request({
+      url: "/caseApplication/updateBooking",
+      method: "post",
+      data: data,
+    });
   }

src/views/caseManagement/caseList.vue

                     <el-button size="mini" type="text" icon="el-icon-edit"
                         @click="evidenceUpload(scope.row)">证据修改</el-button>
                     <el-button size="mini" type="text" icon="el-icon-tickets" @click="payStatus(scope.row)">缴费</el-button>
+                    <el-button size="mini" type="text" icon="el-icon-tickets" @click="selectMediator(scope.row)">预约时间</el-button>
                 </template>
             </el-table-column>
         </el-table>
         <paymentdetailsDialog :openDialog="openDialog" @cancelpaymentdetails="cancelpaymentdetails" :title="payTitle" :detailform="detailform" :flag="flag" :paymentConfirma="paymentConfirma" :getList="getList"></paymentdetailsDialog>
         <!-- 案件受理 -->
         <caseAcceptance :showAcceptance="showAcceptance" @cancelAcceptance="cancelAcceptance" :caseAcceptanceData="caseAcceptanceData" :getList="getList"></caseAcceptance>
+        <!-- 调解员弹窗 -->
+        <selectMediator  @cancelMediator="cancelMediator" :mediatorVisable="mediatorVisable" :mediatorData="mediatorData" :getList="getList" :queryParams="queryParams"></selectMediator>
     </div>
 </template>
 
 import payDialog from "./components/payDialog.vue";
 import paymentdetailsDialog from './components/paymentdetailsDialog.vue'
 import caseAcceptance from './components/caseAcceptance.vue'
+import selectMediator from './components/selectMediator.vue'
 export default {
     name: "caseList",
     dicts: ["case_flow_node"],
         evidenceDialog,
         payDialog,
         paymentdetailsDialog,
-        caseAcceptance
+        caseAcceptance,
+        selectMediator,//调解员弹窗
     },
     data() {
         return {
             paymentConfirma:{},//缴费确认
             showAcceptance:false,//案件受理弹框
             caseAcceptanceData:{},//案件受理数据
+            mediatorVisable:false,//选择调解员弹窗
+            timeVisable:false,//预约时间弹窗
+            mediatorData:{},
             flag: null,
             caseData: {},
             evidenceData: {},
                 })
                 .catch(() => { });
         },
+        /** 选择调解员 */
+        selectMediator(val){
+            this.mediatorVisable = true;
+            this.mediatorData = val;
+        },
+        /** 预约时间 */
+        selectTime(val){
+            this.timeVisable = true;
+        },
         getDetail(parms) {
             caseApplicationSelectById(parms).then((res) => {
                 this.formPayDetail = res.data;
         paycancelRow(row) {
             this.openPay = false;
         },
+        /** 取消调解员弹窗 */
+        cancelMediator(){
+            this.mediatorVisable = false;
+        },
+        /** 取消预约时间弹窗 */
+        cancelTime(){
+            this.timeVisable = false;
+        },
         /** 搜索按钮操作 */
         handleQuery() {
             this.queryParams.pageNum = 1;

src/views/caseManagement/components/selectMediator.vue

+<template>
+    <div>
+        <el-dialog title="预约时间/调解员" :visible="mediatorVisable" v-if="mediatorVisable" @close="cancel" center :distroy-on-close="true">
+            <div>
+                <div>
+                    <div style="margin-bottom: 20px;">预约调解员</div>
+                </div>
+                <el-table ref="multipleTable" :data="tableData" tooltip-effect="dark" style="width: 100%"
+                    @selection-change="handleSelectionChange">
+                    <el-table-column type="selection" width="55">
+                    </el-table-column>
+                    <el-table-column prop="mediatorName" label="调解员名称">
+                    </el-table-column>
+                    <el-table-column prop="specialty" label="专业">
+                    </el-table-column>
+                    <el-table-column prop="todoAmount" label="待办数量">
+                    </el-table-column>
+                    <el-table-column prop="completeAmount" label="已办数量">
+                    </el-table-column>
+                </el-table>
+                <div>
+                    <div style="margin-top: 20px;margin-bottom: 20px;">预约时间</div>
+                    <el-form label-position="right" label-width="80px" :model="formLabelAlign">
+                        <el-form-item label="时间1">
+                            <el-date-picker v-model="formLabelAlign.time[0]" type="datetime" placeholder="选择日期时间">
+                            </el-date-picker>
+                        </el-form-item>
+                        <el-form-item label="时间2">
+                            <el-date-picker v-model="formLabelAlign.time[1]" type="datetime" placeholder="选择日期时间">
+                            </el-date-picker>
+                        </el-form-item>
+                        <el-form-item label="时间3">
+                            <el-date-picker v-model="formLabelAlign.time[2]" type="datetime" placeholder="选择日期时间">
+                            </el-date-picker>
+                        </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,updateBooking } from '@/api/caseManagement/caseManagement.js'
+import moment from "moment";
+export default {
+    props: ["mediatorVisable", "mediatorData","queryParams"],
+    data() {
+        return {
+            tableData: [],
+            multipleSelection: [],
+            formLabelAlign: {
+                time:[]
+            },
+            formTimeArr:[],
+            mediatorArr:[]
+        };
+    },
+    watch: {
+        mediatorVisable(val) {
+            if (val) {
+                // this.this.multipleSelection = [];
+                // this.formLabelAlign.time = [];
+                listMediator().then(res=>{
+                    this.tableData = res.data;
+                })
+            }
+        }
+    },
+    methods: {
+        cancel() {
+            this.$emit("cancelMediator");
+        },
+        /**提交选择结果*/
+        async submitMediator() {
+            if (this.multipleSelection.length > 3) {
+                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
+                })
+            })
+            await this.updateBookingFn({
+                id:this.mediatorData.id,
+                caseFlowId:this.mediatorData.caseFlowId,
+                userList:this.mediatorArr,
+                herDates:this.formTimeArr
+            })
+            console.log(this.mediatorArr,this.formTimeArr,"LLLLLLLLLLLLLLLLLLLLLLLL");
+        },
+        async updateBookingFn(data){
+            await updateBooking(data).then(res=>{
+                this.$modal.msgSuccess("成功");
+                this.$emit("getList",this.queryParams);
+                this.cancel();
+            })
+        },
+        handleSelectionChange(val) {
+            this.multipleSelection = val;
+            // console.log(this.multipleSelection,"LLLLLLLLLLLLLLLLL");
+        }
+    },
+};
+</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>

src/views/system/user/index.vue

             </el-form-item>
           </el-col>
         </el-row>
+        <el-row>
+          <el-col :span="24">
+            <el-form-item label="专长">
+              <el-input v-model="form.specialty" type="textarea" placeholder="请输入内容"></el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
       </el-form>
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitForm">确 定</el-button>