Merge branch 'master' of http://192.168.18.147:9000/root/digital_park_static

digital-park-web/digital-park/src/api/index.js

 // 园区服务产品列表
 export const getParkServiceProduct = p => get("/parkServiceProduct/page", p);
 
+// 园区服务产品详情
+export const getByIdServiceProduct = p =>  get("/parkServiceProduct/getById", p);
+
 // 物业管理产品列表
-export const getPropertyManage = p => get("/propertyManagement/page", p);
+export const getPropertyManage = p => get("/propertyManagement/page", p);
+
+// 物业管理产品详情
+export const getByIdPropertyManage  = p => get("/propertyManagement/getById", p);

digital-park-web/digital-park/src/api/my-related/index.js

 /**
  * api-我的 相关接口
  */
- import { get, post } from "@/utils/http";
+import { get, post } from "@/utils/http";
 
 
 // 我的消息
-export const getMessageNoticeList = p => get("/messageNotice/getMessageNoticeList", p);
+export const getMessageNoticeList = p => get("/messageNotice/getMessageNoticeList", p);
+
+// 设置已读
+export const markReadMessage = p => post('/messageNotice/updateIsRead', p);

digital-park-web/digital-park/src/store/getters.js

 const getters = {
     currentAccount: state => state.sessionInfo.currentAccount,
+    tabList: state => state.tabList
 };
 export default getters;

digital-park-web/digital-park/src/utils/common.js

     } else {
         Message.error(msg);
     }
-};
+};
+
+/**
+ * markdown格式文本转成HTML文本
+ * @param {*} markdownText 
+ * @returns 
+ */
+
+export const parseMarkdown = (markdownText) => {
+    const htmlText = markdownText
+        .replace(/^### (.*$)/gim, '<h3>$1</h3>')
+        .replace(/^## (.*$)/gim, '<h2>$1</h2>')
+        .replace(/^# (.*$)/gim, '<h1>$1</h1>')
+        .replace(/^\> (.*$)/gim, '<blockquote>$1</blockquote>')
+        .replace(/\*\*(.*)\*\*/gim, '<b>$1</b>')
+        .replace(/\*(.*)\*/gim, '<i>$1</i>')
+        .replace(/!\[(.*?)\]\((.*?)\)/gim, "<img alt='$1' src='$2' />")
+        .replace(/\[(.*?)\]\((.*?)\)/gim, "<a href='$2'>$1</a>")
+        .replace(/\n$/gim, '<br />')
+        .replace(/[\r\n]/g, "<br />")
+    return htmlText.trim()
+}

digital-park-web/digital-park/src/utils/filters.js

 import dayjs from "dayjs"; // 时间格式化组件
 const formatDate = (time, fmtstring) => {
     time = new Date(time)
-        // 使用momentjs这个日期格式化类库实现日期的格式化功能
+    // 使用momentjs这个日期格式化类库实现日期的格式化功能
     if (time == '' || !time) {
         return '——'
     } else {
     }
 }
 
-export { formatDate }
+const formatNull = (msg) => {
+    return !msg ? "--" : msg;
+};
+export { formatDate, formatNull }

digital-park-web/digital-park/src/views/my-related/business/Business.scss

                     line-height: 35px;
                     height: 35px;
                     cursor: pointer;
+                    &:hover {
+                        color: #0070d2;
+                        font-weight: bold;
+                    }
                     .icon {
                         width: 15px;
                         height: 15px;
                         border-radius: 50%;
-                        // background: red;
                         box-sizing: border-box;
                         border: 2px solid #0070d2;
-                        margin-right: 5px;
-                        margin-top: 10px;
+                        margin-right: 10px;
+                        margin-top: 11px;
                     }
                     .msg-text {
                         width: calc(100% - 175px);

digital-park-web/digital-park/src/views/my-related/business/Business.vue

                         用户名：{{ currentAccount ? currentAccount.accountName  : ''}}   
                     </div>
                     <span class="logout fl" @click="logout">退出登录</span>
-                    <!-- 已认领，未入驻园区 -->
-                    <div class="company-btn fr" v-if="isClaimed && !isSettleParl">
-                        我是企业，<span class="btn-span">我要入驻园区</span>
+                    <!-- 未认领，未入驻园区 -->
+                    <div class="company-btn fr" v-if="!isClaimed">
+                        我是企业，<span class="btn-span" @click="openApplyForAdmission">我要入驻园区</span>
                         <img src="~@assets/image/myRelated/companyBtnIcon.png" alt="icon"></img>
                     </div>
                     <!-- 未认领 -->
-                    <div class="company-btn fr" v-if="!isClaimed">
+                    <!-- <div class="company-btn fr" v-if="!isClaimed">
                         <span class="btn-span" @click="showClaimDialog = true">认领企业</span>
                         <img src="~@assets/image/myRelated/companyBtnIcon.png" alt="icon">
-                    </div>
+                    </div> -->
                 </div>
                 <div class="comany-info-box" v-if="isClaimed">
                     <div class="main-img-box fl">
                             <el-row :gutter="20">
                                 <el-col :span="info.span" v-for="(info,inx) of mainOtherInfo" :key="inx" class="info-col">
                                     <span class="label-span">{{ info.label }}：</span>
-                                    <span class="value-span">{{ info.value }}</span>
+                                    <span class="value-span">{{ companyDetail[info.value] }}</span>
                                 </el-col>
                             </el-row>
                         </div>
             <div class="my-message-box">
                 <div class="title">
                     <span class="title-span">我的消息</span>
-                    <span class="num-msg">（您有4条未读通知）</span>
+                    <span class="num-msg">（您有{{ notRead }}条未读通知）</span>
                     <div class="more-icon fr" @click="goPath('/my-message')">
                         <img src="~@assets/image/index/icon_more.png" alt="more" />
                     </div>
                 </div>
                 <div class="msg-list">
-                    <div class="msg-list-item" v-for="(item,inx) of myMsgList" :key="inx">
+                    <div class="msg-list-item" v-for="(item,inx) of myMsgList" :key="inx" @click="openDetail(item)">
                         <div class="icon fl"></div>
-                        <div class="msg-text fl">{{ item.msg }}</div>
-                        <div class="msg-time fr">{{ item.time }}</div>
+                        <div class="msg-text fl">{{ item.title }}</div>
+                        <div class="msg-time fr">{{ item.createdOn | formatDate("YYYY-MM-DD HH:mm") }}</div>
                     </div>
                 </div> 
             </div>
             </div>
         </div>
         <Footer />
-        <!-- 认领企业 -->
-        <ClaimDialog :claimDialog="showClaimDialog" @close="showClaimDialog = false" @updateData="initData"/>
+        <!-- 入驻园区 -->
+        <ApplyForAdmission ref="ApplyForAdmission"/>
+        <!-- 消息详情 -->
+        <MessageDetailDialog ref="MessageDetailDialog" />
     </div>
 </template>
 
 import { getCompanyById } from '@api/company';
 import { routerOpenInNewWindow } from "@/utils/common.js";
 import { mapGetters } from "vuex";
-import ClaimDialog from "@/views/park-enterprises/components/ClaimDialog.vue";
+import ApplyForAdmission from "@/views/index/ApplyForAdmission.vue";
+import MessageDetailDialog from "../mseeage/components/MessageDetailDialog/index.vue";
+import { getMessageNoticeList } from "@api/my-related";
 export default {
-    components: { Nav, Footer,ClaimDialog },
+    components: { Nav, Footer,ApplyForAdmission,MessageDetailDialog },
     computed: {
         ...mapGetters({
             currentAccount: "currentAccount",
             mainOtherInfo:[
                 {
                     label:"法人代表",
-                    value:"李瑾",
+                    value:"legalPerson",
                     span:7
                 },
                 {
                     label:"统一社会信用代码",
-                    value:"91310115MA1H71QG17",
+                    value:"creditCode",
                     span:10
                 },
                 {
                     label:"电话",
-                    value:"021-64643026",
+                    value:"companyMobilePhone",
                     span:7
                 },
                 {
                 },
                 {
                     label:"成立日期",
-                    value:"2015-10-22",
+                    value:"establishOn",
                     span:10
                 },
                 {
                     label:"邮箱",
-                    value:"3530451045@qq.com",
+                    value:"email",
                     span:7
                 },
             ],
             // 我的消息
-            myMsgList:[
-                {
-                    msg:"把握住企业的选址动向，招商工作就赢了一半了！把握住企业的选址动向，招商工作就赢了一半了！把握住企业的选址动向，招商工作就赢了一半了！把握住企业的选址动向，招商工作就赢了一半了！",
-                    time:"2022-09-01 18:00"
-                },
-                {
-                    msg:"把握住企业的选址动向，招商工作就赢了一半了！",
-                    time:"2022-09-01 18:00"
-                },
-                {
-                    msg:"把握住企业的选址动向，招商工作就赢了一半了！",
-                    time:"2022-09-01 18:00"
-                },
-                {
-                    msg:"把握住企业的选址动向，招商工作就赢了一半了！",
-                    time:"2022-09-01 18:00"
-                },
-                {
-                    msg:"把握住企业的选址动向，招商工作就赢了一半了！",
-                    time:"2022-09-01 18:00"
-                },
-                {
-                    msg:"把握住企业的选址动向，招商工作就赢了一半了！",
-                    time:"2022-09-01 18:00"
-                },
-                {
-                    msg:"把握住企业的选址动向，招商工作就赢了一半了！",
-                    time:"2022-09-01 18:00"
-                },
-                {
-                    msg:"把握住企业的选址动向，招商工作就赢了一半了！",
-                    time:"2022-09-01 18:00"
-                },
-                {
-                    msg:"把握住企业的选址动向，招商工作就赢了一半了！",
-                    time:"2022-09-01 18:00"
-                },
-                {
-                    msg:"把握住企业的选址动向，招商工作就赢了一半了！",
-                    time:"2022-09-01 18:00"
-                },
-            ],
+            myMsgList:[],
+            // 未读条数
+            notRead:0,
             // 是否授权
             isAuthorize:true,
             // 税收查询公司信息
             this.pageLoading = true;
             Promise.all([
                 // 获取企业信息
-                this.getCompanyById()
+                this.getCompanyById(),
+                // 获取我的消息
+                this.getMessageNoticeList()
             ]).then(()=>{
                 this.pageLoading = false;
             })
         },
         // 获取企业信息
         getCompanyById(){
-            return new Promise(async (resolve, reject) => {
-                let companyRes = await getCompanyById({companyId:this.currentAccount.accountId});
-                this.companyDetail = companyRes.data.data;
-                this.isClaimed = this.companyDetail.claimState;
+            return new Promise( (resolve, reject) => {
+                getCompanyById({companyId:this.currentAccount.accountId}).then(res => {
+                    if(res.data.status == 0){
+                        this.companyDetail = res.data.data;
+                        // 测试代码，让企业已认领
+                        this.isClaimed = this.companyDetail.claimState;
+                        console.log(this.$cloneDeep(this.companyDetail),'企业信息')
+                    }else if(res.data.status == 102){
+                        this.$router.push('/login')
+                    }else {
+                        this.$message.error(res.data.msg);
+                    }
+                    resolve();
+                }).catch(err => {
+                    console.log(err);
+                    resolve();
+                })
+            })
+        },
+        // 我的消息
+        getMessageNoticeList(){
+            let param = {
+                page:1,
+                pageSize:10
+            };
+            getMessageNoticeList(param).then(res => {
+                if(res.data.status == 0){
+                    const data = res.data.data;
+                    let { resultData } = data;
+                    this.myMsgList = resultData.list;
+                    this.notRead = resultData.total - data.readCount;
+                    }else if(res.data.status == 102){
+                        this.$router.push('/login')
+                    }else {
+                        this.$message.error(res.data.msg);
+                    }
+            }).catch(err => {
+                console.log(err);
                 resolve();
             })
         },
             }
             return companyName;
         },
+        // 打开详情
+        openDetail(row){
+            this.$refs.MessageDetailDialog.openDialog(row)
+        },
+        // 入驻园区
+        openApplyForAdmission(){
+            this.$refs.ApplyForAdmission.showDialog();
+        },
         // 退出登录
         logout(){
             this.$confirm('确认是否退出登录', '提示', {

digital-park-web/digital-park/src/views/my-related/mseeage/Message.scss

                     @include font(18px, #0086e7);
                     cursor: pointer;
                     margin-left: 10px;
+                    user-select: none;
                 }
             }
             .table-container {
             margin-top: 10px;
         }
     }
-    .detail-dialog {
-        .el-dialog {
-            border-radius: 6px;
-        }
-        .el-dialog__header {
-            display: none;
-        }
-        .el-dialog__body {
-            border-radius: 6px;
-            padding-top: 20px;
-            position: relative;
-            background: linear-gradient(to bottom, #cde8fb, #fff);
-            .close-icon {
-                position: absolute;
-                right: 19px;
-                height: 21px;
-                cursor: pointer;
-            }
-            .dialog-title {
-                @include font(24px, #334a5f);
-                font-weight: bold;
-                line-height: 33px;
-            }
-            .detial-title {
-                margin-top: 30px;
-                @include font(24px, #0086e7);
-                text-align: center;
-            }
-            .detial-content {
-                margin-top: 18px;
-                @include font(16px, #334a5f);
-                line-height: 34px;
-            }
-            .detial-link {
-                margin-top: 16px;
-                @include font(16px, #0086e7);
-                font-family: Alibaba-PuHuiTi;
-                text-decoration: underline;
-                cursor: pointer;
-            }
-        }
-    }
+    
 }

digital-park-web/digital-park/src/views/my-related/mseeage/Message.vue

                 <img src="~@assets/image/myRelated/titleIcon.png" class="title-icon fl" alt="icon" />
                 <span class="title-span fl">我的消息</span>
             </div>
-            <div class="table-box" v-loading="pageLoading">
+            <div class="table-box" v-loading="pageLoading" element-loading-text="数据加载中...">
                 <div class="table-title">
                     <span class="title-span fl">我的消息</span>
                     <span class="unread-span">
                         （你有
-                        <span class="unread-num">1172</span>条未读通知）
+                        <span class="unread-num">{{ notRead }}</span>条未读通知）
                     </span>
                     <span class="mark-read fr" @click="markRead('all')">全部标记已读</span>
                     <span class="mark-read fr" @click="markRead('check')">勾选标记已读</span>
                             <template slot-scope="scope">
                                 <span
                                     class="check-span"
-                                    :class="{'is-read' : scope.row.v4 == '已读'}"
+                                    :class="{'is-read' : scope.row.isRead}"
                                     @click.stop="changeCheck(scope.row)"
                                 >
                                     <img
-                                        v-if="scope.row.v0"
+                                        v-if="scope.row.isSelected"
                                         src="~@assets/image/myRelated/checked.png"
                                         alt="checkOk"
                                     />
                             :width="item.width"
                             :show-overflow-tooltip="true"
                         >
-                            <template slot-scope="scope">{{ scope.row[item.prop] }}</template>
+                            <template slot-scope="scope">
+                                <div
+                                    v-if="item.prop == 'createdOn'"
+                                >{{ scope.row[item.prop] | formatDate("YYYY-MM-DD HH:mm") }}</div>
+                                <div v-else-if="item.prop == 'type'">{{ scope.row[item.prop].text }}</div>
+                                <div v-else-if="item.prop == 'isRead'">
+                                    <span v-if="scope.row.isRead">已读</span>
+                                    <img
+                                        v-else
+                                        src="~@assets/image/myRelated/notRead.png"
+                                        alt="notRead"
+                                    />
+                                </div>
+                                <div v-else>{{ scope.row[item.prop] }}</div>
+                            </template>
                         </el-table-column>
                     </el-table>
                 </div>
                 <div class="pagination_box">
-                    <Pagination :currentPage="queryParams.page" :total="queryParams.total" />
+                    <Pagination
+                        :currentPage="queryParams.page"
+                        :total="queryParams.total"
+                        @change-page-size="changePageSize"
+                        @change-page="changePage"
+                    />
                 </div>
             </div>
         </div>
-        <!-- 通知详情 -->
-        <el-dialog
-            :visible.sync="detailDialog.isShow"
-            :close-on-click-modal="false"
-            class="detail-dialog"
-            :show-close="false"
-        >
-            <span class="close-icon" @click="detailDialog.isShow = false">
-                <img src="~@assets/image/myRelated/closeIcon.png" alt="close" />
-            </span>
-            <div class="dialog-title">通知详情</div>
-            <div class="detial-title">个独企业重要消息告知</div>
-            <div class="detial-content">{{ detailDialog.row.v2 }}</div>
-            <div class="detial-link">http://www.hhrchina.com/customer/msgCenter.html?page=2</div>
-        </el-dialog>
+        <!-- 消息详情 -->
+        <MessageDetailDialog ref="MessageDetailDialog" />
         <Footer />
     </div>
 </template>
 import Nav from "@components/Header.vue";
 import Footer from "@components/Footer.vue";
 import Pagination from "@components/Pagination.vue";
-import { getMessageNoticeList } from "@api/my-related";
-import ret from "bluebird/js/release/util";
+import { getMessageNoticeList, markReadMessage } from "@api/my-related";
+import MessageDetailDialog from "./components/MessageDetailDialog/index.vue";
+
 export default {
-    components: { Nav, Footer, Pagination },
+    components: { Nav, Footer, Pagination, MessageDetailDialog },
     data() {
         return {
             pageLoading: false,
             tableColumn: [
                 {
                     label: "通知时间",
-                    prop: "v1",
+                    prop: "createdOn",
                     width: 160,
                 },
                 {
                     label: "标题",
-                    prop: "v2",
+                    prop: "title",
                 },
                 {
                     label: "类型",
-                    prop: "v3",
+                    prop: "type",
                     width: 120,
                 },
                 {
                     label: "是否已读",
-                    prop: "v4",
+                    prop: "isRead",
                     width: 100,
                 },
             ],
-            tableData: [
-                {
-                    v0: false,
-                    v1: "2021.02.09 14:07",
-                    v2: "入驻产品审核通过收到入驻产品审核通过收到入驻产品审核通过收到（详情内含有链接）入驻产品审核通过收到入驻产品审核通过收到入驻产品审核通过收到（详情内含有链接）",
-                    v3: "政策宣传",
-                    v4: "未读",
-                    id: 1,
-                },
-                {
-                    v0: false,
-                    v1: "2021.02.09 14:07",
-                    v2: "入驻产品审核通过收到入驻产品审核通过收到入驻产品审核通过收到（详情内含有链接）",
-                    v3: "政策宣传",
-                    v4: "已读",
-                    id: 2,
-                },
-                {
-                    v0: false,
-                    v1: "2021.02.09 14:07",
-                    v2: "入驻产品审核通过收到入驻产品审核通过收到入驻产品审核通过收到（详情内含有链接）入驻产品审核通过收到入驻产品审核通过收到入驻产品审核通过收到（详情内含有链接）",
-                    v3: "政策宣传",
-                    v4: "未读",
-                    id: 3,
-                },
-                {
-                    v0: false,
-                    v1: "2021.02.09 14:07",
-                    v2: "入驻产品审核通过收到入驻产品审核通过收到入驻产品审核通过收到（详情内含有链接）入驻产品审核通过收到入驻产品审核通过收到入驻产品审核通过收到（详情内含有链接）",
-                    v3: "政策宣传",
-                    v4: "未读",
-                    id: 4,
-                },
-            ],
-            detailDialog: {
-                isShow: false,
-                row: {
-                    msg: "位于市中心国家级高科技产业园~静安多媒体谷近日入驻禾获仁平台，园区是一个以发展新兴科技产业为主，集创意创新、企业孵化、创业服务，创新人才培育、科技成果转化等功能为一体的高科技园区。静安多媒体谷园区注册产品，若您在业务办理方面遇到任何问题，可直接与禾获仁平台在线客服咨询。",
-                },
-            },
+            tableData: [],
             queryParams: {
                 page: 1,
                 pageSize: 10,
                 total: 0,
             },
+            // 选中list
             checkedList: [],
+            // 未读数
+            notRead: 0,
         };
     },
     mounted() {
-        getMessageNoticeList();
+        this.getMessageNoticeList();
     },
     methods: {
+        // 分页切换
+        changePageSize(v){
+            this.queryParams.pageSize = v;
+            this.getMessageNoticeList();
+        },
+        changePage(v){
+            this.queryParams.page = v;
+            this.getMessageNoticeList();
+        },
         // 获取列表数据
-        async getMessageNoticeList() {
+        getMessageNoticeList() {
             this.pageLoading = true;
-            let listData = await getMessageNoticeList(this.queryParams());
-            this.pageLoading = false;
-            console.log(listData);
+            getMessageNoticeList(this.queryParams)
+                .then((res) => {
+                    // console.log(res);
+                    if (res.data.status == 0) {
+                        const data = res.data.data;
+                        let { resultData } = data;
+                        this.tableData = resultData.list.map((el) => {
+                            el.isSelected = false;
+                            return el;
+                        });
+                        console.log(
+                            this.$cloneDeep(this.tableData),
+                            "this.tableData"
+                        );
+                        this.queryParams.total = resultData.total;
+                        this.notRead = resultData.total - data.readCount;
+                    } else if (res.data.status == 102) {
+                        this.$router.push("/login");
+                    } else {
+                        this.$message.error(res.data.msg);
+                    }
+                    this.pageLoading = false;
+                })
+                .catch((err) => {
+                    console.log(err);
+                    this.pageLoading = false;
+                    this.$message.error(
+                        `获取数据失败,失败原因${err},请刷新重试！`
+                    );
+                });
         },
         /**
          * 标记已读
          * @param {*} target all 全部 check 勾选已读
          */
         markRead(target) {
-            let param = {};
-            if (target == "all") {
-            } else {
-                if(this.checkedList.length < 1){
+            let param = [];
+            if (target == "check") {
+                if (this.checkedList.length < 1) {
                     return this.$message.error("请至少勾选一条数据");
-                }else {
-                    param.idList = this.checkedList;
+                } else {
+                    param = this.checkedList;
                 }
             }
             // 设置已读
-            console.log(this.$cloneDeep(param),'已读传参')
+            console.log(this.$cloneDeep(param), "已读传参");
+            this.markReadMessage(param, true);
+        },
+        // 设置已读Api
+        markReadMessage(list, needRefresh) {
+            markReadMessage(list)
+                .then((res) => {
+                    console.log(res, "res");
+                    if (res.data.status == 0 && needRefresh) {
+                        this.getMessageNoticeList();
+                    }
+                })
+                .catch((err) => {
+                    console.log(err);
+                });
         },
         // 单元格点击
         changeCheck(row) {
-            if (row.v4 == "已读") {
+            if (row.isRead) {
                 return;
             }
-            // console.log(row.v0);
-            row.v0 = !row.v0;
-            // console.log(row.v0);
+            row.isSelected = !row.isSelected;
             // 如果已勾选的list里有这个ID，并且此数据为false 需要删除
-            if (this.checkedList.includes(row.id) && !row.v0) {
-                this.checkedList.splice(this.checkedList.indexOf(row.id), 1);
+            if (
+                this.checkedList.includes(row.messageNoticeId) &&
+                !row.isSelected
+            ) {
+                this.checkedList.splice(
+                    this.checkedList.indexOf(row.messageNoticeId),
+                    1
+                );
             }
             // 直接push
             else {
-                this.checkedList.push(row.id);
+                this.checkedList.push(row.messageNoticeId);
             }
-            // console.log(this.$cloneDeep(this.checkedList));
-            // if(row.v0 && this.checkedList[]){
-
-            // }
         },
         // 打开详情弹框
         openDetail(row) {
-            this.detailDialog.isShow = true;
-            this.detailDialog.row = this.$cloneDeep(row);
+            this.$refs.MessageDetailDialog.openDialog(row);
         },
     },
 };

digital-park-web/digital-park/src/views/my-related/mseeage/components/MessageDetailDialog/index.scss

+.detail-dialog[data-1664346848131] {
+    .el-dialog {
+        border-radius: 6px;
+    }
+    .el-dialog__header {
+        display: none;
+    }
+    .el-dialog__body {
+        border-radius: 6px;
+        padding-top: 20px;
+        position: relative;
+        background: linear-gradient(to bottom, #cde8fb, #fff);
+        .close-icon {
+            position: absolute;
+            right: 19px;
+            height: 21px;
+            cursor: pointer;
+        }
+        .dialog-title {
+            @include font(24px, #334a5f);
+            font-weight: bold;
+            line-height: 33px;
+        }
+        .detial-title {
+            margin-top: 30px;
+            @include font(24px, #0086e7);
+            text-align: center;
+        }
+        .detial-content {
+            margin-top: 18px;
+            @include font(16px, #334a5f);
+            line-height: 34px;
+        }
+        .detial-link {
+            margin-top: 16px;
+            @include font(16px, #0086e7);
+            font-family: Alibaba-PuHuiTi;
+            text-decoration: underline;
+            cursor: pointer;
+        }
+    }
+}

digital-park-web/digital-park/src/views/my-related/mseeage/components/MessageDetailDialog/index.vue

+<template>
+    <!-- 通知详情 -->
+    <el-dialog
+        :visible.sync="detailDialog.isShow"
+        class="detail-dialog"
+        :show-close="false"
+        data-1664346848131
+    >
+        <span class="close-icon" @click="detailDialog.isShow = false">
+            <img src="~@assets/image/myRelated/closeIcon.png" alt="close" />
+        </span>
+        <div class="dialog-title">通知详情</div>
+        <div class="detial-title">{{ detailDialog.row.title }}</div>
+        <div class="detial-content" v-html="parseMarkdown(detailDialog.row.text)"></div>
+    </el-dialog>
+</template>
+
+<script>
+import "./index.scss";
+import { parseMarkdown } from "@/utils/common";
+export default {
+    data() {
+        return {
+            detailDialog: {
+                isShow: false,
+                row: {},
+            },
+        };
+    },
+    methods: {
+        openDialog(row) {
+            this.detailDialog.isShow = true;
+            this.detailDialog.row = row;
+        },
+        parseMarkdown(str) {
+            return str ? parseMarkdown(str) : "";
+        },
+    },
+};
+</script>

digital-park-web/digital-park/src/views/product/detail/ProductDetail.scss

                 width: 530px;
                 height: 360px;
                 margin-right: 32px;
-                background: green;
+                // background: green;
+                img {
+                    width: 100%;
+                    height: 100%;
+                }
             }
             .main-item {
                 float: left;

digital-park-web/digital-park/src/views/product/detail/ProductDetail.vue

                 </div>
             </div>
         </div>
-        <div class="detial-container">
+        <div class="detial-container" v-loading="pageLoading" element-loading-text="数据加载中...">
             <div class="ditial-banner">
-                <div class="main-img">123</div>
+                <div class="main-img">
+                    <img :src="formatImg(mainImg)" alt="main-img">
+                </div>
                 <div class="main-item">
-                    <div class="main-title" :title="'有限责任公司注册（松江）'">有限责任公司注册（松江）</div>
+                    <div class="main-title" :title="productDetail.productName">{{ productDetail.productName }}</div>
                     <div class="main-price">
                         <span class="price-label">价格：</span>
-                        <span class="price-value">¥80.00元</span>
+                        <span class="price-value">¥{{ productDetail.showPrice }}</span>
                     </div>
                     <div class="mian-detail" :title="mainDetailText">
                         <span class="mian-detail-span">详情：</span>
-                        {{ mainDetailText }}
+                        {{ productDetail.productDescription }}
                     </div>
                     <div class="main-btn">
-                        <img src="~@assets/image/product/consult-icon.png" class="consult-icon" alt="icon"> 立即咨询
+                        <img
+                            src="~@assets/image/product/consult-icon.png"
+                            class="consult-icon"
+                            alt="icon"
+                        /> 立即咨询
                     </div>
                 </div>
             </div>
             <div class="server-detail">
-                <div class="server-title">
-                    服务详情
-                </div>
+                <div class="server-title">服务详情</div>
                 <div class="server-content">
-                    123
+                    <div v-html="parseMarkdown(productDetail.productDetail) "></div>
                 </div>
             </div>
         </div>
 import Nav from "@components/Header.vue";
 import Footer from "@components/Footer.vue";
 import "./ProductDetail.scss";
+import { getByIdServiceProduct } from "@api/index.js";
+import { parseMarkdown,formatImg } from "@/utils/common";
 export default {
-    components: { Nav,Footer },
+    components: { Nav, Footer },
     data() {
         return {
-            mainDetailText: `根据一个纳税年度内的所得、应纳税额、已缴(扣)税额、抵免(扣)税额、应补(退)税额等情况，如实填写并报送《个人所得税纳税申报表(适用于年所得12万元以上的纳税人申报)》、个人有效身份证件复印件，以及主管税务机关要求报送的其他有关资料。有效身份证件，包括纳税人的身份证、护照、回乡证、军人身份证件等。`,
+            pageLoading: false,
+            productDetail:{},
+            mainImg:"",
         };
     },
-    methods:{
-        toPath(path){
-            this.$router.push(path)
+    mounted() {
+        this.parkServiceProductId = this.$route.query.parkServiceProductId;
+        this.getByIdServiceProduct();
+    },
+    methods: {
+        getByIdServiceProduct() {
+            this.pageLoading = true;
+            let parkServiceProductId = this.$route.query.parkServiceProductId;
+            if (!parkServiceProductId) {
+                this.$router.push("/");
+                return;
+            }
+            getByIdServiceProduct({ parkServiceProductId })
+                .then((res) => {
+                    const data = res.data;
+                    if (data.status == 0) {
+                        this.productDetail = data.data;
+                        let { productMasterImg } = this.productDetail;
+                        this.mainImg = productMasterImg ? productMasterImg[0] : "";
+                    } else if (data.status == 101) {
+                    } else {
+                        this.$message.error(data.msg);
+                    }
+                    this.pageLoading = false;
+                })
+                .catch((err) => {
+                    console.log(err);
+                    this.$message.error("获取详情失败，请尝试刷新页面后重试。");
+                    this.pageLoading = false;
+                });
+        },
+        toPath(path) {
+            this.$router.push(path);
+        },
+        parseMarkdown(str) {
+            return str ? parseMarkdown(str) : "";
+        },
+        formatImg(url){
+            return formatImg(url);
         }
-    }
+    },
 };
 </script>
 

digital-park-web/digital-park/src/views/property/detail/PropertyDetail.scss

                 width: 530px;
                 height: 360px;
                 margin-right: 32px;
-                background: green;
+                img {
+                    width: 100%;
+                    height: 100%;
+                }
             }
             .main-item {
                 float: left;
                 }
                 
             }
-            .housing-detail {
-                .dt {
-                    height: 300px;
-                    background: green;
-                    color: #fff;
-                }
-            }
+            // .housing-detail {
+            // }
         }
     }
 }

digital-park-web/digital-park/src/views/property/detail/PropertyDetail.vue

                 </div>
             </div>
         </div>
-        <div class="detial-container">
+        <div class="detial-container" v-loading="pageLoading" element-loading-text="数据加载中...">
             <div class="ditial-banner">
-                <div class="main-img">123</div>
+                <div class="main-img">
+                    <img :src="formatImg(mainImg)" alt="main-img" />
+                </div>
                 <div class="main-item">
-                    <div
-                        class="main-title"
-                        :title="'写字楼出租写字楼出租写字楼出租写字楼出租写字楼出租'"
-                    >写字楼出租写字楼出租写字楼出租写字楼出租写字楼出租</div>
+                    <div class="main-title" :title="propertyDetail.name">{{ propertyDetail.name }}</div>
                     <div class="main-price">
                         <span class="price-label">价格：</span>
-                        <span class="price-value">¥80.00元</span>
+                        <span class="price-value">{{ getShowPrice() }}</span>
                     </div>
-                    <div class="mian-detail" :title="mainDetailText">
+                    <div class="mian-detail" :title="propertyDetail.introduce">
                         <span class="mian-detail-span">详情：</span>
-                        {{ mainDetailText }}
+                        {{ propertyDetail.introduce }}
                     </div>
-                    <div class="mian-detail listing-address" :title="listingAddress">
+                    <div class="mian-detail listing-address" :title="propertyDetail.address">
                         <span class="mian-detail-span">房源地址：</span>
-                        {{ listingAddress }}
+                        {{ propertyDetail.address }}
                     </div>
                     <div class="main-btn">
                         <img
                 </div>
             </div>
             <div class="block-title">可选房源</div>
-            <el-table class="block-table" :data="listingList">
+            <el-table class="block-table" :data="propertyDetail.housingInformationList">
                 <el-table-column
                     :label="item.label"
                     :align="'center'"
                     :key="inx"
                 >
                     <template slot-scope="scope">
-                        <div v-if="item.prop == 'img'">
+                        <div v-if="item.prop == 'housingImg'">
                             <span class="img-icon">
                                 <el-image
-                                    v-if="checkFile(scope.row.img, 'image')"
-                                    :src="scope.row.img"
-                                    :preview-src-list="[scope.row.img]"
+                                    v-if="checkFile(scope.row.housingImg, 'image')"
+                                    :src="scope.row.housingImg"
+                                    :preview-src-list="[scope.row.housingImg]"
                                 ></el-image>
                                 <video
-                                    v-if="checkFile(scope.row.img, 'video')"
-                                    :src="scope.row.img"
-                                    @click="playVideo(scope.row.img)"
+                                    v-if="checkFile(scope.row.housingImg, 'video')"
+                                    :src="scope.row.housingImg"
+                                    @click="playVideo(scope.row.housingImg)"
                                 ></video>
                             </span>
                         </div>
-                        <div v-else>{{ scope.row[item.prop] }}</div>
+                        <div v-else>{{ scope.row[item.prop] | formatNull}}</div>
                     </template>
                 </el-table-column>
             </el-table>
                     :key="inx"
                 >
                     <template slot-scope="scope">
-                        {{ scope.row[item.prop] }}
+                        {{ propertyDetail[item.prop] | formatNull}}
+                        <span v-if="scope.row.test"></span>
                     </template>
                 </el-table-column>
             </el-table>
                     <span class="title">房源优势</span>
                     <span
                         class="item-span"
-                        v-for="(item,inx) of housingAdvantage"
+                        v-for="(item,inx) of propertyDetail.advantageList"
                         :key="inx"
-                        :style="item.style"
-                    >{{ item.label }}</span>
+                        :style="getListingColor(item)"
+                    >{{ item }}</span>
                 </div>
                 <div class="housing-advantage facilities">
                     <span class="title">房源设施</span>
                     <span
                         class="item-facilities"
-                        v-for="(item,inx) of listingFacilities"
+                        v-for="(item,inx) of propertyDetail.facilityList"
                         :key="inx"
                     >
                         <img
-                            :src="require('@assets/image/propety/icon' + item.type + '.png')"
+                            :src="require('@assets/image/propety/icon' + getListingFacilities(item) + '.png')"
                             alt="icon"
-                            :class="['facilities-' + item.type]"
+                            :class="['facilities-' + getListingFacilities(item)]"
                         />
-                        {{ item.label }}
+                        {{ item }}
                     </span>
                 </div>
                 <div class="housing-detail">
-                    <div class="dt">大图</div>
+                    <div v-html="parseMarkdown(propertyDetail.details)"></div>
                 </div>
             </div>
         </div>
 import Nav from "@components/Header.vue";
 import Footer from "@components/Footer.vue";
 import "./PropertyDetail.scss";
-import ret from "bluebird/js/release/util";
+import { getByIdPropertyManage } from "@api/index.js";
+import { parseMarkdown, formatImg } from "@/utils/common";
+const ListingFacilities = {
+    精装修: 1,
+    有线网络: 2,
+    wifi网络: 3,
+    饮水: 4,
+    空调: 5,
+    "24小时办公": 6,
+    "打印/复印": 7,
+    接发传真: 8,
+};
 export default {
     components: { Nav, Footer },
     data() {
         return {
-            // 主体详情
-            mainDetailText: `根据一个纳税年度内的所得、应纳税额、已缴(扣)税额、抵免(扣)税额、应补(退)税额等情况，如实填写并报送《个人所得税纳税申报表(适用于年所得12万元以上的纳税人申报)》、个人有效身份证件复印件，以及主管税务机关要求报送的其他有关资料。有效身份证件，包括纳税人的身份证、护照、回乡证、军人身份证件等。`,
-            // 房源地址
-            listingAddress: "上海市徐汇区吴中路金辉大厦8楼",
+            pageLoading: false,
+            propertyDetail: {},
+            // 主图
+            mainImg: "",
             // 可选房源
             listingColum: [
                 {
-                    prop: "img",
+                    prop: "housingImg",
                     label: "照片",
                 },
                 {
-                    prop: "v1",
+                    prop: "type",
                     label: "租售类型",
                 },
                 {
-                    prop: "v2",
+                    prop: "housingArea",
                     label: "房源面积",
                 },
                 {
-                    prop: "v3",
+                    prop: "maxCapacity",
                     label: "最大容纳人数",
                 },
                 {
-                    prop: "v4",
+                    prop: "decoration",
                     label: "装修状况",
                 },
                 {
-                    prop: "v5",
+                    prop: "canRegister",
                     label: "可注册",
                 },
                 {
-                    prop: "v6",
+                    prop: "showPrice",
                     label: "单价",
                 },
             ],
             // 服务详情
             serverDetailColum: [
                 {
-                    prop: "v1",
+                    prop: "type",
                     label: "房源类型",
                 },
                 {
-                    prop: "v2",
+                    prop: "shortestRent",
                     label: "最短起租",
                 },
                 {
-                    prop: "v3",
+                    prop: "payment",
                     label: "支付方式",
                 },
                 {
-                    prop: "v4",
+                    prop: "parkingFee",
                     label: "停车费",
                 },
                 {
-                    prop: "v5",
+                    prop: "propertyFee",
                     label: "物业费",
                 },
                 {
-                    prop: "v6",
+                    prop: "count",
                     label: "可选房源",
                 },
             ],
-            serverDetailList: [
-                {
-                    v1: "暂无数据",
-                    v2: "1年起租",
-                    v3: "暂无数据",
-                    v4: "--",
-                    v5: "20元/㎡/月",
-                    v6: "2",
-                },
-                {
-                    v1: "暂无数据",
-                    v2: "1年起租",
-                    v3: "暂无数据",
-                    v4: "--",
-                    v5: "20元/㎡/月",
-                    v6: "2",
-                },
-            ],
-            // 房源优势
-            housingAdvantage: [
-                {
-                    label: "精装修",
-                    style: {
-                        "background-image":
-                            "linear-gradient(135deg, #01d8ba 0%, #0086e7 100%)",
-                    },
-                },
-                {
-                    label: "面积大",
-                    style: {
-                        "background-image":
-                            "linear-gradient(135deg, #afd801 0%, #00b4e7 100%)",
-                    },
-                },
-                {
-                    label: "享受税收优惠",
-                    style: {
-                        "background-image":
-                            "linear-gradient(135deg, #8d6dff 0%, #5f24eb 100%)",
-                    },
-                },
-            ],
-            // 房源设施
-            listingFacilities: [
-                {
-                    label: "精装修",
-                    type: 1,
-                },
-                {
-                    label: "有线网络",
-                    type: 2,
-                },
-                {
-                    label: "Wi-Fi网络",
-                    type: 3,
-                },
-                {
-                    label: "饮水",
-                    type: 4,
-                },
-                {
-                    label: "空调",
-                    type: 5,
-                },
-                {
-                    label: "24小时办公",
-                    type: 6,
-                },
-                {
-                    label: "打印/复印",
-                    type: 7,
-                },
-                {
-                    label: "接发传真",
-                    type: 8,
-                },
-            ],
+            serverDetailList: [{}],
+            // // 房源优势
+            // housingAdvantage: [
+            //     {
+            //         label: "精装修",
+            //         style: {
+            //             "background-image":
+            //                 "linear-gradient(135deg, #01d8ba 0%, #0086e7 100%)",
+            //         },
+            //     },
+            //     {
+            //         label: "面积大",
+            //         style: {
+            //             "background-image":
+            //                 "linear-gradient(135deg, #afd801 0%, #00b4e7 100%)",
+            //         },
+            //     },
+            //     {
+            //         label: "享受税收优惠",
+            //         style: {
+            //             "background-image":
+            //                 "linear-gradient(135deg, #8d6dff 0%, #5f24eb 100%)",
+            //         },
+            //     },
+            // ],
+
             // 视频预览
             videoPreview: {
                 isShow: false,
             },
         };
     },
+    mounted() {
+        this.getByIdPropertyManage();
+    },
     methods: {
+        getByIdPropertyManage() {
+            this.pageLoading = true;
+            let propertyManagementId = this.$route.query.propertyManagementId;
+            if (!propertyManagementId) {
+                this.$router.push("/");
+                return;
+            }
+            getByIdPropertyManage({ propertyManagementId })
+                .then((res) => {
+                    const data = res.data;
+                    if (data.status == 0) {
+                        this.propertyDetail = data.data;
+                        console.log(
+                            this.$cloneDeep(this.propertyDetail),
+                            "物业产品详情"
+                        );
+                        let { imgList } = this.propertyDetail;
+                        this.mainImg = imgList ? imgList[0] : "";
+                    } else if (data.status == 101) {
+                    } else {
+                        this.$message.error(data.msg);
+                    }
+                    this.pageLoading = false;
+                })
+                .catch((err) => {
+                    console.log(err);
+                    this.$message.error("获取详情失败，请尝试刷新页面后重试。");
+                    this.pageLoading = false;
+                });
+        },
+        // 获取价格
+        getShowPrice() {
+            let { housingInformationList } = this.propertyDetail;
+            return housingInformationList
+                ? housingInformationList[0].showPrice
+                : "--";
+        },
         toPath(path) {
             this.$router.push(path);
         },
+        parseMarkdown(str) {
+            return str ? parseMarkdown(str) : "";
+        },
+        formatImg(url) {
+            return formatImg(url);
+        },
         // 播放video
         playVideo(src) {
             this.videoPreview.isShow = true;
         },
         // 判断是图片还是视频
         checkFile(fileValue, type) {
+            if (!fileValue) {
+                return "";
+            }
             let index = fileValue.indexOf(".");
             let fileValueSuffix = fileValue.substring(index); //截断"."之前的，得到后缀
             if (type == "video") {
             }
             return true;
         },
+        // 获取房源信息图片
+        getListingFacilities(key) {
+            return ListingFacilities[key];
+        },
+        // 获取房源优势颜色
+        getListingColor(item) {
+            let wuyeguanli_fangyuanyoushi =
+                this.$store.getters.tabList.wuyeguanli_fangyuanyoushi;
+            let style = { background: "" };
+            wuyeguanli_fangyuanyoushi.forEach((el) => {
+                if (item == el.text) {
+                    style.background = el.color;
+                }
+            });
+            return style;
+        },
     },
 };
 </script>