mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-13 04:46:46 +08:00
feat: 增加关卡下的共享文档（静态)
This commit is contained in:
王熙东
@@ -553,165 +553,213 @@
|
|||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
<a-tab-pane key="4" tab="设置">
|
<a-tab-pane key="4" tab="设置">
|
||||||
<div class="split"></div>
|
<div class="split"></div>
|
||||||
<div class="sametab">
|
|
||||||
<div class="Gcon">
|
<a-tabs>
|
||||||
<div class="pad"></div>
|
<a-tab-pane key="1" tab="基本信息">
|
||||||
<div class="Gin">
|
<div class="sametab">
|
||||||
<div class="headone">
|
<div class="Gcon">
|
||||||
<div class="box"></div>
|
<div class="pad"></div>
|
||||||
<div class="onetitle">关卡内容可见可学设置</div>
|
<div class="Gin">
|
||||||
<div class="oneedi" @click="showbtn" v-show="twobtn">
|
<div class="headone">
|
||||||
编辑
|
<div class="box"></div>
|
||||||
</div>
|
<div class="onetitle">关卡内容可见可学设置</div>
|
||||||
<div v-show="twobtnn" class="twobtn">
|
<div class="oneedi" @click="showbtn" v-show="twobtn">
|
||||||
<div class="btnone" @click="closebtn">取消</div>
|
编辑
|
||||||
<div class="btntwo" @click="closebtn">确定</div>
|
</div>
|
||||||
</div>
|
<div v-show="twobtnn" class="twobtn">
|
||||||
</div>
|
<div class="btnone" @click="closebtn">取消</div>
|
||||||
<div class="onemain clearfix">
|
<div class="btntwo" @click="closebtn">确定</div>
|
||||||
<div class="checkcon">
|
|
||||||
<input
|
|
||||||
type="checkbox"
|
|
||||||
name="cb1"
|
|
||||||
value="yulan"
|
|
||||||
class="in"
|
|
||||||
/>
|
|
||||||
<span class="yulan">预览其他关卡</span><br />
|
|
||||||
<div style="width: 10px; height: 4px"></div>
|
|
||||||
<div style="display: flex; align-items: center">
|
|
||||||
<span class="yulan2">学员可预览第</span>
|
|
||||||
<span style="color: #4ea6ff" v-show="number">1</span>
|
|
||||||
<a-input-number
|
|
||||||
v-model:value="nubvalue"
|
|
||||||
v-show="inputbox"
|
|
||||||
:controls="false"
|
|
||||||
:autofocus="true"
|
|
||||||
:min="1"
|
|
||||||
/>
|
|
||||||
<span>关-第</span
|
|
||||||
><span style="color: #4ea6ff" v-show="number">4</span>
|
|
||||||
<a-input-number
|
|
||||||
v-model:value="nubvalue1"
|
|
||||||
v-show="inputbox"
|
|
||||||
:controls="false"
|
|
||||||
:autofocus="true"
|
|
||||||
:min="1"
|
|
||||||
/>
|
|
||||||
<span>关内容</span>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="checkcon" style="margin-top: 20px">
|
<div class="onemain clearfix">
|
||||||
<input
|
<div class="checkcon">
|
||||||
type="checkbox"
|
<input
|
||||||
name="cb1"
|
type="checkbox"
|
||||||
value="xuexi"
|
name="cb1"
|
||||||
class="in"
|
value="yulan"
|
||||||
/>
|
class="in"
|
||||||
<span class="yulan">学习其他关卡</span><br />
|
|
||||||
<div style="width: 10px; height: 4px"></div>
|
|
||||||
<div style="display: flex; align-items: center">
|
|
||||||
<span class="yulan2">学员可预览第</span>
|
|
||||||
<span style="color: #4ea6ff" v-show="number">1</span>
|
|
||||||
<a-input-number
|
|
||||||
v-model:value="nubvalue2"
|
|
||||||
v-show="inputbox"
|
|
||||||
:controls="false"
|
|
||||||
:autofocus="true"
|
|
||||||
:min="1"
|
|
||||||
/>
|
/>
|
||||||
<span>关-第</span
|
<span class="yulan">预览其他关卡</span><br />
|
||||||
><span style="color: #4ea6ff" v-show="number">4</span>
|
<div style="width: 10px; height: 4px"></div>
|
||||||
<a-input-number
|
<div style="display: flex; align-items: center">
|
||||||
v-model:value="nubvalue3"
|
<span class="yulan2">学员可预览第</span>
|
||||||
v-show="inputbox"
|
<span style="color: #4ea6ff" v-show="number">1</span>
|
||||||
:controls="false"
|
<a-input-number
|
||||||
:autofocus="true"
|
v-model:value="nubvalue"
|
||||||
:min="1"
|
v-show="inputbox"
|
||||||
/>
|
:controls="false"
|
||||||
<span>关内容</span>
|
:autofocus="true"
|
||||||
|
:min="1"
|
||||||
|
/>
|
||||||
|
<span>关-第</span
|
||||||
|
><span style="color: #4ea6ff" v-show="number">4</span>
|
||||||
|
<a-input-number
|
||||||
|
v-model:value="nubvalue1"
|
||||||
|
v-show="inputbox"
|
||||||
|
:controls="false"
|
||||||
|
:autofocus="true"
|
||||||
|
:min="1"
|
||||||
|
/>
|
||||||
|
<span>关内容</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="checkcon" style="margin-top: 20px">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
name="cb1"
|
||||||
|
value="xuexi"
|
||||||
|
class="in"
|
||||||
|
/>
|
||||||
|
<span class="yulan">学习其他关卡</span><br />
|
||||||
|
<div style="width: 10px; height: 4px"></div>
|
||||||
|
<div style="display: flex; align-items: center">
|
||||||
|
<span class="yulan2">学员可预览第</span>
|
||||||
|
<span style="color: #4ea6ff" v-show="number">1</span>
|
||||||
|
<a-input-number
|
||||||
|
v-model:value="nubvalue2"
|
||||||
|
v-show="inputbox"
|
||||||
|
:controls="false"
|
||||||
|
:autofocus="true"
|
||||||
|
:min="1"
|
||||||
|
/>
|
||||||
|
<span>关-第</span
|
||||||
|
><span style="color: #4ea6ff" v-show="number">4</span>
|
||||||
|
<a-input-number
|
||||||
|
v-model:value="nubvalue3"
|
||||||
|
v-show="inputbox"
|
||||||
|
:controls="false"
|
||||||
|
:autofocus="true"
|
||||||
|
:min="1"
|
||||||
|
/>
|
||||||
|
<span>关内容</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<br />
|
||||||
</div>
|
</div>
|
||||||
<br />
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="Gcon">
|
||||||
<div class="Gcon">
|
<div class="pad"></div>
|
||||||
<div class="pad"></div>
|
<div class="Gin" style="margin-top: 0px">
|
||||||
<div class="Gin" style="margin-top: 0px">
|
<div class="headone">
|
||||||
<div class="headone">
|
<div class="box"></div>
|
||||||
<div class="box"></div>
|
<div class="onetitle">关卡晋级规则</div>
|
||||||
<div class="onetitle">关卡晋级规则</div>
|
|
||||||
</div>
|
|
||||||
<div class="twomain clearfix">
|
|
||||||
<a-switch
|
|
||||||
size="small"
|
|
||||||
v-model:checked="checked2"
|
|
||||||
style="margin-top: -5px"
|
|
||||||
/>
|
|
||||||
<span class="info">启用关卡自动规则加入</span>
|
|
||||||
<div class="infor">
|
|
||||||
若开启“新建/编辑关卡-添加学员”支持设定自动加入规则，将于每日8点同步数据
|
|
||||||
</div>
|
</div>
|
||||||
<div :class="[checked2 ? 'chooseshow' : 'choo']">
|
<div class="twomain clearfix">
|
||||||
<div class="fane">选择范围</div>
|
<a-switch
|
||||||
<div class="select">
|
size="small"
|
||||||
<a-select
|
v-model:checked="checked2"
|
||||||
v-model:value="projectName"
|
style="margin-top: -5px"
|
||||||
style="
|
/>
|
||||||
width: 250px;
|
<span class="info">启用关卡自动规则加入</span>
|
||||||
border-radius: 8px;
|
<div class="infor">
|
||||||
margin-top: 15px;
|
若开启“新建/编辑关卡-添加学员”支持设定自动加入规则，将于每日8点同步数据
|
||||||
"
|
|
||||||
placeholder="请选择部门"
|
|
||||||
:options="projectNameList"
|
|
||||||
@change="selectProjectName3"
|
|
||||||
allowClear
|
|
||||||
showSearch
|
|
||||||
></a-select>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="select">
|
<div :class="[checked2 ? 'chooseshow' : 'choo']">
|
||||||
<a-select
|
<div class="fane">选择范围</div>
|
||||||
v-model:value="projectName2"
|
<div class="select">
|
||||||
style="
|
<a-select
|
||||||
width: 250px;
|
v-model:value="projectName"
|
||||||
border-radius: 8px;
|
style="
|
||||||
margin-top: 15px;
|
width: 250px;
|
||||||
"
|
border-radius: 8px;
|
||||||
placeholder="请选择岗位"
|
margin-top: 15px;
|
||||||
:options="projectNameList2"
|
"
|
||||||
@change="selectProjectName2"
|
placeholder="请选择部门"
|
||||||
allowClear
|
:options="projectNameList"
|
||||||
showSearch
|
@change="selectProjectName3"
|
||||||
></a-select>
|
allowClear
|
||||||
</div>
|
showSearch
|
||||||
</div>
|
></a-select>
|
||||||
<div class="btm">
|
|
||||||
<div class="bmo">关卡学习方案展示设置</div>
|
|
||||||
<div class="bmt">仅支持移动端</div>
|
|
||||||
<div class="chosecon">
|
|
||||||
<div class="chose">
|
|
||||||
<input
|
|
||||||
type="checkbox"
|
|
||||||
name="cb1"
|
|
||||||
value="lieb"
|
|
||||||
class="inl"
|
|
||||||
/><span class="sh">列表展示</span>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="chose" style="margin-left: 20px">
|
<div class="select">
|
||||||
<input
|
<a-select
|
||||||
type="checkbox"
|
v-model:value="projectName2"
|
||||||
name="cb1"
|
style="
|
||||||
value="lieb"
|
width: 250px;
|
||||||
class="inl"
|
border-radius: 8px;
|
||||||
/><span class="sh">路径展示</span>
|
margin-top: 15px;
|
||||||
|
"
|
||||||
|
placeholder="请选择岗位"
|
||||||
|
:options="projectNameList2"
|
||||||
|
@change="selectProjectName2"
|
||||||
|
allowClear
|
||||||
|
showSearch
|
||||||
|
></a-select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="btm">
|
||||||
|
<div class="bmo">关卡学习方案展示设置</div>
|
||||||
|
<div class="bmt">仅支持移动端</div>
|
||||||
|
<div class="chosecon">
|
||||||
|
<div class="chose">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
name="cb1"
|
||||||
|
value="lieb"
|
||||||
|
class="inl"
|
||||||
|
/><span class="sh">列表展示</span>
|
||||||
|
</div>
|
||||||
|
<div class="chose" style="margin-left: 20px">
|
||||||
|
<input
|
||||||
|
type="checkbox"
|
||||||
|
name="cb1"
|
||||||
|
value="lieb"
|
||||||
|
class="inl"
|
||||||
|
/><span class="sh">路径展示</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div></a-tab-pane
|
</a-tab-pane>
|
||||||
>
|
|
||||||
|
<a-tab-pane key="2" tab="共享文档">
|
||||||
|
<div class="sametab">
|
||||||
|
<div class="Gcon">
|
||||||
|
<div class="pad"></div>
|
||||||
|
<div class="Gin">
|
||||||
|
<div class="headone">
|
||||||
|
<div class="box"></div>
|
||||||
|
<div class="onetitle">上传共享文档</div>
|
||||||
|
<div class="oneedi">
|
||||||
|
<a-switch v-model:checked="docChecked" ></a-switch>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="btnbox" style="margin:20px;">
|
||||||
|
<a-upload
|
||||||
|
v-model:file-list="fileList"
|
||||||
|
name="file"
|
||||||
|
action="/api/file/upload"
|
||||||
|
@change="handleChange"
|
||||||
|
>
|
||||||
|
<span class="xkbtn" style="cursor: pointer; font-size: 17px" >上传</span>
|
||||||
|
<img src="@/assets/images/basicinfo/cloud.png" style="cursor: pointer;
|
||||||
|
width:34px;height:34px;
|
||||||
|
" alt="">
|
||||||
|
</a-upload>
|
||||||
|
<div class="btnbox" style="margin:20px;">
|
||||||
|
<span style="color: #999999">
|
||||||
|
支持：pdf.ppt.pptx.doc.docx.xls.xlsx.jpeg.png.gif.zip
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div v-for="item in docList" :key="item.src" class="docListStyle">
|
||||||
|
<img src="@/assets/images/basicinfo/download.png" style="cursor: pointer;
|
||||||
|
width:40px;height:40px;margin-right:40px;
|
||||||
|
" alt="">
|
||||||
|
<span style="font: oblique bold 16px Sans-serif">{{item.name}}</span>
|
||||||
|
<span style="color: #4ea6ff;float:right;">删除</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a-tab-pane>
|
||||||
|
|
||||||
|
</a-tabs>
|
||||||
|
</a-tab-pane>
|
||||||
</a-tabs>
|
</a-tabs>
|
||||||
<a-modal
|
<a-modal
|
||||||
style="padding: 0"
|
style="padding: 0"
|
||||||
@@ -946,6 +994,20 @@ export default {
|
|||||||
twobtnn: false,
|
twobtnn: false,
|
||||||
inputbox: false,
|
inputbox: false,
|
||||||
Wvisible: false, //作业管理
|
Wvisible: false, //作业管理
|
||||||
|
docList:[
|
||||||
|
{
|
||||||
|
name:'测试文档1.doc',
|
||||||
|
src:"",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name:'测试文档2.doc',
|
||||||
|
src:"",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name:'测试文档3.doc',
|
||||||
|
src:"",
|
||||||
|
}
|
||||||
|
], // 共享文档列表
|
||||||
huodModal: false,
|
huodModal: false,
|
||||||
zhibModal: false,
|
zhibModal: false,
|
||||||
projectNameListt: [
|
projectNameListt: [
|
||||||
@@ -1130,7 +1192,9 @@ export default {
|
|||||||
nubvalue2: ref("1"),
|
nubvalue2: ref("1"),
|
||||||
nubvalue3: ref("4"),
|
nubvalue3: ref("4"),
|
||||||
nubvalue1: ref("4"),
|
nubvalue1: ref("4"),
|
||||||
|
fileList:ref([]),
|
||||||
checked2: false,
|
checked2: false,
|
||||||
|
docChecked:true,
|
||||||
currentPage: 1,
|
currentPage: 1,
|
||||||
tableDataTotal: 100,
|
tableDataTotal: 100,
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
@@ -1588,6 +1652,18 @@ export default {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleChange = (info) => {
|
||||||
|
if (info.file.status !== "uploading") {
|
||||||
|
console.log(info.file, info.fileList);
|
||||||
|
}
|
||||||
|
|
||||||
|
if (info.file.status === "done") {
|
||||||
|
message.success(`${info.file.name} 文件上传成功`);
|
||||||
|
} else if (info.file.status === "error") {
|
||||||
|
message.error(`${info.file.name} 文件上传失败.`);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
return {
|
return {
|
||||||
...toRefs(state),
|
...toRefs(state),
|
||||||
...toRefs(levelList),
|
...toRefs(levelList),
|
||||||
@@ -1620,6 +1696,7 @@ export default {
|
|||||||
closezhibModal,
|
closezhibModal,
|
||||||
changeTabs,
|
changeTabs,
|
||||||
checkType,
|
checkType,
|
||||||
|
handleChange
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
@@ -1705,6 +1782,11 @@ export default {
|
|||||||
color: #666666;
|
color: #666666;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.docListStyle {
|
||||||
|
display: flex;
|
||||||
|
width: 300px !important;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
.del_btnbox {
|
.del_btnbox {
|
||||||
display: flex;
|
display: flex;
|
||||||
margin: 30px auto;
|
margin: 30px auto;
|
||||||
|
|||||||
Reference in New Issue
Block a user