mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-12 04:16:47 +08:00
feat:增加选择模版等
This commit is contained in:
lixg
@@ -2,7 +2,7 @@
|
|||||||
* @Author: lixg lixg@dongwu-inc.com
|
* @Author: lixg lixg@dongwu-inc.com
|
||||||
* @Date: 2022-11-07 17:06:45
|
* @Date: 2022-11-07 17:06:45
|
||||||
* @LastEditors: lixg lixg@dongwu-inc.com
|
* @LastEditors: lixg lixg@dongwu-inc.com
|
||||||
* @LastEditTime: 2022-11-09 09:32:35
|
* @LastEditTime: 2022-11-15 16:43:26
|
||||||
* @FilePath: /fe-manage/src/api/index.js
|
* @FilePath: /fe-manage/src/api/index.js
|
||||||
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
||||||
*/
|
*/
|
||||||
@@ -64,8 +64,8 @@ export const handleProject = (obj) => http.post('/admin/project/handle', obj)
|
|||||||
export const taskStudentList = (obj) => http.post('/admin/project/taskStudentList', obj)
|
export const taskStudentList = (obj) => http.post('/admin/project/taskStudentList', obj)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
//获取讨论信息
|
//获取讨论信息
|
||||||
export const getDiscussDetail=(obj)=>http.post('/discuss/getDiscussDetail',obj)
|
export const getDiscussDetail=(obj)=>http.post('/discuss/getDiscussDetail',obj)
|
||||||
|
|
||||||
|
//获取模版列表
|
||||||
|
export const getTemplate=(obj)=>http.post('/admin/project/template/list',obj)
|
||||||
|
|||||||
@@ -165,9 +165,212 @@ function autoComma(number) {
|
|||||||
const commonData={
|
const commonData={
|
||||||
timeout:50
|
timeout:50
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
//组织树
|
||||||
|
const organizationalTree= [
|
||||||
|
{
|
||||||
|
title: "京东方",
|
||||||
|
value: "京东方",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "产研部",
|
||||||
|
value: "产研部",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "产品部",
|
||||||
|
value: "产品部",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "研究部",
|
||||||
|
value: "研究部",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "研究部2",
|
||||||
|
value: "研究部2",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "研究3",
|
||||||
|
value: "研究3",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "研究4",
|
||||||
|
value: "研究4",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "研究部5",
|
||||||
|
value: "研究部5",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "研究部6",
|
||||||
|
value: "研究部6",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "研究部7",
|
||||||
|
value: "研究部7",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "研究部8",
|
||||||
|
value: "研究部8",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "研究部9",
|
||||||
|
value: "研究部9",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "二级标题",
|
||||||
|
value: "二级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "三级标题",
|
||||||
|
value: "三级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "四级标题",
|
||||||
|
value: "四级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "五级标题",
|
||||||
|
value: "五级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "六级标题",
|
||||||
|
value: "六级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "七级标题",
|
||||||
|
value: "七级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "八级标题",
|
||||||
|
value: "八级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "九级标题",
|
||||||
|
value: "九级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "十级标题",
|
||||||
|
value: "十级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "十一级标题",
|
||||||
|
value: "十一级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "十二级标题",
|
||||||
|
value: "十二级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title:
|
||||||
|
"十三级标题十三级标题十三级标题十三级标题",
|
||||||
|
value: "十三级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title:
|
||||||
|
"十四级标题",
|
||||||
|
value:
|
||||||
|
"十四级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title:
|
||||||
|
"十五级标题",
|
||||||
|
value:
|
||||||
|
"十五级标题",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title:
|
||||||
|
"十六级标题",
|
||||||
|
value:
|
||||||
|
"十六级标题",
|
||||||
|
children:
|
||||||
|
[
|
||||||
|
{
|
||||||
|
title:
|
||||||
|
"十七级标题",
|
||||||
|
value:
|
||||||
|
"十七级标题",
|
||||||
|
children:
|
||||||
|
[
|
||||||
|
{
|
||||||
|
title:
|
||||||
|
"十八级标题",
|
||||||
|
value:
|
||||||
|
"十八级标题",
|
||||||
|
children:
|
||||||
|
[
|
||||||
|
{
|
||||||
|
title:
|
||||||
|
"十九级标题",
|
||||||
|
value:
|
||||||
|
"十九级标题",
|
||||||
|
children:
|
||||||
|
[
|
||||||
|
{
|
||||||
|
title:
|
||||||
|
"二十级标题二十级标题",
|
||||||
|
value:
|
||||||
|
"二十级标题二十级标题",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "人力资源部",
|
||||||
|
value: "人力资源部",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: "人事部",
|
||||||
|
value: "人事部",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "行政部",
|
||||||
|
value: "行政部",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]
|
||||||
export {
|
export {
|
||||||
toDate,
|
toDate,
|
||||||
getWeek,
|
getWeek,
|
||||||
autoComma,
|
autoComma,
|
||||||
commonData,
|
commonData,
|
||||||
|
organizationalTree,
|
||||||
}
|
}
|
||||||
@@ -7,25 +7,45 @@
|
|||||||
:closable="closableQR"
|
:closable="closableQR"
|
||||||
wrapClassName="codeModal"
|
wrapClassName="codeModal"
|
||||||
style="margin-top: 400px"
|
style="margin-top: 400px"
|
||||||
:zIndex="9999"
|
:zIndex="999"
|
||||||
@cancel="qr_exit"
|
@cancel="qr_exit"
|
||||||
>
|
>
|
||||||
<div id="qrcode" class="QR">
|
<div id="qrcode" class="QR">
|
||||||
<div class="qr_header"></div>
|
<div class="qr_header"></div>
|
||||||
<div class="qr_main">
|
<div class="qr_main">
|
||||||
<div class="qrm_header">
|
<div class="qrm_header">
|
||||||
<span style="title">{{codeInfo.title?codeInfo.title:''}}</span>
|
<span style="title">{{
|
||||||
|
codeInfo.title ? codeInfo.title : ""
|
||||||
|
}}</span>
|
||||||
<div class="close_exit" @click="closeCodeModal"></div>
|
<div class="close_exit" @click="closeCodeModal"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="qrm_body">
|
<div class="downloadCode" style="">
|
||||||
<div class="codename">{{codeInfo.name?codeInfo.name:''}}</div>
|
<div class="qrm_body">
|
||||||
<qrcode-vue
|
<div class="codename">
|
||||||
:value="codeInfo.url?codeInfo.url:''"
|
{{ codeInfo.name ? codeInfo.name : "" }}
|
||||||
:size="qrcodeSize"
|
</div>
|
||||||
style="width: 200px; height: 200px"
|
<qrcode-vue
|
||||||
></qrcode-vue>
|
:value="codeInfo.url ? codeInfo.url : ''"
|
||||||
|
:size="qrcodeSize"
|
||||||
|
style="width: 200px; height: 200px"
|
||||||
|
></qrcode-vue>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="codeUrl" :style="{ display: showUrl ? 'flex' : 'none' }">
|
||||||
|
<div class="codeUrlLink">链接</div>
|
||||||
|
<a-input
|
||||||
|
:value="codeInfo.url ? codeInfo.url : ''"
|
||||||
|
disabled
|
||||||
|
class="codeUrlInp"
|
||||||
|
/>
|
||||||
|
<a-input
|
||||||
|
:value="codeInfo.url ? codeInfo.url : ''"
|
||||||
|
id="courseUrl"
|
||||||
|
class="codeUrlInp"
|
||||||
|
style="position: absolute; opacity: 0; z-index: -1"
|
||||||
|
/>
|
||||||
|
<div @click="copyUrl" class="codeUrlCopy">复制链接</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="qrm_footer">
|
<div class="qrm_footer">
|
||||||
<span style="margin-left: 52px">下载二维码</span>
|
<span style="margin-left: 52px">下载二维码</span>
|
||||||
<div class="qrmbtn" @click="downloadQr(200)">
|
<div class="qrmbtn" @click="downloadQr(200)">
|
||||||
@@ -47,7 +67,8 @@
|
|||||||
<script>
|
<script>
|
||||||
import { reactive, toRefs, watch } from "vue";
|
import { reactive, toRefs, watch } from "vue";
|
||||||
import QrcodeVue from "qrcode.vue";
|
import QrcodeVue from "qrcode.vue";
|
||||||
// import html2canvas from "html2canvas";
|
import html2canvas from "html2canvas";
|
||||||
|
import { message } from "ant-design-vue";
|
||||||
export default {
|
export default {
|
||||||
name: "TwoDimensionalCode",
|
name: "TwoDimensionalCode",
|
||||||
components: {
|
components: {
|
||||||
@@ -64,97 +85,70 @@ export default {
|
|||||||
return {};
|
return {};
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
index: {
|
index: {
|
||||||
|
type: String,
|
||||||
|
default: "",
|
||||||
|
},
|
||||||
|
type: {
|
||||||
type: String,
|
type: String,
|
||||||
default: "",
|
default: "",
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
setup(props, ctx) {
|
setup(props, ctx) {
|
||||||
const state = reactive({
|
const state = reactive({
|
||||||
qrcodeUrl: "https://www.baidu.com/",
|
|
||||||
qrcodeSize: 800,
|
qrcodeSize: 800,
|
||||||
codeInfo: {},
|
codeInfo: {},
|
||||||
|
courseUrl: "https://www.baidu.com/",
|
||||||
|
showUrl: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
//下载二维码图片
|
//下载二维码图片
|
||||||
const downloadQr = (num) => {
|
const downloadQr = (num) => {
|
||||||
state.qrcodeSize = num;
|
state.qrcodeSize = num;
|
||||||
// let filename = `${new Date().getTime()}.png`;
|
html2canvas(
|
||||||
// let canvas = document.getElementsByTagName("canvas")[0];
|
document.querySelectorAll(".downloadCode")[Number(props.index)],
|
||||||
// let imageUrl = canvas.toDataURL("image/png");
|
{
|
||||||
|
useCORS: true, //支持图片跨域
|
||||||
|
}
|
||||||
|
).then((canvas) => {
|
||||||
|
// console.log("canvas", canvas, canvas.width, canvas.style.width);
|
||||||
|
let filename = `${new Date().getTime()}.png`;
|
||||||
|
let imageUrl = canvas.toDataURL("image/png");
|
||||||
|
let a = document.createElement("a");
|
||||||
|
a.style.display = "none";
|
||||||
|
a.download = filename;
|
||||||
|
a.href = imageUrl;
|
||||||
|
document.body.appendChild(a);
|
||||||
|
a.click();
|
||||||
|
});
|
||||||
|
// let canvas =document.getElementsByClassName('codeModal')[Number(props.index)].getElementsByTagName('canvas')[0];
|
||||||
|
// let filename = `${new Date().getTime()}.png`;
|
||||||
|
// let imageUrl = canvas.toDataURL("image/png");
|
||||||
|
// let a = document.createElement("a");
|
||||||
|
// a.style.display = "none";
|
||||||
|
// a.download = filename;
|
||||||
|
// a.href = imageUrl;
|
||||||
|
// document.body.appendChild(a);
|
||||||
|
// a.click();
|
||||||
|
};
|
||||||
|
//复制链接
|
||||||
|
const copyUrl = () => {
|
||||||
|
// const range = document.createRange(); //创建range对象
|
||||||
|
// range.selectNode(document.getElementById('courseUrl')); //获取复制内容的 id 选择器
|
||||||
|
// const selection = window.getSelection(); //创建 selection对象
|
||||||
|
// if (selection.rangeCount > 0) selection.removeAllRanges(); //如果页面已经有选取了的话，会自动删除这个选区，没有选区的话，会把这个选取加入选区
|
||||||
|
// selection.addRange(range); //将range对象添加到selection选区当中，会高亮文本块
|
||||||
|
// document.execCommand("Copy"); //复制选中的文字到剪贴板
|
||||||
|
// message.success('复制成功')
|
||||||
|
// selection.removeRange(range); // 移除选中的元素
|
||||||
|
|
||||||
// let canvasBox = document.createElement("canvas");
|
var input = document.createElement("input"); // 创建input对象
|
||||||
// let ctx = canvasBox.getContext("2d");
|
input.value = state.codeInfo.url ? state.codeInfo.url : ""; // 设置复制内容
|
||||||
// var img = new Image();
|
document.body.appendChild(input); // 添加临时实例
|
||||||
// // 需要添加文字的图片
|
input.select(); // 选择实例内容
|
||||||
// img.src = imageUrl;
|
document.execCommand("Copy"); // 执行复制
|
||||||
// // 等待图片加载完成
|
document.body.removeChild(input); // 删除临时实例
|
||||||
// img.onload = function () {
|
message.success("复制成功！");
|
||||||
// // 将图片添加到canvas
|
|
||||||
// ctx.drawImage(img, 0, 0, 1240, 2208);
|
|
||||||
// // 设置字体
|
|
||||||
// ctx.font = "73px 微软雅黑 bolder";
|
|
||||||
// // 设置字体颜色
|
|
||||||
// ctx.fillStyle = "#955f17";
|
|
||||||
// ctx.textAlign = "center";
|
|
||||||
// // 添加文字和位置
|
|
||||||
// ctx.fillText("微信名", 621, 1050);
|
|
||||||
|
|
||||||
// // 导出为图片
|
|
||||||
// let url = canvasBox.toDataURL("image/png");
|
|
||||||
// let a = document.createElement("a");
|
|
||||||
// a.style.display = "none";
|
|
||||||
// a.download = filename;
|
|
||||||
// a.href = url;
|
|
||||||
// document.body.appendChild(a);
|
|
||||||
// a.click();
|
|
||||||
// };
|
|
||||||
|
|
||||||
// // let a = document.createElement("a");
|
|
||||||
// // a.style.display = "none";
|
|
||||||
// // a.download = filename;
|
|
||||||
// // a.href = imageUrl;
|
|
||||||
// // document.body.appendChild(a);
|
|
||||||
// // a.click();
|
|
||||||
|
|
||||||
// html2canvas(document.querySelector("#qrcode"), {
|
|
||||||
// useCORS: true, //支持图片跨域
|
|
||||||
// }).then((canvas) => {
|
|
||||||
// // var extra_canvas = document.createElement("canvas");
|
|
||||||
// // extra_canvas.setAttribute('width',num);
|
|
||||||
// // extra_canvas.setAttribute('height',num);
|
|
||||||
// // var ctx = extra_canvas.getContext('2d');
|
|
||||||
// // ctx.drawImage(canvas,0,0,num,num);
|
|
||||||
// // let filename = `${new Date().getTime()}.png`;
|
|
||||||
// // var imageUrl = extra_canvas.toDataURL("image/png",1.0);
|
|
||||||
|
|
||||||
// console.log("canvas", canvas, canvas.width, canvas.style.width);
|
|
||||||
|
|
||||||
// // // let ctx = canvas.getContext('2d');
|
|
||||||
// // // ctx.drawImage(canvas,0,0,canvas.width, canvas.height);
|
|
||||||
// // // canvas.width=num
|
|
||||||
// // // canvas.height=num
|
|
||||||
// // // canvas.style.width=num+'px'
|
|
||||||
// // // canvas.style.height=num+'px'
|
|
||||||
// // let filename = `${new Date().getTime()}.png`;
|
|
||||||
// // let imageUrl = canvas.toDataURL("image/png");
|
|
||||||
// // let a = document.createElement("a");
|
|
||||||
// // a.style.display = "none";
|
|
||||||
// // a.download = filename;
|
|
||||||
// // a.href = imageUrl;
|
|
||||||
// // document.body.appendChild(a);
|
|
||||||
// // a.click();
|
|
||||||
// });
|
|
||||||
console.log('document.getElementsByClassName',document.getElementsByClassName('codeModal'),Number(props.index))
|
|
||||||
let canvas =document.getElementsByClassName('codeModal')[Number(props.index)].getElementsByTagName('canvas')[0];
|
|
||||||
let filename = `${new Date().getTime()}.png`;
|
|
||||||
let imageUrl = canvas.toDataURL("image/png");
|
|
||||||
let a = document.createElement("a");
|
|
||||||
a.style.display = "none";
|
|
||||||
a.download = filename;
|
|
||||||
a.href = imageUrl;
|
|
||||||
document.body.appendChild(a);
|
|
||||||
a.click();
|
|
||||||
};
|
};
|
||||||
const closeCodeModal = () => {
|
const closeCodeModal = () => {
|
||||||
ctx.emit("update:codevisible", false);
|
ctx.emit("update:codevisible", false);
|
||||||
@@ -166,12 +160,20 @@ console.log('document.getElementsByClassName',document.getElementsByClassName('c
|
|||||||
url: "",
|
url: "",
|
||||||
};
|
};
|
||||||
state.codeInfo = Object.assign(obj, props.codeInfo);
|
state.codeInfo = Object.assign(obj, props.codeInfo);
|
||||||
console.log("codeInfo22222", state.codeInfo,props.index);
|
console.log("codeInfo22222", state.codeInfo, props.index, props.type);
|
||||||
|
|
||||||
|
if (props.type === "签到二维码") {
|
||||||
|
state.showUrl = false;
|
||||||
|
console.log(" state.showUrl", state.showUrl);
|
||||||
|
} else if (props.type === "课程二维码") {
|
||||||
|
state.showUrl = true;
|
||||||
|
}
|
||||||
});
|
});
|
||||||
return {
|
return {
|
||||||
...toRefs(state),
|
...toRefs(state),
|
||||||
downloadQr,
|
downloadQr,
|
||||||
closeCodeModal,
|
closeCodeModal,
|
||||||
|
copyUrl,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
@@ -229,8 +231,8 @@ console.log('document.getElementsByClassName',document.getElementsByClassName('c
|
|||||||
}
|
}
|
||||||
.qrm_body {
|
.qrm_body {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin-top: 22px;
|
padding-top: 22px;
|
||||||
margin-bottom: 32px;
|
padding-bottom: 32px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -242,6 +244,51 @@ console.log('document.getElementsByClassName',document.getElementsByClassName('c
|
|||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.codeUrl {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-bottom: 24px;
|
||||||
|
.codeUrlLink {
|
||||||
|
width: 72px;
|
||||||
|
height: 40px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #c7cbd2;
|
||||||
|
line-height: 20px;
|
||||||
|
border: 1px solid #c7cbd2;
|
||||||
|
border-right: 0px solid #c7cbd2;
|
||||||
|
}
|
||||||
|
.codeUrlInp {
|
||||||
|
width: 305px;
|
||||||
|
height: 40px;
|
||||||
|
border: 1px solid #c7cbd2;
|
||||||
|
}
|
||||||
|
.ant-input-disabled {
|
||||||
|
background-color: rgba(0, 0, 0, 0) !important;
|
||||||
|
}
|
||||||
|
.ant-input[disabled] {
|
||||||
|
background-color: rgba(0, 0, 0, 0) !important;
|
||||||
|
}
|
||||||
|
.codeUrlCopy {
|
||||||
|
width: 96px;
|
||||||
|
height: 40px;
|
||||||
|
background-color: #388be1;
|
||||||
|
border-radius: 8px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #ffffff;
|
||||||
|
line-height: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
.qrm_footer {
|
.qrm_footer {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|||||||
@@ -121,169 +121,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
<a-tab-pane key="2" tab="添加组织" force-render>
|
|
||||||
<div
|
|
||||||
:style="{ height: screenHeight - 235 + 'px' }"
|
|
||||||
style="overflow-y: auto"
|
|
||||||
>
|
|
||||||
<div class="tab2">
|
|
||||||
<div class="nameinp">
|
|
||||||
<div class="namee">组织：</div>
|
|
||||||
<a-input
|
|
||||||
v-model:value="com"
|
|
||||||
style="width: 230px; height: 40px; border-radius: 8px"
|
|
||||||
placeholder="请输入组织"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="btns">
|
|
||||||
<div class="btn1" @click="searchOrg">
|
|
||||||
<div class="img1">
|
|
||||||
<img
|
|
||||||
src="../../assets/images/courseManage/search0.png"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="wz">搜索</div>
|
|
||||||
</div>
|
|
||||||
<div class="btn2">
|
|
||||||
<div class="img2">
|
|
||||||
<img
|
|
||||||
src="../../assets/images/courseManage/reset1.png"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="wz">重置</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<!-- <div class="t1">
|
|
||||||
<div class="organize">姓名：</div>
|
|
||||||
<a-input
|
|
||||||
v-model:value="nameadd"
|
|
||||||
style="width: 200px; height: 40px; border-radius: 8px"
|
|
||||||
placeholder="请输入姓名"
|
|
||||||
/>
|
|
||||||
</div> -->
|
|
||||||
</div>
|
|
||||||
<div class="boeTree">
|
|
||||||
<div class="boeTreeTitle">BOE组织树</div>
|
|
||||||
|
|
||||||
<a-tree
|
|
||||||
class="treeMain treeMain2"
|
|
||||||
:style="{ height: screenHeight - 430 + 'px' }"
|
|
||||||
dropdownClassName="changetreedropdownboe"
|
|
||||||
defaultExpandAll
|
|
||||||
:dropdown-style="{
|
|
||||||
maxHeight: '600px',
|
|
||||||
}"
|
|
||||||
placeholder="BOE组织树"
|
|
||||||
allow-clear
|
|
||||||
tree-default-expand-all
|
|
||||||
:tree-data="treeData"
|
|
||||||
@select="departmentSelect1"
|
|
||||||
multiple
|
|
||||||
v-model:selectedKeys="selectedKeys1"
|
|
||||||
>
|
|
||||||
<template #suffixIcon></template>
|
|
||||||
</a-tree>
|
|
||||||
<div
|
|
||||||
class="boeTreeTitle"
|
|
||||||
style="margin-top: 8px; cursor: pointer"
|
|
||||||
@click="addOrgModal"
|
|
||||||
>
|
|
||||||
确认添加
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a-tab-pane>
|
|
||||||
<a-tab-pane key="3" tab="受众关联">
|
|
||||||
<div
|
|
||||||
:style="{ height: screenHeight - 235 + 'px' }"
|
|
||||||
style="overflow-y: auto"
|
|
||||||
>
|
|
||||||
<div class="tab1">
|
|
||||||
<div class="t1">
|
|
||||||
<!-- <div class="nameinp">
|
|
||||||
<div class="namee">选择受众：</div>
|
|
||||||
<div class="select">
|
|
||||||
<a-select
|
|
||||||
v-model:value="choosevalue"
|
|
||||||
style="width: 200px; border-radius: 8px"
|
|
||||||
placeholder="请选择受众群体"
|
|
||||||
:options="organizeList1"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div> -->
|
|
||||||
</div>
|
|
||||||
<div class="t1" style="margin-top: 10px">
|
|
||||||
<div class="organize">受众名称：</div>
|
|
||||||
<a-input
|
|
||||||
v-model:value="nameaddd"
|
|
||||||
style="width: 260px; height: 40px; border-radius: 8px"
|
|
||||||
placeholder="请输入受众名称"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="btns">
|
|
||||||
<div class="btn1">
|
|
||||||
<div class="img1">
|
|
||||||
<img
|
|
||||||
src="../../assets/images/courseManage/search0.png"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="wz">搜索</div>
|
|
||||||
</div>
|
|
||||||
<div class="btn2">
|
|
||||||
<div class="img2">
|
|
||||||
<img
|
|
||||||
src="../../assets/images/courseManage/reset1.png"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="wz">重置</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- <div class="line">
|
|
||||||
<div class="inline">
|
|
||||||
<div class="left1">
|
|
||||||
<div class="img"></div>
|
|
||||||
<div class="text" style="margin-left: 10px">已选择</div>
|
|
||||||
<div class="text2">2</div>
|
|
||||||
<div class="text">项</div>
|
|
||||||
<div class="text3">列表选项总计：</div>
|
|
||||||
<div class="text4">9条</div>
|
|
||||||
</div>
|
|
||||||
<div class="right1">清空</div>
|
|
||||||
</div>
|
|
||||||
</div> -->
|
|
||||||
<div class="tableBox tabb" style="margin-top: 16px">
|
|
||||||
<a-table
|
|
||||||
style="border: 1px solid #f2f6fe"
|
|
||||||
:columns="tablecolumns2"
|
|
||||||
:data-source="tabledata2"
|
|
||||||
:loading="tableDataTotal === -1 ? true : false"
|
|
||||||
expandRowByClick="true"
|
|
||||||
:scroll="{ x: 500 }"
|
|
||||||
@expand="expandTable"
|
|
||||||
:pagination="false"
|
|
||||||
:row-selection="{
|
|
||||||
columnWidth: 30,
|
|
||||||
selectedRowKeys: selectedRowKeys2,
|
|
||||||
onChange: onSelectChange2,
|
|
||||||
}"
|
|
||||||
/>
|
|
||||||
<div class="pa" style="margin-top: 20px">
|
|
||||||
<a-pagination
|
|
||||||
showSizeChanger="true"
|
|
||||||
showQuickJumper="true"
|
|
||||||
hideOnSinglePage="true"
|
|
||||||
:pageSize="pageSize2"
|
|
||||||
:current="currentPage2"
|
|
||||||
:total="tableDataTotal2"
|
|
||||||
class="pagination"
|
|
||||||
v-if="tabledata2 > 10"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a-tab-pane>
|
|
||||||
</a-tabs>
|
</a-tabs>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -356,134 +194,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="line"></div>
|
|
||||||
<div class="tit">添加组织</div>
|
|
||||||
<div style="position: relative; min-height: 180px">
|
|
||||||
<div
|
|
||||||
style="position: relative; height: 160px"
|
|
||||||
class="selectedsBox"
|
|
||||||
id="selectedsBox1"
|
|
||||||
>
|
|
||||||
<div class="selecteds" id="selecteds1">
|
|
||||||
<!-- 遍历生成 -->
|
|
||||||
<div
|
|
||||||
class="chose"
|
|
||||||
v-for="item in chooseorganization1"
|
|
||||||
:key="item.key"
|
|
||||||
>
|
|
||||||
<div>{{ item.value }}</div>
|
|
||||||
<div class="ch" @click="deleteChoosePeople1(item)"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="chose"
|
|
||||||
style="
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
margin-right: 20px;
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: 500;
|
|
||||||
color: #409eff;
|
|
||||||
line-height: 22px;
|
|
||||||
"
|
|
||||||
v-if="showMore1"
|
|
||||||
@click="morePeopleShow1"
|
|
||||||
>
|
|
||||||
<div>
|
|
||||||
查看更多
|
|
||||||
<img
|
|
||||||
style="width: 10px; height: 12px; margin-top: -2px"
|
|
||||||
src="../../assets/images/projectadd/go.png"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="chose"
|
|
||||||
style="
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
margin-right: 20px;
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: 500;
|
|
||||||
color: #409eff;
|
|
||||||
line-height: 22px;
|
|
||||||
"
|
|
||||||
v-if="showHidden1"
|
|
||||||
@click="morePeopleHidden1"
|
|
||||||
>
|
|
||||||
<div>
|
|
||||||
收起
|
|
||||||
<img
|
|
||||||
style="width: 10px; height: 12px; margin-top: -2px"
|
|
||||||
src="../../assets/images/projectadd/pickUp.png"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="line"></div>
|
|
||||||
<div class="tit">受众关联</div>
|
|
||||||
<div
|
|
||||||
style="position: relative; min-height: 180px; padding-bottom: 40px"
|
|
||||||
>
|
|
||||||
<div style="height: 160px" class="selectedsBox" id="selectedsBox2">
|
|
||||||
<div class="selecteds" id="selecteds2">
|
|
||||||
<!-- 遍历生成 -->
|
|
||||||
<div
|
|
||||||
class="chose"
|
|
||||||
v-for="item in relationpeople"
|
|
||||||
:key="item.key"
|
|
||||||
>
|
|
||||||
<div>{{ item.name }}</div>
|
|
||||||
<div class="ch" @click="deleteRelationPeople(item)"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="chose"
|
|
||||||
style="
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
margin-right: 20px;
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: 500;
|
|
||||||
color: #409eff;
|
|
||||||
line-height: 22px;
|
|
||||||
"
|
|
||||||
v-if="showMore2"
|
|
||||||
@click="morePeopleShow2"
|
|
||||||
>
|
|
||||||
<div>
|
|
||||||
查看更多
|
|
||||||
<img
|
|
||||||
style="width: 10px; height: 12px; margin-top: -2px"
|
|
||||||
src="../../assets/images/projectadd/go.png"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
class="chose"
|
|
||||||
style="
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
margin-right: 20px;
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: 500;
|
|
||||||
color: #409eff;
|
|
||||||
line-height: 22px;
|
|
||||||
"
|
|
||||||
v-if="showHidden2"
|
|
||||||
@click="morePeopleHidden2"
|
|
||||||
>
|
|
||||||
<div>
|
|
||||||
收起
|
|
||||||
<img
|
|
||||||
style="width: 10px; height: 12px; margin-top: -2px"
|
|
||||||
src="../../assets/images/projectadd/pickUp.png"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="btnn">
|
<div class="btnn">
|
||||||
@@ -492,44 +203,15 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 确认添加部门弹窗 -->
|
|
||||||
<a-modal
|
|
||||||
v-model:visible="showOrgModal"
|
|
||||||
:footer="null"
|
|
||||||
wrapClassName="confirmAddOrg"
|
|
||||||
centered="true"
|
|
||||||
>
|
|
||||||
<div class="delete">
|
|
||||||
<div class="del_header"></div>
|
|
||||||
<div class="del_main">
|
|
||||||
<div class="header">
|
|
||||||
<div class="icon"></div>
|
|
||||||
<span>提示</span>
|
|
||||||
<div class="close_exit" @click="closeOrgModal"></div>
|
|
||||||
</div>
|
|
||||||
<div class="body">
|
|
||||||
<span>您确定要添加此组织吗</span>
|
|
||||||
</div>
|
|
||||||
<div class="del_btnbox">
|
|
||||||
<div class="del_btn btn1" @click="closeOrgModal">
|
|
||||||
<div class="btnText">取消</div>
|
|
||||||
</div>
|
|
||||||
<div class="del_btn btn2" @click="addOrg">
|
|
||||||
<div class="btnText">确定</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a-modal>
|
|
||||||
<!-- 确认添加部门弹窗 -->
|
|
||||||
</a-drawer>
|
</a-drawer>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { reactive, toRefs, onMounted, onUnmounted } from "vue";
|
import { reactive, toRefs, onMounted, onUnmounted } from "vue";
|
||||||
import elementResizeDetectorMaker from "element-resize-detector";
|
import elementResizeDetectorMaker from "element-resize-detector";
|
||||||
import { message } from "ant-design-vue";
|
// import { message } from "ant-design-vue";
|
||||||
import { toDate } from "../../api/method";
|
// import { toDate } from "../../api/method";
|
||||||
export default {
|
export default {
|
||||||
name: "OwnPower",
|
name: "OwnPower",
|
||||||
props: {
|
props: {
|
||||||
@@ -885,136 +567,7 @@ export default {
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
|
||||||
//受众关联table数据
|
|
||||||
tabledata2: [
|
|
||||||
{
|
|
||||||
key: 1,
|
|
||||||
name: "学习受众",
|
|
||||||
time: "1668410969",
|
|
||||||
number: "20",
|
|
||||||
type: "普通受众",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 2,
|
|
||||||
name: "案例受众",
|
|
||||||
time: "1668324569",
|
|
||||||
number: "10",
|
|
||||||
type: "普通受众",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 3,
|
|
||||||
name: "学习受众",
|
|
||||||
time: "1668238169",
|
|
||||||
number: "20",
|
|
||||||
type: "普通受众",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 4,
|
|
||||||
name: "显示受众",
|
|
||||||
time: "1668133769",
|
|
||||||
number: "30",
|
|
||||||
type: "普通受众2",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 5,
|
|
||||||
name: "惯例受众",
|
|
||||||
time: "1668047369",
|
|
||||||
number: "50",
|
|
||||||
type: "普通受众",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 6,
|
|
||||||
name: "管理受众",
|
|
||||||
time: "1667960969",
|
|
||||||
number: "20",
|
|
||||||
type: "普通受众",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 7,
|
|
||||||
name: "学习小组受众",
|
|
||||||
time: "1667874569",
|
|
||||||
number: "20",
|
|
||||||
type: "普通受众",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 8,
|
|
||||||
name: "学习受众",
|
|
||||||
time: "1667701769",
|
|
||||||
number: "10",
|
|
||||||
type: "普通受众",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 9,
|
|
||||||
name: "案例受众",
|
|
||||||
time: "1667442569",
|
|
||||||
number: "5",
|
|
||||||
type: "普通受众",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: 10,
|
|
||||||
name: "项目受众",
|
|
||||||
time: "1667262569",
|
|
||||||
number: "25",
|
|
||||||
type: "普通受众",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
tablecolumns2: [
|
|
||||||
{
|
|
||||||
title: "受众名称",
|
|
||||||
dataIndex: "name",
|
|
||||||
key: "name",
|
|
||||||
width: 30,
|
|
||||||
align: "left",
|
|
||||||
className: "h",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "创建时间",
|
|
||||||
dataIndex: "time",
|
|
||||||
key: "time",
|
|
||||||
width: 35,
|
|
||||||
align: "center",
|
|
||||||
className: "h",
|
|
||||||
sorter: {
|
|
||||||
compare: (a, b) => a.time - b.time,
|
|
||||||
multiple: 3,
|
|
||||||
},
|
|
||||||
scopedSlots: { customRender: "action" }, //引入的插槽
|
|
||||||
customRender: (text) => {
|
|
||||||
// console.log(text.record.checked1);
|
|
||||||
return (
|
|
||||||
<div class="racona">
|
|
||||||
<span> {toDate(Number(text.record.time), "Y-M-D h:m:s")}</span>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "人数",
|
|
||||||
dataIndex: "number",
|
|
||||||
key: "number",
|
|
||||||
width: 30,
|
|
||||||
align: "center",
|
|
||||||
className: "h",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "类型",
|
|
||||||
dataIndex: "type",
|
|
||||||
key: "type",
|
|
||||||
width: 40,
|
|
||||||
align: "center",
|
|
||||||
className: "h",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
organizeList1: [
|
|
||||||
{
|
|
||||||
value: "产品受众群体",
|
|
||||||
label: "产品受众群体",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: "人力资源hrbp",
|
|
||||||
label: "人力资源hrbp",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
//快速选人-------------------------------------
|
//快速选人-------------------------------------
|
||||||
valueSelectboe: null, //快速选人的选择组织
|
valueSelectboe: null, //快速选人的选择组织
|
||||||
choosepeople: [], //总的数组
|
choosepeople: [], //总的数组
|
||||||
@@ -1023,23 +576,7 @@ export default {
|
|||||||
showHidden: false, //是否显示收回
|
showHidden: false, //是否显示收回
|
||||||
selectedRowKeys: [], //表格选中的key
|
selectedRowKeys: [], //表格选中的key
|
||||||
//快速选人-------------------------------------
|
//快速选人-------------------------------------
|
||||||
//添加组织-------------------------------------
|
|
||||||
|
|
||||||
selectedKeys1: [], //选中部门的key
|
|
||||||
chooseorganization: [], //添加组织的选择组织
|
|
||||||
chooseorganization1: [], //显示到右侧的数组
|
|
||||||
showMore1: false, //是否显示添加组织的查看更多
|
|
||||||
showHidden1: false, //是否显示添加组织的收回
|
|
||||||
|
|
||||||
showOrgModal: false, //确认弹窗
|
|
||||||
//添加组织-------------------------------------
|
|
||||||
|
|
||||||
//受众关联-------------------------------------
|
|
||||||
relationpeople: [], //总的数组
|
|
||||||
showMore2: false, //是否显示快速选人的查看更多
|
|
||||||
showHidden2: false, //是否显示收回
|
|
||||||
selectedRowKeys2: [], //表格选中的key
|
|
||||||
//受众关联-------------------------------------
|
|
||||||
});
|
});
|
||||||
const closeDrawer = () => {
|
const closeDrawer = () => {
|
||||||
state.activeKey = "1";
|
state.activeKey = "1";
|
||||||
@@ -1153,217 +690,7 @@ export default {
|
|||||||
|
|
||||||
// 结束 快速选人------------------------------------------------------------------
|
// 结束 快速选人------------------------------------------------------------------
|
||||||
|
|
||||||
// 开始 添加组织------------------------------------------------------------------
|
|
||||||
//选中部门
|
|
||||||
const departmentSelect1 = (e, k) => {
|
|
||||||
console.log("选中的部门", e, k);
|
|
||||||
if (!k.node.children) {
|
|
||||||
state.selectedKeys1 = e.reverse();
|
|
||||||
if (k.selected) {
|
|
||||||
state.chooseorganization.unshift(k.node);
|
|
||||||
} else {
|
|
||||||
for (let i = 0; i < state.chooseorganization.length; i++) {
|
|
||||||
if (state.chooseorganization[i].key === k.node.key) {
|
|
||||||
state.chooseorganization.splice(i, 1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// console.log("选中的部门2", state.selectedKeys1, state.chooseorganization);
|
|
||||||
};
|
|
||||||
//点击确认添加-判断是否显示确定弹窗
|
|
||||||
const addOrgModal = () => {
|
|
||||||
if (state.chooseorganization.length === 0) {
|
|
||||||
message.destroy();
|
|
||||||
message.warning("请选择部门");
|
|
||||||
} else {
|
|
||||||
state.showOrgModal = true;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
//确定添加
|
|
||||||
const addOrg = () => {
|
|
||||||
console.log("chooseorganization", state.chooseorganization);
|
|
||||||
state.chooseorganization1 = state.chooseorganization;
|
|
||||||
selectedsHeight1();
|
|
||||||
state.showOrgModal = false;
|
|
||||||
};
|
|
||||||
//取消添加
|
|
||||||
const closeOrgModal = () => {
|
|
||||||
state.showOrgModal = false;
|
|
||||||
};
|
|
||||||
|
|
||||||
//单个删除选中的人
|
|
||||||
const deleteChoosePeople1 = (item) => {
|
|
||||||
console.log("item", item);
|
|
||||||
let arr = state.chooseorganization;
|
|
||||||
for (let i = 0; i < arr.length; i++) {
|
|
||||||
if (arr[i].key === item.key) {
|
|
||||||
arr.splice(i, 1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
state.chooseorganization = arr;
|
|
||||||
let array = state.selectedKeys1;
|
|
||||||
for (let i = 0; i < array.length; i++) {
|
|
||||||
if (array[i] === item.key) {
|
|
||||||
array.splice(i, 1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
state.selectedKeys1 = array;
|
|
||||||
console.log("state.selectedKeys1", state.selectedKeys1);
|
|
||||||
};
|
|
||||||
|
|
||||||
//根据右侧快速选人高度，判断是否显示更多
|
|
||||||
const selectedsHeight1 = () => {
|
|
||||||
let resize = elementResizeDetectorMaker();
|
|
||||||
resize.listenTo(
|
|
||||||
document.getElementById("ownpower").querySelector("#selecteds1"),
|
|
||||||
function (ele) {
|
|
||||||
console.log("ele", ele.offsetHeight);
|
|
||||||
if (ele.offsetHeight > 160 && !state.showHidden1) {
|
|
||||||
state.showMore1 = true;
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox1").style.overflow = "hidden";
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox1").style.height = "160px";
|
|
||||||
} else if (ele.offsetHeight < 160) {
|
|
||||||
state.showMore1 = false;
|
|
||||||
state.showHidden1 = false;
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox1").style.overflow = "hidden";
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox1").style.height = "160px";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
);
|
|
||||||
};
|
|
||||||
const morePeopleShow1 = () => {
|
|
||||||
state.showMore1 = false;
|
|
||||||
state.showHidden1 = true;
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox1").style.overflow = "";
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox1").style.height = "";
|
|
||||||
};
|
|
||||||
const morePeopleHidden1 = () => {
|
|
||||||
state.showMore1 = true;
|
|
||||||
state.showHidden1 = false;
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox1").style.overflow = "hidden";
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox1").style.height = "160px";
|
|
||||||
};
|
|
||||||
//搜索组织
|
|
||||||
const searchOrg = () => {
|
|
||||||
let treeTitle = document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector(".treeMain2")
|
|
||||||
.querySelectorAll(".ant-tree-title");
|
|
||||||
if (state.com) {
|
|
||||||
for (let i = 0; i < treeTitle.length; i++) {
|
|
||||||
if (state.com === treeTitle[i].innerHTML) {
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector(".treeMain2")
|
|
||||||
.scrollTo(0, treeTitle[i].offsetTop + 28 * i);
|
|
||||||
return;
|
|
||||||
} else if (i == treeTitle.length - 1) {
|
|
||||||
message.destroy();
|
|
||||||
message.warning("未找到该部门");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
message.destroy();
|
|
||||||
message.warning("请输入组织名称");
|
|
||||||
}
|
|
||||||
};
|
|
||||||
// 结束 添加组织------------------------------------------------------------------
|
|
||||||
|
|
||||||
// 开始 受众关联------------------------------------------------------------------
|
|
||||||
|
|
||||||
//受众关联 选中的数组
|
|
||||||
const onSelectChange2 = (selectedRowKeys, item) => {
|
|
||||||
// console.log("selectedRowKeys changed: ", selectedRowKeys,item);
|
|
||||||
state.selectedRowKeys2 = selectedRowKeys;
|
|
||||||
state.relationpeople = item.reverse();
|
|
||||||
selectedsHeight2();
|
|
||||||
};
|
|
||||||
//单个删除选中的人
|
|
||||||
const deleteChoosePeople2 = (item) => {
|
|
||||||
let arr = state.relationpeople;
|
|
||||||
for (let i = 0; i < arr.length; i++) {
|
|
||||||
if (arr[i].key === item.key) {
|
|
||||||
arr.splice(i, 1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
state.relationpeople = arr;
|
|
||||||
let array = state.selectedRowKeys2;
|
|
||||||
for (let i = 0; i < array.length; i++) {
|
|
||||||
if (array[i] === item.key) {
|
|
||||||
array.splice(i, 1);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
state.selectedRowKeys2 = array;
|
|
||||||
console.log("");
|
|
||||||
};
|
|
||||||
//根据右侧快速选人高度，判断是否显示更多
|
|
||||||
const selectedsHeight2 = () => {
|
|
||||||
let resize = elementResizeDetectorMaker();
|
|
||||||
resize.listenTo(
|
|
||||||
document.getElementById("ownpower").querySelector("#selecteds2"),
|
|
||||||
function (ele) {
|
|
||||||
console.log("ele", ele.offsetHeight);
|
|
||||||
if (ele.offsetHeight > 160 && !state.showHidden2) {
|
|
||||||
state.showMore2 = true;
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox2").style.overflow = "hidden";
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox2").style.height = "160px";
|
|
||||||
} else if (ele.offsetHeight < 160) {
|
|
||||||
state.showMore2 = false;
|
|
||||||
state.showHidden2 = false;
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox2").style.overflow = "hidden";
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox2").style.height = "160px";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
);
|
|
||||||
};
|
|
||||||
const morePeopleShow2 = () => {
|
|
||||||
state.showMore2 = false;
|
|
||||||
state.showHidden2 = true;
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox2").style.overflow = "";
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox2").style.height = "";
|
|
||||||
};
|
|
||||||
const morePeopleHidden2 = () => {
|
|
||||||
state.showMore2 = true;
|
|
||||||
state.showHidden2 = false;
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox2").style.overflow = "hidden";
|
|
||||||
document
|
|
||||||
.getElementById("ownpower")
|
|
||||||
.querySelector("#selectedsBox2").style.height = "160px";
|
|
||||||
};
|
|
||||||
|
|
||||||
// 结束 受众关联------------------------------------------------------------------
|
|
||||||
|
|
||||||
//全部清除
|
//全部清除
|
||||||
const deleteAll = () => {
|
const deleteAll = () => {
|
||||||
@@ -1374,30 +701,13 @@ export default {
|
|||||||
state.showHidden = false; //是否显示收回
|
state.showHidden = false; //是否显示收回
|
||||||
state.selectedRowKeys = []; //表格选中的key
|
state.selectedRowKeys = []; //表格选中的key
|
||||||
//快速选人-------------------------------------
|
//快速选人-------------------------------------
|
||||||
//添加组织-------------------------------------
|
|
||||||
|
|
||||||
state.selectedKeys1 = []; //选中部门的key
|
|
||||||
state.chooseorganization = []; //添加组织的选择组织
|
|
||||||
state.chooseorganization1 = []; //显示到右侧的数组
|
|
||||||
state.showMore1 = false; //是否显示添加组织的查看更多
|
|
||||||
state.showHidden1 = false; //是否显示添加组织的收回
|
|
||||||
|
|
||||||
state.showOrgModal = false; //确认弹窗
|
|
||||||
//添加组织-------------------------------------
|
|
||||||
|
|
||||||
//受众关联-------------------------------------
|
|
||||||
state.relationpeople = []; //总的数组
|
|
||||||
state.showMore2 = false; //是否显示快速选人的查看更多
|
|
||||||
state.showHidden2 = false; //是否显示收回
|
|
||||||
state.selectedRowKeys2 = []; //表格选中的key
|
|
||||||
//受众关联-------------------------------------
|
|
||||||
};
|
};
|
||||||
return {
|
return {
|
||||||
...toRefs(state),
|
...toRefs(state),
|
||||||
afterVisibleChange,
|
afterVisibleChange,
|
||||||
closeDrawer,
|
closeDrawer,
|
||||||
onSelectChange,
|
onSelectChange,
|
||||||
onSelectChange2,
|
|
||||||
// change,
|
// change,
|
||||||
departmentSelect,
|
departmentSelect,
|
||||||
deleteChoosePeople,
|
deleteChoosePeople,
|
||||||
@@ -1405,23 +715,10 @@ export default {
|
|||||||
morePeopleShow,
|
morePeopleShow,
|
||||||
morePeopleHidden,
|
morePeopleHidden,
|
||||||
|
|
||||||
departmentSelect1,
|
|
||||||
addOrgModal,
|
|
||||||
addOrg,
|
|
||||||
closeOrgModal,
|
|
||||||
selectedsHeight1,
|
|
||||||
morePeopleShow1,
|
|
||||||
morePeopleHidden1,
|
|
||||||
deleteChoosePeople1,
|
|
||||||
|
|
||||||
selectedsHeight2,
|
|
||||||
morePeopleShow2,
|
|
||||||
morePeopleHidden2,
|
|
||||||
deleteChoosePeople2,
|
|
||||||
|
|
||||||
deleteAll,
|
deleteAll,
|
||||||
|
|
||||||
searchOrg,
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -38,13 +38,13 @@
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div style="display: flex; margin-bottom: 20px">
|
<div style="display: flex; margin-bottom: 20px">
|
||||||
<div class="btn btn1">
|
<div class="btn btn1" @click="searchLearnPath">
|
||||||
<div class="search"></div>
|
<div class="search"></div>
|
||||||
<div class="btnText" @click="searchLearnPath">搜索</div>
|
<div class="btnText" >搜索</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="btnn btn2">
|
<div class="btnn btn2" @click="resetLearnPath">
|
||||||
<div class="search"></div>
|
<div class="search"></div>
|
||||||
<div class="btnText" @click="resetLearnPath">重置</div>
|
<div class="btnText" >重置</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -1349,7 +1349,7 @@ export default {
|
|||||||
.getLearnPath(obj)
|
.getLearnPath(obj)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
if (res.status === 200) {
|
if (res.status === 200) {
|
||||||
// console.log("获取路径列表数据", res.data.data);
|
console.log("获取路径列表数据", res.data.data);
|
||||||
let arr = res.data.data.rows;
|
let arr = res.data.data.rows;
|
||||||
if (
|
if (
|
||||||
arr.length === 0 &&
|
arr.length === 0 &&
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@@ -419,23 +419,7 @@
|
|||||||
<div
|
<div
|
||||||
class="operation"
|
class="operation"
|
||||||
style="cursor: pointer"
|
style="cursor: pointer"
|
||||||
:style="{
|
@click="showCodeModal"
|
||||||
display:
|
|
||||||
item.type == '6' ||
|
|
||||||
item.type == '9' ||
|
|
||||||
item.type == '2'
|
|
||||||
? 'flex'
|
|
||||||
: 'none',
|
|
||||||
}"
|
|
||||||
@click="
|
|
||||||
item.type == '2'
|
|
||||||
? showCopyModal(item.type)
|
|
||||||
: item.type == '6'
|
|
||||||
? showzhibModal(item.type)
|
|
||||||
: item.type == '9'
|
|
||||||
? showhuodModal(item.type)
|
|
||||||
: null
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
二维码
|
二维码
|
||||||
</div>
|
</div>
|
||||||
@@ -1373,6 +1357,7 @@
|
|||||||
</a-modal>
|
</a-modal>
|
||||||
</div>
|
</div>
|
||||||
<!-- 删除弹窗 -->
|
<!-- 删除弹窗 -->
|
||||||
|
|
||||||
<!-- 面授管理二维码 -->
|
<!-- 面授管理二维码 -->
|
||||||
<a-modal
|
<a-modal
|
||||||
v-model:visible="copyModal"
|
v-model:visible="copyModal"
|
||||||
@@ -1490,6 +1475,15 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- 编辑项目弹窗 -->
|
<!-- 编辑项目弹窗 -->
|
||||||
<proj-set v-model:editHs="editHs" v-model:projectId="projectId" />
|
<proj-set v-model:editHs="editHs" v-model:projectId="projectId" />
|
||||||
|
|
||||||
|
<!-- 二维码弹窗 -->
|
||||||
|
<two-dimensional-code
|
||||||
|
v-model:codevisible="codevisible"
|
||||||
|
:codeInfo="codeInfo"
|
||||||
|
index="0"
|
||||||
|
type="课程二维码"
|
||||||
|
/>
|
||||||
|
<!-- 二维码弹窗 -->
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@@ -1529,6 +1523,7 @@ import { getTask } from "../../api/indexTaskadd";
|
|||||||
import { toDate } from "../../api/method";
|
import { toDate } from "../../api/method";
|
||||||
import projSet from "../../components/Modals/projSet";
|
import projSet from "../../components/Modals/projSet";
|
||||||
import { overview } from "../../api/indexProjStu";
|
import { overview } from "../../api/indexProjStu";
|
||||||
|
import TwoDimensionalCode from "../../components/TwoDimensionalCode.vue";
|
||||||
export default {
|
export default {
|
||||||
name: "taskPage",
|
name: "taskPage",
|
||||||
components: {
|
components: {
|
||||||
@@ -1550,6 +1545,7 @@ export default {
|
|||||||
TaskImpStu,
|
TaskImpStu,
|
||||||
projSet,
|
projSet,
|
||||||
NoticeHis,
|
NoticeHis,
|
||||||
|
TwoDimensionalCode,
|
||||||
},
|
},
|
||||||
setup() {
|
setup() {
|
||||||
const state = reactive({
|
const state = reactive({
|
||||||
@@ -1664,6 +1660,9 @@ export default {
|
|||||||
|
|
||||||
huodModal: false, //活动二维码弹窗
|
huodModal: false, //活动二维码弹窗
|
||||||
allDelete: false, //批量删除弹窗
|
allDelete: false, //批量删除弹窗
|
||||||
|
|
||||||
|
codevisible: false, //二维码弹窗
|
||||||
|
codeInfo: null, //二维码信息
|
||||||
pubproject: false,
|
pubproject: false,
|
||||||
stugroup: false,
|
stugroup: false,
|
||||||
canclestu: false,
|
canclestu: false,
|
||||||
@@ -2505,6 +2504,15 @@ export default {
|
|||||||
const showEditProj = () => {
|
const showEditProj = () => {
|
||||||
state.editHs = true;
|
state.editHs = true;
|
||||||
};
|
};
|
||||||
|
//显示二维码弹窗
|
||||||
|
const showCodeModal = () => {
|
||||||
|
state.codevisible = true;
|
||||||
|
state.codeInfo = {
|
||||||
|
title: "课程二维码",
|
||||||
|
name: "管理者进阶面授课程",
|
||||||
|
url: "https://www.baidu.com/https://www.baidu.com/https://www.baidu.com/https://www.baidu.com/https://www.baidu.com/",
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
//学员管理列表操作
|
//学员管理列表操作
|
||||||
const studentData = () => {
|
const studentData = () => {
|
||||||
@@ -3199,6 +3207,7 @@ export default {
|
|||||||
closehuodModal,
|
closehuodModal,
|
||||||
closezhibModal,
|
closezhibModal,
|
||||||
|
|
||||||
|
showCodeModal,
|
||||||
tabsChange,
|
tabsChange,
|
||||||
|
|
||||||
getTaskList,
|
getTaskList,
|
||||||
|
|||||||
@@ -91,10 +91,10 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div @click="changeCodevisible">显示二维码弹窗</div>
|
<div @click="changeCodevisible">显示二维码弹窗</div>
|
||||||
<two-dimensional-code v-model:codevisible="codevisible" :codeInfo="codeInfo" index="0"/>
|
<two-dimensional-code v-model:codevisible="codevisible" :codeInfo="codeInfo" index="0" type="课程二维码"/>
|
||||||
|
|
||||||
<div @click="changeCodevisible2">显示二维码弹窗22</div>
|
<div @click="changeCodevisible2">显示二维码弹窗22</div>
|
||||||
<two-dimensional-code v-model:codevisible="codevisible2" :codeInfo="codeInfo2" index="1"/>
|
<two-dimensional-code v-model:codevisible="codevisible2" :codeInfo="codeInfo2" index="1" type="签到二维码"/>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import { reactive, toRefs } from "vue";
|
import { reactive, toRefs } from "vue";
|
||||||
|
|||||||
Reference in New Issue
Block a user