整合工程
This commit is contained in:
		| @@ -1,101 +0,0 @@ | ||||
| <template> | ||||
|   <section class="conference"> | ||||
|     <ai-list v-if="!showDetail"> | ||||
|       <template slot="title"> | ||||
|         <ai-title title="会议管理"></ai-title> | ||||
|       </template> | ||||
|       <template slot="tabs"> | ||||
|         <el-tabs v-model="currIndex" @tab-click="handleClick"> | ||||
|           <el-tab-pane v-for="(tab,i) in tabs" :key="i" :label="tab.label" :name="String(i)"> | ||||
|             <component :is="tab.comp" v-if="currIndex==i" :ref="currIndex" :instance="instance" :dict="dict" | ||||
|                        :permissions="permissions" @goPage="goPage" :listType="listType" /> | ||||
|           </el-tab-pane> | ||||
|         </el-tabs> | ||||
|       </template> | ||||
|     </ai-list> | ||||
|  | ||||
|     <component v-else :is="currentComp" :instance="instance" :dict="dict" :detail="detailRow" :listType="listType" @gotoEdit="gotoAdd" ></component> | ||||
|  | ||||
|   </section> | ||||
| </template> | ||||
| <script> | ||||
| import addMeeting from './addMeeting'; | ||||
| import detail from './detail' | ||||
| import list from './list' | ||||
|  | ||||
| export default { | ||||
|   name: 'AppConference', | ||||
|   label: "会议管理", | ||||
|   components: {addMeeting, detail, list}, | ||||
|   provide() { | ||||
|     return { | ||||
|       top: this | ||||
|     } | ||||
|   }, | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     dict: Object, | ||||
|     permissions: Function, | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       //会议状态,0、草稿;1、未开始;2、进行中;3、已取消;4、已结束 | ||||
|       //参会状态,0、未确认;1、已确认;2、缺席 | ||||
|       currIndex: "0", | ||||
|       currentComp: "", | ||||
|       showDetail: false, | ||||
|       detailRow: {}, | ||||
|       listType: '1', | ||||
|     } | ||||
|   }, | ||||
|   computed:{ | ||||
|     tabs() { | ||||
|       return [ | ||||
|         {label: "我参与的会议", name: "addMeeting", comp: list, detail: detail, permission: ""}, | ||||
|         {label: "我发起的会议", name: "addMeeting",  comp: list, detail: detail, permission: ""}, | ||||
|       ] | ||||
|     }, | ||||
|   }, | ||||
|  | ||||
|   methods: { | ||||
|     goPage(params) { | ||||
|       this.detailRow = params.row | ||||
|       this.currentComp = params.comp | ||||
|  | ||||
|       if(params.comp == 'detail' || params.comp == 'addMeeting') { | ||||
|         this.showDetail = true | ||||
|       } | ||||
|     }, | ||||
|     handleClick() { | ||||
|       if (this.currIndex == 0) { | ||||
|         this.listType = '1' | ||||
|       } else { | ||||
|         this.listType = '0' | ||||
|       } | ||||
|     }, | ||||
|     goBack() { | ||||
|       this.showDetail = false; | ||||
|       if (this.currIndex == '0') { | ||||
|         this.listType = '1' | ||||
|       } else { | ||||
|         this.listType = '0' | ||||
|       } | ||||
|     }, | ||||
|     gotoAdd(obj) { | ||||
|       this.showDetail = true | ||||
|       this.detailRow = obj | ||||
|       this.currentComp = 'addMeeting' | ||||
|     }, | ||||
|   }, | ||||
| } | ||||
| </script> | ||||
| <style lang="scss" scoped> | ||||
|   .conference { | ||||
|     height: 100%; | ||||
|  | ||||
|     :deep( .ai-list__content--right-wrapper ){ | ||||
|       background-color: transparent !important; | ||||
|       box-shadow: none !important; | ||||
|     } | ||||
|   } | ||||
| </style> | ||||
| @@ -1,244 +0,0 @@ | ||||
| <template> | ||||
|   <ai-detail class="addMeeting"> | ||||
|     <ai-title slot="title" title="发起会议" isShowBack isShowBottomBorder @onBackClick="$parent.goBack"/> | ||||
|     <template #content> | ||||
|       <ai-card title="会议信息"> | ||||
|         <template #content> | ||||
|           <el-form :model="saveData" status-icon ref="ruleForm" :rules="rules" label-width="100px" | ||||
|                    label-position="right"> | ||||
|             <el-form-item label="会议标题:" prop="title"> | ||||
|               <el-input v-model="saveData.title" size="small" placeholder="请输入..." | ||||
|                         :maxlength="30" show-word-limit></el-input> | ||||
|             </el-form-item> | ||||
|             <el-row type="flex" justify="space-between"> | ||||
|               <el-form-item label="开始时间:" prop="startTime"> | ||||
|                 <el-date-picker | ||||
|                     :editable="false" | ||||
|                     value-format="yyyy-MM-dd HH:mm:ss" | ||||
|                     v-model="saveData.startTime" | ||||
|                     :picker-options="pickerOptions" | ||||
|                     type="datetime" | ||||
|                     size="small" | ||||
|                     placeholder="选择开始时间"> | ||||
|                 </el-date-picker> | ||||
|               </el-form-item> | ||||
|               <el-form-item label="结束时间:" prop="endTime"> | ||||
|                 <el-date-picker | ||||
|                     :editable="false" | ||||
|                     value-format="yyyy-MM-dd HH:mm:ss" | ||||
|                     v-model="saveData.endTime" | ||||
|                     :picker-options="pickerOptions" | ||||
|                     type="datetime" | ||||
|                     :disabled="!Boolean(saveData.startTime)" | ||||
|                     size="small" | ||||
|                     placeholder="选择结束时间"> | ||||
|                 </el-date-picker> | ||||
|               </el-form-item> | ||||
|             </el-row> | ||||
|             <el-form-item label="会议地点:" prop="address"> | ||||
|               <el-input v-model="saveData.address" size="small" placeholder="请输入..." | ||||
|                         :maxlength="30" show-word-limit></el-input> | ||||
|             </el-form-item> | ||||
|             <el-form-item label="会议内容:" prop="content"> | ||||
|               <el-input v-model="saveData.content" size="small" placeholder="请输入..." | ||||
|                         type="textarea" :rows="8" :maxlength="500" show-word-limit></el-input> | ||||
|             </el-form-item> | ||||
|             <el-row type="flex" justify="space-between"> | ||||
|               <el-form-item label="参会提醒:" prop="noticeBefore"> | ||||
|                 <ai-select v-model="saveData.noticeBefore" | ||||
|                            placeholder="请选择" | ||||
|                            :selectList="dict.getDict('meetingNoticeBefore')" | ||||
|                 ></ai-select> | ||||
|               </el-form-item> | ||||
|               <el-form-item label="确认提醒:" prop="noticeAfter"> | ||||
|                 <ai-select v-model="saveData.noticeAfter" | ||||
|                            placeholder="请选择" | ||||
|                            :selectList="dict.getDict('meetingNoticeAfter')" | ||||
|                 ></ai-select> | ||||
|               </el-form-item> | ||||
|             </el-row> | ||||
|             <el-form-item label="会议资料:" prop="files"> | ||||
|               <ai-uploader :instance="instance" @change="handleChange" isShowTip fileType="file" | ||||
|                            v-model="saveData.fileList" | ||||
|                            acceptType=".zip,.rar,.doc,.docx,.xls,.ppt,.pptx,.pdf,.txt,.jpg,.png,.xlsx" | ||||
|                            :limit="9"></ai-uploader> | ||||
|             </el-form-item> | ||||
|           </el-form> | ||||
|         </template> | ||||
|       </ai-card> | ||||
|       <ai-card title="参会人员信息"> | ||||
|         <template #right> | ||||
|           <ai-wechat-selecter slot="append" :instance="instance" v-model="saveData.attendees"> | ||||
|             <el-button type="text" icon="iconfont iconAdd">选择参会人员</el-button> | ||||
|           </ai-wechat-selecter> | ||||
|         </template> | ||||
|         <template #content> | ||||
|           <ai-table | ||||
|               border | ||||
|               :tableData="saveData.attendees" | ||||
|               :colConfigs="colConfigs" | ||||
|               :isShowPagination="false"> | ||||
|             <el-table-column label="操作" slot="option" align="center"> | ||||
|               <template v-slot="{row}"> | ||||
|                 <el-button type="text" title="删除" @click="deletePer(row)">删除</el-button> | ||||
|               </template> | ||||
|             </el-table-column> | ||||
|           </ai-table> | ||||
|         </template> | ||||
|       </ai-card> | ||||
|     </template> | ||||
|     <template #footer> | ||||
|       <el-button @click="$parent.goBack">取消</el-button> | ||||
|       <el-button type="primary" @click="saveFrom(0)">保存草稿</el-button> | ||||
|       <el-button type="primary" @click="saveFrom(1)">保存并发布</el-button> | ||||
|     </template> | ||||
|   </ai-detail> | ||||
| </template> | ||||
| <script> | ||||
| import {mapState} from "vuex"; | ||||
| import moment from 'dayjs' | ||||
|  | ||||
| export default { | ||||
|   name: "addMeeting", | ||||
|   inject: ['top'], | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     dict: Object, | ||||
|     permissions: Function, | ||||
|     detail: Object | ||||
|   }, | ||||
|   data() { | ||||
|     let endTimePass = (rule, value, callback) => { | ||||
|       if (value) { | ||||
|         if (moment(value).unix() - moment(this.saveData.startTime).unix() > 0) { | ||||
|           callback() | ||||
|         } else { | ||||
|           callback(new Error('结束时间要大于开始时间')); | ||||
|         } | ||||
|       } else { | ||||
|         callback(new Error('请选择结束时间')); | ||||
|       } | ||||
|     } | ||||
|     return { | ||||
|       saveData: { | ||||
|         noticeBefore: '4', | ||||
|         noticeAfter: '0', | ||||
|         attendees: [], | ||||
|         fileList: [] | ||||
|       }, | ||||
|       rules: { | ||||
|         title: [{required: true, message: '请填写会议标题', trigger: 'blur'}], | ||||
|         startTime: [{required: true, message: '请选择开始时间', trigger: 'blur'}], | ||||
|         endTime: [{required: true, validator: endTimePass, trigger: 'change'}], | ||||
|         address: [{required: true, message: '请填写会议地点', trigger: 'blur'}], | ||||
|         // content: [{required: true, message: '请填写会议内容', trigger: 'blur'}], | ||||
|         noticeBefore: [{required: true, message: '请选择参会提醒', trigger: 'blur'}], | ||||
|         noticeAfter: [{required: true, message: '请选择确认提醒', trigger: 'blur'}], | ||||
|       }, | ||||
|       pickerOptions: { | ||||
|         disabledDate(time) { | ||||
|           return time.getTime() < Date.now() - 8.64e7; | ||||
|         } | ||||
|       }, | ||||
|       showEdit: false, | ||||
|       total: 0, | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     handleChange(e) { | ||||
|       this.saveData.fileList = e | ||||
|     }, | ||||
|     deletePer(scope) { | ||||
|       this.$confirm('确认删除此参会人?') | ||||
|       .then(_ => { | ||||
|         if (this.detail.id) { //编辑 | ||||
|  | ||||
|         } else { //新增 | ||||
|           this.saveData.attendees.map((item, index) => { | ||||
|             if (item.id == scope.id) { | ||||
|               this.saveData.attendees.splice(index, 1) | ||||
|             } | ||||
|           }) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     saveFrom(status) { | ||||
|       this.$refs["ruleForm"].validate((valid) => { | ||||
|         if (this.saveData.attendees.length == 0) { | ||||
|           return this.$message.error("参会人不能为空!") | ||||
|         } | ||||
|         if (moment(this.saveData.startTime).unix() - moment(Date.now()).unix() < 0) { | ||||
|           return this.$message.error("会议开始时间已过期,请重新选择!"); | ||||
|         } | ||||
|         if (valid) { | ||||
|  | ||||
|           this.saveData.files = [] | ||||
|           this.saveData.fileList.map((item) => { | ||||
|             this.saveData.files.push(item.id) | ||||
|           }) | ||||
|           this.instance.post(`/app/appmeetinginfo/add-update`, { | ||||
|             ...this.saveData, | ||||
|             status: status, | ||||
|           }).then(res => { | ||||
|             if (res.code == 0) { | ||||
|               if (status != 1) { | ||||
|                 this.$message.success("保存草稿成功") | ||||
|               } else { | ||||
|                 this.$message.success("发布成功") | ||||
|               } | ||||
|               this.$parent.goBack(); | ||||
|             } | ||||
|           }); | ||||
|         } | ||||
|       }); | ||||
|     }, | ||||
|     getDetail() { | ||||
|       this.instance.post(`/app/appmeetinginfo/info-id?id=${this.detail.id}`).then(res => { | ||||
|         if (res?.data) { | ||||
|           this.saveData = { | ||||
|             ...res.data, | ||||
|           }; | ||||
|           this.saveData.fileList = res.data.files || [] | ||||
|         } | ||||
|       }); | ||||
|     } | ||||
|   }, | ||||
|   created() { | ||||
|     this.dict.load("meetingNoticeAfter", "meetingNoticeBefore").then( | ||||
|         this.$nextTick(() => { | ||||
|           if (JSON.stringify(this.detail) == '{}') { | ||||
|             this.showEdit = false; | ||||
|           } else { | ||||
|             this.showEdit = true; | ||||
|             // this.saveData = {...this.detail}; | ||||
|             // this.compereList = this.saveData.hosts; | ||||
|             // this.saveData.attendees = this.saveData.attendees || []; | ||||
|             this.getDetail() | ||||
|           } | ||||
|         }) | ||||
|     ) | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|     headerTitle() { | ||||
|       return this.showEdit ? '修改会议' : '发起会议' | ||||
|     }, | ||||
|     colConfigs() { | ||||
|       return [ | ||||
|         {prop: 'name', align: 'center', label: '姓名'}, | ||||
|         {prop: 'departName', align: 'center', label: '所属单位'}, | ||||
|         {slot: 'option'} | ||||
|       ] | ||||
|     }, | ||||
|   } | ||||
| } | ||||
| </script> | ||||
| <style lang="scss" scoped> | ||||
| .addMeeting { | ||||
|   :deep( .el-button--text ){ | ||||
|     .iconfont { | ||||
|       color: inherit; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,595 +0,0 @@ | ||||
| <template> | ||||
|   <section class="meetingDetail detail-content"> | ||||
|     <ai-detail> | ||||
|       <template #title> | ||||
|         <ai-title title="会议详情" isShowBottomBorder isShowBack @onBackClick="$parent.goBack"> | ||||
|           <template #rightBtn> | ||||
|             <p class="conference_top_area" v-if="listType==0"> | ||||
|               <!-- <el-button type="primary" v-if="detail.status==0" @click="changeMeeting('是否立即发布会议?')">立即发布</el-button> --> | ||||
|               <el-button type="primary" v-if="detail.status==1" @click="noticeMetting()">参会提醒</el-button> | ||||
|               <el-button type="primary" v-if="detail.status==0" @click="editMeeting()">修改会议</el-button> | ||||
|               <el-button class="del-btn-list" v-if="detail.status==1" @click="changeMeeting('是否取消会议?')">取消会议</el-button> | ||||
|               <el-button class="iconfont iconDelete del-btn-list" v-if="detail.status==0||detail.status==3" | ||||
|                          @click="changeMeeting('是否删除会议?')">删除会议 | ||||
|               </el-button> | ||||
|             </p> | ||||
|             <!-- v-if="detail.status==0||detail.status==3" --> | ||||
|             <p class="conference_top_area" v-if="listType==1&&info.status==1"> | ||||
|               <el-button @click="toDo" style="width:80px;" class="del-btn-list">待定</el-button> | ||||
|               <el-button @click="innerVisible=true" v-if="info.joinStatus!=2" style="width:80px;" class="del-btn-list"> | ||||
|                 请假 | ||||
|               </el-button> | ||||
|               <el-button type="primary" @click="changeMeeting('是否确认参会?')" v-if="info.joinStatus!=1" style="width:80px;"> | ||||
|                 确认参会 | ||||
|               </el-button> | ||||
|             </p> | ||||
|           </template> | ||||
|         </ai-title> | ||||
|       </template> | ||||
|       <template #content> | ||||
|         <ai-dialog | ||||
|             title="确认请假" | ||||
|             :visible.sync="innerVisible" | ||||
|             @onConfirm="queMeeting('writeInfo')" | ||||
|             @onCancel="innerVisible=false;" @close="$refs.writeInfo.resetFields()" | ||||
|             width="520px"> | ||||
|           <div class="addother_main" style="width:400px;margin:auto;"> | ||||
|             <el-form :model="writeInfo" status-icon ref="writeInfo" label-width="100px" class="demo-ruleForm"> | ||||
|               <el-form-item label="请假原因:" prop="reason" autocomplete="off" | ||||
|                             :rules="{ | ||||
|                                         required: true, message: '请假原因不能为空', trigger: 'blur' | ||||
|                                     }" | ||||
|               > | ||||
|                 <el-input v-model.trim="writeInfo.reason" autocomplete="off" size="mini" placeholder="请输入..." | ||||
|                           type="textarea" :rows="4" :maxlength="100" show-word-limit></el-input> | ||||
|               </el-form-item> | ||||
|  | ||||
|             </el-form> | ||||
|           </div> | ||||
|         </ai-dialog> | ||||
|         <ai-card title="会议说明"> | ||||
|           <template slot="content"> | ||||
|             <ai-wrapper class="mar-t16" label-width="70px" :columnsNumber="1"> | ||||
|               <ai-info-item label="会议标题:"><span>{{ info.title }}</span></ai-info-item> | ||||
|             </ai-wrapper> | ||||
|             <ai-wrapper class="mar-t16" label-width="70px" :columnsNumber="2"> | ||||
|               <ai-info-item label="发起单位:" :value="info.unitName"> | ||||
|               </ai-info-item> | ||||
|               <ai-info-item label="发起人:" :value="info.userName"> | ||||
|               </ai-info-item> | ||||
|             </ai-wrapper> | ||||
|             <ai-wrapper class="mar-t16" label-width="70px" :columnsNumber="1"> | ||||
|               <!-- <ai-info-item label="会议状态:" v-if="xq.joinStatus==1&&listType==1"><span>{{ xq.joinStatus }}</span> | ||||
|               </ai-info-item> --> | ||||
|               <ai-info-item label="发起时间:"><span>{{ info.createTime }}</span></ai-info-item> | ||||
|             </ai-wrapper> | ||||
|             <ai-wrapper class="mar-t16" label-width="70px" :columnsNumber="2"> | ||||
|               <ai-info-item label="开始时间:"><span>{{ info.startTime }}</span></ai-info-item> | ||||
|               <ai-info-item label="结束时间:"><span>{{ info.endTime }}</span></ai-info-item> | ||||
|             </ai-wrapper> | ||||
|             <ai-wrapper class="mar-t16" label-width="70px" :columnsNumber="2"> | ||||
|               <ai-info-item label="参会提醒:"><span>{{ | ||||
|                   dict.getLabel("meetingNoticeBefore", info.noticeBefore) || "-" | ||||
|                 }}</span></ai-info-item> | ||||
|               <ai-info-item label="确认提醒:"><span>{{ | ||||
|                   dict.getLabel("meetingNoticeAfter", info.noticeAfter) || "-" | ||||
|                 }}</span> | ||||
|               </ai-info-item> | ||||
|             </ai-wrapper> | ||||
|             <ai-wrapper class="mar-t16" label-width="70px" :columnsNumber="1"> | ||||
|               <ai-info-item label="会议地点:"><span>{{ info.address }}</span></ai-info-item> | ||||
|             </ai-wrapper> | ||||
|             <ai-wrapper class="mar-t16" label-width="70px" :columnsNumber="1"> | ||||
|               <ai-info-item label="会议内容:"><span v-html="info.content"></span></ai-info-item> | ||||
|             </ai-wrapper> | ||||
|           </template> | ||||
|         </ai-card> | ||||
|         <ai-card title="会议资料"> | ||||
|           <template slot="content"> | ||||
|             <ai-file-list :fileList="info.files" :fileOps="{name: 'name', size: 'fileSizeStr'}"></ai-file-list> | ||||
|           </template> | ||||
|         </ai-card> | ||||
|         <ai-card title="参会名单"> | ||||
|           <template slot="content"> | ||||
|             <ai-search-bar bottomBorder> | ||||
|               <template #left> | ||||
|                 <el-select v-model="search.joinStatus" placeholder="确认状态" size="small" clearable class="vc-input-160" @change="searchMeetinguser"> | ||||
|                   <el-option | ||||
|                       v-for="(item,k) in confirmStatus" | ||||
|                       :key="k" | ||||
|                       :label="item.label" | ||||
|                       :value="k"> | ||||
|                   </el-option> | ||||
|                 </el-select> | ||||
|               </template> | ||||
|               <template #right> | ||||
|                 <!-- <ai-download :instance="instance" url="/app/appepidemicbackhomerecord/export" fileName="参会名单"> | ||||
|                   <el-button icon="iconfont iconExported">导出</el-button> | ||||
|                 </ai-download> --> | ||||
|               </template> | ||||
|             </ai-search-bar> | ||||
|             <ai-table | ||||
|                 :tableData="info.attendees" | ||||
|                 :colConfigs="colConfigs" | ||||
|                 style="margin-top: 12px;" | ||||
|                 :isShowPagination="false"> | ||||
|               <el-table-column slot="meetingUserName" | ||||
|                                label="姓名" | ||||
|                                align="center" | ||||
|                                show-overflow-tooltip> | ||||
|                 <div slot-scope="{row}"> | ||||
|                   <span>{{ row.meetingUserName }}</span> | ||||
|                 </div> | ||||
|               </el-table-column> | ||||
|  | ||||
|               <el-table-column slot="meetingUnitName" | ||||
|                                label="所属部门" | ||||
|                                align="center" | ||||
|                                show-overflow-tooltip> | ||||
|                 <div slot-scope="{row}"> | ||||
|                   <span>{{ row.meetingUnitName }}</span> | ||||
|                 </div> | ||||
|               </el-table-column> | ||||
|  | ||||
|               <el-table-column slot="joinStatus" | ||||
|                                prop="joinStatus" | ||||
|                                label="确认状态" | ||||
|                                align="center" | ||||
|                                show-overflow-tooltip> | ||||
|                 <div slot-scope="{row}"> | ||||
|                   <p style="color:rgba(255,68,102,1);display:flex;justify-content:center;" v-if="row.joinStatus==2"> | ||||
|                     请假<i class="el-icon-warning" :title="row.absence" style="cursor: pointer;"></i> | ||||
|                   </p> | ||||
|                   <span v-else :style="{color:confirmStatus[row.joinStatus].color}" | ||||
|                         v-text="confirmStatus[row.joinStatus].label"/> | ||||
|                 </div> | ||||
|               </el-table-column> | ||||
|               <el-table-column slot="option" | ||||
|                                label="操作" | ||||
|                                align="center" | ||||
|                                v-if="listType==0" | ||||
|                                show-overflow-tooltip> | ||||
|                 <div slot-scope="{row}" v-if="row.joinStatus==0"> | ||||
|                   <span class="el-icon-message-solid" style="cursor: pointer;" title="参会提醒" | ||||
|                         @click="noticeMetting(row.meetingUserId)" v-if="detail.status==1"></span> | ||||
|                 </div> | ||||
|               </el-table-column> | ||||
|             </ai-table> | ||||
|           </template> | ||||
|         </ai-card> | ||||
|       </template> | ||||
|     </ai-detail> | ||||
|   </section> | ||||
| </template> | ||||
| <script> | ||||
| import {mapState} from "vuex"; | ||||
|  | ||||
| export default { | ||||
|   name: 'meetingDetail', | ||||
|   inject: ['top'], | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     dict: Object, | ||||
|     permissions: Function, | ||||
|     detail: Object, | ||||
|     listType: String | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       navId: '1', | ||||
|       info: {}, | ||||
|       total: 0, | ||||
|       writeInfo: {reason: ''}, | ||||
|       meetingUserList: [], | ||||
|       innerVisible: false, | ||||
|       search: {joinStatus: ''} | ||||
|     } | ||||
|   }, | ||||
|   created() { | ||||
|     this.dict.load("meetingNoticeAfter", "meetingNoticeBefore").then(() => this.searchDetail(this.detail.id)) | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|     colConfigs() { | ||||
|       return [ | ||||
|         { | ||||
|           slot: 'meetingUserName' | ||||
|         }, | ||||
|         { | ||||
|           slot: 'meetingUnitName' | ||||
|         }, | ||||
|         { | ||||
|           slot: 'joinStatus', | ||||
|         }, | ||||
|         {prop: 'signInStatus', align: 'center', label: '签到', format: v => v === '1' ? '已签到' : '未签到'}, | ||||
|         { | ||||
|           slot: 'option', | ||||
|         } | ||||
|       ] | ||||
|     }, | ||||
|     confirmStatus() { | ||||
|       return { | ||||
|         0: {label: '未确认', color: "rgba(255,136,34,1)"}, | ||||
|         1: {label: '已确认', color: "rgba(34,102,255,1)"}, | ||||
|         2: {label: '请假', color: "rgba(255,68,102,1)"}, | ||||
|         3: {label: '待定', color: "rgba(255,136,34,1)"}, | ||||
|       } | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     toDo() { | ||||
|       this.$confirm("是否确认待定会议?").then(_ => { | ||||
|         this.instance.post("/app/appmeetinginfo/tobeConfirm", null, { | ||||
|           params: { | ||||
|             meetingId: this.detail.id, | ||||
|           } | ||||
|         }).then(res => { | ||||
|           if (res.code == 0) { | ||||
|             this.$message.success("会议待定"); | ||||
|             setTimeout(_ => { | ||||
|               this.$parent.goBack(); | ||||
|             }, 800) | ||||
|           } | ||||
|         }) | ||||
|       }) | ||||
|     }, | ||||
|     searchMeetinguser() { | ||||
|       this.instance.post(`/app/appmeetinguser/list`, null, { | ||||
|         params: {...this.search, size: 999, meetingId: this.info.id} | ||||
|       }).then(res => { | ||||
|         if (res?.data) { | ||||
|           this.info.attendees = res.data.records; | ||||
|           this.total = res.data.total; | ||||
|  | ||||
|         } | ||||
|       }); | ||||
|     }, | ||||
|     searchDetail(id) { | ||||
|       this.instance.post(`/app/appmeetinginfo/info-id`, null, { | ||||
|         params: {id} | ||||
|       }).then(res => { | ||||
|         if (res?.data) { | ||||
|           let {files = [], content} = res.data | ||||
|           content = content.replace(/(\r\n)|(\n)/g, "<br>") | ||||
|           this.info = {...res.data, content, files}; | ||||
|           this.searchMeetinguser() | ||||
|         } | ||||
|       }); | ||||
|     }, | ||||
|     changeMeeting(title, id) { | ||||
|       this.$confirm(title, { | ||||
|         type: 'warning' | ||||
|       }).then(() => { | ||||
|         if (title == '是否立即发布会议?') { | ||||
|           this.fbMeeting(); | ||||
|         } else if (title == '是否删除会议?') { | ||||
|           this.sdMeeting(); | ||||
|         } else if (title == '是否取消会议?') { | ||||
|           this.qxMeeting(); | ||||
|         } else if (title == '是否确认参会?') { | ||||
|           this.qrMeeting(); | ||||
|         } else if (title == '是否删除此参会人员?') { | ||||
|           this.deleteMeetingPer(id) | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     deleteMeetingPer(id) { | ||||
|       this.instance.post(`/app/appmeetinguser/delete`, null, | ||||
|           { | ||||
|             params: { | ||||
|               id | ||||
|             } | ||||
|           } | ||||
|       ).then(res => { | ||||
|  | ||||
|         if (res && res.code == 0) { | ||||
|           this.$message.success("删除成功!"); | ||||
|           this.searchMeetinguser(); | ||||
|         } | ||||
|  | ||||
|       }); | ||||
|     }, | ||||
|     queMeeting(formName) { | ||||
|       this.$refs[formName].validate((valid) => { | ||||
|         if (valid) { | ||||
|           this.instance.post(`/app/appmeetinginfo/absent`, null, | ||||
|               { | ||||
|                 params: { | ||||
|                   meetingId: this.detail.id, | ||||
|                   reason: this.writeInfo.reason | ||||
|                 } | ||||
|               } | ||||
|           ).then(res => { | ||||
|  | ||||
|             if (res && res.code == 0) { | ||||
|               this.innerVisible = false; | ||||
|               this.$parent.goBack(); | ||||
|             } | ||||
|  | ||||
|           }); | ||||
|         } else { | ||||
|           return false; | ||||
|         } | ||||
|       }); | ||||
|  | ||||
|     }, | ||||
|     qrMeeting() { | ||||
|       this.instance.post(`/app/appmeetinginfo/confirm`, null, | ||||
|           { | ||||
|             params: { | ||||
|               meetingId: this.detail.id | ||||
|  | ||||
|             } | ||||
|           } | ||||
|       ).then(res => { | ||||
|  | ||||
|         if (res && res.code == 0) { | ||||
|           this.$message.success("确认参会成功!") | ||||
|           this.$parent.goBack(); | ||||
|         } | ||||
|  | ||||
|       }); | ||||
|     }, | ||||
|     noticeMetting(meetingUserId) { | ||||
|       this.instance.post(`/app/appmeetinginfo/notice`, null, { | ||||
|         params: { | ||||
|           meetingId: this.detail.id, noticeALL: !meetingUserId, meetingUserId | ||||
|         } | ||||
|       }).then(res => { | ||||
|         if (res && res.code == 0) { | ||||
|           this.$message.success("提醒成功!") | ||||
|         } | ||||
|  | ||||
|       }); | ||||
|     }, | ||||
|     fbMeeting() { | ||||
|       this.instance.post(`/app/appmeetinginfo/release`, null, | ||||
|           { | ||||
|             params: { | ||||
|               meetingId: this.detail.id | ||||
|             } | ||||
|           } | ||||
|       ).then(res => { | ||||
|  | ||||
|         if (res && res.code == 0) { | ||||
|           this.$message.success("发布成功!") | ||||
|           this.$parent.goBack(); | ||||
|         } | ||||
|  | ||||
|       }); | ||||
|  | ||||
|     }, | ||||
|     sdMeeting() { | ||||
|       this.instance.post(`/app/appmeetinginfo/delete`, null, | ||||
|           { | ||||
|             params: { | ||||
|               meetingId: this.detail.id | ||||
|             } | ||||
|           } | ||||
|       ).then(res => { | ||||
|  | ||||
|         if (res && res.code == 0) { | ||||
|           this.$message.success("删除成功!"); | ||||
|           this.$parent.goBack(); | ||||
|         } | ||||
|  | ||||
|       }); | ||||
|     }, | ||||
|     qxMeeting() { | ||||
|       this.instance.post(`/app/appmeetinginfo/cancel`, null, | ||||
|           { | ||||
|             params: { | ||||
|               meetingId: this.detail.id | ||||
|             } | ||||
|           } | ||||
|       ).then(res => { | ||||
|  | ||||
|         if (res && res.code == 0) { | ||||
|           this.$message.success("取消会议成功!"); | ||||
|           this.$parent.goBack(); | ||||
|         } | ||||
|  | ||||
|       }); | ||||
|     }, | ||||
|     editMeeting() { | ||||
|       this.$parent.goBack(); | ||||
|       this.$emit('gotoEdit', this.info) | ||||
|     }, | ||||
|   } | ||||
| } | ||||
| </script> | ||||
| <style lang="scss" scoped> | ||||
| .meetingDetail { | ||||
|   width: 100%; | ||||
|   height: 100%; | ||||
|   background: rgba(255, 255, 255, 1); | ||||
|  | ||||
|   .conference_top_area { | ||||
|     display: flex; | ||||
|     align-items: center; | ||||
|   } | ||||
|  | ||||
|   .user-search { | ||||
|     width: 100%; | ||||
|     height: 48px; | ||||
|     display: flex; | ||||
|     justify-content: space-between; | ||||
|     align-items: center; | ||||
|  | ||||
|     .float-right { | ||||
|       width: calc(100% - 200px); | ||||
|       text-align: right; | ||||
|     } | ||||
|  | ||||
|     .input-162 { | ||||
|       display: inline-block; | ||||
|       width: 162px; | ||||
|     } | ||||
|  | ||||
|   } | ||||
|  | ||||
|   .content { | ||||
|     width: 1000px; | ||||
|     height: calc(100% - 50px); | ||||
|     overflow: hidden; | ||||
|     margin: auto; | ||||
|     display: flex; | ||||
|     justify-content: space-around; | ||||
|  | ||||
|     .content-left { | ||||
|       width: 160px; | ||||
|       height: 100%; | ||||
|  | ||||
|       .content-left-nav { | ||||
|         width: 158px; | ||||
|         background-color: #ffffff; | ||||
|         border-radius: 4px; | ||||
|         border: solid 1px #eeeeee; | ||||
|         margin-top: 56px; | ||||
|         overflow: hidden; | ||||
|  | ||||
|         li { | ||||
|           height: 48px; | ||||
|           line-height: 48px; | ||||
|           padding-left: 24px; | ||||
|           font-size: 14px; | ||||
|           font-weight: normal; | ||||
|           font-stretch: normal; | ||||
|           letter-spacing: 0; | ||||
|           color: #666666; | ||||
|           cursor: pointer; | ||||
|           border-left: 3px solid transparent; | ||||
|  | ||||
|           &:hover { | ||||
|             border-left: 3px solid #5088ff; | ||||
|           } | ||||
|  | ||||
|           a { | ||||
|             display: block; | ||||
|           } | ||||
|         } | ||||
|  | ||||
|         .navActive { | ||||
|           border-left: 3px solid #5088ff; | ||||
|           color: #5088ff; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|     } | ||||
|  | ||||
|     .content-right { | ||||
|       width: 780px; | ||||
|       height: calc(100% - 80px); | ||||
|       overflow-y: auto; | ||||
|       margin-left: 40px; | ||||
|       box-sizing: border-box; | ||||
|       overflow-x: hidden; | ||||
|  | ||||
|       .content-right-title { | ||||
|         width: 780px; | ||||
|         height: 56px; | ||||
|         margin-bottom: 16px; | ||||
|         box-shadow: inset 0px -1px 0px 0px #dad5d5; | ||||
|         display: flex; | ||||
|         justify-content: space-between; | ||||
|         align-items: center; | ||||
|  | ||||
|         span { | ||||
|           display: block; | ||||
|           width: 150px; | ||||
|           height: 56px; | ||||
|           line-height: 56px; | ||||
|           color: #333333; | ||||
|           font-weight: bold; | ||||
|  | ||||
|           &:nth-of-type(2) { | ||||
|             text-align: right; | ||||
|             width: 200px; | ||||
|           } | ||||
|  | ||||
|         } | ||||
|  | ||||
|  | ||||
|       } | ||||
|  | ||||
|       .flie { | ||||
|         width: 100%; | ||||
|         height: 40px; | ||||
|         line-height: 40px; | ||||
|         padding: 0 8px; | ||||
|         box-sizing: border-box; | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
|         justify-content: space-between; | ||||
|         font-size: 14px; | ||||
|         color: rgba(51, 51, 51, 1); | ||||
|         background: rgba(255, 255, 255, 1); | ||||
|         border-radius: 4px; | ||||
|         border: 1px solid rgba(208, 212, 220, 1); | ||||
|         margin-bottom: 16px; | ||||
|         cursor: pointer; | ||||
|  | ||||
|         p { | ||||
|           display: flex; | ||||
|           justify-content: flex-start; | ||||
|           align-items: center | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .meeting_name { | ||||
|         width: 100%; | ||||
|         padding-bottom: 25px; | ||||
|         font-size: 16px; | ||||
|         box-shadow: inset 0px -1px 0px 0px #dad5d5; | ||||
|         position: relative; | ||||
|         overflow: hidden; | ||||
|  | ||||
|         .title { | ||||
|           color: #333333; | ||||
|           height: 28px; | ||||
|           line-height: 28px; | ||||
|           margin-left: 0; | ||||
|           font-weight: bold; | ||||
|           margin-top: 14px; | ||||
|         } | ||||
|  | ||||
|         ul { | ||||
|           overflow: hidden; | ||||
|  | ||||
|           li { | ||||
|             width: 33.3%; | ||||
|             float: left; | ||||
|             line-height: 28px; | ||||
|             font-size: 14px; | ||||
|  | ||||
|             span { | ||||
|               width: 70px; | ||||
|               display: block; | ||||
|               float: left; | ||||
|               color: rgba(153, 153, 153, 1) | ||||
|             } | ||||
|  | ||||
|             p { | ||||
|               width: calc(100% - 70px); | ||||
|               float: left; | ||||
|               color: rgba(51, 51, 51, 1); | ||||
|             } | ||||
|           ; | ||||
|           } | ||||
|         } | ||||
|  | ||||
|         .svg { | ||||
|           width: 88px; | ||||
|           height: 88px; | ||||
|           position: absolute; | ||||
|           right: -20px; | ||||
|           bottom: -20px; | ||||
|         } | ||||
|  | ||||
|       } | ||||
|  | ||||
|  | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,259 +0,0 @@ | ||||
| <template> | ||||
|   <ai-list isTabs> | ||||
|     <template #content> | ||||
|       <ai-search-bar> | ||||
|         <template #left> | ||||
|           <el-button type="primary" @click="addMetting()">发起会议</el-button> | ||||
|           <ai-select | ||||
|               v-model="search.meetingStatus" | ||||
|               @change="getTableData()" | ||||
|               placeholder="会议状态" | ||||
|               :selectList="dict.getDict($parent.name==0 ? 'meetingStatusSelect' : 'meetingStatus')" | ||||
|           ></ai-select> | ||||
|           <ai-select | ||||
|               v-if="$parent.name==0" | ||||
|               v-model="search.confirmStatus" | ||||
|               @change="getTableData()" | ||||
|               placeholder="确认状态" | ||||
|               :selectList="dict.getDict('confirmStatus')" | ||||
|           ></ai-select> | ||||
|         </template> | ||||
|         <template #right> | ||||
|           <el-input | ||||
|             v-model="search.param" | ||||
|             v-throttle="() => {search.current=1,getTableData()}" | ||||
|             @keyup.enter.native="search.current=1,getTableData()" | ||||
|             placeholder="会议标题/地点" | ||||
|             size="small" suffix-icon="iconfont iconSearch" clearable @clear="getTableData()"></el-input> | ||||
|         </template> | ||||
|       </ai-search-bar> | ||||
|       <div class="list_main"> | ||||
|         <div class="no-data" style="height:160px;" v-if="tableData.length==0"></div> | ||||
|         <ul v-if="tableData.length>0"> | ||||
|           <li v-for="(item,index) in tableData" :key="index" @click="goDetail(item)"> | ||||
|             <p> | ||||
|               <span class="conference_title">{{ item.title }}</span> | ||||
|               <span class="time" v-if="item.status==1">{{ item.expirationTime }}</span> | ||||
|             </p> | ||||
|             <p style="width:80%;"> | ||||
|               <el-row type="flex" align="middle" class="unit">发起人:{{ item.userName }} | ||||
|               </el-row> | ||||
|               <el-row type="flex" align="middle" class="unit">发起单位:{{ item.unitName }} | ||||
|               </el-row> | ||||
|             </p> | ||||
|             <p style="width:80%;"> | ||||
|               <span class="unit">会议时间:{{ item.startTime.substring(0, 16) + '至' + item.endTime.substring(0, 16) }}</span> | ||||
|               <el-tooltip :content="item.address" placement="top-start" effect="light"> | ||||
|                 <span class="unit" v-if="item.address.length>12">会议地点:{{ | ||||
|                     item.address.substring(0, 12) + '....' | ||||
|                   }}</span> | ||||
|                 <span class="unit" v-else>会议地点:{{ item.address }}</span> | ||||
|               </el-tooltip> | ||||
|             </p> | ||||
|             <!-- <p style="width:80%;"> | ||||
|                   <span | ||||
|                     class="unit">会议时间:{{ | ||||
|                       item.startTime.substring(0, 16) + '至' + item.endTime.substring(0, 16) | ||||
|                     }}</span> | ||||
|               <el-tooltip :content="item.address" placement="top-start" effect="light"> | ||||
|                     <span class="unit address" | ||||
|                           v-if="item.address.length>12">会议地点:{{ item.address.substring(0, 12) + '....' }}</span> | ||||
|                 <span class="unit address" v-else>会议地点:{{ item.address }}</span> | ||||
|               </el-tooltip> | ||||
|             </p> --> | ||||
|             <h5 :class="{color0:item.status==0,color1:item.status==1,color2:item.status==2,color3:item.status==3,color4:item.status==4}"> | ||||
|               <span v-if="item.status==0">草稿箱</span> | ||||
|               <span v-if="item.status==1">未开始</span> | ||||
|               <span v-if="item.status==2">进行中</span> | ||||
|               <span v-if="item.status==3">已取消</span> | ||||
|               <span v-if="item.status==4">已结束</span> | ||||
|             </h5> | ||||
|             <ai-icon class="svg" v-if="item.joinStatus==0" type="svg" icon="iconunidentified"/> | ||||
|             <ai-icon class="svg" v-else-if="item.joinStatus==1" type="svg" icon="iconidentified"/> | ||||
|             <ai-icon class="svg" v-else-if="item.joinStatus==2" type="svg" icon="iconyiqingjia"/> | ||||
|             <ai-icon class="svg" v-else-if="item.joinStatus==3" type="svg" icon="icondaiding"/> | ||||
|           </li> | ||||
|         </ul> | ||||
|       </div> | ||||
|       <div class="pagination" v-if="tableData.length>0"> | ||||
|         <el-pagination | ||||
|             @current-change="handleCurrentChange" | ||||
|             @size-change="handleSizeChange" | ||||
|             background | ||||
|             :current-page.sync="search.current" | ||||
|             :page-sizes="[5, 10, 50, 100,200]" | ||||
|             :page-size="search.size" | ||||
|             layout="total,prev, pager, next,sizes,jumper" | ||||
|             :total="total"> | ||||
|         </el-pagination> | ||||
|       </div> | ||||
|     </template> | ||||
|   </ai-list> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: "list", | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     dict: Object, | ||||
|     permissions: Function, | ||||
|     listType: String | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       search: { | ||||
|         meetingStatus: '', | ||||
|         confirmStatus: '', | ||||
|         param: '', | ||||
|         current: 1, | ||||
|         size: 10, | ||||
|         listType: '' | ||||
|       }, | ||||
|       tableData: [], | ||||
|       total: 0, | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     goDetail(item) { | ||||
|       this.$emit('goPage', { | ||||
|         row: item, | ||||
|         comp: 'detail' | ||||
|       }); | ||||
|     }, | ||||
|     addMetting() { | ||||
|       this.$emit('goPage', { | ||||
|         row: {}, | ||||
|         comp: 'addMeeting' | ||||
|       }); | ||||
|     }, | ||||
|  | ||||
|     getTableData() { | ||||
|       this.instance.post(`/app/appmeetinginfo/list`, null, { | ||||
|         params: { | ||||
|           ...this.search, | ||||
|           listType: this.listType | ||||
|         } | ||||
|       }).then(res => { | ||||
|         if (res && res.data) { | ||||
|           this.tableData = res.data.records; | ||||
|           this.total = res.data.total; | ||||
|  | ||||
|         } | ||||
|       }); | ||||
|     }, | ||||
|     handleCurrentChange(val) { | ||||
|       this.search.current = val; | ||||
|       this.getTableData(); | ||||
|     }, | ||||
|     handleSizeChange(val) { | ||||
|       this.search.size = val; | ||||
|       this.getTableData(); | ||||
|     }, | ||||
|   }, | ||||
|   created() { | ||||
|     this.dict.load("confirmStatus", "meetingStatus", "meetingStatusSelect").then(_ => this.getTableData()) | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .list_main { | ||||
|   width: 100%; | ||||
|  | ||||
|   ul { | ||||
|     overflow: hidden; | ||||
|     padding: 0; | ||||
|     margin: 0; | ||||
|  | ||||
|     li { | ||||
|       width: 100%; | ||||
|       height: 107px; | ||||
|       background: rgba(255, 255, 255, 1); | ||||
|       border-radius: 4px; | ||||
|       border: 1px solid rgba(216, 224, 232, 1); | ||||
|       box-sizing: border-box; | ||||
|       padding: 16px 16px 16px 50px; | ||||
|       margin-top: 8px; | ||||
|       cursor: pointer; | ||||
|       position: relative; | ||||
|       overflow: hidden; | ||||
|  | ||||
|       p { | ||||
|         width: 100%; | ||||
|         height: 25px; | ||||
|         display: flex; | ||||
|         justify-content: space-between; | ||||
|         align-items: center; | ||||
|  | ||||
|         .conference_title { | ||||
|           color: rgba(51, 51, 51, 1); | ||||
|           font-size: 16px; | ||||
|           font-weight: bold; | ||||
|         } | ||||
|  | ||||
|         .time { | ||||
|           font-size: 14px; | ||||
|           color: #2266FF; | ||||
|         } | ||||
|  | ||||
|         .unit { | ||||
|           font-size: 14px; | ||||
|           width: 50%; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       h5 { | ||||
|         width: 100px; | ||||
|         height: 20px; | ||||
|         line-height: 20px; | ||||
|         text-align: center; | ||||
|         position: absolute; | ||||
|         left: -22px; | ||||
|         top: 10px; | ||||
|         box-sizing: border-box; | ||||
|         padding-right: 8px; | ||||
|         font-size: 12px; | ||||
|         transform: rotate(-45deg); | ||||
|         background: #FFF3E8; | ||||
|         color: rgba(255, 136, 34, 1); | ||||
|         box-shadow: -1px 1px 0px 0px rgba(216, 224, 232, 1), 1px -1px 0px 0px rgba(216, 224, 232, 1); | ||||
|         margin: 0; | ||||
|       } | ||||
|  | ||||
|       .color0 { | ||||
|         color: #2244FF; | ||||
|         background: #EFF6FF; | ||||
|       } | ||||
|  | ||||
|       .color1 { | ||||
|         background: #FFF3E8; | ||||
|         color: rgba(255, 136, 34, 1); | ||||
|       } | ||||
|  | ||||
|       .color2 { | ||||
|         background: #EFF6FF; | ||||
|         color: #2266FF; | ||||
|       } | ||||
|  | ||||
|       .color3 { | ||||
|         background-color: #D8E0E8; | ||||
|         color: #999999; | ||||
|       } | ||||
|  | ||||
|       .color4 { | ||||
|         color: #2EA222; | ||||
|         background-color: #D8E0E8; | ||||
|       } | ||||
|  | ||||
|       .svg { | ||||
|         width: 88px; | ||||
|         height: 88px; | ||||
|         position: absolute; | ||||
|         right: -20px; | ||||
|         bottom: -20px; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,186 +0,0 @@ | ||||
| <template> | ||||
|   <section class="AppCorporateSeal"> | ||||
|       <ai-list v-if="showList"> | ||||
|         <template slot="title"> | ||||
|           <ai-title title="企业印章" :isShowBottomBorder="true"></ai-title> | ||||
|         </template> | ||||
|         <template slot="content"> | ||||
|           <div class="signaturePane"> | ||||
|             <div class="signatureCard" v-for="(op,i) in signatures" :key="i"> | ||||
|               <div class="default" v-if="op.isDefault==1">默认</div> | ||||
|               <div class="body"> | ||||
|                 <el-image :src="`data:image/png;base64,${op.signSealData}`"/> | ||||
|               </div> | ||||
|               <div class="footer"> | ||||
|                 <el-button type="text" :disabled="op.isDefault==1" @click.stop="handleSetDefault(op.id)">设为默认</el-button> | ||||
|                 <hr/> | ||||
|                 <el-button type="text" :disabled="op.isDefault==1||op.signType==1" @click.stop="handleDelete(op.id)">删除 | ||||
|                 </el-button> | ||||
|               </div> | ||||
|             </div> | ||||
|             <div class="signatureCard add" @click="showList=false"> | ||||
|               <ai-icon icon="iconAdd" size="32px"/> | ||||
|               <span>点击添加印章</span> | ||||
|             </div> | ||||
|           </div> | ||||
|         </template> | ||||
|       </ai-list> | ||||
|     <seal-detail v-else/> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
|   import SealDetail from "./sealDetail"; | ||||
|  | ||||
|   export default { | ||||
|     name: "AppCorporateSeal", | ||||
|     label: "企业印章", | ||||
|     components: {SealDetail}, | ||||
|     provide() { | ||||
|       return { | ||||
|         seal: this | ||||
|       } | ||||
|     }, | ||||
|     props: { | ||||
|       instance: Function, | ||||
|       dict: Object, | ||||
|       permissions: Function | ||||
|     }, | ||||
|     data() { | ||||
|       return { | ||||
|         signatures: [], | ||||
|         showList: true | ||||
|       } | ||||
|     }, | ||||
|     created() { | ||||
|       this.getSignatures() | ||||
|     }, | ||||
|     methods: { | ||||
|       getSignatures() { | ||||
|         this.instance.post("/app/syssignaccount/list", null, { | ||||
|           params: { | ||||
|             signType: 2, | ||||
|             size: 999 | ||||
|           } | ||||
|         }).then(res => { | ||||
|           if (res?.data) { | ||||
|             this.signatures = res.data.records | ||||
|           } | ||||
|         }) | ||||
|       }, | ||||
|       handleSetDefault(id) { | ||||
|         this.$confirm("是否设置该印章为默认印章?").then(() => { | ||||
|           this.instance.post("/app/syssignaccount/default", null, {params: {id, listType: 1}}).then(res => { | ||||
|             if (res?.code == 0) { | ||||
|               this.$message.success("设置成功!") | ||||
|               this.getSignatures() | ||||
|             } | ||||
|           }).catch(() => 0) | ||||
|         }) | ||||
|       }, | ||||
|       handleDelete(ids) { | ||||
|         this.$confirm("是否删除该印章?").then(() => { | ||||
|           this.instance.post("/app/syssignaccount/delete", null, {params: {ids}}).then(res => { | ||||
|             if (res?.code == 0) { | ||||
|               this.$message.success("删除成功!") | ||||
|               this.getSignatures() | ||||
|             } | ||||
|           }).catch(() => 0) | ||||
|         }) | ||||
|       }, | ||||
|     } | ||||
|   } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
|   .AppCorporateSeal { | ||||
|     height: 100%; | ||||
|     background: #f3f6f9; | ||||
|  | ||||
|     :deep( .signaturePane ){ | ||||
|       display: flex; | ||||
|       gap: 16px; | ||||
|       flex-wrap: wrap; | ||||
|       padding: 16px; | ||||
|  | ||||
|       .signatureCard { | ||||
|         width: 290px; | ||||
|         height: 258px; | ||||
|         background: #FFFFFF; | ||||
|         border-radius: 4px; | ||||
|         position: relative; | ||||
|         display: flex; | ||||
|         flex-direction: column; | ||||
|         overflow: hidden; | ||||
|  | ||||
|         &.add { | ||||
|           justify-content: center; | ||||
|           align-items: center; | ||||
|           color: #666666; | ||||
|           cursor: pointer; | ||||
|  | ||||
|           .AiIcon { | ||||
|             width: 32px; | ||||
|             height: 32px; | ||||
|             font-size: 32px; | ||||
|           } | ||||
|  | ||||
|           & > span { | ||||
|             font-size: 12px; | ||||
|             line-height: 16px; | ||||
|           } | ||||
|         } | ||||
|  | ||||
|         .default { | ||||
|           position: absolute; | ||||
|           width: 56px; | ||||
|           height: 24px; | ||||
|           background: #3573FF; | ||||
|           border-radius: 0 0 4px 0; | ||||
|           top: 0; | ||||
|           left: 0; | ||||
|           text-align: center; | ||||
|           line-height: 24px; | ||||
|           font-size: 12px; | ||||
|           color: #FFF; | ||||
|         } | ||||
|  | ||||
|         .body { | ||||
|           min-height: 0; | ||||
|           flex: 1; | ||||
|           display: flex; | ||||
|           justify-content: center; | ||||
|           align-items: center; | ||||
|           padding: 50px; | ||||
|           cursor: pointer; | ||||
|  | ||||
|         } | ||||
|  | ||||
|         .footer { | ||||
|           flex-shrink: 0; | ||||
|           height: 40px; | ||||
|           background: rgba(#30426F, .5); | ||||
|           display: flex; | ||||
|           align-items: center; | ||||
|           padding: 8px 0; | ||||
|           box-sizing: border-box; | ||||
|  | ||||
|           hr { | ||||
|             height: 100%; | ||||
|             border-color: rgba(#fff, .5); | ||||
|           } | ||||
|  | ||||
|           & > .el-button { | ||||
|             flex: 1; | ||||
|             color: #fff; | ||||
|  | ||||
|             &[disabled] { | ||||
|               color: rgba(#fff, .5); | ||||
|             } | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
| </style> | ||||
| @@ -1,235 +0,0 @@ | ||||
| <template> | ||||
|   <section class="sealDetail"> | ||||
|     <ai-detail> | ||||
|       <template #title> | ||||
|         <ai-title title="添加企业印章" isShowBack isShowBottomBorder @onBackClick="back"/> | ||||
|       </template> | ||||
|       <template #content> | ||||
|         <el-form size="small" ref="SealForm" :model="form" :rules="rules" label-suffix=":" label-width="160px"> | ||||
|           <ai-title title="单位信息" isShowBottomBorder/> | ||||
|           <el-form-item label="单位名称" prop="organizeName"> | ||||
|             <el-input clearable v-model="form.organizeName" placeholder="请输入..." maxlength="25" show-word-limit/> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="单位类型" prop="organizeType"> | ||||
|             <el-select clearable v-model="form.organizeType" placeholder="请输入..."> | ||||
|               <el-option v-for="(op,i) in $dict.getDict('organizeType')" :key="i" :value="op.dictValue" | ||||
|                          :label="op.dictName"/> | ||||
|             </el-select> | ||||
|           </el-form-item> | ||||
|           <div class="flexFillRow"> | ||||
|             <el-form-item label="企业注册类型" prop="organRegType"> | ||||
|               <el-select clearable v-model="form.organRegType" placeholder="请输入..."> | ||||
|                 <el-option v-for="(op,i) in $dict.getDict('organRegType')" :key="i" :value="op.dictValue" | ||||
|                            :label="op.dictName"/> | ||||
|               </el-select> | ||||
|             </el-form-item> | ||||
|             <el-form-item v-if="!!form.organRegType" :label="$dict.getLabel('organRegType',form.organRegType)" | ||||
|                           prop="organCode"> | ||||
|               <el-input clearable v-model="form.organCode" placeholder="请输入..."/> | ||||
|             </el-form-item> | ||||
|             <div v-else/> | ||||
|           </div> | ||||
|           <div class="flexFillRow"> | ||||
|             <el-form-item label="注册类型" prop="registerType"> | ||||
|               <el-select clearable v-model="form.registerType" placeholder="请输入..."> | ||||
|                 <el-option v-for="(op,i) in $dict.getDict('registerType')" :key="i" :value="op.dictValue" | ||||
|                            :label="op.dictName"/> | ||||
|               </el-select> | ||||
|             </el-form-item> | ||||
|             <div/> | ||||
|           </div> | ||||
|           <template v-if="form.registerType==1"> | ||||
|             <div class="flexFillRow"> | ||||
|               <el-form-item label="代理人姓名" prop="agentName"> | ||||
|                 <el-input clearable v-model="form.agentName" placeholder="请输入..."/> | ||||
|               </el-form-item> | ||||
|               <el-form-item label="代理人身份证号" prop="agentIdNumber"> | ||||
|                 <el-input clearable v-model="form.agentIdNumber" placeholder="请输入..."/> | ||||
|               </el-form-item> | ||||
|             </div> | ||||
|             <div class="flexFillRow"> | ||||
|               <el-form-item label="代理人手机号" prop="signPhone"> | ||||
|                 <el-input clearable v-model="form.signPhone" placeholder="请输入..."/> | ||||
|               </el-form-item> | ||||
|               <div/> | ||||
|             </div> | ||||
|           </template> | ||||
|           <template v-if="form.registerType==2"> | ||||
|             <div class="flexFillRow"> | ||||
|               <el-form-item label="法人姓名" prop="legalName"> | ||||
|                 <el-input clearable v-model="form.legalName" placeholder="请输入..."/> | ||||
|               </el-form-item> | ||||
|               <el-form-item label="法人身份证号" prop="legalIdNumber"> | ||||
|                 <el-input clearable v-model="form.legalIdNumber" placeholder="请输入..."/> | ||||
|               </el-form-item> | ||||
|             </div> | ||||
|             <div class="flexFillRow"> | ||||
|               <el-form-item label="法人手机号" prop="signPhone"> | ||||
|                 <el-input clearable v-model="form.signPhone" placeholder="请输入..."/> | ||||
|               </el-form-item> | ||||
|               <div/> | ||||
|             </div> | ||||
|           </template> | ||||
|           <ai-title title="印章信息" isShowBottomBorder/> | ||||
|           <el-form-item class="sealImageTypes" label="生成印章类型" prop="organizeTemplateType"> | ||||
|             <div v-for="(op,i) in sealImageTypes" :key="i" class="item" @click="form.organizeTemplateType=op.value"> | ||||
|               <el-image :src="op.image" fit="contain"/> | ||||
|               <el-radio :label="op.value" v-model="form.organizeTemplateType">{{ op.name }}</el-radio> | ||||
|             </div> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="横向文内容" prop="htext"> | ||||
|             <el-input clearable v-model="form.htext" placeholder="0-8个字,如合同专用章,财务专用章等" maxlength="8" show-word-limit/> | ||||
|           </el-form-item> | ||||
|           <el-form-item label="下弦文内容" prop="qtext"> | ||||
|             <el-input clearable v-model="form.qtext" placeholder="0-20个字,下弦文是指的贵司公章底部一串防伪数字" maxlength="20" | ||||
|                       show-word-limit/> | ||||
|           </el-form-item> | ||||
|         </el-form> | ||||
|       </template> | ||||
|       <template #footer> | ||||
|         <el-button @click="back">取消</el-button> | ||||
|         <el-button type="primary" @click="handleSubmit" v-loading="loading">提交</el-button> | ||||
|       </template> | ||||
|     </ai-detail> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {ID} from "dui/lib/js/utils"; | ||||
|  | ||||
| export default { | ||||
|   name: "sealDetail", | ||||
|   inject: ['seal'], | ||||
|   data() { | ||||
|     return { | ||||
|       form: { | ||||
|         organizeTemplateType: "STAR", | ||||
|         organizeType: "4", | ||||
|         organRegType: "NORMAL", | ||||
|         registerType: "1" | ||||
|       }, | ||||
|       loading: false | ||||
|     } | ||||
|   }, | ||||
|   computed: { | ||||
|     sealImageTypes() { | ||||
|       return this.$dict.getDict("organizeTemplateType")?.map(e => ({ | ||||
|         image: e.dictColor, | ||||
|         value: e.dictValue, | ||||
|         name: e.dictName | ||||
|       })) || [] | ||||
|     }, | ||||
|     rules() { | ||||
|       return { | ||||
|         organizeName: [{required: true, message: "请填写单位名称"}], | ||||
|         organCode: [{required: true, message: `请填写${this.$dict.getLabel('organRegType', this.form.organRegType)}`}], | ||||
|         legalName: [{required: true, message: "请填写法人姓名"}], | ||||
|         agentName: [{required: true, message: "请填写代理人姓名"}], | ||||
|         organizeTemplateType: [{required: true}], | ||||
|         htext: [{required: true, message: "请填写横向文内容"}], | ||||
|         qtext: [{required: true, message: "请填写下弦文内容"}], | ||||
|         organizeType: [{required: true, message: "请选择单位类型"}], | ||||
|         organRegType: [{required: true, message: "请选择企业注册类型"}], | ||||
|         registerType: [{required: true, message: "请选择注册类型"}], | ||||
|         signPhone: [ | ||||
|           {required: true, message: "请填写手机号码"}, | ||||
|           {pattern: /^1[3456789]\d{9}$/, message: "手机号码格式有误"} | ||||
|         ], | ||||
|         legalIdNumber: [ | ||||
|           {required: true, message: "请填写法人身份证号码"}, | ||||
|           {validator: (r, v, cb) => cb(ID.check(v) ? undefined : "身份证号码格式有误")} | ||||
|         ], | ||||
|         agentIdNumber: [ | ||||
|           {required: true, message: "请填写代理人身份证号码"}, | ||||
|           {validator: (r, v, cb) => cb(ID.check(v) ? undefined : "身份证号码格式有误")} | ||||
|         ], | ||||
|       } | ||||
|     } | ||||
|   }, | ||||
|   created() { | ||||
|     this.$dict.load("registerType", "organRegType", "organizeType", "organizeTemplateType") | ||||
|   }, | ||||
|   methods: { | ||||
|     back() { | ||||
|       this.seal.showList = true | ||||
|       this.seal.getSignatures() | ||||
|     }, | ||||
|     handleSubmit() { | ||||
|       this.$refs.SealForm.validate(v => { | ||||
|         if (v) { | ||||
|           this.loading = true | ||||
|           this.seal.instance.post("/app/syssignaccount/register", { | ||||
|             userType: 0, | ||||
|             signType: 2, | ||||
|             signPhone: this.form.signPhone, | ||||
|             registerInfo: {...this.form, legalArea: 0}, | ||||
|             style: {...this.form, sealColor: "RED"} | ||||
|           }).then(res => { | ||||
|             this.loading = false | ||||
|             if (res?.code == 0) { | ||||
|               this.$message.success("添加成功!") | ||||
|               this.back() | ||||
|             } | ||||
|           }).catch(() => this.loading = false) | ||||
|         } | ||||
|       }) | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .sealDetail { | ||||
|   height: inherit; | ||||
|  | ||||
|   :deep( .ai-detail__content--wrapper ){ | ||||
|     .el-form { | ||||
|       display: flex; | ||||
|       flex-direction: column; | ||||
|       gap: 24px; | ||||
|     } | ||||
|  | ||||
|     .el-form-item { | ||||
|       margin-bottom: 0; | ||||
|  | ||||
|       .el-select { | ||||
|         width: 100%; | ||||
|       } | ||||
|  | ||||
|       &.sealImageTypes > .el-form-item__content { | ||||
|         display: flex; | ||||
|         gap: 40px; | ||||
|  | ||||
|         .item { | ||||
|           display: flex; | ||||
|           flex-direction: column; | ||||
|           align-items: center; | ||||
|           justify-content: center; | ||||
|           gap: 8px; | ||||
|           cursor: pointer; | ||||
|  | ||||
|           .el-image { | ||||
|             width: 80px; | ||||
|             height: 80px; | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|  | ||||
|     .flexFillRow { | ||||
|       display: flex; | ||||
|       align-items: center; | ||||
|  | ||||
|       & > * { | ||||
|         flex: 1; | ||||
|         min-width: 0; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | ||||
|   :deep( .ai-detail__footer > .el-button ){ | ||||
|     width: 92px; | ||||
|     height: 32px; | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,365 +0,0 @@ | ||||
| <template> | ||||
|   <section class="personal-signature"> | ||||
|     <ai-list v-if="!showPhonePage"> | ||||
|       <ai-title slot="title" title="个人签名" :isShowBottomBorder="false"/> | ||||
|       <template #custom> | ||||
|         <div class="signaturePane"> | ||||
|           <div class="signatureCard" v-for="(op,i) in signatures" :key="i"> | ||||
|             <div class="default" v-if="op.isDefault==1">默认</div> | ||||
|             <div class="body"> | ||||
|               <el-image :src="`data:image/png;base64,${op.signSealData}`"/> | ||||
|             </div> | ||||
|             <div class="footer"> | ||||
|               <el-button type="text" :disabled="op.isDefault==1" @click.stop="handleSetDefault(op.id)">设为默认</el-button> | ||||
|               <hr/> | ||||
|               <el-button type="text" :disabled="op.isDefault==1||op.signType>0" @click.stop="handleDelete(op.id)">删除 | ||||
|               </el-button> | ||||
|             </div> | ||||
|           </div> | ||||
|           <div class="signatureCard add" @click="dialog=true"> | ||||
|             <ai-icon icon="iconAdd" size="32px"/> | ||||
|             <span>点击添加签名</span> | ||||
|           </div> | ||||
|         </div> | ||||
|       </template> | ||||
|     </ai-list> | ||||
|     <ai-dialog :visible.sync="dialog" v-bind="dialogConf" @onConfirm="handleSubmit" | ||||
|                @closed="form={},drawPlaceholder=true,qrCode=null,showQRCode=false,getSignatures()"> | ||||
|       <ai-drawer v-if="hasAuthed" :seal.sync="sealData" ref="aiDrawer"> | ||||
|         <template #tools> | ||||
|           <el-popover trigger="manual" v-model="showQRCode"> | ||||
|             <el-image :src="qrCode"/> | ||||
|             <div class="writeInPhone" slot="reference" @click.stop="showQR"> | ||||
|               <ai-icon icon="iconEwm"/> | ||||
|               <span>手机签名</span> | ||||
|             </div> | ||||
|           </el-popover> | ||||
|         </template> | ||||
|       </ai-drawer> | ||||
|       <el-form size="small" :model="form" ref="authForm" :rules="rules" class="authZone" v-else label-suffix=":" | ||||
|                label-width="100px"> | ||||
|         <el-alert type="warning" title="第一次添加个人签名,需先进行实名认证" show-icon :closable="false"/> | ||||
|         <el-form-item label="姓名" prop="personName"> | ||||
|           <el-input v-model="form.personName" clearable placeholder="姓名"/> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="身份证号" prop="idNumber"> | ||||
|           <el-input v-model="form.idNumber" clearable placeholder="身份证号"/> | ||||
|         </el-form-item> | ||||
|         <el-form-item label="手机号码" prop="signPhone"> | ||||
|           <el-input v-model="form.signPhone" clearable placeholder="手机号码"/> | ||||
|         </el-form-item> | ||||
|       </el-form> | ||||
|     </ai-dialog> | ||||
|     <draw-in-phone v-if="showPhonePage"/> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import {mapState} from "vuex"; | ||||
| import DrawInPhone from "./drawInPhone"; | ||||
|  | ||||
| export default { | ||||
|   name: "AppPersonalSignature", | ||||
|   label: "个人签名", | ||||
|   components: {DrawInPhone}, | ||||
|   provide() { | ||||
|     return { | ||||
|       signature: this | ||||
|     } | ||||
|   }, | ||||
|   props: { | ||||
|     instance: Function, | ||||
|     dict: Object, | ||||
|     permissions: Function | ||||
|   }, | ||||
|   computed: { | ||||
|     ...mapState(['user']), | ||||
|     hasAuthed() { | ||||
|       return this.signatures.length > 0 | ||||
|     }, | ||||
|     dialogConf() { | ||||
|       return this.hasAuthed ? { | ||||
|         title: "手写签名", | ||||
|         width: '720px' | ||||
|       } : { | ||||
|         title: "实名认证", | ||||
|         width: '520px' | ||||
|       } | ||||
|     }, | ||||
|     rules() { | ||||
|       return { | ||||
|         personName: [{required: true, message: "请填写姓名"}], | ||||
|         signPhone: [ | ||||
|           {required: true, message: "请填写手机号码"}, | ||||
|           {pattern: /^1[3456789]\d{9}$/, message: "手机号码格式有误"} | ||||
|         ], | ||||
|         idNumber: [ | ||||
|           {required: true, message: "请填写身份证号码"}, | ||||
|           {validator: (r, v, cb) => cb(ID.check(v) ? undefined : "身份证号码格式有误")} | ||||
|         ], | ||||
|       } | ||||
|     } | ||||
|   }, | ||||
|   data() { | ||||
|     return { | ||||
|       signatures: [], | ||||
|       dialog: false, | ||||
|       form: {}, | ||||
|       sealData: null, | ||||
|       qrCode: null, | ||||
|       showQRCode: false, | ||||
|       showPhonePage: false, | ||||
|       loading: false, | ||||
|     } | ||||
|   }, | ||||
|   created() { | ||||
|     if (this.$route.query.userId && this.$route.hash == "#phone") { | ||||
|       this.showPhonePage = true | ||||
|     } else { | ||||
|       this.getSignatures() | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     getSignatures() { | ||||
|       this.instance.post("/app/syssignaccount/list", null, { | ||||
|         params: { | ||||
|           size: 999 | ||||
|         } | ||||
|       }).then(res => { | ||||
|         if (res?.data) { | ||||
|           this.signatures = res.data.records | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|     handleSubmit() { | ||||
|       if (this.loading) return | ||||
|       if (this.hasAuthed && this.$refs['aiDrawer'].drawPlaceholder) return this.$message.error("请签名") | ||||
|       this.loading = true | ||||
|       if (this.hasAuthed) { | ||||
|         let sealData = this.sealData?.replace(/data:image\/png;base64,/, '') | ||||
|         sealData && this.instance({ | ||||
|           url: '/app/syssignaccount/upload-sealdata', | ||||
|           headers: {"Content-Type": "application/json"}, | ||||
|           method: 'post', | ||||
|           params: {userId: this.user.info.id}, | ||||
|           data: sealData | ||||
|         }).then(res => { | ||||
|           this.loading = false | ||||
|           if (res?.code == 0) { | ||||
|             this.dialog = false | ||||
|             this.$message.success("添加成功!") | ||||
|             this.getSignatures() | ||||
|           } | ||||
|         }).catch(() => { | ||||
|           this.loading = false | ||||
|         }) | ||||
|       } else { | ||||
|         this.$refs.authForm.validate(v => { | ||||
|           if (v) { | ||||
|             this.instance.post("/app/syssignaccount/register", { | ||||
|               signPhone: this.form.signPhone, | ||||
|               signType: 1, | ||||
|               userType: 0, | ||||
|               registerInfo: {...this.form}, | ||||
|               style: {personTemplateType: 'RECTANGLE', sealColor: 'RED'} | ||||
|             }).then(res => { | ||||
|               this.loading = false | ||||
|               if (res?.code == 0) { | ||||
|                 this.dialog = false | ||||
|                 this.$message.success("认证成功!") | ||||
|                 this.getSignatures() | ||||
|               } | ||||
|             }).catch(() => { | ||||
|               this.loading = false | ||||
|             }) | ||||
|           } | ||||
|         }) | ||||
|       } | ||||
|     }, | ||||
|     handleSetDefault(id) { | ||||
|       this.$confirm("是否设置该签名为默认签名?").then(() => { | ||||
|         this.instance.post("/app/syssignaccount/default", null, {params: {id, listType: 0}}).then(res => { | ||||
|           if (res?.code == 0) { | ||||
|             this.$message.success("设置成功!") | ||||
|             this.getSignatures() | ||||
|           } | ||||
|         }).catch(() => 0) | ||||
|       }) | ||||
|     }, | ||||
|     handleDelete(ids) { | ||||
|       this.$confirm("是否删除该签名?").then(() => { | ||||
|         this.instance.post("/app/syssignaccount/delete", null, {params: {ids}}).then(res => { | ||||
|           if (res?.code == 0) { | ||||
|             this.$message.success("删除成功!") | ||||
|             this.getSignatures() | ||||
|           } | ||||
|         }).catch(() => 0) | ||||
|       }) | ||||
|     }, | ||||
|     showQR() { | ||||
|       if (!this.qrCode) { | ||||
|         let url = `${location.href}?userId=${this.user.info.id}#phone` | ||||
|         this.instance.post("/app/syssignaccount/draw-qrcode", null, { | ||||
|           params: {url} | ||||
|         }).then(res => { | ||||
|           if (res?.data) { | ||||
|             this.showQRCode = true | ||||
|             this.qrCode = res.data | ||||
|           } | ||||
|         }) | ||||
|       } else { | ||||
|         this.showQRCode = !this.showQRCode | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .personal-signature { | ||||
|   height: 100%; | ||||
|   background: #f3f6f9; | ||||
|   overflow: auto; | ||||
|  | ||||
|   :deep( .signaturePane ){ | ||||
|     display: flex; | ||||
|     gap: 16px; | ||||
|     flex-wrap: wrap; | ||||
|     padding: 16px; | ||||
|  | ||||
|     .signatureCard { | ||||
|       width: 290px; | ||||
|       height: 258px; | ||||
|       background: #FFFFFF; | ||||
|       border-radius: 4px; | ||||
|       position: relative; | ||||
|       display: flex; | ||||
|       flex-direction: column; | ||||
|       overflow: hidden; | ||||
|  | ||||
|       &.add { | ||||
|         justify-content: center; | ||||
|         align-items: center; | ||||
|         color: #666666; | ||||
|         cursor: pointer; | ||||
|  | ||||
|         .AiIcon { | ||||
|           width: 32px; | ||||
|           height: 32px; | ||||
|           font-size: 32px; | ||||
|         } | ||||
|  | ||||
|         & > span { | ||||
|           font-size: 12px; | ||||
|           line-height: 16px; | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .default { | ||||
|         position: absolute; | ||||
|         width: 56px; | ||||
|         height: 24px; | ||||
|         background: #3573FF; | ||||
|         border-radius: 0 0 4px 0; | ||||
|         top: 0; | ||||
|         left: 0; | ||||
|         text-align: center; | ||||
|         line-height: 24px; | ||||
|         font-size: 12px; | ||||
|         color: #FFF; | ||||
|       } | ||||
|  | ||||
|       .body { | ||||
|         min-height: 0; | ||||
|         flex: 1; | ||||
|         display: flex; | ||||
|         justify-content: center; | ||||
|         align-items: center; | ||||
|         padding: 25px; | ||||
|         pointer-events: none; | ||||
|  | ||||
|         .el-image { | ||||
|           width: 100%; | ||||
|           height: 100% | ||||
|         } | ||||
|       } | ||||
|  | ||||
|       .footer { | ||||
|         flex-shrink: 0; | ||||
|         height: 40px; | ||||
|         background: rgba(#30426F, .5); | ||||
|         display: flex; | ||||
|         align-items: center; | ||||
|         padding: 8px 0; | ||||
|         box-sizing: border-box; | ||||
|  | ||||
|         hr { | ||||
|           height: 100%; | ||||
|           border-color: rgba(#fff, .5); | ||||
|         } | ||||
|  | ||||
|         & > .el-button { | ||||
|           flex: 1; | ||||
|           color: #fff; | ||||
|  | ||||
|           &[disabled] { | ||||
|             color: rgba(#fff, .5); | ||||
|           } | ||||
|         } | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|   :deep( .writeInPhone ){ | ||||
|     position: absolute; | ||||
|     width: 100px; | ||||
|     height: 32px; | ||||
|     background: rgba(#000, .5); | ||||
|     border-radius: 16px; | ||||
|     display: flex; | ||||
|     align-items: center; | ||||
|     justify-content: center; | ||||
|     gap: 4px; | ||||
|     color: rgba(#fff, .6); | ||||
|     cursor: pointer; | ||||
|     left: 16px; | ||||
|     top: 16px; | ||||
|  | ||||
|     .AiIcon { | ||||
|       width: auto; | ||||
|       height: auto; | ||||
|     } | ||||
|  | ||||
|     &:hover { | ||||
|       color: #fff; | ||||
|     } | ||||
|   } | ||||
|   :deep( .ai-dialog__wrapper ){ | ||||
|     .ai-dialog__content--wrapper { | ||||
|       padding-right: 0 !important; | ||||
|     } | ||||
|  | ||||
|     .el-dialog__body { | ||||
|       padding: 24px 0; | ||||
|     } | ||||
|  | ||||
|  | ||||
|  | ||||
|     .authZone { | ||||
|       padding: 0 16px 24px; | ||||
|       width: 100%; | ||||
|       box-sizing: border-box; | ||||
|       display: flex; | ||||
|       flex-direction: column; | ||||
|       gap: 24px; | ||||
|  | ||||
|       .el-alert { | ||||
|         border: 1px solid #FF8822; | ||||
|       } | ||||
|  | ||||
|       .el-form-item { | ||||
|         margin-bottom: 0; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
| @@ -1,110 +0,0 @@ | ||||
| <template> | ||||
|   <section class="drawInPhone" @touchmove.prevent> | ||||
|     <div class="endPage" v-if="finished">操作结束请关闭页面</div> | ||||
|     <ai-drawer :seal.sync="sealData" placeholder="请签名" :width="device.width" :height="device.height"> | ||||
|       <template #tools> | ||||
|         <div class="writeInPhone" slot="reference" @click.stop="handleSubmit"> | ||||
|           <ai-icon icon="iconPublish"/> | ||||
|           <span>提交</span> | ||||
|         </div> | ||||
|       </template> | ||||
|     </ai-drawer> | ||||
|   </section> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| export default { | ||||
|   name: "drawInPhone", | ||||
|   inject: ['signature'], | ||||
|   data() { | ||||
|     return { | ||||
|       sealData: null, | ||||
|       device: {width: 0, height: 0}, | ||||
|       finished: false | ||||
|     } | ||||
|   }, | ||||
|   created() { | ||||
|     this.device.width = document.body.clientWidth | ||||
|     this.device.height = document.body.clientHeight | ||||
|     window.onresize = () => { | ||||
|       this.device.width = document.body.clientWidth | ||||
|       this.device.height = document.body.clientHeight | ||||
|     } | ||||
|   }, | ||||
|   methods: { | ||||
|     handleSubmit() { | ||||
|       let sealData = this.sealData?.replace(/data:image\/png;base64,/, ''), | ||||
|           {userId} = this.$route.query | ||||
|       if (!userId) return alert("缺少必要参数") | ||||
|       sealData && this.signature.instance({ | ||||
|         url: '/app/syssignaccount/upload-sealdata', | ||||
|         headers: {"Content-Type": "application/json"}, | ||||
|         method: 'post', | ||||
|         params: {userId}, | ||||
|         data: sealData, | ||||
|         withoutToken: true | ||||
|       }).then(res => { | ||||
|         if (res?.code == 0) { | ||||
|           alert("添加成功!") | ||||
|           this.finished = true | ||||
|         } | ||||
|       }) | ||||
|     }, | ||||
|   } | ||||
| } | ||||
| </script> | ||||
|  | ||||
| <style lang="scss" scoped> | ||||
| .drawInPhone { | ||||
|   position: fixed; | ||||
|   left: 0; | ||||
|   right: 0; | ||||
|   top: 0; | ||||
|   bottom: 0; | ||||
|   z-index: 20210205932; | ||||
|  | ||||
|   .endPage { | ||||
|     position: fixed; | ||||
|     left: 0; | ||||
|     right: 0; | ||||
|     top: 0; | ||||
|     bottom: 0; | ||||
|     z-index: 20210205933; | ||||
|     background: rgba(#000, .8); | ||||
|     color: #999; | ||||
|     display: flex; | ||||
|     justify-content: center; | ||||
|     align-items: center; | ||||
|     font-size: 32px; | ||||
|   } | ||||
|  | ||||
|   .AiDrawer { | ||||
|     margin: 0; | ||||
|   } | ||||
|  | ||||
|   .writeInPhone { | ||||
|     position: absolute; | ||||
|     width: 72px; | ||||
|     height: 32px; | ||||
|     background: rgba(#000, .5); | ||||
|     border-radius: 16px; | ||||
|     display: flex; | ||||
|     align-items: center; | ||||
|     justify-content: center; | ||||
|     gap: 4px; | ||||
|     color: rgba(#fff, .6); | ||||
|     cursor: pointer; | ||||
|     left: 16px; | ||||
|     top: 16px; | ||||
|  | ||||
|     .AiIcon { | ||||
|       width: auto; | ||||
|       height: auto; | ||||
|     } | ||||
|  | ||||
|     &:hover { | ||||
|       color: #fff; | ||||
|     } | ||||
|   } | ||||
| } | ||||
| </style> | ||||
		Reference in New Issue
	
	Block a user