项目积分

src/components/drawers/NoticePub.vue

@@ -0,0 +1,63 @@
+<!--发布公告-->
+<template>
+    <div class="noticeTitle"><span style="font-size: 18px;">公告</span>
+        <a-divider style="margin-top: 0px;margin-bottom:30px;"></a-divider>
+        <a-switch v-model:checked="noticeChecked" size="small"/><span style="margin-left: 16px;">开启</span>
+        <p style="margin-top: 35px;">公告内容</p>
+        <a-textarea v-model:value="noticeContent" show-count :maxlength="150" style="margin-top: -10px;margin-bottom:30px;height: 110px;"/>
+        <div class="publish"><div class="iconPub"></div><div class="btnText">发布</div></div>
+      </div>
+</template>s
+<script>
+import { reactive,toRefs} from "vue";
+export default {
+    name: "NoticePub",
+    setup(){
+      const state = reactive({
+      noticeChecked: true,
+    });
+    return{
+      ...toRefs(state),
+    }
+    }
+   
+}
+</script>
+<style lang="scss">
+    .noticeTitle {
+        margin-left: 38px;
+        margin-right: 38px;
+        padding-top: 20px;
+        .publish {
+            width: 100px;
+            height:38px;
+            background: rgb(64, 158, 255);
+            border-radius: 8px;
+            border: 1px solid rgba(64, 158, 255, 1);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            flex-shrink: 0;
+            float: right;
+            margin-top: 60px;
+            margin-bottom: 60px;
+            margin-right: 20px;
+            cursor: pointer;
+            .iconPub {
+                width: 15px;
+                height: 15px;
+                background-image: url(@/assets/images/taskpage/pub0.png);
+                background-size: 100% 100%;
+                color: rgb(255, 255, 255);
+            }
+            .btnText {
+                font-size: 14px;
+                font-weight: 400;
+                color: rgb(255, 255, 255);
+                line-height: 36px;
+                margin-left: 5px;
+            }
+         }
+    }
+
+</style>