From 2cb2f782d29b546caecbabf16f605721e0ea4243 Mon Sep 17 00:00:00 2001
From: liukangdong <898885815@qq.com>
Date: 星期四, 19 九月 2024 09:01:11 +0800
Subject: [PATCH] ‘’
---
admin/src/views/meeting/components/OperaRoomsWindow.vue | 203 ++++++++++++++++++++++++++++++++++----------------
1 files changed, 139 insertions(+), 64 deletions(-)
diff --git a/admin/src/views/meeting/components/OperaRoomsWindow.vue b/admin/src/views/meeting/components/OperaRoomsWindow.vue
index 22561e6..15981d2 100644
--- a/admin/src/views/meeting/components/OperaRoomsWindow.vue
+++ b/admin/src/views/meeting/components/OperaRoomsWindow.vue
@@ -1,67 +1,58 @@
<template>
- <GlobalAlertWindow
- v-loading="isUploading"
- :title="title"
- :visible.sync="visible"
- :confirm-working="isWorking"
- @confirm="confirm"
- >
+ <GlobalAlertWindow v-loading="isUploading" :title="title" :visible.sync="visible" :confirm-working="isWorking"
+ @confirm="confirm">
<el-form :model="form" ref="form" :rules="rules" label-width="120px" label-suffix="锛�">
<el-form-item label="浼氳瀹ゅ悕绉�" prop="name">
- <el-input v-model="form.name" placeholder="璇疯緭鍏ヤ細璁鍚嶇О" :maxlength="10" v-trim/>
+ <el-input v-model="form.name" placeholder="璇疯緭鍏ヤ細璁鍚嶇О" :maxlength="10" v-trim />
</el-form-item>
<el-form-item label="寮�鏀炬椂闂�" prop="timeRange">
- <el-time-picker
- is-range
- value-format="HH:mm"
- format="HH:mm"
- v-model="timeRange"
- range-separator="鑷�"
- start-placeholder="寮�濮嬫椂闂�"
- end-placeholder="缁撴潫鏃堕棿"
- placeholder="閫夋嫨鏃堕棿鑼冨洿"
- @change="selectRange"
- ></el-time-picker>
+ <el-time-picker is-range value-format="HH:mm" format="HH:mm" v-model="timeRange" range-separator="鑷�"
+ start-placeholder="寮�濮嬫椂闂�" end-placeholder="缁撴潫鏃堕棿" placeholder="閫夋嫨鏃堕棿鑼冨洿" @change="selectRange"></el-time-picker>
</el-form-item>
<el-form-item label="绮掑害鍒嗛挓" prop="intervalTime">
- <el-input v-model="form.intervalTime" type="number" placeholder="璇疯緭鍏ユ椂闂寸矑搴︼紙鍒嗛挓锛�" v-trim/>
+ <el-input v-model="form.intervalTime" type="number" placeholder="璇疯緭鍏ユ椂闂寸矑搴︼紙鍒嗛挓锛�" v-trim />
</el-form-item>
<el-form-item label="瀹圭撼浜烘暟" prop="limitNum">
- <el-input v-model="form.limitNum" type="number" placeholder="璇疯緭鍏ュ绾充汉鏁�" v-trim/>
+ <el-input v-model="form.limitNum" type="number" placeholder="璇疯緭鍏ュ绾充汉鏁�" v-trim />
</el-form-item>
<el-form-item label="绠＄悊鍛�" prop="sysList">
- <el-select
- v-model="form.sysList"
- filterable
- multiple
- clearable
- placeholder="璇烽�夋嫨閮ㄩ棬"
- >
- <!-- :label="`${item.department.name}-${item.realname}`" -->
- <el-option
- v-for="item in userList()"
- :key="item.id"
- :value="item.id"
- :label="item.companyId?`${item.companyName}-${item.companyName}`:item.realname"
- />
+ <el-select v-model="form.sysList" filterable multiple clearable placeholder="璇烽�夋嫨閮ㄩ棬">
+ <!-- :label="`${item.department.name}-${item.realname}`" -->
+ <el-option v-for="item in userList()" :key="item.id" :value="item.id"
+ :label="item.companyId ? `${item.companyName}-${item.companyName}` : item.realname" />
</el-select>
</el-form-item>
<el-form-item label="鎻愪緵鏈嶅姟椤圭洰" prop="projectList">
<el-checkbox-group v-model="form.projectList">
- <el-checkbox v-for="project in projectList" :label="project.id" :key="project.id">{{project.name}}</el-checkbox>
+ <el-checkbox v-for="project in projectList" :label="project.id" :key="project.id">{{ project.name
+ }}</el-checkbox>
</el-checkbox-group>
</el-form-item>
- <el-form-item label="浼氳瀹ゅ浘鐗�" prop="imgurl">
- <UploadAvatarImage
- :file="{ 'imgurlfull': form.imgFullUrl, 'imgurl': form.imgurl }"
- :uploadData="uploadData"
- @uploadSuccess="uploadAvatarSuccess"
- @uploadEnd="isUploading = false"
- @uploadBegin="isUploading = true"
- />
+ <el-form-item label="绌洪棽灞曠ず鍐呭" prop="fileType">
+ <el-radio v-model="form.fileType" @change="changeFile" :label="2">鏃�</el-radio>
+ <el-radio v-model="form.fileType" @change="changeFile" :label="0">鍥剧墖</el-radio>
+ <el-radio v-model="form.fileType" @change="changeFile" :label="1">瑙嗛</el-radio>
+ </el-form-item>
+ <el-form-item v-if="form.fileType == 0" label="灞曠ず鍥剧墖" prop="imgurl">
+ <div class="upload_wrap">
+ <el-upload class="avatar-uploader" accept=".png,.jpg,.jpeg" :action="uploadImgUrl" :data="uploadData"
+ :show-file-list="false" :on-success="handleImgSuccess">
+ <div>
+ <i class="el-icon-plus avatar-uploader-icon"></i>
+ </div>
+ </el-upload>
+ <div v-for="item, i in form.multifileList" class="img_wrap">
+ <img :src="item.fileurlFull" class="img">
+ <i class="el-icon-error del" @click="imgDel(i)"></i>
+ </div>
+ </div>
+ </el-form-item>
+ <el-form-item v-if="form.fileType == 1" label="灞曠ず瑙嗛" prop="imgurl">
+ <UploadAvatarVideo :file="{ 'videourlfull': form.videoFullUrl, 'videourl': form.videourl }" :uploadData="uploadData"
+ @uploadSuccess="uploadAvatarSuccess" @uploadEnd="isUploading = false" @uploadBegin="isUploading = true" />
</el-form-item>
<el-form-item label="浣跨敤椤荤煡" prop="tips">
- <el-input v-model="form.tips" type="textarea" placeholder="璇疯緭鍏ヤ娇鐢ㄩ』鐭�" v-trim/>
+ <el-input v-model="form.tips" type="textarea" placeholder="璇疯緭鍏ヤ娇鐢ㄩ』鐭�" v-trim />
</el-form-item>
</el-form>
</GlobalAlertWindow>
@@ -70,14 +61,14 @@
<script>
import BaseOpera from '@/components/base/BaseOpera'
import GlobalAlertWindow from '@/components/common/GlobalAlertWindow'
-import UploadAvatarImage from '@/components/common/UploadAvatarImage'
+import UploadAvatarVideo from '@/components/common/UploadAvatarVideo'
import { numRule } from '@/utils/form'
import { fetchList } from '@/api/meeting/projects'
export default {
name: 'OperaRoomsWindow',
extends: BaseOpera,
- components: { GlobalAlertWindow, UploadAvatarImage },
- data () {
+ components: { GlobalAlertWindow, UploadAvatarVideo },
+ data() {
let timeRangeRule = (rule, value, callBack) => {
if (!this.form.startTime) {
callBack(new Error('璇烽�夋嫨寮�濮嬫椂闂�'))
@@ -90,6 +81,7 @@
callBack()
}
return {
+ uploadImgUrl: process.env.VUE_APP_API_PREFIX + '/visitsAdmin/cloudService/public/upload',
isUploading: false,
uploadData: {
folder: 'projects'
@@ -99,11 +91,13 @@
form: {
id: null,
sysList: [],
+ multifileList: [],
projectList: [],
createDate: '',
editor: '',
editDate: null,
isdeleted: 0,
+ fileType: 2,
name: '',
remark: '',
startTime: '',
@@ -132,7 +126,7 @@
}
},
inject: ['userList'],
- created () {
+ created() {
this.config({
api: '/meeting/rooms',
'field.id': 'id'
@@ -153,7 +147,7 @@
* @title 绐楀彛鏍囬
* @target 缂栬緫鐨勫璞�
*/
- open (title, target) {
+ open(title, target) {
this.title = title
this.visible = true
this.form.imgFullUrl = ''
@@ -182,20 +176,44 @@
console.log(target)
})
},
+ imgDel(i) {
+ this.form.multifileList.splice(i, 1)
+ },
+ handleImgSuccess(res) {
+ const list = [...this.form.multifileList]
+ if (res.code == 200) {
+ let { data } = res
+ list.push({
+ fileurl: data.imgaddr,
+ fileurlFull: data.url,
+ type: 0
+ })
+ this.$set(this.form, 'multifileList', list)
+
+ }
+ },
selectRange(v) {
// console.log(this.timeRange);
- console.log(v);
+ console.log(v)
this.form.startTime = v[0]
this.form.endTime = v[1]
- console.log(this.form.startTime, this.form.endTime);
+ console.log(this.form.startTime, this.form.endTime)
},
- // 涓婁紶鍥剧墖
+ changeFile() {
+ this.$set(this.form, 'multifileList', [])
+ },
uploadAvatarSuccess(file) {
- this.form.imgurl = file.imgurl;
- this.form.imgFullUrl = file.imgurlfull;
+ console.log('file', file)
+ this.form.multifileList.push({
+ fileurl: file.imgurl,
+ fileurlFull: file.imgurlfull,
+ type: 1
+ })
+ this.$set(this.form, 'videourl', file.imgurl)
+ this.$set(this.form, 'videoFullUrl', file.imgurlfull)
},
// 纭鏂板缓
- __confirmCreate () {
+ __confirmCreate() {
this.$refs.form.validate((valid) => {
// debugger
if (!valid) {
@@ -207,11 +225,11 @@
this.isWorking = true
let sysList = [...this.form.sysList]
sysList = sysList.map(item => {
- return {userId: item}
+ return { userId: item }
})
let projectList = [...this.form.projectList]
projectList = projectList.map(item => {
- return {projectId: item}
+ return { projectId: item }
})
this.api.create({
...this.form,
@@ -232,22 +250,22 @@
})
},
// 纭淇敼
- __confirmEdit () {
+ __confirmEdit() {
this.$refs.form.validate((valid) => {
if (!valid) {
return
}
- console.log(this.form);
+ console.log(this.form)
debugger
// 璋冪敤鏂板缓鎺ュ彛
this.isWorking = true
let sysList = [...this.form.sysList]
sysList = sysList.map(item => {
- return {userId: item}
+ return { userId: item }
})
let projectList = [...this.form.projectList]
projectList = projectList.map(item => {
- return {projectId: item}
+ return { projectId: item }
})
this.api.updateById({
...this.form,
@@ -272,6 +290,63 @@
</script>
<style lang="scss" scoped>
-@import "@/assets/style/alertstyle.scss";
+$image-width: 90px;
-</style>
+.upload_wrap {
+ display: flex;
+
+ .img_wrap {
+ margin-left: 10px;
+ border: 1px dashed #d9d9d9;
+ width: $image-width;
+ height: $image-width;
+ border-radius: 6px;
+ position: relative;
+
+ .img {
+ width: $image-width;
+ height: $image-width;
+ }
+
+ .del {
+ position: absolute;
+ top: -6px;
+ right: -6px;
+ cursor: pointer;
+ color: red;
+ }
+ }
+}
+
+.avatar-uploader {
+ width: $image-width;
+ height: $image-width;
+}
+
+::v-deep .el-upload {
+ border: 1px dashed #d9d9d9;
+ border-radius: 6px;
+ cursor: pointer;
+ position: relative;
+ overflow: hidden;
+}
+
+.avatar-uploader .el-upload:hover {
+ border-color: #409EFF;
+}
+
+.avatar-uploader-icon {
+ line-height: 90px;
+ font-size: 28px;
+ color: #8c939d;
+ width: $image-width;
+ height: $image-width;
+ text-align: center;
+}
+
+.avatar {
+ width: 90px;
+ max-height: 90px;
+ display: block;
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3