feat: 会议总结

components/meet-pop/meet-pop.vue

@@ -0,0 +1,152 @@
+<template>
+  <view class="mask" v-if="dialogShow">
+    <view class="content">
+      <view class="bg">
+        <view class="title">{{ dialogTitle }}</view>
+        <rich-text
+          class="text-[#4B4C50] text-[28rpx]"
+          :nodes="dialogContent"
+          :style="{
+            textAlign: textAlign,
+          }"
+        ></rich-text>
+      </view>
+      <view
+        v-if="btnType == 1"
+        class="bg-[#D6B184] text-[#24272A] text-center rounded-md h-[80rpx] leading-[80rpx] font-bold mt-[48rpx]"
+        @click="handleHide"
+        >确定</view
+      >
+      <view class="flex justify-between mt-[50rpx]" v-if="btnType == 2">
+        <view
+          class="w-[226rpx] h-[80rpx] bg-[#ffffff] rounded-xl text-[#D6B184] text-[30rpx] font-bold text-center leading-[80rpx] bg-inherit borderColor"
+          @click="handleCancel"
+        >
+          {{ CancelText }}</view
+        >
+        <view
+          class="w-[226rpx] h-[80rpx] rounded-xl text-[30rpx] font-bold text-center leading-[80rpx]"
+          :style="{
+            background: backgroundColor,
+            color: color,
+          }"
+          @click="handleConfirm"
+        >
+          {{ ConfirmText }}</view
+        >
+      </view>
+      <!-- 登陆弹框 -->
+      <view class="flex justify-between mt-[50rpx]" v-if="btnType == 3">
+        <button
+          class="w-[226rpx] h-[80rpx] rounded-xl text-[30rpx] font-bold text-center leading-[80rpx]"
+          :style="{
+            background: backgroundColor,
+            color: color,
+          }"
+          open-type="getPhoneNumber"
+          @getphonenumber="getUserPhone"
+        >
+          确认
+        </button>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  props: {
+    dialogShow: {
+      type: Boolean,
+      default: false,
+    },
+    dialogTitle: {
+      type: String,
+      default: "",
+    },
+    dialogContent: {
+      type: String,
+      default: "",
+    },
+    btnType: {
+      type: Number,
+      default: 1,
+    },
+    CancelText: {
+      type: String,
+      default: "取消",
+    },
+    ConfirmText: {
+      type: String,
+      default: "确定",
+    },
+    backgroundColor: {
+      type: String,
+      default: "#202124",
+    },
+    color: {
+      type: String,
+      default: "#D6B184",
+    },
+    textAlign: {
+      type: String,
+      default: "left",
+    },
+  },
+  data() {
+    return {};
+  },
+  methods: {
+    handleHide() {
+      this.$emit("handleHide");
+    },
+    handleCancel() {
+      this.$emit("handleCancel");
+    },
+    handleConfirm() {
+      this.$emit("handleConfirm");
+    },
+    getUserPhone(e) {
+      this.$emit("getUserPhone", e);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "../../meeting/common.scss";
+.title {
+  // text-[#202124] text-[30rpx] font-bold text-center mb-[32rpx]
+  color: #23262b;
+  font-size: 30rpx;
+  font-weight: bold;
+  text-align: center;
+}
+.mask {
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+  top: 0;
+  left: 0;
+  z-index: 100002;
+
+  .content {
+    width: 600rpx;
+    border-radius: 24rpx;
+    background: #fff;
+    box-sizing: border-box;
+    padding: 48rpx 60rpx 32rpx;
+    // background-image: url(#{$uni-base-url}icon28.png);
+    background-size: 100% 214rpx;
+    background-position: top;
+    background-repeat: no-repeat;
+    margin: 0 auto;
+    margin-top: 500rpx;
+  }
+
+  .borderColor {
+    border: 2rpx solid #d6b184;
+  }
+}
+</style>

meeting/common.scss

@@ -27,3 +27,10 @@
 .items-center{
     align-items: center;
 }
+/* -=======背景======= */
+// .bg{
+//     min-height: 100vh;
+//     background-image: url('/static/image/bg.png');
+//     background-repeat: no-repeat;
+//     background-size: cover;
+// }

meeting/summary/index.vue

@@ -1,20 +1,181 @@
 <template>
-  <div>
+  <div class="bg container">
     <meet-sticky :bg="bg">
       <meet-navbar title="会议总结" :isFixed="false"></meet-navbar>
     </meet-sticky>
+    <view>
+      <!-- 会议标题 -->
+      <view class="border-item">
+        <image
+          src="/static/image/summary/meet_title.png"
+          mode="scaleToFill"
+          class="img-item"
+        />
+        <view class="title"> 00 </view>
+      </view>
+      <!-- 关键词 -->
+      <view class="border-item">
+        <image
+          src="/static/image/summary/key_word.png"
+          mode="scaleToFill"
+          class="img-item"
+        />
+        <view class="flex key-box">
+          <view class="key-item flex items-center">
+            <view>蔡徐坤</view>
+            <image
+              src="/static/image/summary/close.png"
+              mode="scaleToFill"
+              class="close"
+            />
+          </view>
+          <image
+            src="/static/image/summary/add.png"
+            mode="scaleToFill"
+            class="add"
+            @click="add"
+          />
+        </view>
+      </view>
+
+      <!-- 参会人 -->
+      <view class="border-item">
+        <image
+          src="/static/image/summary/attendee .png"
+          mode="scaleToFill"
+          class="img-item"
+        />
+        <view class="flex key-box">
+          <view class="key-item flex items-center">
+            <view>蔡徐坤</view>
+            <image
+              src="/static/image/summary/edit.png"
+              mode="scaleToFill"
+              class="close"
+            />
+          </view>
+        </view>
+      </view>
+
+      <!-- 会议总结 -->
+      <view class="border-item">
+        <image
+          src="/static/image/summary/summary.png"
+          mode="scaleToFill"
+          class="img-item"
+        />
+        <view class="title">
+          AI会议、智能助手、需求评审会、AI会议、智能助手、需求评审会、AI会议、智能助手、需求评审会、AI会议、智能助手、需求评审会。
+        </view>
+      </view>
+
+      <!-- 会议摘要 -->
+      <view class="border-item">
+        <image
+          src="/static/image/summary/abstract.png"
+          mode="scaleToFill"
+          class="img-item"
+        />
+        <view class="title">
+          AI会议、智能助手、需求评审会、AI会议、智能助手、需求评审会、AI会议、智能助手、需求评审会、AI会议、智能助手、需求评审会。
+        </view>
+      </view>
+
+      <!-- 会议要点-->
+      <view class="border-item">
+        <image
+          src="/static/image/summary/points.png"
+          mode="scaleToFill"
+          class="img-item"
+        />
+        <view class="title">
+          AI会议、智能助手、需求评审会、AI会议、智能助手、需求评审会、AI会议、智能助手、需求评审会、AI会议、智能助手、需求评审会。
+        </view>
+      </view>
+
+      <!-- 弹窗 -->
+      <meet-pop
+      :dialogShow="popConfig.show"
+      :btnType="popConfig.btnType"
+      :dialogTitle="popConfig.title"
+      ></meet-pop>
+    </view>
   </div>
 </template>
 
 <script>
+import meetPop from "../../components/meet-pop/meet-pop.vue";
 export default {
+  components: { meetPop },
   data() {
     return {
       bg: "",
+      meetData: {},
+      popConfig: {
+        show: true,
+        title: "编辑参会人",
+        btnType:2
+      },
     };
   },
+  methods: {
+    add() {
+      this.popConfig.show = true;
+    },
+    confirm() {
+      this.popConfig.show = false;
+    },
+    close() {
+      this.popConfig.show = false;
+    },
+  },
 };
 </script>
 
 <style lang="scss" scoped>
+@import "../common.scss";
+.container {
+  padding: 24rpx;
+  background-color: #e3edfe;
+}
+.add {
+  width: 148rpx;
+  height: 72rpx;
+}
+.key-box {
+  flex-wrap: wrap;
+}
+.key-item {
+  padding: 16rpx 24rpx;
+  background-color: #fff;
+  border-radius: 12rpx;
+  margin-right: 16rpx;
+}
+.close {
+  width: 32rpx;
+  height: 32rpx;
+  margin-left: 16rpx;
+}
+.border-item {
+  padding: 24rpx;
+  border: 2rpx solid #fff;
+  border-radius: 24rpx;
+  background: linear-gradient(
+    180deg,
+    rgba(255, 255, 255, 0.4) 0%,
+    rgba(255, 255, 255, 0.6) 100%
+  );
+  margin-bottom: 20rpx;
+  .title {
+    padding: 20rpx;
+    background-color: #fff;
+    border-radius: 20rpx;
+    line-height: 1.6;
+  }
+}
+.img-item {
+  width: 164rpx;
+  height: 40rpx;
+  margin-bottom: 16rpx;
+}
 </style>