qa-regulatory-gwj-app/pages/key-project-management/key-project-out/list.vue

138 lines
4.4 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view class="content">
<view class="search card">
<u--input
prefixIcon="search"
placeholder="请输入关键字"
border="surround"
v-model="CORP_NAME"
clearable
shape="circle"
></u--input>
<u-button class="bth-mini ml-10" type="success" text="确定" @click="resetList"></u-button>
</view>
<u-list @scrolltolower="scrolltolower" v-if="list.length > 0">
<u-list-item v-for="(item, index) in list" :key="index">
<view>
<view class="flex-between">
<text class="main-title">{{ item.CORP_NAME }}</text>
<u-badge style="font-size: x-small; padding:5px 5px" :value="item.cf+item.yh"/>
</view>
<view class="flex-between mt-10 subtitle">
<text v-if="item.CORPINFO_ID != '1'">属地:{{item.prvinceName}}-{{item.cityName}}-{{item.countryName}}</text>
<text v-else="item.prvinceName">属地:河北省-秦皇岛市-海港区</text>
</view>
<view class="flex-between mt-10 subtitle">
<text v-if="item.CORPINFO_ID != '1'">所属行业:{{item.INDUSTRY_NAME}}</text>
<text v-else>所属行业:交通运输、仓储和邮政业</text>
</view>
<view class="flex-between mt-10 subtitle">
<text>重点工程数:{{item.OUTSOURCED_COUNT}}</text>
</view>
<view class="flex-between mt-10 subtitle">
<text>在线视频数:{{item.ONLINE_COUNT}}</text>
<u-button type="primary" text="进入" size="mini" class="bth-mini" @click="fnNavigatorDetail(item.CORPINFO_ID)"/>
</view>
<!-- <view class="flex-between mt-10 subtitle">-->
<!-- <text>重点工程数:{{ item.OUTSOURCED_COUNT }}</text>-->
<!-- <text>检查次数:{{ item.CHECK_COUNT }}</text>-->
<!-- </view>-->
<!-- <view class="flex-between mt-10 subtitle">-->
<!-- <text>违约处罚次数:{{ item.PUNISH_COUNT }}</text>-->
<!-- <text>违约处罚金额:{{ item.AMOUT_SUM }}</text>-->
<!-- </view>-->
<!-- <view class="flex-between mt-10 subtitle">-->
<!-- <text>发现隐患数量{{ item.HIDDEN_COUNT }}</text>-->
<!-- <u-button type="primary" text="进入" size="mini" class="bth-mini"-->
<!-- @click="fnNavigatorDetail(item.CORPINFO_ID)"/>-->
<!-- </view>-->
</view>
</u-list-item>
</u-list>
<empty v-else></empty>
</view>
</template>
<script>
import {getKeyProjectsListListByCorp} from "../../../api";
export default {
data() {
return {
CORP_NAME: '',
pageSize: 10,
currentPage: 1,
totalPage: 0,
list: [],
}
},
onShow() {
this.resetList()
},
computed: {
userInfo() {
return this.$store.getters.getUserInfo
}
},
methods:{
async getData(){
let resData = await getKeyProjectsListListByCorp({
CORP_NAME: this.CORP_NAME,
showCount: this.pageSize,
loginUserId: this.userInfo.USER_ID,
currentPage: this.currentPage
});
this.list = [...this.list,...resData.varList];
this.totalPage = resData.page.totalPage;
},
resetList() {
this.pageSize= 10
this.currentPage= 1
this.list = []
this.getData()
},
fnNavigatorDetail(CORPINFO_ID){
// 重点工程
// 安全环保检查管理
uni.$u.route({
url: '/pages/key-project-management/index/index',
params: {
CORPINFO_ID
}
})
},
scrolltolower() {
this.currentPage++;
if(this.totalPage >= this.currentPage) this.getData();
},
}
}
</script>
<style scoped>
.btn-corner-label::before,
.btn-corner-label::after {
content: attr(data-label); /* 使用 attr 获取按钮的 data-label 属性的值作为角标内容 */
position: absolute;
top: 0;
right: 0;
padding: 5px 10px; /* 根据需要调整角标的大小和位置 */
background-color: rgba(0, 0, 0, 0.5); /* 设置角标的背景颜色和透明度 */
color: #fff; /* 设置角标的文本颜色 */
font-size: 12px; /* 设置角标的字体大小 */
border-radius: 3px; /* 为角标添加圆角效果 */
}
.btn-corner-label::before {
left: 0;
transform: skew(-5deg); /* 调整角标的位置使其倾斜,以达到更好的效果 */
}
.btn-corner-label::after {
right: 0;
transform: skew(5deg); /* 调整角标的位置使其倾斜,以达到更好的效果 */
}
</style>