stage：申报静态页面

src/views/business/outContract/declare.vue

@@ -19,7 +19,21 @@
                 </el-date-picker>
             </el-descriptions-item>
         </el-descriptions>
-        <el-empty description="暂无申报"></el-empty>
+        <!-- 申报主体内容盒子 -->
+        <el-row :gutter="12">
+            <el-col :span="6" v-for="item in 12" :key="item">
+                <div class="declareMain">
+                    <div class="declareMain_title">{{ item }}月</div>
+                    <div class="declareMain_content">人数:28人</div>
+                    <div class="declareMain_buttonBox">
+                        <el-button type="primary" plain class="declareMain_declare">去申报</el-button>
+                        <el-button type="primary" @click="toLinkPay" class="declareMain_pay">去发薪</el-button>
+                    </div>
+                    <!-- 当前申报状态 -->
+                    <div class="declareMain_status">未申报</div>
+                </div>
+            </el-col>
+        </el-row>
     </div>
 </template>
 
@@ -39,6 +53,9 @@ export default {
         }
     },
     methods: {
+        toLinkPay() {
+            this.$router.push({ path: '/transfer/salaryAccount' })
+        },
         getOutContractFN(id) {
             getOutContract(id).then(res => {
                 console.log(res)
@@ -52,5 +69,61 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.declare {}
+.declare ::v-deep {
+
+    .declareMain {
+        overflow: hidden;
+        margin-top: 32px;
+        width: 100%;
+        background-color: #fafafa;
+        border-radius: 6px;
+        padding: 20px;
+        position: relative;
+
+        .declareMain_title {
+            font-size: 28px;
+            color: #000;
+            font-weight: 600;
+        }
+
+        .declareMain_content {
+            font-size: 16px;
+            color: #666;
+            margin-top: 14px;
+        }
+
+        .declareMain_buttonBox {
+            margin-top: 22px;
+            display: flex;
+            align-items: center;
+            justify-content: space-evenly;
+
+            .declareMain_declare {
+                width: calc(50% - 15px);
+            }
+
+            .declareMain_pay {
+                width: calc(50% - 15px);
+            }
+        }
+
+        .declareMain_status {
+            position: absolute;
+            top: 50px;
+            right: -20px;
+            width: 100px;
+            font-size: 14px;
+            font-weight: 500;
+            height: 0;
+            border-bottom: 25px solid #50A3E7;
+            border-left: 20px solid transparent;
+            border-right: 20px solid transparent;
+            color: white;
+            text-align: center;
+            line-height: 25px;
+            transform: rotate(45deg);
+            transform-origin: top right;
+        }
+    }
+}
 </style>
\ No newline at end of file