feat:项目 项目积分 获取规则 样式

This commit is contained in:
dongwug
2022-10-26 14:19:22 +08:00
parent 0e74c17aee
commit 4e0e4723f1
2 changed files with 100 additions and 36 deletions

View File

@@ -140,7 +140,6 @@
</div>
<div v-else class="btns">
<div class="btn1" @click="edit=!edit">
<span class="btn1text">保存</span>
</div>
</div>
@@ -346,9 +345,6 @@ export default {
score1:5,
score2:5,
edit:true,
});
const getTableData = () => {
let datas = state.tabledataStu;

View File

@@ -322,22 +322,58 @@
</div>
<hr color="#E8E8E8" />
<div class="pjc_body">
<div class="pjcb_header">
<span>规则</span>
<div class="edit_btn">
<div class="edit"></div>
<div class="btnText">编辑</div>
<div class="groupright">
<div class="spandiv"><span class="spantext">规则</span></div>
<div v-if="edit" class="btns">
<div class="btn1" @click="edit = !edit">
<img src="../../assets/images/projectadd/edit1.png" />
<span class="btn1text">编辑</span>
</div>
</div>
<div v-else class="btns">
<div class="btn1" @click="edit = !edit">
<span class="btn1text">保存</span>
</div>
</div>
</div>
<div class="pjcb_content">
<div v-if="edit" class="pjcb_content">
<div class="content content1">
<span>当前设计下学员可以获得 10 积分</span>
<span>当前设计下学员可以获得 </span
><span class="scoretext">{{ scoresum }}</span
><span>积分</span>
</div>
<div class="content content2">
<span>完成必修/选修获得 5 积分</span>
<span>完成必修/选修获得 </span
><span class="scoretext">{{ score1 }} </span><span>积分</span>
</div>
<div class="content content3">
<span>优秀学员可获得 5 积分</span>
<span>优秀学员可获得 </span
><span class="scoretext">{{ score2 }}</span
><span>积分</span>
</div>
</div>
<div v-else class="pjcb_content">
<div class="content content1">
<span>当前设计下学员可以获得 </span
><span class="scoretext">{{ scoresum }}</span
><span>积分</span>
</div>
<div class="content content2">
<span>完成必修/选修获得 </span
><span
><a-input
v-model:value="score1"
:bordered="false"
@change="getScore"
/> </span
><span>积分</span>
</div>
<div class="content content3">
<span>优秀学员可获得 </span
><span
><a-input v-model:value="score2" :bordered="false" /></span
><span>积分</span>
</div>
</div>
</div>
@@ -603,6 +639,9 @@ export default defineComponent({
value3: false,
value4: false,
hideshow: false,
score1: 5,
score2: 5,
edit: true,
});
const value = ref("");
const value2 = ref("");
@@ -626,6 +665,12 @@ export default defineComponent({
changecheck3,
};
},
computed: {
// 计算属性的 getter
scoresum: function () {
return Number(this.score1) + Number(this.score2);
},
},
});
</script>
<style lang="scss">
@@ -1098,47 +1143,70 @@ export default defineComponent({
.pjc_body {
margin-left: 34px;
margin-right: 34px;
.pjcb_header {
.groupright {
display: flex;
justify-content: space-between;
align-items: center;
margin: 24px auto;
.edit_btn {
.btn1 {
width: 100px;
// padding: 0px 26px 0px 26px;
height: 38px;
background: rgb(64, 158, 255);
border-radius: 8px;
border: 1px solid rgba(64, 158, 255, 1);
height: 40px;
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
margin-right: 16px;
border: 1px solid #409eff;
border-radius: 8px;
background: #409eff;
cursor: pointer;
.edit {
width: 15px;
height: 15px;
background-image: url(@/assets/images/coursewareManage/export1.png);
background-size: 100% 100%;
}
.btnText {
font-size: 14px;
font-weight: 400;
color: rgb(255, 255, 255);
line-height: 36px;
.btn1text {
color: #ffffff;
margin-left: 5px;
font-size: 14px;
}
}
.btn2 {
width: 100px;
height: 40px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 32px;
border: 1px solid #409eff;
border-radius: 8px;
cursor: pointer;
background: #ffffff;
.btn2text {
color: #409eff;
margin-left: 5px;
font-size: 14px;
}
}
}
.pjcb_content {
border: 1px solid #388be1;
padding: 32px;
border: 1px solid #409eff;
padding: 20px;
margin-top: 10px;
.ant-input {
width: 46px;
font-size: 16px;
color: #409eff;
}
.scoretext {
color: #409eff;
font-size: 16px;
margin-left: 3px;
margin-right: 4px;
}
.pjcb_content :last-child {
margin-bottom: 0px;
}
.content {
margin-bottom: 24px;
align-items: center;
height: 50px;
display: flex;
}
margin-bottom: 130px;
}
}
}