From 18ca331378a21e924ee49c60645d1fe2572f0d42 Mon Sep 17 00:00:00 2001
From: songyang <972986197@qq.com>
Date: Tue, 12 Dec 2023 09:23:09 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E4=BC=81=E4=B8=9A=E4=B8=93?=
 =?UTF-8?q?=E5=8C=BA=20=E5=AF=BB=E6=BA=90=E6=AF=94=E8=BE=83=E7=90=86?=
 =?UTF-8?q?=E7=94=B1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .gitignore                         |    1 +
 components.d.ts                    |    4 +
 src/components/Navmenu/index.vue   |    4 +-
 src/layout/header.vue              |    2 +-
 src/router/index.ts                |   22 +
 src/views/enterpriseZone/index.vue |    7 +
 src/views/equip/detail.vue         | 1569 ++++++++++++++--------------
 src/views/parity/index.vue         |    7 +
 8 files changed, 820 insertions(+), 796 deletions(-)
 create mode 100644 src/views/enterpriseZone/index.vue
 create mode 100644 src/views/parity/index.vue

diff --git a/.gitignore b/.gitignore
index dbf2be4..b454a48 100644
--- a/.gitignore
+++ b/.gitignore
@@ -29,3 +29,4 @@ coverage
 *.sw?
 .prettierrc.js
 auto-imports.d.ts
+components.d.ts
diff --git a/components.d.ts b/components.d.ts
index 4f54c9f..24999a5 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -12,11 +12,15 @@ declare module 'vue' {
     ElCarouselItem: typeof import('element-plus/es')['ElCarouselItem']
     ElCol: typeof import('element-plus/es')['ElCol']
     ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
+    ElEmpty: typeof import('element-plus/es')['ElEmpty']
     ElForm: typeof import('element-plus/es')['ElForm']
     ElFormItem: typeof import('element-plus/es')['ElFormItem']
+    ElIcon: typeof import('element-plus/es')['ElIcon']
     ElImage: typeof import('element-plus/es')['ElImage']
     ElInput: typeof import('element-plus/es')['ElInput']
+    ElPagination: typeof import('element-plus/es')['ElPagination']
     ElRow: typeof import('element-plus/es')['ElRow']
+    ElTag: typeof import('element-plus/es')['ElTag']
     EquipCard: typeof import('./src/components/equipCard.vue')['default']
     EquipDetailTable: typeof import('./src/components/equipDetailTable.vue')['default']
     FooterInfo: typeof import('./src/components/FooterInfo/index.vue')['default']
diff --git a/src/components/Navmenu/index.vue b/src/components/Navmenu/index.vue
index 5d73515..e4f5e0c 100644
--- a/src/components/Navmenu/index.vue
+++ b/src/components/Navmenu/index.vue
@@ -4,11 +4,11 @@
     const navMenuList = [
         { name: '首页', routerName: 'home' },
         { name: '自选直租', routerName: 'equipList' },
-        { name: '寻源比价', routerName: '/home' },
+        { name: '寻源比价', routerName: 'parity' },
         { name: '二手交易', routerName: '/home' },
         { name: '保险业务', routerName: '/home' },
         { name: '检验业务', routerName: '/home' },
-        { name: '企业专区', routerName: '/home' }
+        { name: '企业专区', routerName: 'enterpriseZone' }
     ]
 
     const navMenuClick = (name: any) => {
diff --git a/src/layout/header.vue b/src/layout/header.vue
index 655959a..5b8a652 100644
--- a/src/layout/header.vue
+++ b/src/layout/header.vue
@@ -87,7 +87,7 @@
                     <span v-if="!isShowLogout">
                         <a class="a-border-none" @click="$router.push('/login')">登录</a>
                         <span style="margin: 0 3px">/</span>
-                        <a>注册</a>
+                        <a @click="$router.push('/register')">注册</a>
                     </span>
                     <span v-else>
                         <a @click="handlerLogout">退出登录</a>
diff --git a/src/router/index.ts b/src/router/index.ts
index bf48931..134249e 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -122,6 +122,28 @@ const routes: Array<RouteRecordRaw> = [
                 },
                 component: () => import('views/collect/index.vue')
             },
+            // 寻源比价页面
+            {
+                path: '/parity',
+                name: 'parity',
+                meta: {
+                    title: '寻源比较',
+                    isLogin: true,
+                    AuthFlag: false
+                },
+                component: () => import('views/parity/index.vue')
+            },
+            // 企业专区页面
+            {
+                path: '/enterpriseZone',
+                name: 'enterpriseZone',
+                meta: {
+                    title: '企业专区',
+                    isLogin: true,
+                    AuthFlag: false
+                },
+                component: () => import('views/enterpriseZone/index.vue')
+            },
             // 个人中心
             {
                 path: '/myuser', // 主路由地址
diff --git a/src/views/enterpriseZone/index.vue b/src/views/enterpriseZone/index.vue
new file mode 100644
index 0000000..44d5405
--- /dev/null
+++ b/src/views/enterpriseZone/index.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts"></script>
+
+<template>
+    <div>企业专区---</div>
+</template>
+
+<style></style>
diff --git a/src/views/equip/detail.vue b/src/views/equip/detail.vue
index ebf3bf2..28db392 100644
--- a/src/views/equip/detail.vue
+++ b/src/views/equip/detail.vue
@@ -9,20 +9,26 @@
                 <div class="equipInfo">
                     <div class="left">
                         <div class="title">
-                            <div class="name">{{ pageData.modelName }}{{ pageData.deviceName }}</div>
+                            <div class="name">
+                                {{ pageData.modelName }}{{ pageData.deviceName }}
+                            </div>
                             <div class="tag">
                                 <div class="item otherItem">{{ pageData.maStatusStr }}</div>
-                                <div class="item ">已审核</div>
+                                <div class="item">已审核</div>
                             </div>
                         </div>
                         <div class="viewNnum">浏览{{ pageData.searchNum }}</div>
                         <div class="infoBox">
                             <div class="item" v-for="(v, i) in equipBaseInfoList" :key="i">
                                 <div class="label">{{ v.label }}：</div>
-                                <div class="value">{{
-                                    v.key.split(',').map(key => {
-                                      return pageData[key]
-                                    }).join('')
+                                <div class="value">
+                                    {{
+                                        v.key
+                                            .split(',')
+                                            .map((key) => {
+                                                return pageData[key]
+                                            })
+                                            .join('')
                                     }}
                                 </div>
                             </div>
@@ -35,29 +41,27 @@
                                 <span>{{ pageData.monthLeasePrice }}</span>
                                 /月
                             </div>
-                            <div class="collect"  v-authBtn="()=>collectChange"  >
+                            <div class="collect" v-authBtn="() => collectChange">
                                 <el-icon class="no" v-show="!isCollect">
-                                    <Star/>
+                                    <Star />
                                 </el-icon>
                                 <el-icon class="yes" v-show="isCollect">
-                                    <StarFilled/>
+                                    <StarFilled />
                                 </el-icon>
                                 {{ isCollect ? '装备已收藏' : '收藏装备' }}
                             </div>
                         </div>
                         <div class="options">
                             <div class="item contact" @click="openPhone">联系商家</div>
-                            <div class="item applyFor" v-authBtn="()=>openLease">我要租</div>
+                            <div class="item applyFor" v-authBtn="() => openLease">我要租</div>
                         </div>
                     </div>
                 </div>
                 <div class="businessInfo">
-                    <img class="bgCar" src="@/assets/img/equipDetail/gouwu.png"/>
+                    <img class="bgCar" src="@/assets/img/equipDetail/gouwu.png" />
 
                     <div class="business">
-                        <img
-                                src="@/assets/img/bns-logo.png"
-                                class="avatar"/>
+                        <img src="@/assets/img/bns-logo.png" class="avatar" />
                         <div class="fonts">
                             <div class="name">{{ pageData.companyName }}</div>
                             <div class="other">
@@ -78,9 +82,10 @@
             <div class="list publicContent">
                 <div class="item" v-for="(v, i) in equipDetailKeyList" :key="i">
                     <div class="label">{{ v.label }}：</div>
-                    <div :class="v.fn ? 'fnValue' : 'value'" @click="handelDetailListClick(v.fn,pageData[v.arg])">{{
-                        pageData[v.key]
-                        }}
+                    <div
+                        :class="v.fn ? 'fnValue' : 'value'"
+                        @click="handelDetailListClick(v.fn, pageData[v.arg])">
+                        {{ pageData[v.key] }}
                     </div>
                 </div>
             </div>
@@ -89,7 +94,7 @@
             <div class="publicTitle">装备外观</div>
             <div class="publicLine"></div>
             <div class="urlList publicContent">
-                <img :src="v" v-for="(v, i) in (pageData.pictures || [])" :key="i"/>
+                <img :src="v" v-for="(v, i) in pageData.pictures || []" :key="i" />
             </div>
         </div>
         <div class="recommend">
@@ -99,48 +104,48 @@
                 <div class="change" @click="randomHotList">换一批</div>
             </div>
             <div class="content">
-                <equip-card class="item"
-                            @on-click="goDetail"
-                            v-for="(v, i) in hotList"
-                            :key="i"
-                            :url="v.picUrl"
-                            :name="`${v.modelName}${v.deviceName}`"
-                            :tags="[v.maStatusStr,v.cityStr]"
-                            :company="v.companyName"
-                            :price="v.monthLeasePrice"
-                            timeUnit="月"
-                            :id="v.maId"></equip-card>
+                <equip-card
+                    class="item"
+                    @on-click="goDetail"
+                    v-for="(v, i) in hotList"
+                    :key="i"
+                    :url="v.picUrl"
+                    :name="`${v.modelName}${v.deviceName}`"
+                    :tags="[v.maStatusStr, v.cityStr]"
+                    :company="v.companyName"
+                    :price="v.monthLeasePrice"
+                    timeUnit="月"
+                    :id="v.maId"></equip-card>
             </div>
         </div>
 
         <el-dialog
-                v-model="dialoglease"
-                title="填写租赁信息"
-                lock-scroll
-                class="dialoglease"
-                width="60%"
-        >
+            v-model="dialoglease"
+            title="填写租赁信息"
+            lock-scroll
+            class="dialoglease"
+            width="60%">
             <el-config-provider :locale="zhCn">
                 <el-form
-                        ref="ruleFormRef"
-                        :model="ruleForm"
-                        :rules="rules"
-                        label-width="120px"
-                        class="demo-ruleForm"
-                        status-icon
-                >
-
+                    ref="ruleFormRef"
+                    :model="ruleForm"
+                    :rules="rules"
+                    label-width="120px"
+                    class="demo-ruleForm"
+                    status-icon>
                     <el-row>
                         <el-col :span="15">
                             <el-form-item label="设备进场地址" prop="address">
-                                <el-cascader :props="addressCascader" v-model="ruleForm.address"/>
+                                <el-cascader :props="addressCascader" v-model="ruleForm.address" />
                             </el-form-item>
                         </el-col>
                     </el-row>
                     <el-row>
                         <el-col :span="15">
                             <el-form-item label="详细地址" prop="detailAddress">
-                                <el-input placeholder="请输入地址" v-model="ruleForm.detailAddress"></el-input>
+                                <el-input
+                                    placeholder="请输入地址"
+                                    v-model="ruleForm.detailAddress"></el-input>
                             </el-form-item>
                         </el-col>
                     </el-row>
@@ -148,23 +153,28 @@
                         <el-col :span="15">
                             <el-form-item label="进场时间" prop="entryTime">
                                 <el-date-picker
-                                        v-model="ruleForm.entryTime"
-                                        value-format="YYYY-MM-DD"
-                                        type="date"
-                                        placeholder="请选择"
-                                />
+                                    v-model="ruleForm.entryTime"
+                                    value-format="YYYY-MM-DD"
+                                    type="date"
+                                    placeholder="请选择" />
                             </el-form-item>
                         </el-col>
                     </el-row>
                     <el-row>
                         <el-col :span="15">
                             <el-form-item label="工期时长" prop="duration">
-                                <el-input v-model.number="ruleForm.duration" type="number" placeholder="请输入工期时长">
+                                <el-input
+                                    v-model.number="ruleForm.duration"
+                                    type="number"
+                                    placeholder="请输入工期时长">
                                     <template #append>
-                                        <el-select v-model="ruleForm.durationUnit" placeholder="Select"
-                                                   style="width: 85px" @change="priceChange">
-                                            <el-option label="天" value="0"/>
-                                            <el-option label="月" value="1"/>
+                                        <el-select
+                                            v-model="ruleForm.durationUnit"
+                                            placeholder="Select"
+                                            style="width: 85px"
+                                            @change="priceChange">
+                                            <el-option label="天" value="0" />
+                                            <el-option label="月" value="1" />
                                         </el-select>
                                     </template>
                                 </el-input>
@@ -178,24 +188,16 @@
                                     <el-radio-button :label="1" :disabled="!pageData.isOperator">
                                         是
                                     </el-radio-button>
-                                    <el-radio-button :label="0">
-                                        否
-                                    </el-radio-button>
+                                    <el-radio-button :label="0">否</el-radio-button>
                                 </el-radio-group>
                             </el-form-item>
                         </el-col>
                         <el-col :span="12">
                             <el-form-item label="发票类型" prop="invoiceType">
                                 <el-radio-group v-model="ruleForm.invoiceType">
-                                    <el-radio-button label="">
-                                        不需要
-                                    </el-radio-button>
-                                    <el-radio-button :label="1">
-                                        增值税普票
-                                    </el-radio-button>
-                                    <el-radio-button :label="2">
-                                        增值税专票
-                                    </el-radio-button>
+                                    <el-radio-button label="">不需要</el-radio-button>
+                                    <el-radio-button :label="1">增值税普票</el-radio-button>
+                                    <el-radio-button :label="2">增值税专票</el-radio-button>
                                 </el-radio-group>
                             </el-form-item>
                         </el-col>
@@ -203,808 +205,789 @@
                     <el-row>
                         <el-col :span="15">
                             <el-form-item label="项目说明" prop="projectDescription">
-                                <el-input placeholder="请填写项目说明" rows="5" type="textarea"
-                                          v-model="ruleForm.projectDescription"></el-input>
+                                <el-input
+                                    placeholder="请填写项目说明"
+                                    rows="5"
+                                    type="textarea"
+                                    v-model="ruleForm.projectDescription"></el-input>
                             </el-form-item>
                         </el-col>
                     </el-row>
                 </el-form>
             </el-config-provider>
             <equipDetailTable
-                    :price="`${ruleForm.durationUnit == '1' ? pageData.monthLeasePrice : pageData.dayLeasePrice }`"
-                    :name="`${pageData.modelName}${pageData.deviceName}`"
-                    :company="pageData.companyName"
-                    :url="pageData.picUrl"
-                    :brand="pageData.brand"
-                    :code="pageData.code"
-                    :group="pageData.groupName"
-                    :position="`${pageData.provinceStr}${pageData.cityStr || ''}${pageData.areaStr || ''}`"
-                    :specifications="pageData.specification"
-                    :type="pageData.typeName"
-                    :unit="ruleForm.durationUnit == '1' ? '月' : '天'"
-            ></equipDetailTable>
+                :price="`${
+                    ruleForm.durationUnit == '1' ? pageData.monthLeasePrice : pageData.dayLeasePrice
+                }`"
+                :name="`${pageData.modelName}${pageData.deviceName}`"
+                :company="pageData.companyName"
+                :url="pageData.picUrl"
+                :brand="pageData.brand"
+                :code="pageData.code"
+                :group="pageData.groupName"
+                :position="`${pageData.provinceStr}${pageData.cityStr || ''}${
+                    pageData.areaStr || ''
+                }`"
+                :specifications="pageData.specification"
+                :type="pageData.typeName"
+                :unit="ruleForm.durationUnit == '1' ? '月' : '天'"></equipDetailTable>
             <div class="countPrice">
-                合计总价：<span>{{ priceChange }}元</span>
+                合计总价：
+                <span>{{ priceChange }}元</span>
             </div>
             <template #footer>
-                  <span class="dialog-footer">
-                    <el-button type="primary" @click="submit(ruleFormRef)">
-                      提交
-                    </el-button>
-                  </span>
+                <span class="dialog-footer">
+                    <el-button type="primary" @click="submit(ruleFormRef)">提交</el-button>
+                </span>
             </template>
         </el-dialog>
 
-        <el-dialog
-                v-model="dialogPhone"
-                title="服务电话"
-                width="30%"
-        >
-            <div style="font-size: 16px;font-weight: 600;">
+        <el-dialog v-model="dialogPhone" title="服务电话" width="30%">
+            <div style="font-size: 16px; font-weight: 600">
                 {{ pageData.authPhone }}
             </div>
             <template #footer>
-                  <span class="dialog-footer">
-                    <el-button type="primary" @click="openPhone">
-                        确认
-                    </el-button>
-                  </span>
+                <span class="dialog-footer">
+                    <el-button type="primary" @click="openPhone">确认</el-button>
+                </span>
             </template>
         </el-dialog>
     </div>
 </template>
 <script lang="ts" setup>
-import ShowImg from './comoonents/showImg.vue'
-import {computed, reactive, ref} from 'vue'
-import EquipCard from 'components/equipCard.vue'
-import {getDetail, getHotList, equipCollect, apiSubmitLease, apiGetAddressList} from "@/http/api/equip"
-import {useRoute, useRouter} from "vue-router";
-import Navmenu from '@/components/Navmenu/index.vue'
-import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
-import equipDetailTable from '@/components/equipDetailTable.vue'
-import {ElMessage} from "element-plus";
+    import ShowImg from './comoonents/showImg.vue'
+    import { computed, reactive, ref } from 'vue'
+    import EquipCard from 'components/equipCard.vue'
+    import {
+        getDetail,
+        getHotList,
+        equipCollect,
+        apiSubmitLease,
+        apiGetAddressList
+    } from '@/http/api/equip'
+    import { useRoute, useRouter } from 'vue-router'
+    import Navmenu from '@/components/Navmenu/index.vue'
+    import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
+    import equipDetailTable from '@/components/equipDetailTable.vue'
+    import { ElMessage } from 'element-plus'
 
-import {mainStore} from '@/store/main'
+    import { mainStore } from '@/store/main'
 
-const router = useRouter()
-const route = useRoute()
+    const router = useRouter()
+    const route = useRoute()
 
-const ruleFormRef = ref()
+    const ruleFormRef = ref()
 
-const store = mainStore()
+    const store = mainStore()
 
-const pageParams = route.params
-//设备简略基本信息
-const equipBaseInfoList = reactive([
-    {
-        label: '设备规格',
-        key: 'specification'
-    },
-    {
-        label: '设备位置',
-        key: 'provinceStr,cityStr,areaStr'
-    },
-    {
-        label: '配备机手',
-        key: 'isOperatorCn'
-    },
-    {
-        label: '发布时间',
-        key: 'createTime'
-    },
-    {
-        label: '更新时间',
-        key: 'updateTime'
+    const pageParams = route.params
+    //设备简略基本信息
+    const equipBaseInfoList = reactive([
+        {
+            label: '设备规格',
+            key: 'specification'
+        },
+        {
+            label: '设备位置',
+            key: 'provinceStr,cityStr,areaStr'
+        },
+        {
+            label: '配备机手',
+            key: 'isOperatorCn'
+        },
+        {
+            label: '发布时间',
+            key: 'createTime'
+        },
+        {
+            label: '更新时间',
+            key: 'updateTime'
+        }
+    ])
+    //商家标签信息
+    const businessList = reactive([
+        {
+            label: '入驻时间',
+            key: 'companyCreateTime',
+            unit: ''
+        },
+        {
+            label: '上架数量',
+            key: 'companyUpNum',
+            unit: '台'
+        }
+    ])
+
+    //装备详情数据map
+    const equipDetailKeyList = reactive([
+        {
+            label: '装备编号',
+            key: 'code',
+            fn: '',
+            arg: ''
+        },
+        {
+            label: '装备类别',
+            key: 'typeName',
+            fn: '',
+            arg: ''
+        },
+        {
+            label: '装备组别',
+            key: 'groupName',
+            fn: '',
+            arg: ''
+        },
+        {
+            label: '装备名称',
+            key: 'deviceName',
+            fn: '',
+            arg: ''
+        },
+        {
+            label: '规格',
+            key: 'specification',
+            fn: '',
+            arg: ''
+        },
+        {
+            label: '品牌',
+            key: 'brand',
+            fn: '',
+            arg: ''
+        },
+        {
+            label: '装备型号',
+            key: 'modelName',
+            fn: '',
+            arg: ''
+        },
+        {
+            label: '序列号码',
+            key: 'serialNumber',
+            fn: '',
+            arg: ''
+        },
+        {
+            label: '出场时间',
+            key: 'productionDate',
+            fn: '',
+            arg: ''
+        },
+        {
+            label: '工作时长',
+            key: 'workingHours',
+            fn: '',
+            arg: ''
+        },
+        {
+            label: '检验信息',
+            key: 'isExaminationPdf',
+            fn: 'openPdf',
+            arg: 'examinationPdf'
+        },
+        {
+            label: '保险信息',
+            key: 'isInsurancePdf',
+            fn: 'openPdf',
+            arg: 'insurancePdf'
+        }
+    ])
+
+    //
+    const dialogPhone = ref(false)
+
+    //装备详情数据
+    const pageData = ref({})
+
+    //我要租  弹窗
+    const dialoglease = ref(false)
+
+    //装备收藏状态
+    const isCollect = ref(false)
+
+    //推荐列表
+    const hotList = ref([])
+    // 展示的推荐列表
+    const showHotList = ref([])
+
+    const checkDuration = (rule, value, callback) => {
+        if ((value == '' || value == null) && value !== 0) {
+            return callback(new Error('请输入工期时长'))
+        } else if (value <= 0) {
+            return callback(new Error('工期时长需大于0'))
+        } else {
+            return callback()
+        }
     }
-])
-//商家标签信息
-const businessList = reactive([
-    {
-        label: '入驻时间',
-        key: 'companyCreateTime',
-        unit: ''
-    },
-    {
-        label: '上架数量',
-        key: 'companyUpNum',
-        unit: '台'
+
+    //我要租 表单数据
+    const ruleForm = ref({
+        address: [], //进场地址
+        detailAddress: '', //详细地址
+        entryTime: '', //进场时间
+        duration: null, //工期时长
+        durationUnit: '0', //工期时长单位 0 —> 天  1 -> 月
+        machinist: 0, //是否需要机手
+        invoiceType: '', //发票类型
+        projectDescription: '' //项目说明
+    })
+    const rules = reactive({
+        address: [{ required: true, message: '请输入进场地址', trigger: 'blur' }],
+        detailAddress: [{ required: true, message: '请输入详细地址', trigger: 'blur' }],
+        entryTime: [{ required: true, message: '请选择进场时间', trigger: 'blur' }],
+        duration: [{ validator: checkDuration, trigger: 'blur' }],
+        machinist: [{ required: true, message: '请输入进场地址', trigger: 'blur' }],
+        invoiceType: [],
+        projectDescription: [{ required: true, message: '请输入项目说明', trigger: 'blur' }]
+    })
+
+    //打开我要租表单
+    const openLease = () => {
+        dialoglease.value = true
     }
-])
-
-//装备详情数据map
-const equipDetailKeyList = reactive([
-    {
-        label: '装备编号',
-        key: 'code',
-        fn: '',
-        arg: ''
-    },
-    {
-        label: '装备类别',
-        key: 'typeName',
-        fn: '',
-        arg: ''
-    },
-    {
-        label: '装备组别',
-        key: 'groupName',
-        fn: '',
-        arg: ''
-    },
-    {
-        label: '装备名称',
-        key: 'deviceName',
-        fn: '',
-        arg: ''
-    },
-    {
-        label: '规格',
-        key: 'specification',
-        fn: '',
-        arg: ''
-    },
-    {
-        label: '品牌',
-        key: 'brand',
-        fn: '',
-        arg: ''
-    },
-    {
-        label: '装备型号',
-        key: 'modelName',
-        fn: '',
-        arg: ''
-    },
-    {
-        label: '序列号码',
-        key: 'serialNumber',
-        fn: '',
-        arg: ''
-    },
-    {
-        label: '出场时间',
-        key: 'productionDate',
-        fn: '',
-        arg: ''
-    },
-    {
-        label: '工作时长',
-        key: 'workingHours',
-        fn: '',
-        arg: ''
-    },
-    {
-        label: '检验信息',
-        key: 'isExaminationPdf',
-        fn: 'openPdf',
-        arg: 'examinationPdf'
-    },
-    {
-        label: '保险信息',
-        key: 'isInsurancePdf',
-        fn: 'openPdf',
-        arg: 'insurancePdf'
+    //切换收藏状态
+    const collectChange = async () => {
+        isCollect.value = !isCollect.value
+        const params = {
+            maId: pageData.value.maId,
+            isCollect: isCollect.value
+        }
+        const res = await equipCollect(params)
+        if (res.code == '200') {
+            ElMessage({
+                type: 'success',
+                duration: 1000,
+                message: `装备${isCollect.value ? '收藏' : '取消收藏'}成功`
+            })
+        }
     }
-])
 
-//
-const dialogPhone = ref(false)
+    //计算具体价格
+    const priceChange = computed(() => {
+        //总价
+        let count = 0
+        //单价
+        let unitPrice = 0
+        // 额外机手价格
+        let jsPrice = 0
+        // 时长
+        let duration = 0
 
+        if (ruleForm.value.durationUnit == '0') {
+            unitPrice = Number(pageData.value.dayLeasePrice)
+            jsPrice = Number(pageData.value.jsDayPrice)
+        } else {
+            unitPrice = Number(pageData.value.monthLeasePrice)
+            jsPrice = Number(pageData.value.jsMonthPrice)
+        }
+        if (!ruleForm.value.machinist) {
+            jsPrice = 0
+        }
 
-//装备详情数据
-const pageData = ref({})
+        duration = Number(ruleForm.value.duration)
 
-//我要租  弹窗
-const dialoglease = ref(false)
+        count = unitPrice * duration + jsPrice * duration
 
-//装备收藏状态
-const isCollect = ref(false)
+        return Math.round(count * 100) / 100 || 0
+    })
 
-//推荐列表
-const hotList = ref([])
-// 展示的推荐列表
-const showHotList = ref([])
-
-const checkDuration = (rule, value, callback) => {
-    if ((value == '' || value == null) && value !== 0) {
-        return callback(new Error('请输入工期时长'))
-    } else if (value <= 0) {
-        return callback(new Error('工期时长需大于0'))
-    } else {
-        return callback()
+    //打开商家电话弹窗
+    const openPhone = () => {
+        dialogPhone.value = !dialogPhone.value
     }
-}
 
-//我要租 表单数据
-const ruleForm = ref({
-    address: [],//进场地址
-    detailAddress: '',//详细地址
-    entryTime: '',//进场时间
-    duration: null,//工期时长
-    durationUnit: '0',//工期时长单位 0 —> 天  1 -> 月
-    machinist: 0,//是否需要机手
-    invoiceType: '',//发票类型
-    projectDescription: ''//项目说明
-})
-const rules = reactive({
-    address: [
-        {required: true, message: '请输入进场地址', trigger: 'blur'}
-    ],
-    detailAddress: [
-        {required: true, message: '请输入详细地址', trigger: 'blur'}
-    ],
-    entryTime: [
-        {required: true, message: '请选择进场时间', trigger: 'blur'},
-    ],
-    duration: [
-        {validator: checkDuration, trigger: 'blur'}
-
-    ],
-    machinist: [
-        {required: true, message: '请输入进场地址', trigger: 'blur'}
-    ],
-    invoiceType: [
-
-    ],
-    projectDescription: [
-        {required: true, message: '请输入项目说明', trigger: 'blur'}
-    ],
-})
-
-
-//打开我要租表单
-const openLease = () => {
-    dialoglease.value = true
-}
-//切换收藏状态
-const collectChange = async () => {
-    isCollect.value = !isCollect.value
-    const params = {
-        maId: pageData.value.maId,
-        isCollect: isCollect.value
+    // 打开新标签页查看pdf
+    const openPdf = (name) => {
+        if (name) {
+            window.open(name)
+        }
     }
-    const res = await equipCollect(params)
-    if (res.code == '200') {
-        ElMessage({
-            type: 'success',
-            duration: 1000,
-            message: `装备${isCollect.value ? '收藏' : '取消收藏'}成功`
+    const that = {
+        openPdf
+    }
+
+    const addressCascader = {
+        lazy: true,
+        label: 'name',
+        value: 'code',
+        lazyLoad: async (node, resolve) => {
+            const { level, data } = node
+            let nodes = []
+            if (level == 0) {
+                const arr = await getAddressData()
+                nodes = arr
+            } else if (level == 1) {
+                const arr = await getAddressData(data.code)
+                nodes = arr
+            } else if (level == 2) {
+                const arr = await getAddressData(data.code)
+                nodes = arr.map((item) => ({
+                    ...item,
+                    leaf: true
+                }))
+            }
+            resolve(nodes)
+        }
+    }
+
+    //获取地址列表
+    const getAddressData = async (code = '') => {
+        let params = {}
+        if (code) {
+            params = { code }
+        }
+
+        const res = await apiGetAddressList(params)
+
+        return res.data || []
+    }
+
+    const handelDetailListClick = (fnName, arg) => {
+        if (fnName) {
+            that[fnName](arg)
+        }
+    }
+
+    //获取页面数据
+    const getData = async () => {
+        const res = await getDetail(pageParams.id)
+        res.data.isOperatorCn = res.data.isOperator ? '是' : '否'
+        res.data.isInsurancePdf = res.data.insurancePdf ? '点击查看' : '暂无'
+        res.data.isExaminationPdf = res.data.examinationPdf ? '点击查看' : '暂无'
+
+        isCollect.value = res.data.collectId ? true : false
+        pageData.value = res.data
+    }
+
+    //获取推荐列表
+    const gethotList = async () => {
+        const params = {
+            pageNum: 1,
+            pageSize: 10
+        }
+        const res = await getHotList(params)
+        hotList.value = res.rows
+        randomHotList()
+    }
+
+    const randomHotList = () => {
+        showHotList.value = random().map((key) => {
+            return hotList.value[key]
         })
     }
-}
 
-//计算具体价格
-const priceChange = computed(() => {
-    //总价
-    let count = 0
-    //单价
-    let unitPrice = 0
-    // 额外机手价格
-    let jsPrice = 0
-    // 时长
-    let duration = 0
-
-    if (ruleForm.value.durationUnit == '0') {
-        unitPrice = Number(pageData.value.dayLeasePrice)
-        jsPrice = Number(pageData.value.jsDayPrice)
-    } else {
-        unitPrice = Number(pageData.value.monthLeasePrice)
-        jsPrice = Number(pageData.value.jsMonthPrice)
-    }
-    if (!ruleForm.value.machinist) {
-        jsPrice = 0
-    }
-
-    duration = Number(ruleForm.value.duration)
-
-    count = unitPrice * duration + jsPrice * duration
-
-    return Math.round(count * 100) / 100 || 0
-})
-
-//打开商家电话弹窗
-const openPhone = () => {
-    dialogPhone.value = !dialogPhone.value
-
-}
-
-// 打开新标签页查看pdf
-const openPdf = (name) => {
-    if (name) {
-        window.open(name)
-    }
-}
-const that = {
-    openPdf
-}
-
-
-const addressCascader = {
-    lazy: true,
-    label: 'name',
-    value: 'code',
-    lazyLoad: async (node, resolve) => {
-        const {level, data} = node
-        let nodes = []
-        if (level == 0) {
-            const arr = await getAddressData()
-            nodes = arr
-        } else if (level == 1) {
-            const arr = await getAddressData(data.code)
-            nodes = arr
-        } else if (level == 2) {
-            const arr = await getAddressData(data.code)
-            nodes = arr.map((item) => ({
-                ...item,
-                leaf: true
-            }))
+    const random = () => {
+        let numbers = new Set()
+        while (numbers.size < 3) {
+            numbers.add(Math.floor(Math.random() * 10))
         }
-        resolve(nodes)
-    }
-}
-
-
-//获取地址列表
-const getAddressData = async (code = '') => {
-    let params = {}
-    if (code) {
-        params = {code}
+        return Array.from(numbers)
     }
 
-    const res = await apiGetAddressList(params)
-
-    return res.data || []
-}
-
-const handelDetailListClick = (fnName, arg) => {
-    if (fnName) {
-        that[fnName](arg)
+    //获取详情数据
+    const goDetail = (val) => {
+        router.push({
+            path: `/equipDetail/${val.id}`
+        })
     }
-}
-
-//获取页面数据
-const getData = async () => {
-    const res = await getDetail(pageParams.id)
-    res.data.isOperatorCn = res.data.isOperator ? '是' : '否'
-    res.data.isInsurancePdf = res.data.insurancePdf ? '点击查看' : '暂无'
-    res.data.isExaminationPdf = res.data.examinationPdf ? '点击查看' : '暂无'
-
-    isCollect.value = res.data.collectId ? true : false
-    pageData.value = res.data
-}
-
-//获取推荐列表
-const gethotList = async () => {
-    const params = {
-        pageNum: 1,
-        pageSize: 10
-    }
-    const res = await getHotList(params)
-    hotList.value = res.rows
-    randomHotList()
-}
-
-const randomHotList = () => {
-    showHotList.value = random().map(key => {
-        return hotList.value[key]
-    })
-}
-
-const random = () => {
-    let numbers = new Set();
-    while (numbers.size < 3) {
-        numbers.add(Math.floor(Math.random() * 10));
-    }
-    return Array.from(numbers);
-}
-
-//获取详情数据
-const goDetail = (val) => {
-    router.push({
-        path: `/equipDetail/${val.id}`
-    })
-}
-
-//提交申请
-const submit = async (Ref) => {
-    if(!Ref){
-        return
-    }
-    await Ref.validate( async(valid, fields) => {
-        if(valid){
-            const params = {
-                provinceId: ruleForm.value.address[0],
-                cityId: ruleForm.value.address[1],
-                areaId: ruleForm.value.address[2],
-                address: ruleForm.value.detailAddress,
-                realStartTime: ruleForm.value.entryTime,
-                duration: ruleForm.value.duration,
-                isMachinist: ruleForm.value.machinist,
-                invoiceType: ruleForm.value.invoiceType,
-                description: ruleForm.value.projectDescription,
-                durationType: ruleForm.value.durationUnit,
-                cost: priceChange.value,
-                maId: pageData.value.maId,
-                orderCompany:store.userInfo.companyId
-            }
-
-            const res = await apiSubmitLease(params)
-
-            if (res.code == '200') {
-                ElMessage({
-                    message: '提交租赁申请成功',
-                    type: 'success',
-                    duration: 1500
-                })
-            }
-            dialoglease.value = false
-        }else {
 
+    //提交申请
+    const submit = async (Ref) => {
+        if (!Ref) {
+            return
         }
-    })
+        await Ref.validate(async (valid, fields) => {
+            if (valid) {
+                const params = {
+                    provinceId: ruleForm.value.address[0],
+                    cityId: ruleForm.value.address[1],
+                    areaId: ruleForm.value.address[2],
+                    address: ruleForm.value.detailAddress,
+                    realStartTime: ruleForm.value.entryTime,
+                    duration: ruleForm.value.duration,
+                    isMachinist: ruleForm.value.machinist,
+                    invoiceType: ruleForm.value.invoiceType,
+                    description: ruleForm.value.projectDescription,
+                    durationType: ruleForm.value.durationUnit,
+                    cost: priceChange.value,
+                    maId: pageData.value.maId,
+                    orderCompany: store.userInfo.companyId
+                }
 
+                const res = await apiSubmitLease(params)
 
-}
+                if (res.code == '200') {
+                    ElMessage({
+                        message: '提交租赁申请成功',
+                        type: 'success',
+                        duration: 1500
+                    })
+                }
+                dialoglease.value = false
+            } else {
+            }
+        })
+    }
 
-const init = async () => {
-    await gethotList()
-    await getData()
-}
-init()
+    const init = async () => {
+        await gethotList()
+        await getData()
+    }
+    init()
 </script>
 <style scoped lang="scss">
-:deep(.dialoglease) {
-  margin: 10px auto 0 !important;
-  min-width: 855px !important;
-}
-
-:deep(.el-form-item) {
-  display: flex;
-  width: 100%;
-
-  .el-form-item__content {
-    flex: 1;
-  }
-}
-
-.countPrice {
-  padding: 10px;
-  text-align: right;
-
-  span {
-    color: red;
-    font-weight: 600;
-  }
-}
-
-.equipDetail {
-  user-select: none;
-  margin-top: 20px;
-
-  .top {
-    display: flex;
-    margin-bottom: 50px;
-
-    .showImg {
-      width: 38%;
-      border-radius: 15px;
-      overflow: hidden;
-      margin-right: 30px;
+    :deep(.dialoglease) {
+        margin: 10px auto 0 !important;
+        min-width: 855px !important;
     }
 
-    .baseInfo {
-      flex: 1;
-      display: flex;
-      flex-direction: column;
-      justify-content: space-between;
-      overflow: hidden;
-
-      .equipInfo {
+    :deep(.el-form-item) {
         display: flex;
+        width: 100%;
 
-        .left {
-          margin-right: 5px;
-          width: 62%;
+        .el-form-item__content {
+            flex: 1;
+        }
+    }
 
-          .title {
+    .countPrice {
+        padding: 10px;
+        text-align: right;
 
-            .name {
-              font-size: 24px;
-              font-family: PingFangSC, PingFang SC;
-              font-weight: 600;
-              color: #000000;
-              overflow: hidden;
-              text-overflow: ellipsis;
-              white-space: nowrap;
+        span {
+            color: red;
+            font-weight: 600;
+        }
+    }
+
+    .equipDetail {
+        user-select: none;
+        margin-top: 20px;
+
+        .top {
+            display: flex;
+            margin-bottom: 50px;
+
+            .showImg {
+                width: 38%;
+                border-radius: 15px;
+                overflow: hidden;
+                margin-right: 30px;
             }
 
-            .tag {
-              display: flex;
-              align-items: center;
-              margin-top: 10px;
+            .baseInfo {
+                flex: 1;
+                display: flex;
+                flex-direction: column;
+                justify-content: space-between;
+                overflow: hidden;
 
-              .item {
-                font-size: 13px;
-                font-family: PingFangSC, PingFang SC;
-                font-weight: 400;
-                color: #005af2;
-                margin-right: 15px;
-                padding: 2px 10px;
-                border: 1px solid #005af2;
-                border-radius: 4px;
-              }
+                .equipInfo {
+                    display: flex;
 
-              .otherItem {
-                border-color: #ff6734;
-                color: #ff6734;
-              }
+                    .left {
+                        margin-right: 5px;
+                        width: 62%;
+
+                        .title {
+                            .name {
+                                font-size: 24px;
+                                font-family: PingFangSC, PingFang SC;
+                                font-weight: 600;
+                                color: #000000;
+                                overflow: hidden;
+                                text-overflow: ellipsis;
+                                white-space: nowrap;
+                            }
+
+                            .tag {
+                                display: flex;
+                                align-items: center;
+                                margin-top: 10px;
+
+                                .item {
+                                    font-size: 13px;
+                                    font-family: PingFangSC, PingFang SC;
+                                    font-weight: 400;
+                                    color: #005af2;
+                                    margin-right: 15px;
+                                    padding: 2px 10px;
+                                    border: 1px solid #005af2;
+                                    border-radius: 4px;
+                                }
+
+                                .otherItem {
+                                    border-color: #ff6734;
+                                    color: #ff6734;
+                                }
+                            }
+                        }
+
+                        .viewNnum {
+                            font-size: 13px;
+                            font-family: PingFangSC, PingFang SC;
+                            font-weight: 500;
+                            color: #bcbcbc;
+                            margin-top: 10px;
+                        }
+
+                        .infoBox {
+                            margin-top: 20px;
+
+                            .item {
+                                display: flex;
+                                align-items: center;
+                                margin-bottom: 18px;
+
+                                .label {
+                                    font-size: 15px;
+                                    font-family: PingFangSC, PingFang SC;
+                                    font-weight: 600;
+                                    color: #8e8e8e;
+                                    margin-right: 15px;
+                                }
+
+                                .value {
+                                    font-size: 14px;
+                                    font-family: PingFangSC, PingFang SC;
+                                    color: #333333;
+                                }
+                            }
+                        }
+                    }
+
+                    .right {
+                        flex: 1;
+                        display: flex;
+                        flex-direction: column;
+                        justify-content: space-between;
+
+                        .collect {
+                            user-select: none;
+                            margin-top: 10px;
+                            display: flex;
+                            align-items: center;
+                            justify-content: flex-end;
+                            font-size: 14px;
+                            color: #acacac;
+                            cursor: pointer;
+
+                            .no {
+                                font-size: 16px;
+                            }
+
+                            .yes {
+                                font-size: 20px;
+                                color: #1b7eff;
+                            }
+                        }
+
+                        .price {
+                            font-size: 15px;
+                            font-weight: 500;
+                            font-family: PingFangSC, PingFang SC;
+                            color: #ff4800;
+                            text-align: right;
+
+                            span {
+                                font-size: 30px;
+                                font-weight: 600;
+                            }
+                        }
+
+                        .options {
+                            display: flex;
+                            justify-content: flex-end;
+
+                            .item {
+                                cursor: pointer;
+                                width: 110px;
+                                height: 40px;
+                                line-height: 40px;
+                                border-radius: 4px;
+                                font-size: 18px;
+                                font-weight: 600;
+                                text-align: center;
+                            }
+
+                            .contact {
+                                color: #ffffff;
+                                background: #3cabff;
+                                margin-right: 20px;
+                            }
+
+                            .applyFor {
+                                border: 1px solid #3cabff;
+                                color: #3cabff;
+                                box-sizing: border-box;
+                                line-height: 38px;
+                            }
+                        }
+                    }
+                }
+
+                .businessInfo {
+                    width: 100%;
+                    height: 147px;
+                    background: #f7f9fa;
+                    border-radius: 15px;
+                    position: relative;
+                    box-sizing: border-box;
+                    padding: 25px 15px;
+
+                    .bgCar {
+                        position: absolute;
+                        top: 0;
+                        right: 0;
+                        height: 100%;
+                        z-index: 0;
+                    }
+
+                    .business {
+                        display: flex;
+                        align-items: center;
+
+                        .avatar {
+                            width: 65px;
+                            height: 65px;
+                            border-radius: 100%;
+                            margin-right: 10px;
+                        }
+
+                        .fonts {
+                            .name {
+                                font-size: 20px;
+                                font-family: PingFangSC, PingFang SC;
+                                font-weight: 600;
+                                color: #333333;
+                                margin-bottom: 12px;
+                            }
+
+                            .other {
+                                display: flex;
+
+                                .item {
+                                    font-size: 14px;
+                                    font-family: PingFangSC, PingFang SC;
+                                    font-weight: 400;
+                                    color: #333333;
+                                    display: flex;
+                                    margin-right: 15px;
+
+                                    .label {
+                                    }
+
+                                    .value {
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
             }
-          }
-
-          .viewNnum {
-            font-size: 13px;
-            font-family: PingFangSC, PingFang SC;
-            font-weight: 500;
-            color: #bcbcbc;
-            margin-top: 10px;
-          }
-
-          .infoBox {
-            margin-top: 20px;
-
-            .item {
-              display: flex;
-              align-items: center;
-              margin-bottom: 18px;
-
-              .label {
-                font-size: 15px;
-                font-family: PingFangSC, PingFang SC;
-                font-weight: 600;
-                color: #8e8e8e;
-                margin-right: 15px;
-              }
-
-              .value {
-                font-size: 14px;
-                font-family: PingFangSC, PingFang SC;
-                color: #333333;
-              }
-            }
-          }
         }
 
-        .right {
-          flex: 1;
-          display: flex;
-          flex-direction: column;
-          justify-content: space-between;
+        .publicTitle {
+            font-size: 20px;
+            font-family: PingFangSC, PingFang SC;
+            font-weight: 600;
+            color: #333333;
 
-          .collect {
-            user-select: none;
-            margin-top: 10px;
             display: flex;
             align-items: center;
-            justify-content: flex-end;
-            font-size: 14px;
-            color: #acacac;
-            cursor: pointer;
-
-            .no {
-              font-size: 16px;
-            }
-
-            .yes {
-              font-size: 20px;
-              color: #1b7eff;
-            }
-          }
-
-          .price {
-            font-size: 15px;
-            font-weight: 500;
-            font-family: PingFangSC, PingFang SC;
-            color: #ff4800;
-            text-align: right;
-
-            span {
-              font-size: 30px;
-              font-weight: 600;
-            }
-          }
-
-          .options {
-            display: flex;
-            justify-content: flex-end;
-
-            .item {
-              cursor: pointer;
-              width: 110px;
-              height: 40px;
-              line-height: 40px;
-              border-radius: 4px;
-              font-size: 18px;
-              font-weight: 600;
-              text-align: center;
-            }
-
-            .contact {
-              color: #ffffff;
-              background: #3cabff;
-              margin-right: 20px;
-            }
-
-            .applyFor {
-              border: 1px solid #3cabff;
-              color: #3cabff;
-              box-sizing: border-box;
-              line-height: 38px;
-            }
-          }
-        }
-      }
-
-      .businessInfo {
-        width: 100%;
-        height: 147px;
-        background: #f7f9fa;
-        border-radius: 15px;
-        position: relative;
-        box-sizing: border-box;
-        padding: 25px 15px;
-
-        .bgCar {
-          position: absolute;
-          top: 0;
-          right: 0;
-          height: 100%;
-          z-index: 0;
+            justify-content: space-between;
         }
 
-        .business {
-          display: flex;
-          align-items: center;
+        .publicLine {
+            width: 100%;
+            height: 12px;
+            border-bottom: 1px solid #e0e0e0;
+            position: relative;
 
-          .avatar {
-            width: 65px;
-            height: 65px;
-            border-radius: 100%;
-            margin-right: 10px;
-          }
-
-          .fonts {
-            .name {
-              font-size: 20px;
-              font-family: PingFangSC, PingFang SC;
-              font-weight: 600;
-              color: #333333;
-              margin-bottom: 12px;
+            &:before {
+                content: '';
+                height: 3px;
+                width: 40px;
+                background: #2282ff;
+                border-radius: 2px;
+                position: absolute;
+                bottom: -1px;
+                left: 20px;
             }
+        }
 
-            .other {
-              display: flex;
+        .publicContent {
+            box-sizing: border-box;
+            padding: 40px 70px 10px;
+        }
 
-              .item {
+        .detail {
+            .list {
+                display: flex;
+                flex-wrap: wrap;
+
+                .item {
+                    cursor: pointer;
+                    width: calc(100% / 3);
+                    font-size: 16px;
+                    font-family: PingFangSC, PingFang SC;
+                    font-weight: 600;
+                    display: flex;
+                    margin-bottom: 35px;
+
+                    .label {
+                        color: #8e8e8e;
+                        width: 100px;
+                    }
+
+                    .value {
+                        color: #333333;
+                        flex: 1;
+                        word-break: break-all;
+                        font-family: 'fangsong';
+                    }
+
+                    .fnValue {
+                        color: #0087cd;
+                        font-family: 'fangsong';
+                    }
+                }
+            }
+        }
+
+        .appearance {
+            margin-bottom: 20px;
+
+            .urlList {
+                img {
+                    width: 100%;
+                }
+            }
+        }
+
+        .recommend {
+            .change {
                 font-size: 14px;
                 font-family: PingFangSC, PingFang SC;
-                font-weight: 400;
-                color: #333333;
-                display: flex;
-                margin-right: 15px;
-
-                .label {
-                }
-
-                .value {
-                }
-              }
+                font-weight: 500;
+                color: #9d9d9d;
+                cursor: pointer;
+            }
+
+            .content {
+                margin-top: 20px;
+                width: 100%;
+                display: flex;
+
+                .item {
+                    width: calc((100% - 40px) / 3);
+
+                    &:nth-child(3n - 1) {
+                        margin: 0 20px;
+                    }
+                }
             }
-          }
         }
-      }
     }
-  }
-
-  .publicTitle {
-    font-size: 20px;
-    font-family: PingFangSC, PingFang SC;
-    font-weight: 600;
-    color: #333333;
-
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-  }
-
-  .publicLine {
-    width: 100%;
-    height: 12px;
-    border-bottom: 1px solid #e0e0e0;
-    position: relative;
-
-    &:before {
-      content: '';
-      height: 3px;
-      width: 40px;
-      background: #2282ff;
-      border-radius: 2px;
-      position: absolute;
-      bottom: -1px;
-      left: 20px;
-    }
-  }
-
-  .publicContent {
-    box-sizing: border-box;
-    padding: 40px 70px 10px;
-  }
-
-  .detail {
-    .list {
-      display: flex;
-      flex-wrap: wrap;
-
-      .item {
-        cursor: pointer;
-        width: calc(100% / 3);
-        font-size: 16px;
-        font-family: PingFangSC, PingFang SC;
-        font-weight: 600;
-        display: flex;
-        margin-bottom: 35px;
-
-        .label {
-          color: #8e8e8e;
-          width: 100px;
-        }
-
-        .value {
-          color: #333333;
-          flex: 1;
-          word-break: break-all;
-          font-family: 'fangsong';
-        }
-
-        .fnValue {
-          color: #0087cd;
-          font-family: 'fangsong';
-        }
-      }
-    }
-  }
-
-  .appearance {
-    margin-bottom: 20px;
-
-    .urlList {
-      img {
-        width: 100%;
-      }
-    }
-  }
-
-  .recommend {
-    .change {
-      font-size: 14px;
-      font-family: PingFangSC, PingFang SC;
-      font-weight: 500;
-      color: #9d9d9d;
-      cursor: pointer;
-    }
-
-    .content {
-      margin-top: 20px;
-      width: 100%;
-      display: flex;
-
-      .item {
-        width: calc((100% - 40px) / 3);
-
-        &:nth-child(3n - 1) {
-          margin: 0 20px;
-        }
-      }
-    }
-  }
-}
 </style>
diff --git a/src/views/parity/index.vue b/src/views/parity/index.vue
new file mode 100644
index 0000000..3189f1d
--- /dev/null
+++ b/src/views/parity/index.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts"></script>
+
+<template>
+    <div>寻源比价---</div>
+</template>
+
+<style></style>