change
This commit is contained in:
wlikett
parent
bd0290dcf8
commit
1dc9468dbf
|
|
@ -1,5 +1,10 @@
|
|||
import { post,get } from '../index'
|
||||
|
||||
export const getList = () => {
|
||||
return get('/dev/list',{})
|
||||
// 获取装备列表
|
||||
export const getList = (params = {}) => {
|
||||
return post('/dev/list',params)
|
||||
}
|
||||
|
||||
export const getDetail = (id = '') => {
|
||||
return get(`/dev/${id}`)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,11 +3,14 @@
|
|||
import axios from 'axios'
|
||||
import NProgress from 'nprogress'
|
||||
import { useStore } from 'store/main'
|
||||
import {ElMessage} from "element-plus";
|
||||
import router from "@/router"
|
||||
const store = useStore()
|
||||
// const CancelToken = axios.CancelToken
|
||||
// const source = CancelToken.source()
|
||||
const baseUrl = import.meta.env.VITE_API_URL
|
||||
// const mode = import.meta.env.VITE_BUILD_MODE
|
||||
|
||||
const service = axios.create({
|
||||
baseURL: baseUrl,
|
||||
timeout: 60000
|
||||
|
|
@ -15,7 +18,7 @@ const service = axios.create({
|
|||
|
||||
service.interceptors.request.use(
|
||||
(config) => {
|
||||
config.headers['Authorization'] = "eyJhbGciOiJIUzUxMiJ9.eyJ1c2VyX2lkIjoxLCJ1c2VyX2tleSI6Ijc5MjRkNDc1LTRjMmUtNGViYy05ZDU0LTA2NzNmNWU0MDhiMyIsInVzZXJuYW1lIjoiYWRtaW4ifQ.M3H9jHnfFAKJ3szdiDb79hIHfiS8AWvaI51mP65l01Q2G0jcLSTvjlub8FykYV3A27If7V6GBRo83u8spRDquw"
|
||||
config.headers['Authorization'] = store.token
|
||||
return config
|
||||
},
|
||||
(error) => {
|
||||
|
|
@ -25,7 +28,15 @@ service.interceptors.request.use(
|
|||
// 响应拦截
|
||||
service.interceptors.response.use(
|
||||
(res) => {
|
||||
return res.data
|
||||
const { data } = res
|
||||
if(data.code == '200'){
|
||||
return data
|
||||
}else if(data.code == '403'){
|
||||
ElMessage.error('请重新登录')
|
||||
router.push('/login')
|
||||
}else{
|
||||
return data
|
||||
}
|
||||
},
|
||||
(error) => {
|
||||
|
||||
|
|
|
|||
|
|
@ -208,12 +208,11 @@ const router = createRouter({
|
|||
router.beforeEach((to, from, next) => {
|
||||
const store = useStore()
|
||||
|
||||
if (store.token) {
|
||||
if (store.token || to.path == '/login') {
|
||||
next()
|
||||
} else {
|
||||
next({ path: '/login' })
|
||||
next('/login')
|
||||
}
|
||||
|
||||
// chrome
|
||||
document.body.scrollTop = 0;
|
||||
// firefox 兼容火狐
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ export const useStore = defineStore('main', {
|
|||
state: () => {
|
||||
return {
|
||||
loadingFlag: false, //loading控制,
|
||||
token: ''
|
||||
token: 'eyJhbGciOiJIUzUxMiJ9.eyJ1c2VyX2lkIjoxLCJ1c2VyX2tleSI6Ijc5MjRkNDc1LTRjMmUtNGViYy05ZDU0LTA2NzNmNWU0MDhiMyIsInVzZXJuYW1lIjoiYWRtaW4ifQ.M3H9jHnfFAKJ3szdiDb79hIHfiS8AWvaI51mP65l01Q2G0jcLSTvjlub8FykYV3A27If7V6GBRo83u8spRDquw'
|
||||
}
|
||||
},
|
||||
getters: {},
|
||||
|
|
|
|||
|
|
@ -1,7 +1,9 @@
|
|||
<script setup lang="ts">
|
||||
import FooterInfo from '../compontents/FooterInfo/index.vue'
|
||||
import {useRouter} from "vue-router";
|
||||
import $bus from "@/utils/bus"
|
||||
const route = useRoute()
|
||||
|
||||
const router = useRouter()
|
||||
// 判断是否是个人中心页面 如果是则隐藏页脚
|
||||
const isMyInfoPage = () => {
|
||||
if (route.path.indexOf('myuser') === -1) {
|
||||
|
|
@ -23,16 +25,32 @@
|
|||
])
|
||||
|
||||
// 搜索按钮
|
||||
const searchKeywordBtn = () => {
|
||||
console.log('搜索关键字', keywordIptValue.value)
|
||||
const searchKeywordBtn = (e) => {
|
||||
if(route.path == '/equipList'){
|
||||
$bus.emit('search',keywordIptValue.value)
|
||||
}else {
|
||||
router.push({
|
||||
name:'equipList',
|
||||
state:{keyWord: keywordIptValue.value}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// 点击下方搜索记录时
|
||||
const handleHistory = (hisValue: any) => {
|
||||
keywordIptValue.value = hisValue
|
||||
}
|
||||
//页面刷新回显模糊搜索词
|
||||
$bus.on('callBackText',(val) => {
|
||||
nextTick(() => {
|
||||
keywordIptValue.value = val
|
||||
})
|
||||
})
|
||||
|
||||
onMounted(() => {})
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
|
|||
|
|
@ -1,18 +1,20 @@
|
|||
<template>
|
||||
<div class="equipShowImg">
|
||||
<div class="show">
|
||||
<img :src="activeUrl">
|
||||
<img :src="urlList[activeUrl]">
|
||||
</div>
|
||||
<div class="loop">
|
||||
<div class="prev btn">
|
||||
<div class="prev btn" @click="changeActive(-1)">
|
||||
<el-icon><ArrowLeftBold /></el-icon>
|
||||
</div>
|
||||
<div class="list">
|
||||
<div class="item" @mouseenter="mouseenter($event,v)" :class="v == activeUrl && 'activeUrl'" v-for="(v,i) in urlList" :key="i">
|
||||
<img :src="v">
|
||||
<div class="line" :style="`transform: translateX(calc((-100% - 10px) / 3 * ${activeUrl - 3}))`">
|
||||
<div class="item" @mouseenter="mouseenter($event,i)" :class="i == activeUrl && 'activeUrl'" v-for="(v,i) in urlList" :key="i">
|
||||
<img :src="v">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="next btn">
|
||||
<div class="next btn" @click="changeActive(1)">
|
||||
<el-icon><ArrowRightBold /></el-icon>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -33,10 +35,11 @@
|
|||
}
|
||||
})
|
||||
|
||||
const activeUrl = ref('')
|
||||
|
||||
//激活图片下标
|
||||
const activeUrl = ref(0)
|
||||
|
||||
const init = () => {
|
||||
activeUrl.value = props.urlList ? props.urlList[0] : ''
|
||||
|
||||
}
|
||||
init()
|
||||
|
||||
|
|
@ -44,6 +47,15 @@
|
|||
activeUrl.value = val
|
||||
}
|
||||
|
||||
const changeActive = (val) => {
|
||||
activeUrl.value = activeUrl.value + val
|
||||
if(activeUrl.value < 0){
|
||||
activeUrl.value = 0
|
||||
}else if(activeUrl.value == props.urlList?.length){
|
||||
activeUrl.value = props.urlList.length - 1
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.equipShowImg{
|
||||
|
|
@ -83,9 +95,13 @@
|
|||
flex: 1;
|
||||
overflow: hidden;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
height: 100%;
|
||||
.line{
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.item{
|
||||
height: 100%;
|
||||
margin-right: 5px;
|
||||
|
|
|
|||
|
|
@ -29,15 +29,22 @@
|
|||
{{ v.label }}：
|
||||
</div>
|
||||
<div class="value">
|
||||
操作重量：22吨 铲斗容量：1立方亩
|
||||
{{ detailData[v.key] }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="right">
|
||||
<div class="price">
|
||||
￥<span>18500</span>/月
|
||||
<div class="Top">
|
||||
<div class="price">
|
||||
￥<span>{{ detailData.monthLeasePrice }}</span>/月
|
||||
</div>
|
||||
<div class="collect" @click="collectChange">
|
||||
<el-icon class="no" v-show="!isCollect"><Star /></el-icon>
|
||||
<el-icon class="yes" v-show="isCollect"><StarFilled /></el-icon>
|
||||
{{ isCollect ? '装备已收藏' : '收藏装备' }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="options">
|
||||
<div class="item contact">
|
||||
|
|
@ -55,7 +62,7 @@
|
|||
<div class="business">
|
||||
<img src="https://img0.baidu.com/it/u=3896113677,3541736724&fm=253&app=138&size=w931&n=0&f=JPEG&fmt=auto?sec=1701709200&t=0b8dabbcda79511d6d18aaed664132fd" class="avatar">
|
||||
<div class="fonts">
|
||||
<div class="name">珠海嘉昌设备有限责任公司</div>
|
||||
<div class="name">{{ detailData.companyName }}</div>
|
||||
<div class="other">
|
||||
<div class="item" v-for="(v,i) in businessList" :key="i">
|
||||
<div class="label">
|
||||
|
|
@ -116,7 +123,10 @@
|
|||
import ShowImg from "./comoonents/showImg.vue"
|
||||
import { reactive, ref} from "vue";
|
||||
import EquipCard from "@/compontents/equipCard.vue";
|
||||
import {getDetail} from "@/http/api/equip"
|
||||
import {useRoute} from "vue-router";
|
||||
|
||||
const route = useRoute()
|
||||
//设备简略基本信息
|
||||
const equipBaseInfoList = reactive([
|
||||
{
|
||||
|
|
@ -124,16 +134,16 @@ const equipBaseInfoList = reactive([
|
|||
key:''
|
||||
},{
|
||||
label:'设备单位',
|
||||
key:''
|
||||
key:'companyName'
|
||||
},{
|
||||
label:'配备机手',
|
||||
key:''
|
||||
},{
|
||||
label:'发布时间',
|
||||
key:''
|
||||
key:'createTime'
|
||||
},{
|
||||
label:'更新时间',
|
||||
key:''
|
||||
key:'updateTime'
|
||||
},
|
||||
])
|
||||
//商家标签信息
|
||||
|
|
@ -223,6 +233,11 @@ const testUrl = [
|
|||
'https://img1.baidu.com/it/u=3893389324,4043822814&fm=253&fmt=auto&app=120&f=JPEG?w=1280&h=800'
|
||||
]
|
||||
|
||||
//装备详情数据
|
||||
const detailData = ref({})
|
||||
//是否收藏装备
|
||||
const isCollect = ref(false)
|
||||
|
||||
const fn = () => {
|
||||
console.log('fn 111111111111111111111')
|
||||
}
|
||||
|
|
@ -231,9 +246,22 @@ const that = {
|
|||
fn
|
||||
}
|
||||
|
||||
//获取装备详情数据
|
||||
const getPageData = async () => {
|
||||
const res = await getDetail(route.params.id)
|
||||
detailData.value = res.data
|
||||
console.log(detailData.value)
|
||||
}
|
||||
|
||||
const collectChange = () => {
|
||||
isCollect.value = !isCollect.value
|
||||
}
|
||||
|
||||
|
||||
//模拟created
|
||||
const init = () => {
|
||||
getPageData()
|
||||
}
|
||||
init()
|
||||
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
|
|
@ -305,9 +333,8 @@ const that = {
|
|||
margin-right: 15px;
|
||||
}
|
||||
.value{
|
||||
font-size: 15px;
|
||||
font-size: 14px;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 600;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
|
@ -318,7 +345,11 @@ const that = {
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
.Top{
|
||||
width: 100%;
|
||||
}
|
||||
.price{
|
||||
width: 100%;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
|
|
@ -329,11 +360,30 @@ const that = {
|
|||
font-weight: 600;
|
||||
}
|
||||
}
|
||||
.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;
|
||||
}
|
||||
}
|
||||
.options{
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
|
||||
.item{
|
||||
cursor: pointer;
|
||||
user-select: none;
|
||||
width: 110px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
|
|
|
|||
|
|
@ -57,25 +57,41 @@
|
|||
</div>
|
||||
|
||||
<div class="showList">
|
||||
<equip-card class="card" v-for="(v,i) in 10" :key="i" :id="i" @on-click="toDetail"></equip-card>
|
||||
<equip-card
|
||||
class="card"
|
||||
v-for="(v,i) in equipList"
|
||||
:key="i"
|
||||
:url="v.picUrl"
|
||||
:company="v.companyName"
|
||||
:tags="[v.maStatus,v.location || '合肥市']"
|
||||
:name="`${v.modelName}${v.typeName}`"
|
||||
:price="v.monthLeasePrice"
|
||||
:id="v.maId"
|
||||
time-unit="月"
|
||||
@on-click="toDetail"></equip-card>
|
||||
</div>
|
||||
|
||||
<div class="pagination">
|
||||
<el-pagination
|
||||
:page-size="20"
|
||||
:pager-count="11"
|
||||
v-model:current-page="pageData.pageNum"
|
||||
:page-size="pageData.pageSize"
|
||||
@current-change="pageChange"
|
||||
:pager-count="5"
|
||||
layout="prev, pager, next"
|
||||
:total="1000"
|
||||
:total="pageData.total"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import {computed, reactive, ref} from "vue";
|
||||
import {computed, onMounted, onUnmounted, reactive, ref} from "vue";
|
||||
import EquipCard from "@/compontents/equipCard.vue";
|
||||
import {useRouter} from "vue-router";
|
||||
import {useRoute, useRouter} from "vue-router";
|
||||
import { getList } from "@/http/api/equip"
|
||||
import $bus from "@/utils/bus"
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
//筛选条件列表数据
|
||||
const screenChooseList = reactive([
|
||||
{
|
||||
|
|
@ -326,6 +342,25 @@ const screenTags = computed<Array<any>>(() => {
|
|||
return arr
|
||||
})
|
||||
|
||||
//分页参数
|
||||
const pageData = reactive({
|
||||
pageNum: 1,
|
||||
pageSize: 9,
|
||||
total:100
|
||||
})
|
||||
|
||||
//装备列表
|
||||
const equipList = ref([])
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
$bus.on('search',(val) => {
|
||||
getData(val)
|
||||
})
|
||||
})
|
||||
onUnmounted(() => {
|
||||
$bus.off('search')
|
||||
})
|
||||
//删除条件
|
||||
const handleClose = (tag, index) => {
|
||||
screenChooseList[tag.parentIndex].select.splice(tag.index)
|
||||
|
|
@ -366,11 +401,43 @@ const toDetail = (data) => {
|
|||
})
|
||||
}
|
||||
|
||||
const getData = async () => {
|
||||
const res = await getList()
|
||||
console.log('res ============',res)
|
||||
//分页page变化
|
||||
const pageChange = (val) => {
|
||||
pageData.pageNum = val
|
||||
getData()
|
||||
}
|
||||
//获取列表
|
||||
const getData = async (text = '') => {
|
||||
const params = {
|
||||
keyWord: text,
|
||||
pageSize:pageData.pageSize,
|
||||
pageNum:pageData.pageNum
|
||||
}
|
||||
const res = await getList(params)
|
||||
console.log(res)
|
||||
pageData.total = res.total
|
||||
equipList.value = res.rows
|
||||
}
|
||||
|
||||
const getParams = () => {
|
||||
const paramsKey = ['keyWord']
|
||||
let params = {}
|
||||
paramsKey.forEach(key => {
|
||||
if (history.state[key]){
|
||||
params[key] = history.state[key]
|
||||
}
|
||||
})
|
||||
return params
|
||||
}
|
||||
const init = () => {
|
||||
const params = getParams()
|
||||
console.log(params)
|
||||
|
||||
if(params && params.keyWord){
|
||||
$bus.emit('callBackText',params.keyWord)
|
||||
$bus.off('callBackText')
|
||||
}
|
||||
|
||||
getData()
|
||||
}
|
||||
init()
|
||||
|
|
|
|||
Loading…
Reference in New Issue