Skip to content

frontend / qqxb-self-service

Go to a project
Commit 89cfa958 by 展昭
Options

Merge branch 'master' of http://gitlab.corp.qinqinxiaobao.com:9880/frontend_vue/qqxb-self-service

parents 69e484e6 6be64220
Inline Side-by-side
Showing with 249 additions and 64 deletions
package-lock.json
...@@ -964,6 +964,11 @@ ...@@ -964,6 +964,11 @@
"integrity": "sha512-EaObqwIvayI5a8dCzhFrjKzVwKLxjoG9T6Ppd5CEo07LRKfQ8Yokw54r5+Wq7FaBQ+yXRvQAYPrHwya1/UFt9g==", "integrity": "sha512-EaObqwIvayI5a8dCzhFrjKzVwKLxjoG9T6Ppd5CEo07LRKfQ8Yokw54r5+Wq7FaBQ+yXRvQAYPrHwya1/UFt9g==",
"dev": true "dev": true
}, },
"@types/fastclick": {
"version": "1.0.29",
"resolved": "https://registry.npmjs.org/@types/fastclick/-/fastclick-1.0.29.tgz",
"integrity": "sha512-umkMhdAk3dNAenNuhoKPzZUYN9uBHrK8UAvUKWMLst80Gj4BWC1syLuiNzdBzPpM2b2Xg036vvl6X1wiu1Piuw=="
},
"@types/glob": { "@types/glob": {
"version": "7.1.1", "version": "7.1.1",
"resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.1.1.tgz", "resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.1.1.tgz",
...@@ -4484,6 +4489,11 @@ ...@@ -4484,6 +4489,11 @@
"integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==", "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==",
"dev": true "dev": true
}, },
"fastclick": {
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/fastclick/-/fastclick-1.0.6.tgz",
"integrity": "sha1-FhYlsnsaWAZAWTa9qaLBkm0Gvmo="
},
"fastparse": { "fastparse": {
"version": "1.1.2", "version": "1.1.2",
"resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.2.tgz", "resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.2.tgz",
......
package.json
...@@ -8,10 +8,12 @@ ...@@ -8,10 +8,12 @@
"lint": "vue-cli-service lint" "lint": "vue-cli-service lint"
}, },
"dependencies": { "dependencies": {
"@types/fastclick": "^1.0.29",
"@types/qs": "^6.9.3", "@types/qs": "^6.9.3",
"amfe-flexible": "^2.2.1", "amfe-flexible": "^2.2.1",
"axios": "^0.19.2", "axios": "^0.19.2",
"core-js": "^2.6.11", "core-js": "^2.6.11",
"fastclick": "^1.0.6",
"oidc-client": "^1.10.1", "oidc-client": "^1.10.1",
"qs": "^6.9.4", "qs": "^6.9.4",
"vant": "^2.2.0", "vant": "^2.2.0",
......
src/components/archives/workInfo.vue
...@@ -3,6 +3,7 @@ ...@@ -3,6 +3,7 @@
<div class="header"> <div class="header">
<div class="tip"></div> <div class="tip"></div>
<div class="title">工作信息</div> <div class="title">工作信息</div>
<van-icon size="14px" color="#E1E4EB" name="arrow" />
</div> </div>
<div class="box"> <div class="box">
<div class="item"> <div class="item">
...@@ -31,23 +32,22 @@ ...@@ -31,23 +32,22 @@
<script lang="ts"> <script lang="ts">
import Vue from "vue"; import Vue from "vue";
// import { Button } from 'vant'; import { Icon } from 'vant';
import { Component } from "vue-property-decorator"; import { Component } from "vue-property-decorator";
@Component({ @Component({
// components:{ components:{
// // [Cell.name]: Cell, [Icon.name]: Icon
// [Button.name]:Button }
// }
}) })
export default class workInfo extends Vue { export default class workInfo extends Vue {
created() { created() {
// let params = { let params = {
// edId: 1 edId: 1
// }; };
// this.$server.EmployeeService.getWorkInfoDetail(params).then(res => { this.$server.EmployeeService.getWorkInfoDetail(params).then(res => {
// console.log(res); console.log(res);
// }); });
} }
} }
</script> </script>
...@@ -70,6 +70,9 @@ export default class workInfo extends Vue { ...@@ -70,6 +70,9 @@ export default class workInfo extends Vue {
font-weight: 500; font-weight: 500;
color: rgba(61, 64, 71, 1); color: rgba(61, 64, 71, 1);
} }
i{
margin: 0 20px 0 auto;
}
} }
.box { .box {
margin: 0 20px; margin: 0 20px;
......
src/main.ts
...@@ -3,10 +3,12 @@ import App from './App.vue'; ...@@ -3,10 +3,12 @@ import App from './App.vue';
import router from './router' import router from './router'
import store from './store' import store from './store'
import 'amfe-flexible/index.js' import 'amfe-flexible/index.js'
import server from '@/services/install'; import server from '@/services/install'
import FastClick from 'fastclick'
import '@/assets/css/index.less' import '@/assets/css/index.less'
Vue.config.productionTip = false; Vue.config.productionTip = false;
FastClick.attach(document.body);
Vue.use(server) Vue.use(server)
new Vue({ new Vue({
......
src/views/FlexEmployee.vue
<template> <template>
<!-- 1、已接单 进行中 #077AEC 2、已拒回 #FF9100 3、已完成 #95989E--> <!-- 1、已接单 进行中 #077AEC 2、已拒回 #FF9100 3、已完成 #95989E-->
<div class="fe-bigbox"> <div class="fe-bigbox">
<div v-if="taskRecordList.length>0">
<div class="person-information"> <div class="person-information">
<div class="person-information-top"> <div class="person-information-top">
<div class="person-information-left"> <div class="person-information-left">
<h3>{{name}}</h3> <h3>{{name}}</h3>
<p>1996.01.01</p> <p>{{birthday}}</p>
</div> </div>
<div class="person-information-right"> <div class="person-information-right">
<img src="../assets/images/agent/123.jpg" alt /> <img src="../assets/images/agent/123.jpg" alt />
...@@ -13,29 +14,36 @@ ...@@ -13,29 +14,36 @@
</div> </div>
<div class="person-information-bottom"> <div class="person-information-bottom">
<div class="person-information-bottom-child" id="person-information-yjrw"> <div class="person-information-bottom-child" id="person-information-yjrw">
<h3>10</h3> <h3>{{accept_work}}</h3>
<p>已接任务</p> <p>已接任务</p>
</div> </div>
<div class="person-information-bottom-child" id="person-information-wcrw"> <div class="person-information-bottom-child" id="person-information-wcrw">
<h3>2</h3> <h3>{{perform_work}}</h3>
<p>完成任务</p> <p>完成任务</p>
</div> </div>
<div class="person-information-bottom-child" id="person-information-ysbc"> <div class="person-information-bottom-child" id="person-information-ysbc">
<h3>12236.36</h3> <h3>{{Payment_receivable}}</h3>
<p>应收报酬</p> <p>应收报酬</p>
</div> </div>
<div class="person-information-bottom-child" id="person-information-yysbc"> <div class="person-information-bottom-child" id="person-information-yysbc">
<h3>2236.36</h3> <h3>{{receive_receivable}}</h3>
<p>已收报酬</p> <p>已收报酬</p>
</div> </div>
</div> </div>
</div> </div>
<div class="green-bg">
<div class="fe-list-box"> <div class="fe-list-box">
<div class="fe-list-title"> <div class="fe-list-title">
<h3>任务记录</h3> <h3>任务记录</h3>
</div> </div>
<a class="fe-list-child" href='javascript:void(0)' v-for="item in taskRecordList" :key="item.id" @click="toDetail(item.id)"> <a
class="fe-list-child"
href="javascript:void(0)"
v-for="item in taskRecordList"
:key="item.id"
@click="toDetail(item.id)"
>
<div class="fe-list-child-left"> <div class="fe-list-child-left">
<h3>{{item.title}}</h3> <h3>{{item.title}}</h3>
<p>{{item.date}}</p> <p>{{item.date}}</p>
...@@ -48,52 +56,200 @@ ...@@ -48,52 +56,200 @@
<img src="../assets/images/agent/next_gray.png" alt /> <img src="../assets/images/agent/next_gray.png" alt />
</div> </div>
</a> </a>
</div>
</div>
</div>
<div class="empty_data" v-else>
<p>
您在亲亲小保未从事灵活用工的相关任务
<br />暂无相关记录
</p>
</div> </div>
</div> </div>
</template> </template>
<script lang='ts'> <script lang='ts'>
import {Component,Vue} from 'vue-property-decorator' import { Component, Vue } from "vue-property-decorator";
@Component @Component
export default class FlexEmployee extends Vue { export default class FlexEmployee extends Vue {
private name:string='小小JJ帅'; private name: string = "迪丽热巴";
private birthday: string = "1987-10-16";
private taskRecordList:any=[ private accept_work: string = "999";
{id:1,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, private perform_work: string = "999";
{id:2,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已完成'}, private Payment_receivable: string = "9999.99";
{id:3,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已拒回'}, private receive_receivable: string = "9999.99";
{id:4,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'进行中'}, private taskRecordList: any = [
{id:5,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, {
{id:6,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, id: 1,
{id:7,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, title: "市场推广-地推",
{id:8,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, date: "2020-02-02",
{id:9,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, price: "9999.99",
{id:10,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, state: "已接单"
{id:11,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, },
{id:12,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, {
{id:13,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, id: 2,
{id:14,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, title: "市场推广-地推",
{id:15,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, date: "2020-02-02",
{id:16,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, price: "9999.99",
{id:17,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, state: "已完成"
{id:18,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, },
{id:19,title:'市场推广-地推',date:'2020-02-02',price:'9999.99',state:'已接单'}, {
] id: 3,
title: "市场推广-地推",
private toDetail(id:any):void{ date: "2020-02-02",
this.$router.push({name:'',query:{id:id}}) price: "9999.99",
state: "已拒回"
},
{
id: 4,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "进行中"
},
{
id: 5,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 6,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 7,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 8,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 9,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 10,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 11,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 12,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 13,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 14,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 15,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 16,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 17,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 18,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
},
{
id: 19,
title: "市场推广-地推",
date: "2020-02-02",
price: "9999.99",
state: "已接单"
} }
];
}; private toDetail(id: any): void {
this.$router.push({ name: "FlexEmployeeDetial", query: { id: id } });
}
}
</script> </script>
<style lang="less"> <style lang="less">
.empty_data {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.empty_data p {
font-size: 14px;
font-weight: 400;
color: rgba(149, 152, 158, 1);
line-height: 24px;
text-align: center;
margin-top: 256px;
}
.green-bg {
background-color: #19b370;
position: absolute;
top: 180px;
bottom: 0px;
left: 0px;
right: 0px;
overflow: auto;
}
.person-information { .person-information {
background-color: #19b370; background-color: #19b370;
width: 100%; width: 100%;
height: 256px; height: 180px;
padding: 20px 16px 0 16px; padding: 20px 16px 0 16px;
} }
.person-information-top { .person-information-top {
...@@ -148,8 +304,6 @@ export default class FlexEmployee extends Vue { ...@@ -148,8 +304,6 @@ export default class FlexEmployee extends Vue {
background-color: #ffffff; background-color: #ffffff;
border-radius: 12px 12px 0px 0px; border-radius: 12px 12px 0px 0px;
padding: 0 16px; padding: 0 16px;
margin-top: -76px;
min-height: 76px;
} }
.fe-list-title { .fe-list-title {
width: 100%; width: 100%;
......
src/views/FlexEmployeeDetial.vue
...@@ -2,8 +2,8 @@ ...@@ -2,8 +2,8 @@
<div class="fe-detial-box"> <div class="fe-detial-box">
<div class="fe-detial-top"> <div class="fe-detial-top">
<h4>任务报酬</h4> <h4>任务报酬</h4>
<h3>+8,000.22</h3> <h3>+{{money}}</h3>
<p>待发放</p> <p>{{status}}</p>
</div> </div>
<div class="fe-detial-bottom"> <div class="fe-detial-bottom">
<div class="fe-detial-bottom-title"> <div class="fe-detial-bottom-title">
...@@ -13,17 +13,31 @@ ...@@ -13,17 +13,31 @@
<p>收款账户</p> <p>收款账户</p>
</div> </div>
<div class="fe-detial-bottom-detial"> <div class="fe-detial-bottom-detial">
<p>天津有米科技有限公司</p> <p>{{company}}</p>
<p>市场推广-地推</p> <p>{{task_count}}</p>
<p>2019-11-12</p> <p>{{date}}</p>
<p>622254889999888900</p> <p>{{account}}</p>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script lang="ts">
export default {}; import {Component,Vue} from 'vue-property-decorator'
@Component
export default class FlexEmployee extends Vue {
private money:number=9999.99;
private status:string='待发放';
private company:string='天津有米科技有限公司';
private task_count:string='市场推广-地推';
private date:string='2020-5-29';
private account:string='622254889999888900'
private toDetail(id:any):void{
this.$router.push({name:'FlexEmployeeDetial',query:{id:id}})
}
};
</script> </script>
<style lang="less"> <style lang="less">
......
vue.config.js
...@@ -114,11 +114,11 @@ module.exports = { ...@@ -114,11 +114,11 @@ module.exports = {
before: app => { } before: app => { }
}, },
// 第三方插件配置 // 第三方插件配置
pluginOptions: { // pluginOptions: {
'style-resources-loader': { // 'style-resources-loader': {
preProcessor: 'scss', // preProcessor: 'scss',
patterns: [] // patterns: []
} // }
} // }
}; };
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment