mirror of
https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/fe-manage.git
synced 2025-12-10 03:16:44 +08:00
feat: 增加关卡下的共享文档（静态)
This commit is contained in:
王熙东
@@ -553,165 +553,213 @@
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="4" tab="设置">
|
||||
<div class="split"></div>
|
||||
<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" @click="showbtn" v-show="twobtn">
|
||||
编辑
|
||||
</div>
|
||||
<div v-show="twobtnn" class="twobtn">
|
||||
<div class="btnone" @click="closebtn">取消</div>
|
||||
<div class="btntwo" @click="closebtn">确定</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="onemain clearfix">
|
||||
<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>
|
||||
|
||||
<a-tabs>
|
||||
<a-tab-pane key="1" 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" @click="showbtn" v-show="twobtn">
|
||||
编辑
|
||||
</div>
|
||||
<div v-show="twobtnn" class="twobtn">
|
||||
<div class="btnone" @click="closebtn">取消</div>
|
||||
<div class="btntwo" @click="closebtn">确定</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"
|
||||
<div class="onemain clearfix">
|
||||
<div class="checkcon">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="cb1"
|
||||
value="yulan"
|
||||
class="in"
|
||||
/>
|
||||
<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>
|
||||
<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 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>
|
||||
<br />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="Gcon">
|
||||
<div class="pad"></div>
|
||||
<div class="Gin" style="margin-top: 0px">
|
||||
<div class="headone">
|
||||
<div class="box"></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 class="Gcon">
|
||||
<div class="pad"></div>
|
||||
<div class="Gin" style="margin-top: 0px">
|
||||
<div class="headone">
|
||||
<div class="box"></div>
|
||||
<div class="onetitle">关卡晋级规则</div>
|
||||
</div>
|
||||
<div :class="[checked2 ? 'chooseshow' : 'choo']">
|
||||
<div class="fane">选择范围</div>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="
|
||||
width: 250px;
|
||||
border-radius: 8px;
|
||||
margin-top: 15px;
|
||||
"
|
||||
placeholder="请选择部门"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName3"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
<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 class="select">
|
||||
<a-select
|
||||
v-model:value="projectName2"
|
||||
style="
|
||||
width: 250px;
|
||||
border-radius: 8px;
|
||||
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 :class="[checked2 ? 'chooseshow' : 'choo']">
|
||||
<div class="fane">选择范围</div>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName"
|
||||
style="
|
||||
width: 250px;
|
||||
border-radius: 8px;
|
||||
margin-top: 15px;
|
||||
"
|
||||
placeholder="请选择部门"
|
||||
:options="projectNameList"
|
||||
@change="selectProjectName3"
|
||||
allowClear
|
||||
showSearch
|
||||
></a-select>
|
||||
</div>
|
||||
<div class="chose" style="margin-left: 20px">
|
||||
<input
|
||||
type="checkbox"
|
||||
name="cb1"
|
||||
value="lieb"
|
||||
class="inl"
|
||||
/><span class="sh">路径展示</span>
|
||||
<div class="select">
|
||||
<a-select
|
||||
v-model:value="projectName2"
|
||||
style="
|
||||
width: 250px;
|
||||
border-radius: 8px;
|
||||
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></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-modal
|
||||
style="padding: 0"
|
||||
@@ -946,6 +994,20 @@ export default {
|
||||
twobtnn: false,
|
||||
inputbox: false,
|
||||
Wvisible: false, //作业管理
|
||||
docList:[
|
||||
{
|
||||
name:'测试文档1.doc',
|
||||
src:"",
|
||||
},
|
||||
{
|
||||
name:'测试文档2.doc',
|
||||
src:"",
|
||||
},
|
||||
{
|
||||
name:'测试文档3.doc',
|
||||
src:"",
|
||||
}
|
||||
], // 共享文档列表
|
||||
huodModal: false,
|
||||
zhibModal: false,
|
||||
projectNameListt: [
|
||||
@@ -1130,7 +1192,9 @@ export default {
|
||||
nubvalue2: ref("1"),
|
||||
nubvalue3: ref("4"),
|
||||
nubvalue1: ref("4"),
|
||||
fileList:ref([]),
|
||||
checked2: false,
|
||||
docChecked:true,
|
||||
currentPage: 1,
|
||||
tableDataTotal: 100,
|
||||
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 {
|
||||
...toRefs(state),
|
||||
...toRefs(levelList),
|
||||
@@ -1620,6 +1696,7 @@ export default {
|
||||
closezhibModal,
|
||||
changeTabs,
|
||||
checkType,
|
||||
handleChange
|
||||
};
|
||||
},
|
||||
};
|
||||
@@ -1705,6 +1782,11 @@ export default {
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
.docListStyle {
|
||||
display: flex;
|
||||
width: 300px !important;
|
||||
justify-content: space-around;
|
||||
}
|
||||
.del_btnbox {
|
||||
display: flex;
|
||||
margin: 30px auto;
|
||||
|
||||
Reference in New Issue
Block a user