0118xx资源编目、版本管理

src/api/sys/tips.ts

@@ -19,49 +19,49 @@ export function getSmsByUserId(data) {
         rows: data.rows,
         userid: session.getItem('userId')
     }
-    var obj = {
-        "datas": {
-            "records": [
-                {
-                    "id": "32b28674-2f0e-4694-b75d-7532b5d4326e",
-                    "message": "您申请的【组件资源上传】业务,未通过审核！",
-                    "userid": "27AF004A-8BDN-885T-30FU-89DE3388762B",
-                    "smslx": 1,
-                    "createtime": "2023-11-27 16:18:18",
-                    "bussid": "f78ddf0a-7d0b-4752-bd94-81fe65c7b10e",
-                    "status": 0
-                },
-                {
-                    "id": "c84d238a-3856-4f58-b65d-4ee083c8c936",
-                    "message": "您有一个业务名称为【组件资源授权】的业务件未处理，请及时处理！",
-                    "userid": "27AF004A-8BDN-885T-30FU-89DE3388762B",
-                    "smslx": 0,
-                    "createtime": "2023-10-23 17:15:42",
-                    "bussid": "38aabe11-169a-492f-9a08-d21967bde86a",
-                    "status": 0
-                },
-            ],
-            "total": 142,
-            "size": 1000000,
-            "current": 1,
-            "searchCount": true,
-            "pages": 1
-        },
-        "resp_code": 0,
-        "resp_msg": "获取成功"
-    }
-    return new Promise<void>((resolve, reject) => {
-        resolve(obj);
-    })
+    // var obj = {
+    //     "datas": {
+    //         "records": [
+    //             {
+    //                 "id": "32b28674-2f0e-4694-b75d-7532b5d4326e",
+    //                 "message": "您申请的【组件资源上传】业务,未通过审核！",
+    //                 "userid": "27AF004A-8BDN-885T-30FU-89DE3388762B",
+    //                 "smslx": 1,
+    //                 "createtime": "2023-11-27 16:18:18",
+    //                 "bussid": "f78ddf0a-7d0b-4752-bd94-81fe65c7b10e",
+    //                 "status": 0
+    //             },
+    //             {
+    //                 "id": "c84d238a-3856-4f58-b65d-4ee083c8c936",
+    //                 "message": "您有一个业务名称为【组件资源授权】的业务件未处理，请及时处理！",
+    //                 "userid": "27AF004A-8BDN-885T-30FU-89DE3388762B",
+    //                 "smslx": 0,
+    //                 "createtime": "2023-10-23 17:15:42",
+    //                 "bussid": "38aabe11-169a-492f-9a08-d21967bde86a",
+    //                 "status": 0
+    //             },
+    //         ],
+    //         "total": 142,
+    //         "size": 1000000,
+    //         "current": 1,
+    //         "searchCount": true,
+    //         "pages": 1
+    //     },
+    //     "resp_code": 0,
+    //     "resp_msg": "获取成功"
+    // }
     // return new Promise<void>((resolve, reject) => {
-    //     defHttp.post({ url: Api.GetSms, params })
-    //         .then((r) => {
-    //             resolve(r);
-    //         }).
-    //         catch((e) => {
-    //             reject(e);
-    //         })
+    //     resolve(obj);
     // })
+    return new Promise<void>((resolve, reject) => {
+        defHttp.post({ url: Api.GetSms, params })
+            .then((r) => {
+                resolve(r);
+            }).
+            catch((e) => {
+                reject(e);
+            })
+    })
 }
 
 /**

src/views/dataAdmin/dataAdmin/resVersion/AssemblyDetailModal.vue

@@ -0,0 +1,211 @@
+<template>
+    <a-modal :visible="true" :width="width" :maskClosable="false" :destroyOnClose="true" centered :title="title"
+        :footer="null" wrapClassName="modal-wrap" @cancel="onClose">
+        <div class="action-content">
+            <div class="top-header">
+                <div class="img-container">
+                    <img :src="baseInfo?.url || './static/img/default-dr3.jpg'" alt="">
+                </div>
+                <div class="res-title">
+                    <div class="title">{{ baseInfo.servicename }}</div>
+                    <div class="describle">描述：{{ baseInfo.description }}</div>
+                    <div class="small-mark">
+                        <div class="update-time">更新时间：{{ baseInfo.updatedate }}</div>
+                        <div class="service-type">服务类型：组件工具</div>
+                    </div>
+                    <div class="look">
+                        <a :href="[`./mapview.html?onlineIde_${baseInfo.servicealiasname}`]" target="_blank"
+                            rel="noopener noreferrer">浏览</a>
+                    </div>
+                </div>
+            </div>
+            <div class="base-info info-item">
+                <div class="info-title">基本信息</div>
+                <div class="form-box">
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title">真实地址</a-col>
+                        <a-col :span="21" class="form-item-value form-title">{{ baseInfo.zsdz }}</a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">资源名称</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.servicename }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">资源别名</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.servicealiasname }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title" style="border-top: none;">缩略图</a-col>
+                        <a-col :span="21" class="form-item-value form-title" style="border-top: none;"
+                            :title="baseInfo.url">{{ baseInfo.url }}</a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title" style="border-top: none;">资源描述</a-col>
+                        <a-col :span="21" class="form-item-value form-title" style="border-top: none;">{{
+                            baseInfo.description }}</a-col>
+                    </a-row>
+                </div>
+            </div>
+        </div>
+    </a-modal>
+</template>
+<script>
+import { defineComponent, reactive, ref, onMounted, watch, toRefs } from 'vue';
+import { message } from 'ant-design-vue';
+import { session } from '/@/utils/Memory';
+import moment from 'moment';
+
+import { getResViewInfo } from '/@/api/resource/plat';
+
+
+export default defineComponent({
+    name: 'modal',
+    components: {},
+    props: {
+        resId: {
+            type: String,
+            default: ''
+        }
+    },
+    setup(props, { emit }) {
+        const data = reactive({
+            width: '1200px',
+            title: '组件详情',
+        })
+        // 关闭请求弹窗
+        const onClose = (e) => {
+            emit('closeModal')
+        }
+        const baseInfo = ref({})
+        const metaInfo = ref({})
+        //初始化请求所需数据
+        onMounted(() => {
+            getResViewInfo(props.resId).then(res => {
+                console.log(res);
+                baseInfo.value = res.servicebase;
+                baseInfo.value.thumbnail = res.metadata.thumbnail
+                baseInfo.value.updatedate = moment(baseInfo.value.updatedate).format('YYYY-MM-DD HH:mm:ss');
+                baseInfo.value.zsdz = `${window.location.origin}/mapview.html?onlineIde_${baseInfo.value.servicealiasname}`;
+            })
+        })
+        return {
+            baseInfo,
+            metaInfo,
+            // formRef,
+            ...toRefs(data),
+            onClose
+        };
+    },
+});
+</script>
+<style lang="less" scoped>
+.modal-wrap {
+    .action-content {
+        padding: 20px;
+        max-height: 800px;
+        overflow: auto;
+
+        .top-header {
+            margin-left: 20px;
+            display: flex;
+            align-items: center;
+
+            .img-container {
+                width: 260px;
+                height: 200px;
+                // border: 1px solid blue;
+                box-sizing: border-box;
+
+                img {
+                    width: 100%;
+                    height: 100%;
+                }
+            }
+
+            .res-title {
+                flex-grow: 1;
+                margin-left: 30px;
+
+                .title {
+                    font-size: 26px;
+                    font-weight: 700;
+                }
+
+                .describle {
+                    margin: 10px 0;
+                }
+
+                .small-mark {
+                    width: 100%;
+                    padding-bottom: 10px;
+                    display: flex;
+                    border-bottom: 1px solid rgb(220, 220, 220);
+
+                    .update-time {
+                        margin-right: 50px;
+                    }
+                }
+
+                .look {
+                    margin-top: 20px;
+                    margin-left: 10px;
+                    width: 100px;
+                    height: 35px;
+                    line-height: 32px;
+                    text-align: center;
+                    border: 2px solid blue;
+                    box-sizing: border-box;
+                    color: blue;
+                    font-size: 16px;
+                    font-weight: 700;
+                    cursor: pointer;
+                    user-select: none;
+                    border-radius: 4px;
+                }
+            }
+        }
+
+        .info-item {
+            margin-top: 20px;
+
+            .info-title {
+                margin: 10px 0;
+                padding-left: 10px;
+                border-left: 3px solid blue;
+            }
+
+            .form-box {
+                width: 100%;
+
+                .form-title {
+                    border: 1px solid rgb(230, 230, 230);
+                    box-sizing: border-box;
+                    height: 30px;
+                    line-height: 27px;
+                    padding-left: 5px;
+                    white-space: nowrap;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                }
+
+                .form-item-title {
+                    background-color: rgb(249, 249, 249);
+                }
+
+                .form-item-value {
+                    border-left: none;
+                }
+            }
+        }
+    }
+}
+</style>

src/views/dataAdmin/dataAdmin/resVersion/InterfaceDetailModal.vue

@@ -0,0 +1,278 @@
+<!-- 接口详情弹窗 -->
+<template>
+    <div class="assembly-detail">
+        <!-- 基本信息 -->
+        <div class="detail-item">
+            <div class="item-header">
+                <div class="title">基本信息</div>
+            </div>
+            <div class="item-body">
+                <div class="des" v-for="(item, index) of baseData" :key="index">
+                    <div class="des-label">{{ item.label }}:</div>
+                    <div v-if="item.label!=='接口描述'">{{ item.value }}</div>
+                    <div v-else v-html="item.value"></div>
+                </div>
+            </div>
+        </div>
+        <!-- 请求参数 -->
+        <div class="detail-item">
+            <div class="item-header">
+                <div class="title">请求参数</div>
+            </div>
+            <div class="item-body">
+                <a-table :data-source="reqData" :columns="reqColumns" :pagination="{ hideOnSinglePage: true }">
+                    <template #required="{ record }">
+                        <div>{{ record.required ? '是' : '否' }}</div>
+                    </template>
+                </a-table>
+            </div>
+        </div>
+        <!-- 返回参数 -->
+        <div class="detail-item">
+            <div class="item-header">
+                <div class="title">返回参数</div>
+            </div>
+            <div class="item-body">
+                <a-table :data-source="resData" :columns="resColumns" :pagination="{ hideOnSinglePage: true }">
+                </a-table>
+            </div>
+        </div>
+        <!-- 返回示例 -->
+        <div class="detail-item">
+            <div class="item-header">
+                <div class="title">返回示例</div>
+            </div>
+            <div class="item-body">
+                <a-textarea v-model:value="resExample" placeholder="" :autoSize="true" />
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import { defineComponent, reactive, ref, toRefs, computed, onMounted, watch } from 'vue';
+import { getInterfaceDetail } from '/@/api/interface/interface.ts';
+import { message } from 'ant-design-vue';
+
+const props = {
+    action: {
+        type: String,
+        default: ''
+    }
+}
+
+export default defineComponent({
+    components: {},
+    props,
+    setup(props) {
+        //action数据，初始化时使用这个数据去组装需要的数据
+        const actionData = ref(null)
+
+        // 四类数据
+        const baseData = ref([])
+        const reqData = ref([])
+        const resData = ref([])
+        const resExample = ref('')
+
+        //请求参数表
+        const reqColumns = [
+            {
+                title: '参数名称',
+                align: 'center',
+                dataIndex: 'name',
+                key: 'name'
+            },
+            {
+                title: '说明',
+                align: 'center',
+                dataIndex: 'description',
+                key: 'description'
+            },
+            {
+                title: '参数位置',
+                align: 'center',
+                dataIndex: 'in',
+                key: 'in'
+            },
+            {
+                title: '是否必填',
+                align: 'center',
+                dataIndex: 'required',
+                slots: {
+                    customRender: 'required',
+                }
+            },
+            {
+                title: '数据类型',
+                align: 'center',
+                dataIndex: 'type',
+                key: 'type'
+            }
+        ]
+        //返回参数列表
+        const resColumns = [
+            {
+                title: '参数名称',
+                align: 'center',
+                dataIndex: 'name',
+                key: 'name'
+            },
+            {
+                title: '说明',
+                align: 'center',
+                dataIndex: 'schema',
+                key: 'schema'
+            },
+            {
+                title: '参数位置',
+                align: 'center',
+                dataIndex: 'in',
+                key: 'in'
+            },
+            {
+                title: '数据类型',
+                align: 'center',
+                dataIndex: 'type',
+                key: 'type'
+            }
+        ]
+
+        onMounted(() => {
+            props.action && getActionData(props.action)
+        })
+        watch(
+            () => props.action,
+            (val) => {
+                getActionData(val)
+            }
+        )
+        const getActionData = (id) => {
+            actionData.value = null
+            baseData.value = []
+            reqData.value = []
+            resData.value = []
+            resExample.value = ''
+            getInterfaceDetail(id).then(res => {
+                if(!res.id){
+                    message.info('该接口暂未查询到详情')
+                    return
+                }
+                actionData.value = {
+                    ...res,
+                    queryParams: JSON.parse(res.queryParams),
+                    requestHeaders: JSON.parse(res.requestHeaders),
+                    responseParams: JSON.parse(res.responseParams),
+                    // successRespExample:JSON.parse(res.successRespExample),
+                }
+                //组装四个需求的数据
+                baseData.value = [
+                    {
+                        label: '接口名称',
+                        value: actionData.value.name || '',
+                    },
+                    {
+                        label: '接口地址',
+                        value: actionData.value.requestUrl || '',
+                    },
+                    {
+                        label: '请求方式',
+                        value: actionData.value.requestMethod ? actionData.value.requestMethod : '',
+                    },
+                    {
+                        label: '发布日期',
+                        value: actionData.value.publishTime || '',
+                    },
+                    {
+                        label: '版本号',
+                        value: actionData.value.version || ''
+                    },
+                    {
+                        label: '接口描述',
+                        value: actionData.value.remark || ''
+                    },
+                ]
+                reqData.value = actionData.value.queryParams
+                reqData.value.unshift({
+                    description:'令牌',
+                    in:'header',
+                    name:'Authorization',
+                    required:false,
+                    type:'string'
+                })
+                reqData.value.forEach((item, index) => {
+                    item.key = index
+                })
+                resData.value = actionData.value.responseParams
+                resData.value.forEach((item, index) => {
+                    item.key = index
+                })
+                resExample.value = actionData.value.successRespExample
+                console.log(actionData.value);
+            })
+        }
+        return {
+            actionData,
+            baseData,
+            reqData,
+            resData,
+            resExample,
+
+            reqColumns,
+            resColumns,
+        };
+    },
+});
+</script>
+
+<style lang="less" scoped>
+.assembly-detail {
+    .detail-item {
+        margin-top: 10px;
+        margin-bottom: 20px;
+
+        &:first-child {
+            margin-top: 0;
+        }
+
+        .item-header {
+            padding-left: 20px;
+            height: 30px;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            border-left: 2px solid #e6a23c;
+            box-sizing: border-box;
+
+            .btns {
+                display: flex;
+
+                .btn {
+                    width: 80px;
+                    height: 30px;
+                    line-height: 30px;
+                    text-align: center;
+                    border-radius: 5px;
+                    background-color: #66b1ff;
+                    color: #fff;
+                    margin-right: 10px;
+                    cursor: pointer;
+                    user-select: none;
+                }
+            }
+        }
+
+        .item-body {
+            padding-left: 20px;
+
+            .des {
+                margin: 10px 0;
+                display: flex;
+
+                .des-label {
+                    width: 100px;
+                }
+            }
+        }
+    }
+}
+</style>

src/views/dataAdmin/dataAdmin/resVersion/ResDetailModal.vue

@@ -0,0 +1,431 @@
+<template>
+    <a-modal :visible="true" :width="width" :maskClosable="false" :destroyOnClose="true" centered :title="title"
+        :footer="null" wrapClassName="modal-wrap" @cancel="onClose">
+        <div class="action-content">
+            <div class="top-header">
+                <div class="img-container">
+                    <img :src="baseInfo?.thumbnail2 || './static/img/default-dr3.jpg'" alt="">
+                </div>
+                <div class="res-title">
+                    <div class="title">{{ baseInfo.servicename }}</div>
+                    <div class="describle">描述：{{ baseInfo.description }}</div>
+                    <div class="small-mark">
+                        <div class="update-time">更新时间：{{ baseInfo.updatedate }}</div>
+                        <div class="service-type">服务类型：{{ baseInfo.servicetype }}</div>
+                    </div>
+                    <div class="look">
+                        <a target="_blank" :href="`./mapview.html?${baseInfo.serviceid}`">
+                            <span>浏览</span>
+                        </a>
+                    </div>
+                </div>
+            </div>
+            <div class="base-info info-item">
+                <div class="info-title">基本信息</div>
+                <div class="form-box">
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title">真实地址</a-col>
+                        <a-col :span="21" class="form-item-value form-title">{{ baseInfo.mapingurl }}</a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">资源名称</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.servicename }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">资源别名</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.servicealiasname }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title" style="border-top: none;">缩略图</a-col>
+                        <a-col :span="21" class="form-item-value form-title" style="border-top: none;"
+                            :title="baseInfo.thumbnail">{{ baseInfo.thumbnail }}</a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title" style="border-top: none;">资源描述</a-col>
+                        <a-col :span="21" class="form-item-value form-title" style="border-top: none;">{{
+                            baseInfo.description }}</a-col>
+                    </a-row>
+                </div>
+            </div>
+            <div class="meta-info info-item">
+                <div class="info-title">描述信息</div>
+                <div class="form-box">
+                    <!-- 系统标签,资源类型 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title">系统标签</a-col>
+                                <a-col :span="18" class="form-item-value form-title">{{ metaInfo.serviceTags }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-left: none;">资源类型</a-col>
+                                <a-col :span="18" class="form-item-value form-title">{{ baseInfo.servicetype }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 数据类型,数据范围 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">数据类型</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.dataType === '2' ? '二维' : metaInfo.dataType === '3' ? '三维' : '' }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">数据范围</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.dataScope }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 更新方式,数据来源 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">更新方式</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.updateType }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">数据来源</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.source }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 管理部门,责任科室 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">管理部门</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.keepingunit }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">责任科室</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.rboffice }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 密级,坐标系 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">密级</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.secretlevel }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">坐标系</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.crs }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- EPSG code，运行状态 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">EPSG
+                                    code</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.epsgCode }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">运行状态</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.runtimestatus ? '启用' : '禁用' }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 是否为历史版本，适合申请流程 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;">是否为历史版本</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    Boolean(Number(metaInfo.ishistory)) ? '是' : '否' }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">适合申请流程</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.shsqlc }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 备注 -->
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title" style="border-top: none;">备注</a-col>
+                        <a-col :span="21" class="form-item-value form-title" style="border-top: none;">{{
+                            metaInfo.bz }}</a-col>
+                    </a-row>
+
+                </div>
+            </div>
+            <div class="public-set info-item">
+                <div class="info-title">共享设置</div>
+                <div class="form-box">
+                    <!-- 是否公开,是否共享 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title">是否公开</a-col>
+                                <a-col :span="18" class="form-item-value form-title">{{ baseInfo.ispublic === '1' ? '是' :
+                                    '否'
+                                }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-left: none;">是否共享</a-col>
+                                <a-col :span="18" class="form-item-value form-title">{{ metaInfo.searched === '1' ? '是' : '否'
+                                }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 外部申请，是否展示 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">外部申请</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.externalApply === '1' ? '是' : '否' }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">是否展示</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.isShow === '1' ? '是' : '否' }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                </div>
+            </div>
+        </div>
+    </a-modal>
+</template>
+<script>
+import { defineComponent, reactive, ref, onMounted, watch, toRefs } from 'vue';
+import { message } from 'ant-design-vue';
+import { session } from '/@/utils/Memory';
+import moment from 'moment';
+import { setHtmlImg } from '/@/views/minWidgets/CommonWay.js';
+import { getResViewInfo, queryServiceTags } from '/@/api/resource/plat';
+import { getAllTags } from '/@/api/sys/tag';
+
+const props = {
+    resId: {
+        type: String,
+        default: ''
+    }
+}
+export default defineComponent({
+    name: 'modal',
+    components: {},
+    props,
+    setup(props, { emit }) {
+        const data = reactive({
+            width: '1200px',
+            title: '资源详情',
+        })
+
+        // 关闭请求弹窗
+        const onClose = (e) => {
+            emit('closeModal')
+        }
+        const baseInfo = ref({})
+        const metaInfo = ref({})
+        //初始化请求所需数据
+        onMounted(async () => {
+            console.log(props.resId);
+            let res = await getResViewInfo(props.resId)
+            console.log(res);
+            baseInfo.value = res.servicebase;
+            baseInfo.value.thumbnail = res.metadata.thumbnail
+            session.getItem('thumbnail2') && (baseInfo.value.thumbnail2 = session.getItem('thumbnail2'));
+            baseInfo.value.updatedate = moment(baseInfo.value.updatedate).format('YYYY-MM-DD HH:mm:ss');
+            metaInfo.value = res.metadata
+            //所有标签
+            let param = {
+                1: session.getItem('tokenV2')
+            }
+            let allTags = await getAllTags(param)
+            if (allTags.status === '0' && allTags.result) {
+                let allTagArr = JSON.parse(allTags.result)
+                let keepingUnitObj = {}
+                let rbOfficeObj = {}
+                let secretLevelObj = {}
+                let epsgCodeObj = {}
+                let serviceTagsObj = {}
+                allTagArr.forEach(item => {
+                    //管理部门
+                    item.type === '管理部门' && (keepingUnitObj[item.code] = item.name)
+                    //责任科室
+                    item.type === '责任科室' && (rbOfficeObj[item.code] = item.name)
+                    //密级
+                    item.type === '密级' && (secretLevelObj[item.code] = item.name)
+                    //EPSG code
+                    item.type === 'EPSG code' && (epsgCodeObj[item.code] = item.name)
+                    //资源标签
+                    serviceTagsObj[item.code] = item.name
+                    if (metaInfo.value.keywords) {
+                        let tags = metaInfo.value.keywords.indexOf('[') > -1 ? JSON.parse(metaInfo.value.keywords) : [metaInfo.value.keywords];
+                        let resStr = ''
+                        tags.forEach(tag => {
+                            serviceTagsObj[tag]? resStr += serviceTagsObj[tag] + ',' : resStr += ''
+                        })
+                        metaInfo.value.serviceTags = resStr.slice(0, -1)
+                    }
+                })
+                metaInfo.value.keepingunit = keepingUnitObj[metaInfo.value.keepingunit]
+                metaInfo.value.rboffice = rbOfficeObj[metaInfo.value.rboffice]
+                metaInfo.value.secretlevel = secretLevelObj[metaInfo.value.secretlevel]
+                metaInfo.value.epsgCode = epsgCodeObj[metaInfo.value.epsgCode]
+            }
+        })
+        return {
+            // setHtmlImg,
+            baseInfo,
+            metaInfo,
+            // formRef,
+            ...toRefs(data),
+            onClose
+        };
+    },
+});
+</script>
+<style lang="less" scoped>
+.modal-wrap {
+    .action-content {
+        padding: 20px;
+        max-height: 800px;
+        overflow: auto;
+
+        .top-header {
+            margin-left: 20px;
+            display: flex;
+            align-items: center;
+
+            .img-container {
+                width: 260px;
+                height: 200px;
+                // border: 1px solid blue;
+                box-sizing: border-box;
+
+                img {
+                    width: 100%;
+                    height: 100%;
+                }
+            }
+
+            .res-title {
+                flex-grow: 1;
+                margin-left: 30px;
+
+                .title {
+                    font-size: 26px;
+                    font-weight: 700;
+                }
+
+                .describle {
+                    margin: 10px 0;
+                }
+
+                .small-mark {
+                    width: 100%;
+                    padding-bottom: 10px;
+                    display: flex;
+                    border-bottom: 1px solid rgb(220, 220, 220);
+
+                    .update-time {
+                        margin-right: 50px;
+                    }
+                }
+
+                .look {
+                    margin-top: 20px;
+                    margin-left: 10px;
+                    width: 100px;
+                    height: 35px;
+                    line-height: 32px;
+                    text-align: center;
+                    border: 2px solid blue;
+                    box-sizing: border-box;
+                    color: blue;
+                    font-size: 16px;
+                    font-weight: 700;
+                    cursor: pointer;
+                    user-select: none;
+                    border-radius: 4px;
+                }
+            }
+        }
+
+        .info-item {
+            margin-top: 20px;
+
+            .info-title {
+                margin: 10px 0;
+                padding-left: 10px;
+                border-left: 3px solid blue;
+            }
+
+            .form-box {
+                width: 100%;
+
+                .form-title {
+                    border: 1px solid rgb(230, 230, 230);
+                    box-sizing: border-box;
+                    height: 30px;
+                    line-height: 27px;
+                    padding-left: 5px;
+                    white-space: nowrap;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                }
+
+                .form-item-title {
+                    background-color: rgb(249, 249, 249);
+                }
+
+                .form-item-value {
+                    border-left: none;
+                }
+            }
+        }
+    }
+}
+</style>

src/views/dataAdmin/dataAdmin/resVersion/ResVersionManageModal.vue

@@ -306,6 +306,10 @@ export default defineComponent({
                 .history-label {
                     width: 100px;
                 }
+
+                .select-btn{
+                    color: #0671DD !important;
+                }
             }
         }
 

src/views/dataAdmin/dataAdmin/resVersion/index.vue

@@ -38,6 +38,7 @@
                                 {
                                     label: '浏览',
                                     tooltip: '浏览',
+                                    ifShow: !isInterface,
                                     onClick: handleFetchRes.bind(null, record),
                                 },
                                 {
@@ -65,6 +66,15 @@
         </div>
         <ResVersionManageModal @register="registerModal" @success="onSubmit"></ResVersionManageModal>
         <ResVersionManageAllModalVue @register="registerModalAll" @success="onSubmit"></ResVersionManageAllModalVue>
+        <ResDetailModal v-if="ifResDetail" :resId="resId" @closeModal="ifResDetail = false"></ResDetailModal>
+        <AssemblyDetailModal v-if="ifAssemblyDetail" :resId="resId" @closeModal="ifAssemblyDetail = false">
+        </AssemblyDetailModal>
+        <a-modal wrapClassName="modal-wrap" title="接口详情" width="1200px" v-model:visible="ifInterfaceDetail"
+            @cancel="ifInterfaceDetail = false" centered :footer="null">
+            <div class="content">
+                <InterfaceDetailModal :action="resId"></InterfaceDetailModal>
+            </div>
+        </a-modal>
     </div>
 </template>
 
@@ -76,18 +86,26 @@ import { Button, notification } from 'ant-design-vue';
 import { useModal } from '/@/components/Modal';
 import ResVersionManageModal from './ResVersionManageModal.vue';
 import ResVersionManageAllModalVue from './ResVersionManageAllModal.vue';
+import ResDetailModal from './ResDetailModal.vue';
+import AssemblyDetailModal from './AssemblyDetailModal.vue';
+import InterfaceDetailModal from './InterfaceDetailModal.vue';
 import { getResVersionList, removeResVersion } from '/@/api/sys/version';
 import { message } from 'ant-design-vue';
 import moment from 'moment'
 import { session } from '/@/utils/Memory';
 import uiTool from '/@/utils/uiTool';
+import { getResViewInfo } from '/@/api/resource/plat';
 
 export default defineComponent({
     name: 'resVersion',
-    components: { ResVersionManageModal, ResVersionManageAllModalVue, BasicTable, TableAction, Button },
+    components: { ResVersionManageModal, ResVersionManageAllModalVue, BasicTable, TableAction, Button, ResDetailModal, AssemblyDetailModal, InterfaceDetailModal },
     setup() {
         const [registerModal, { openModal }] = useModal();
         const [registerModalAll, { openModal: openModalAll }] = useModal();
+        const ifResDetail = ref(false)
+        const ifAssemblyDetail = ref(false)
+        const ifInterfaceDetail = ref(false)
+        const resId = ref('')
         const data = reactive({
             searchValue: "",//关键字
             searchType: 0,//是否已关联
@@ -123,6 +141,7 @@ export default defineComponent({
         }
         const currentResType = ref("MR");
         const isgl = ref(false);
+        const isInterface = computed(() => currentResType.value === 'interface');
         //获取所有标签
         const getResData = () => {
             return new Promise((resolve, reject) => {
@@ -189,7 +208,7 @@ export default defineComponent({
         const searchTable = () => {
             setSelectedRowKeys([])
             reload()
-            setPagination({current:1})
+            setPagination({ current: 1 })
             isgl.value = Boolean(data.searchType)
         }
         //重置
@@ -222,11 +241,6 @@ export default defineComponent({
                 let params = {
                     serviceid: rowKeys.toString()
                 }
-                // rowKeys.forEach(resId => {
-                //     params.version.push({
-                //         resource_ID: resId
-                //     })
-                // })
                 // 循环配置参数
                 removeResVersion(params).then(saveRes => {
                     console.log(saveRes)
@@ -238,7 +252,7 @@ export default defineComponent({
         const handleDel = (record) => {
             uiTool.delModal('确定取消该资源的版本？', (() => {
                 let params = {
-                    serviceid:record.SERVICEID
+                    serviceid: record.SERVICEID
                     // version: [{
                     //     resource_ID: record.SERVICEID
                     // }]
@@ -252,15 +266,36 @@ export default defineComponent({
         }
         // 浏览资源
         const handleFetchRes = (record) => {
+            if (currentResType.value === 'SR') {
+                getResViewInfo(record.SERVICEID).then(res => {
+                    console.log(res);
+                    window.open(`./mapview.html?onlineIde_${res.servicebase.servicealiasname}`, '_blank')
+                })
+            }
+            else if (currentResType.value === 'interface') {
 
+            }
+            else {
+                getResViewInfo(record.SERVICEID).then(res => {
+                    console.log(res);
+                    window.open(`./mapview.html?${res.servicebase.serviceid}`, '_blank')
+                })
+            }
         }
         // 查看资源
         const handleLookRes = (record) => {
-            // const { FID, VERSION_NAME, VERSION_NO, VERSION_DISP } = record;
-            // openResModal(true, {
-            //     status: 'look',
-            //     form: { FID, VERSION_NAME, VERSION_NO, VERSION_DISP }
-            // });
+            console.log(record)
+            console.log(currentResType.value)
+            resId.value = record.SERVICEID
+            if (currentResType.value === 'SR') {
+                ifAssemblyDetail.value = true
+            }
+            else if (currentResType.value === 'interface') {
+                ifInterfaceDetail.value = true
+            }
+            else {
+                ifResDetail.value = true
+            }
         }
         //管理资源的版本
         const handleManage = (record) => {
@@ -310,11 +345,16 @@ export default defineComponent({
             },
         });
         return {
+            ifResDetail,
+            ifAssemblyDetail,
+            ifInterfaceDetail,
+            resId,
             resBtns,
             currentResType,
             columns,
             hasSelected,
             isgl,
+            isInterface,
             ...toRefs(data),
             // func
             // registerResModal,
@@ -415,4 +455,13 @@ export default defineComponent({
         }
     }
 }
+
+.modal-wrap {
+    .content {
+        padding: 20px 10px 10px 20px;
+        margin-top: 10px;
+        max-height: 800px;
+        overflow: auto;
+    }
+}
 </style>

src/views/dataAdmin/dataAdmin/resourceCataloging/index.vue

@@ -24,7 +24,7 @@
       <div class="right">
         <div class="right-head">
           <a-card>
-            <a-row>
+            <!-- <a-row>
               <a-col :span="10">
                 类型：
                 <a-checkbox-group v-model:value="checked" name="checkboxgroup" :options="plainOptions"
@@ -44,7 +44,33 @@
                 <a-button style="margin-right: 10px;" @click="resetKeyWord">重置</a-button>
                 <a-button type="primary" @click="getKeyWordData">查询</a-button>
               </a-col>
-            </a-row>
+            </a-row> -->
+            <div class="right-search-bar">
+              <div class="right-search-bar-items">
+                <div class="search-bar-item">
+                  类型：
+                  <a-checkbox-group v-model:value="checked" name="checkboxgroup" :options="plainOptions"
+                    @change="(checkedValue) => { selectType(checkedValue) }" />
+                </div>
+                <div class="search-bar-item">
+                  坐标系：
+                  <a-select allowClear ref="select" :value="coordinateChangeValue" style="width: 150px"
+                    @change="handleChange">
+                    <a-select-option v-for="item in coordinateData" :key="item.ID" :value="item.GEOMNAME">{{ item.GEOMNAME
+                    }}</a-select-option>
+                  </a-select>
+                </div>
+                <div class="search-bar-item">
+                  资源名称：
+                  <a-input v-model:value="inputValue" placeholder="支持名称搜索" style="width: 150px" />
+                </div>
+              </div>
+              <div class="right-search-bar-btns">
+                <a-button style="margin-right: 10px;" @click="resetKeyWord">重置</a-button>
+                <a-button type="primary" @click="getKeyWordData">查询</a-button>
+              </div>
+            </div>
+
           </a-card>
         </div>
         <div class="right-content">
@@ -265,6 +291,7 @@ export default defineComponent({
 
     const inputValue = ref('')
     const getKeyWordData = () => {
+      pagination.current = 1
       getUsedResource()
     }
     const resetKeyWord = () => {
@@ -280,6 +307,7 @@ export default defineComponent({
 
     // 坐标系下拉框处理函数
     const handleChange = value1 => {
+      pagination.current = 1
       coordinateChangeValue.value = value1 || ''
       getUsedResource()
       getAssociatedData()
@@ -347,6 +375,7 @@ export default defineComponent({
       }
     ])
     const selectType = (e) => {
+      pagination.current = 1
       if (e.toString().indexOf('false') > -1) {
         typeChangeValue.value = e.slice(0, -1).toString()
         associatedFlag.value = 'false'
@@ -355,6 +384,7 @@ export default defineComponent({
         typeChangeValue.value = e.toString()
         associatedFlag.value = ''
       }
+      typeChangeValue.value = typeChangeValue.value || 'MR,ER,DR'
       getUsedResource()
     }
 
@@ -363,7 +393,7 @@ export default defineComponent({
       if (selectedKeys.length) {
         clickTreeNode.value = { ...node.dataRef }
         getAssociatedData()
-      }else{
+      } else {
         clickTreeNode.value = {}
         associatedData.value = []
       }
@@ -393,11 +423,11 @@ export default defineComponent({
 
     // 添加关联数据
     const addAssociateData = () => {
-      if(!clickTreeNode.value.id){
+      if (!clickTreeNode.value.id) {
         message.info('请选择目录');
         return;
       }
-      if(!useValue.value.length){
+      if (!useValue.value.length) {
         message.info('请选择资源');
         return;
       }
@@ -435,7 +465,7 @@ export default defineComponent({
 
     // 取消关联数据
     const cancelAssociateData = () => {
-      if(!clickTreeNode.value.id){
+      if (!clickTreeNode.value.id) {
         message.info('请选择目录');
         return;
       }
@@ -547,6 +577,24 @@ export default defineComponent({
     .right-head {
       width: 100%;
       height: 10%;
+      .right-search-bar{
+        display: flex;
+        justify-content: space-between;
+
+        &-items{
+          display: flex;
+          .search-bar-item{
+            margin-right: 10px;
+            display: flex;
+            align-items: center;
+          }
+        }
+
+        &-btns{
+          display: flex;
+          justify-content: flex-end;
+        }
+      }
     }
 
     .right-content {
@@ -616,9 +664,10 @@ export default defineComponent({
         overflow: auto;
 
         ::v-deep label {
-          // display: flex;
+          display: flex;
           padding: 10px 0;
-          // align-items: center;
+          align-items: center;
+          min-width: 260px;
 
           span {
             &:last-child {

src/views/dataAdmin/dataAdmin/version/AssemblyDetailModal.vue

@@ -0,0 +1,211 @@
+<template>
+    <a-modal :visible="true" :width="width" :maskClosable="false" :destroyOnClose="true" centered :title="title"
+        :footer="null" wrapClassName="modal-wrap" @cancel="onClose">
+        <div class="action-content">
+            <div class="top-header">
+                <div class="img-container">
+                    <img :src="baseInfo?.url || './static/img/default-dr3.jpg'" alt="">
+                </div>
+                <div class="res-title">
+                    <div class="title">{{ baseInfo.servicename }}</div>
+                    <div class="describle">描述：{{ baseInfo.description }}</div>
+                    <div class="small-mark">
+                        <div class="update-time">更新时间：{{ baseInfo.updatedate }}</div>
+                        <div class="service-type">服务类型：组件工具</div>
+                    </div>
+                    <div class="look">
+                        <a :href="[`./mapview.html?onlineIde_${baseInfo.servicealiasname}`]" target="_blank"
+                            rel="noopener noreferrer">浏览</a>
+                    </div>
+                </div>
+            </div>
+            <div class="base-info info-item">
+                <div class="info-title">基本信息</div>
+                <div class="form-box">
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title">真实地址</a-col>
+                        <a-col :span="21" class="form-item-value form-title">{{ baseInfo.zsdz }}</a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">资源名称</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.servicename }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">资源别名</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.servicealiasname }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title" style="border-top: none;">缩略图</a-col>
+                        <a-col :span="21" class="form-item-value form-title" style="border-top: none;"
+                            :title="baseInfo.url">{{ baseInfo.url }}</a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title" style="border-top: none;">资源描述</a-col>
+                        <a-col :span="21" class="form-item-value form-title" style="border-top: none;">{{
+                            baseInfo.description }}</a-col>
+                    </a-row>
+                </div>
+            </div>
+        </div>
+    </a-modal>
+</template>
+<script>
+import { defineComponent, reactive, ref, onMounted, watch, toRefs } from 'vue';
+import { message } from 'ant-design-vue';
+import { session } from '/@/utils/Memory';
+import moment from 'moment';
+
+import { getResViewInfo } from '/@/api/resource/plat';
+
+
+export default defineComponent({
+    name: 'modal',
+    components: {},
+    props: {
+        resId: {
+            type: String,
+            default: ''
+        }
+    },
+    setup(props, { emit }) {
+        const data = reactive({
+            width: '1200px',
+            title: '组件详情',
+        })
+        // 关闭请求弹窗
+        const onClose = (e) => {
+            emit('closeModal')
+        }
+        const baseInfo = ref({})
+        const metaInfo = ref({})
+        //初始化请求所需数据
+        onMounted(() => {
+            getResViewInfo(props.resId).then(res => {
+                console.log(res);
+                baseInfo.value = res.servicebase;
+                baseInfo.value.thumbnail = res.metadata.thumbnail
+                baseInfo.value.updatedate = moment(baseInfo.value.updatedate).format('YYYY-MM-DD HH:mm:ss');
+                baseInfo.value.zsdz = `${window.location.origin}/mapview.html?onlineIde_${baseInfo.value.servicealiasname}`;
+            })
+        })
+        return {
+            baseInfo,
+            metaInfo,
+            // formRef,
+            ...toRefs(data),
+            onClose
+        };
+    },
+});
+</script>
+<style lang="less" scoped>
+.modal-wrap {
+    .action-content {
+        padding: 20px;
+        max-height: 800px;
+        overflow: auto;
+
+        .top-header {
+            margin-left: 20px;
+            display: flex;
+            align-items: center;
+
+            .img-container {
+                width: 260px;
+                height: 200px;
+                // border: 1px solid blue;
+                box-sizing: border-box;
+
+                img {
+                    width: 100%;
+                    height: 100%;
+                }
+            }
+
+            .res-title {
+                flex-grow: 1;
+                margin-left: 30px;
+
+                .title {
+                    font-size: 26px;
+                    font-weight: 700;
+                }
+
+                .describle {
+                    margin: 10px 0;
+                }
+
+                .small-mark {
+                    width: 100%;
+                    padding-bottom: 10px;
+                    display: flex;
+                    border-bottom: 1px solid rgb(220, 220, 220);
+
+                    .update-time {
+                        margin-right: 50px;
+                    }
+                }
+
+                .look {
+                    margin-top: 20px;
+                    margin-left: 10px;
+                    width: 100px;
+                    height: 35px;
+                    line-height: 32px;
+                    text-align: center;
+                    border: 2px solid blue;
+                    box-sizing: border-box;
+                    color: blue;
+                    font-size: 16px;
+                    font-weight: 700;
+                    cursor: pointer;
+                    user-select: none;
+                    border-radius: 4px;
+                }
+            }
+        }
+
+        .info-item {
+            margin-top: 20px;
+
+            .info-title {
+                margin: 10px 0;
+                padding-left: 10px;
+                border-left: 3px solid blue;
+            }
+
+            .form-box {
+                width: 100%;
+
+                .form-title {
+                    border: 1px solid rgb(230, 230, 230);
+                    box-sizing: border-box;
+                    height: 30px;
+                    line-height: 27px;
+                    padding-left: 5px;
+                    white-space: nowrap;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                }
+
+                .form-item-title {
+                    background-color: rgb(249, 249, 249);
+                }
+
+                .form-item-value {
+                    border-left: none;
+                }
+            }
+        }
+    }
+}
+</style>

src/views/dataAdmin/dataAdmin/version/InterfaceDetailModal.vue

@@ -0,0 +1,278 @@
+<!-- 接口详情弹窗 -->
+<template>
+    <div class="assembly-detail">
+        <!-- 基本信息 -->
+        <div class="detail-item">
+            <div class="item-header">
+                <div class="title">基本信息</div>
+            </div>
+            <div class="item-body">
+                <div class="des" v-for="(item, index) of baseData" :key="index">
+                    <div class="des-label">{{ item.label }}:</div>
+                    <div v-if="item.label!=='接口描述'">{{ item.value }}</div>
+                    <div v-else v-html="item.value"></div>
+                </div>
+            </div>
+        </div>
+        <!-- 请求参数 -->
+        <div class="detail-item">
+            <div class="item-header">
+                <div class="title">请求参数</div>
+            </div>
+            <div class="item-body">
+                <a-table :data-source="reqData" :columns="reqColumns" :pagination="{ hideOnSinglePage: true }">
+                    <template #required="{ record }">
+                        <div>{{ record.required ? '是' : '否' }}</div>
+                    </template>
+                </a-table>
+            </div>
+        </div>
+        <!-- 返回参数 -->
+        <div class="detail-item">
+            <div class="item-header">
+                <div class="title">返回参数</div>
+            </div>
+            <div class="item-body">
+                <a-table :data-source="resData" :columns="resColumns" :pagination="{ hideOnSinglePage: true }">
+                </a-table>
+            </div>
+        </div>
+        <!-- 返回示例 -->
+        <div class="detail-item">
+            <div class="item-header">
+                <div class="title">返回示例</div>
+            </div>
+            <div class="item-body">
+                <a-textarea v-model:value="resExample" placeholder="" :autoSize="true" />
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import { defineComponent, reactive, ref, toRefs, computed, onMounted, watch } from 'vue';
+import { getInterfaceDetail } from '/@/api/interface/interface.ts';
+import { message } from 'ant-design-vue';
+
+const props = {
+    action: {
+        type: String,
+        default: ''
+    }
+}
+
+export default defineComponent({
+    components: {},
+    props,
+    setup(props) {
+        //action数据，初始化时使用这个数据去组装需要的数据
+        const actionData = ref(null)
+
+        // 四类数据
+        const baseData = ref([])
+        const reqData = ref([])
+        const resData = ref([])
+        const resExample = ref('')
+
+        //请求参数表
+        const reqColumns = [
+            {
+                title: '参数名称',
+                align: 'center',
+                dataIndex: 'name',
+                key: 'name'
+            },
+            {
+                title: '说明',
+                align: 'center',
+                dataIndex: 'description',
+                key: 'description'
+            },
+            {
+                title: '参数位置',
+                align: 'center',
+                dataIndex: 'in',
+                key: 'in'
+            },
+            {
+                title: '是否必填',
+                align: 'center',
+                dataIndex: 'required',
+                slots: {
+                    customRender: 'required',
+                }
+            },
+            {
+                title: '数据类型',
+                align: 'center',
+                dataIndex: 'type',
+                key: 'type'
+            }
+        ]
+        //返回参数列表
+        const resColumns = [
+            {
+                title: '参数名称',
+                align: 'center',
+                dataIndex: 'name',
+                key: 'name'
+            },
+            {
+                title: '说明',
+                align: 'center',
+                dataIndex: 'schema',
+                key: 'schema'
+            },
+            {
+                title: '参数位置',
+                align: 'center',
+                dataIndex: 'in',
+                key: 'in'
+            },
+            {
+                title: '数据类型',
+                align: 'center',
+                dataIndex: 'type',
+                key: 'type'
+            }
+        ]
+
+        onMounted(() => {
+            props.action && getActionData(props.action)
+        })
+        watch(
+            () => props.action,
+            (val) => {
+                getActionData(val)
+            }
+        )
+        const getActionData = (id) => {
+            actionData.value = null
+            baseData.value = []
+            reqData.value = []
+            resData.value = []
+            resExample.value = ''
+            getInterfaceDetail(id).then(res => {
+                if(!res.id){
+                    message.info('该接口暂未查询到详情')
+                    return
+                }
+                actionData.value = {
+                    ...res,
+                    queryParams: JSON.parse(res.queryParams),
+                    requestHeaders: JSON.parse(res.requestHeaders),
+                    responseParams: JSON.parse(res.responseParams),
+                    // successRespExample:JSON.parse(res.successRespExample),
+                }
+                //组装四个需求的数据
+                baseData.value = [
+                    {
+                        label: '接口名称',
+                        value: actionData.value.name || '',
+                    },
+                    {
+                        label: '接口地址',
+                        value: actionData.value.requestUrl || '',
+                    },
+                    {
+                        label: '请求方式',
+                        value: actionData.value.requestMethod ? actionData.value.requestMethod : '',
+                    },
+                    {
+                        label: '发布日期',
+                        value: actionData.value.publishTime || '',
+                    },
+                    {
+                        label: '版本号',
+                        value: actionData.value.version || ''
+                    },
+                    {
+                        label: '接口描述',
+                        value: actionData.value.remark || ''
+                    },
+                ]
+                reqData.value = actionData.value.queryParams
+                reqData.value.unshift({
+                    description:'令牌',
+                    in:'header',
+                    name:'Authorization',
+                    required:false,
+                    type:'string'
+                })
+                reqData.value.forEach((item, index) => {
+                    item.key = index
+                })
+                resData.value = actionData.value.responseParams
+                resData.value.forEach((item, index) => {
+                    item.key = index
+                })
+                resExample.value = actionData.value.successRespExample
+                console.log(actionData.value);
+            })
+        }
+        return {
+            actionData,
+            baseData,
+            reqData,
+            resData,
+            resExample,
+
+            reqColumns,
+            resColumns,
+        };
+    },
+});
+</script>
+
+<style lang="less" scoped>
+.assembly-detail {
+    .detail-item {
+        margin-top: 10px;
+        margin-bottom: 20px;
+
+        &:first-child {
+            margin-top: 0;
+        }
+
+        .item-header {
+            padding-left: 20px;
+            height: 30px;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            border-left: 2px solid #e6a23c;
+            box-sizing: border-box;
+
+            .btns {
+                display: flex;
+
+                .btn {
+                    width: 80px;
+                    height: 30px;
+                    line-height: 30px;
+                    text-align: center;
+                    border-radius: 5px;
+                    background-color: #66b1ff;
+                    color: #fff;
+                    margin-right: 10px;
+                    cursor: pointer;
+                    user-select: none;
+                }
+            }
+        }
+
+        .item-body {
+            padding-left: 20px;
+
+            .des {
+                margin: 10px 0;
+                display: flex;
+
+                .des-label {
+                    width: 100px;
+                }
+            }
+        }
+    }
+}
+</style>

src/views/dataAdmin/dataAdmin/version/ResDetailModal.vue

@@ -0,0 +1,431 @@
+<template>
+    <a-modal :visible="true" :width="width" :maskClosable="false" :destroyOnClose="true" centered :title="title"
+        :footer="null" wrapClassName="modal-wrap" @cancel="onClose">
+        <div class="action-content">
+            <div class="top-header">
+                <div class="img-container">
+                    <img :src="baseInfo?.thumbnail2 || './static/img/default-dr3.jpg'" alt="">
+                </div>
+                <div class="res-title">
+                    <div class="title">{{ baseInfo.servicename }}</div>
+                    <div class="describle">描述：{{ baseInfo.description }}</div>
+                    <div class="small-mark">
+                        <div class="update-time">更新时间：{{ baseInfo.updatedate }}</div>
+                        <div class="service-type">服务类型：{{ baseInfo.servicetype }}</div>
+                    </div>
+                    <div class="look">
+                        <a target="_blank" :href="`./mapview.html?${baseInfo.serviceid}`">
+                            <span>浏览</span>
+                        </a>
+                    </div>
+                </div>
+            </div>
+            <div class="base-info info-item">
+                <div class="info-title">基本信息</div>
+                <div class="form-box">
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title">真实地址</a-col>
+                        <a-col :span="21" class="form-item-value form-title">{{ baseInfo.mapingurl }}</a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">资源名称</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.servicename }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">资源别名</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.servicealiasname }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title" style="border-top: none;">缩略图</a-col>
+                        <a-col :span="21" class="form-item-value form-title" style="border-top: none;"
+                            :title="baseInfo.thumbnail">{{ baseInfo.thumbnail }}</a-col>
+                    </a-row>
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title" style="border-top: none;">资源描述</a-col>
+                        <a-col :span="21" class="form-item-value form-title" style="border-top: none;">{{
+                            baseInfo.description }}</a-col>
+                    </a-row>
+                </div>
+            </div>
+            <div class="meta-info info-item">
+                <div class="info-title">描述信息</div>
+                <div class="form-box">
+                    <!-- 系统标签,资源类型 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title">系统标签</a-col>
+                                <a-col :span="18" class="form-item-value form-title">{{ metaInfo.serviceTags }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-left: none;">资源类型</a-col>
+                                <a-col :span="18" class="form-item-value form-title">{{ baseInfo.servicetype }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 数据类型,数据范围 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">数据类型</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.dataType === '2' ? '二维' : metaInfo.dataType === '3' ? '三维' : '' }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">数据范围</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.dataScope }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 更新方式,数据来源 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">更新方式</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.updateType }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">数据来源</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.source }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 管理部门,责任科室 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">管理部门</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.keepingunit }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">责任科室</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.rboffice }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 密级,坐标系 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">密级</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.secretlevel }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">坐标系</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.crs }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- EPSG code，运行状态 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">EPSG
+                                    code</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.epsgCode }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">运行状态</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.runtimestatus ? '启用' : '禁用' }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 是否为历史版本，适合申请流程 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;">是否为历史版本</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    Boolean(Number(metaInfo.ishistory)) ? '是' : '否' }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">适合申请流程</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.shsqlc }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 备注 -->
+                    <a-row>
+                        <a-col :span="3" class="form-item-title form-title" style="border-top: none;">备注</a-col>
+                        <a-col :span="21" class="form-item-value form-title" style="border-top: none;">{{
+                            metaInfo.bz }}</a-col>
+                    </a-row>
+
+                </div>
+            </div>
+            <div class="public-set info-item">
+                <div class="info-title">共享设置</div>
+                <div class="form-box">
+                    <!-- 是否公开,是否共享 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title">是否公开</a-col>
+                                <a-col :span="18" class="form-item-value form-title">{{ baseInfo.ispublic === '1' ? '是' :
+                                    '否'
+                                }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-left: none;">是否共享</a-col>
+                                <a-col :span="18" class="form-item-value form-title">{{ metaInfo.searched === '1' ? '是' : '否'
+                                }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                    <!-- 外部申请，是否展示 -->
+                    <a-row>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title" style="border-top: none;">外部申请</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    baseInfo.externalApply === '1' ? '是' : '否' }}</a-col>
+                            </a-row>
+                        </a-col>
+                        <a-col :span="12">
+                            <a-row>
+                                <a-col :span="6" class="form-item-title form-title"
+                                    style="border-top: none;border-left: none;">是否展示</a-col>
+                                <a-col :span="18" class="form-item-value form-title" style="border-top: none;">{{
+                                    metaInfo.isShow === '1' ? '是' : '否' }}</a-col>
+                            </a-row>
+                        </a-col>
+                    </a-row>
+                </div>
+            </div>
+        </div>
+    </a-modal>
+</template>
+<script>
+import { defineComponent, reactive, ref, onMounted, watch, toRefs } from 'vue';
+import { message } from 'ant-design-vue';
+import { session } from '/@/utils/Memory';
+import moment from 'moment';
+import { setHtmlImg } from '/@/views/minWidgets/CommonWay.js';
+import { getResViewInfo, queryServiceTags } from '/@/api/resource/plat';
+import { getAllTags } from '/@/api/sys/tag';
+
+const props = {
+    resId: {
+        type: String,
+        default: ''
+    }
+}
+export default defineComponent({
+    name: 'modal',
+    components: {},
+    props,
+    setup(props, { emit }) {
+        const data = reactive({
+            width: '1200px',
+            title: '资源详情',
+        })
+
+        // 关闭请求弹窗
+        const onClose = (e) => {
+            emit('closeModal')
+        }
+        const baseInfo = ref({})
+        const metaInfo = ref({})
+        //初始化请求所需数据
+        onMounted(async () => {
+            console.log(props.resId);
+            let res = await getResViewInfo(props.resId)
+            console.log(res);
+            baseInfo.value = res.servicebase;
+            baseInfo.value.thumbnail = res.metadata.thumbnail
+            session.getItem('thumbnail2') && (baseInfo.value.thumbnail2 = session.getItem('thumbnail2'));
+            baseInfo.value.updatedate = moment(baseInfo.value.updatedate).format('YYYY-MM-DD HH:mm:ss');
+            metaInfo.value = res.metadata
+            //所有标签
+            let param = {
+                1: session.getItem('tokenV2')
+            }
+            let allTags = await getAllTags(param)
+            if (allTags.status === '0' && allTags.result) {
+                let allTagArr = JSON.parse(allTags.result)
+                let keepingUnitObj = {}
+                let rbOfficeObj = {}
+                let secretLevelObj = {}
+                let epsgCodeObj = {}
+                let serviceTagsObj = {}
+                allTagArr.forEach(item => {
+                    //管理部门
+                    item.type === '管理部门' && (keepingUnitObj[item.code] = item.name)
+                    //责任科室
+                    item.type === '责任科室' && (rbOfficeObj[item.code] = item.name)
+                    //密级
+                    item.type === '密级' && (secretLevelObj[item.code] = item.name)
+                    //EPSG code
+                    item.type === 'EPSG code' && (epsgCodeObj[item.code] = item.name)
+                    //资源标签
+                    serviceTagsObj[item.code] = item.name
+                    if (metaInfo.value.keywords) {
+                        let tags = metaInfo.value.keywords.indexOf('[') > -1 ? JSON.parse(metaInfo.value.keywords) : [metaInfo.value.keywords];
+                        let resStr = ''
+                        tags.forEach(tag => {
+                            serviceTagsObj[tag]? resStr += serviceTagsObj[tag] + ',' : resStr += ''
+                        })
+                        metaInfo.value.serviceTags = resStr.slice(0, -1)
+                    }
+                })
+                metaInfo.value.keepingunit = keepingUnitObj[metaInfo.value.keepingunit]
+                metaInfo.value.rboffice = rbOfficeObj[metaInfo.value.rboffice]
+                metaInfo.value.secretlevel = secretLevelObj[metaInfo.value.secretlevel]
+                metaInfo.value.epsgCode = epsgCodeObj[metaInfo.value.epsgCode]
+            }
+        })
+        return {
+            // setHtmlImg,
+            baseInfo,
+            metaInfo,
+            // formRef,
+            ...toRefs(data),
+            onClose
+        };
+    },
+});
+</script>
+<style lang="less" scoped>
+.modal-wrap {
+    .action-content {
+        padding: 20px;
+        max-height: 800px;
+        overflow: auto;
+
+        .top-header {
+            margin-left: 20px;
+            display: flex;
+            align-items: center;
+
+            .img-container {
+                width: 260px;
+                height: 200px;
+                // border: 1px solid blue;
+                box-sizing: border-box;
+
+                img {
+                    width: 100%;
+                    height: 100%;
+                }
+            }
+
+            .res-title {
+                flex-grow: 1;
+                margin-left: 30px;
+
+                .title {
+                    font-size: 26px;
+                    font-weight: 700;
+                }
+
+                .describle {
+                    margin: 10px 0;
+                }
+
+                .small-mark {
+                    width: 100%;
+                    padding-bottom: 10px;
+                    display: flex;
+                    border-bottom: 1px solid rgb(220, 220, 220);
+
+                    .update-time {
+                        margin-right: 50px;
+                    }
+                }
+
+                .look {
+                    margin-top: 20px;
+                    margin-left: 10px;
+                    width: 100px;
+                    height: 35px;
+                    line-height: 32px;
+                    text-align: center;
+                    border: 2px solid blue;
+                    box-sizing: border-box;
+                    color: blue;
+                    font-size: 16px;
+                    font-weight: 700;
+                    cursor: pointer;
+                    user-select: none;
+                    border-radius: 4px;
+                }
+            }
+        }
+
+        .info-item {
+            margin-top: 20px;
+
+            .info-title {
+                margin: 10px 0;
+                padding-left: 10px;
+                border-left: 3px solid blue;
+            }
+
+            .form-box {
+                width: 100%;
+
+                .form-title {
+                    border: 1px solid rgb(230, 230, 230);
+                    box-sizing: border-box;
+                    height: 30px;
+                    line-height: 27px;
+                    padding-left: 5px;
+                    white-space: nowrap;
+                    overflow: hidden;
+                    text-overflow: ellipsis;
+                }
+
+                .form-item-title {
+                    background-color: rgb(249, 249, 249);
+                }
+
+                .form-item-value {
+                    border-left: none;
+                }
+            }
+        }
+    }
+}
+</style>

src/views/dataAdmin/dataAdmin/version/VersionResModal.vue

@@ -26,6 +26,7 @@
                                 {
                                     label: '浏览',
                                     tooltip: '浏览',
+                                    ifShow: !isInterface,
                                     onClick: handleFetchRes.bind(null, record),
                                 },
                                 {
@@ -46,6 +47,15 @@
         </div>
     </BasicModal>
     <HistoryResListModal @register="registerHistoryModal"></HistoryResListModal>
+    <ResDetailModal v-if="ifResDetail" :resId="resId" @closeModal="ifResDetail = false"></ResDetailModal>
+    <AssemblyDetailModal v-if="ifAssemblyDetail" :resId="resId" @closeModal="ifAssemblyDetail = false">
+    </AssemblyDetailModal>
+    <a-modal wrapClassName="modal-wrap" title="接口详情" width="1200px" v-model:visible="ifInterfaceDetail"
+        @cancel="ifInterfaceDetail = false" centered :footer="null">
+        <div class="content">
+            <InterfaceDetailModal :action="resId"></InterfaceDetailModal>
+        </div>
+    </a-modal>
 </template>
 <script>
 import { defineComponent, reactive, ref, onMounted, watch, computed } from 'vue';
@@ -57,10 +67,14 @@ import { getResByVersion } from '/@/api/sys/version';
 import { session } from '/@/utils/Memory';
 import moment from 'moment';
 import HistoryResListModal from './HistoryResListModal.vue';
+import ResDetailModal from './ResDetailModal.vue';
+import AssemblyDetailModal from './AssemblyDetailModal.vue';
+import InterfaceDetailModal from './InterfaceDetailModal.vue';
+import { getResViewInfo } from '/@/api/resource/plat';
 
 export default defineComponent({
     name: 'VersionResModal',
-    components: { BasicModal, BasicTable, TableAction, Button, HistoryResListModal },
+    components: { BasicModal, BasicTable, TableAction, Button, HistoryResListModal, ResDetailModal, AssemblyDetailModal, InterfaceDetailModal },
     setup(_, { emit }) {
         const title = ref('');
         const resBtns = ref([
@@ -93,10 +107,15 @@ export default defineComponent({
         const currentType = ref('MR')
         const currentFid = ref('')
         const searchValue = ref('')
+        const ifResDetail = ref(false)
+        const ifAssemblyDetail = ref(false)
+        const ifInterfaceDetail = ref(false)
+        const resId = ref('')
         const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data) => {
             const { FID, VERSION_NAME, VERSION_NO, VERSION_DISP } = data.form;
             currentFid.value = FID;
             title.value = `【${VERSION_NAME} V${VERSION_NO}】资源绑定查看`;
+            currentType.value = 'MR';
             reload()
             getNumber()
         });
@@ -108,6 +127,7 @@ export default defineComponent({
             SR: "组件服务",
             interface: "接口服务"
         }
+        const isInterface = computed(() => currentType.value === 'interface');
         const getNumber = () => {
             let params = {
                 keyStr: '',
@@ -116,7 +136,7 @@ export default defineComponent({
             getResByVersion(params).then(res => {
                 if (res.resp_code === 0 && res.datas) {
                     let resData = res.datas;
-                    resBtns.value.forEach(btn=>{
+                    resBtns.value.forEach(btn => {
                         btn.number = resData[btn.value].total
                     })
                 }
@@ -228,13 +248,35 @@ export default defineComponent({
             currentType.value = item.value;
             reload();
         }
-        // 浏览
-        const handleFetchRes = () => {
-
+        // 浏览资源
+        const handleFetchRes = (record) => {
+            if (currentType.value === 'SR') {
+                getResViewInfo(record.SERVICEID).then(res => {
+                    console.log(res);
+                    window.open(`./mapview.html?onlineIde_${res.servicebase.servicealiasname}`, '_blank')
+                })
+            }
+            else {
+                getResViewInfo(record.SERVICEID).then(res => {
+                    console.log(res);
+                    window.open(`./mapview.html?${res.servicebase.serviceid}`, '_blank')
+                })
+            }
         }
-        // 查看
-        const handleLookRes = () => {
-
+        // 查看资源
+        const handleLookRes = (record) => {
+            console.log(record)
+            console.log(currentType.value)
+            resId.value = record.SERVICEID || record.SERVERID
+            if (currentType.value === 'SR') {
+                ifAssemblyDetail.value = true
+            }
+            else if (currentType.value === 'interface') {
+                ifInterfaceDetail.value = true
+            }
+            else {
+                ifResDetail.value = true
+            }
         }
         // 历史版本
         const handleSearchHistory = (record) => {
@@ -245,6 +287,11 @@ export default defineComponent({
             })
         }
         return {
+            ifResDetail,
+            ifAssemblyDetail,
+            ifInterfaceDetail,
+            resId,
+            isInterface,
             title,
             resBtns,
             currentType,
@@ -343,4 +390,12 @@ export default defineComponent({
         }
     }
 }
+.modal-wrap {
+    .content {
+        padding: 20px 10px 10px 20px;
+        margin-top: 10px;
+        max-height: 800px;
+        overflow: auto;
+    }
+}
 </style>