初始化项目
This commit is contained in:
68
src/views/wel/cards/adminhellocard.vue
Normal file
68
src/views/wel/cards/adminhellocard.vue
Normal file
@@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<card class="wel-admin-hello">
|
||||
<h1>您好,{{userInfo.real_name}}</h1>
|
||||
<span>待办提醒:</span>
|
||||
<span>
|
||||
报名截止任务数
|
||||
<i>{{form.employEndCount}}</i>
|
||||
</span>
|
||||
<span>
|
||||
待发工资人数
|
||||
<i>{{form.noPayCount}}</i>
|
||||
</span>
|
||||
<span>
|
||||
待开票数
|
||||
<i>{{form.noBillCount}}</i>
|
||||
</span>
|
||||
</card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import card from "./card";
|
||||
import { reminder } from "@/api/manage/wel";
|
||||
import { mapGetters } from "vuex";
|
||||
|
||||
export default {
|
||||
components: { card },
|
||||
data() {
|
||||
return {
|
||||
form: {}
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.getData();
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
reminder().then(resp => {
|
||||
this.form = resp.data;
|
||||
});
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(["userInfo"])
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.wel-admin-hello {
|
||||
height: 160px;
|
||||
padding-left: 30px;
|
||||
}
|
||||
.wel-admin-hello h1 {
|
||||
font-size: 24px;
|
||||
margin: 14px 0 26px 0;
|
||||
}
|
||||
.wel-admin-hello span {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
display: inline-block;
|
||||
line-height: 18px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.wel-admin-hello i {
|
||||
font-style: normal;
|
||||
color: #5d9df8;
|
||||
}
|
||||
</style>
|
||||
232
src/views/wel/cards/authSteps/companyInfo.vue
Normal file
232
src/views/wel/cards/authSteps/companyInfo.vue
Normal file
@@ -0,0 +1,232 @@
|
||||
<template>
|
||||
<div v-loading="loading">
|
||||
<el-row>
|
||||
<el-col :sm="24" :md="{ span: 12, offset: 6 }">
|
||||
<el-form
|
||||
:model="form"
|
||||
ref="form"
|
||||
class="content"
|
||||
label-position="right"
|
||||
label-width="140px"
|
||||
:rules="rules"
|
||||
>
|
||||
<el-form-item label="企业名称" prop="companyName">
|
||||
<el-input
|
||||
maxlength="50"
|
||||
placeholder="请输入"
|
||||
v-model.trim="form.companyName"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="统一社会信用代码" prop="companyTid">
|
||||
<el-input
|
||||
placeholder="请输入18位有效社会统一信用代码"
|
||||
v-model.trim="form.companyTid"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="所在地区" prop="cityId">
|
||||
<jl-city-cascader
|
||||
:disabled="disabled"
|
||||
v-model="form.cityId"
|
||||
></jl-city-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="详细地址" prop="companyAddress">
|
||||
<el-input
|
||||
placeholder="请输入"
|
||||
v-model.trim="form.companyAddress"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="所属行业" prop="tradeId">
|
||||
<el-select placeholder="请选择" v-model="form.tradeId">
|
||||
<el-option
|
||||
v-for="item in tradeDic"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="企业营业执照:" prop="authUrlId">
|
||||
<el-upload
|
||||
:action="putFile"
|
||||
:show-file-list="false"
|
||||
:on-progress="
|
||||
() => {
|
||||
uploading = true;
|
||||
}
|
||||
"
|
||||
:on-success="handleAvatarSuccess"
|
||||
:before-upload="beforeAvatarUpload"
|
||||
:http-request="httpRequest"
|
||||
>
|
||||
<div v-loading="uploading">
|
||||
<img
|
||||
class="companyInfo-upload-image"
|
||||
:src="form.authUrlId || imageUrl"
|
||||
/>
|
||||
</div>
|
||||
<!-- <div class="companyInfo-upload-tip" slot="tip">
|
||||
请上传营业执照
|
||||
</div> -->
|
||||
</el-upload>
|
||||
<p class="uploadImgP">上传图片大小限制2M以内</p>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="next" type="primary">下一步</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { putFile } from "@/api/resource/oss";
|
||||
import { getTradeDic } from "@/api/manage/trade";
|
||||
import { checkIdentity } from "@/api/tenant/auth";
|
||||
import lodash from "lodash";
|
||||
import httpRequest from "./httpRequest";
|
||||
|
||||
const accept = ["image/png", "image/jpeg", "image/svg+xml", "image/gif"];
|
||||
|
||||
export default {
|
||||
props: {
|
||||
value: Object,
|
||||
},
|
||||
data() {
|
||||
const validateId = (rule, value, callback) => {
|
||||
checkIdentity(value)
|
||||
.then(() => {
|
||||
callback();
|
||||
})
|
||||
.catch((err) => {
|
||||
|
||||
callback(err);
|
||||
this.$message.closeAll();
|
||||
});
|
||||
};
|
||||
return {
|
||||
uploading: false,
|
||||
putFile,
|
||||
imageUrl: "/img/license.png",
|
||||
rules: {
|
||||
companyName: [
|
||||
{ required: true, message: "请输入企业名称", trigger: "blur" },
|
||||
],
|
||||
companyTid: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入统一社会信用代码",
|
||||
trigger: "blur",
|
||||
},
|
||||
{
|
||||
max: 18,
|
||||
min: 18,
|
||||
trigger: "blur",
|
||||
message: "请输入18位有效社会统一信用代码",
|
||||
},
|
||||
{
|
||||
trigger: "blur",
|
||||
validator: validateId,
|
||||
},
|
||||
],
|
||||
cityId: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择所在地区",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
companyAddress: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入详细地址",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
tradeId: [
|
||||
{
|
||||
required: true,
|
||||
message: "请选择所属行业",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
authUrlId: [
|
||||
{
|
||||
required: true,
|
||||
message: "请上传营业执照",
|
||||
trigger: "change",
|
||||
},
|
||||
],
|
||||
},
|
||||
form: lodash.clone(this.value || {}),
|
||||
tradeDic: [],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.init();
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
getTradeDic(true).then((res) => {
|
||||
this.tradeDic = res.data.data;
|
||||
});
|
||||
},
|
||||
next() {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$emit("submit", this.form);
|
||||
this.$emit("input", this.form);
|
||||
}
|
||||
});
|
||||
},
|
||||
/**上传图片**/
|
||||
handleAvatarSuccess(res, file) {
|
||||
this.imageUrl = URL.createObjectURL(file.raw);
|
||||
this.$set(this.form, "authUrlId", res.data.link);
|
||||
this.uploading = false;
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
const isJPG = accept.includes(file.type);
|
||||
const is2M=file.size/1024/1024<2;
|
||||
if (!isJPG) {
|
||||
this.$message.error("图片格式不正确!");
|
||||
}
|
||||
if(!is2M){
|
||||
this.$message.error("上传图片大小不能超过2M!");
|
||||
}
|
||||
return isJPG && is2M;
|
||||
},
|
||||
/**上传图片*/
|
||||
httpRequest,
|
||||
},
|
||||
watch: {
|
||||
value(val) {
|
||||
this.form = val;
|
||||
},
|
||||
form: {
|
||||
handler(val) {
|
||||
this.$emit("input", val);
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.companyInfo-upload-image {
|
||||
height: 100px;
|
||||
width: 160px;
|
||||
}
|
||||
.companyInfo-upload-tip {
|
||||
line-height: 12px;
|
||||
font-size: 12px;
|
||||
color: #999999;
|
||||
}
|
||||
.el-form-item__content{
|
||||
line-height: normal;
|
||||
}
|
||||
.uploadImgP{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
line-height: 18px;
|
||||
}
|
||||
</style>
|
||||
59
src/views/wel/cards/authSteps/finish.vue
Normal file
59
src/views/wel/cards/authSteps/finish.vue
Normal file
@@ -0,0 +1,59 @@
|
||||
<template>
|
||||
<basic-container>
|
||||
<div class="waiting-check">
|
||||
<div>
|
||||
<i class="waiting-check-icon el-icon-success"></i>
|
||||
</div>
|
||||
<div class="waiting-check-title">认证审核成功</div>
|
||||
<div class="waiting-check-tip">
|
||||
<div>请重新登录</div>
|
||||
</div>
|
||||
</div>
|
||||
</basic-container>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
status: Number,
|
||||
remarks: String,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
height: 100,
|
||||
};
|
||||
},
|
||||
mounted() {},
|
||||
methods: {},
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.waiting-check {
|
||||
height: 207px;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
.waiting-check-icon {
|
||||
font-size: 72px;
|
||||
}
|
||||
.waiting-check-icon.el-icon-success {
|
||||
font-size: 72px;
|
||||
color: #5aa0fa;
|
||||
}
|
||||
.waiting-check-title {
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 24px;
|
||||
color: #4f5e7b;
|
||||
letter-spacing: 0;
|
||||
text-align: center;
|
||||
line-height: 24px;
|
||||
margin: 36px auto 16px auto;
|
||||
}
|
||||
.waiting-check-tip {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 14px;
|
||||
color: #999999;
|
||||
letter-spacing: 0;
|
||||
text-align: center;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
</style>
|
||||
22
src/views/wel/cards/authSteps/httpRequest.js
Normal file
22
src/views/wel/cards/authSteps/httpRequest.js
Normal file
@@ -0,0 +1,22 @@
|
||||
/**上传图片*/
|
||||
import {putFileFun} from '@/api/resource/oss';
|
||||
import compress from '@/util/compress';
|
||||
|
||||
export default ({file, onProgress, onError, onSuccess}) => {
|
||||
onProgress({percent: 0});
|
||||
compress(file, 300)
|
||||
.then(({compressedFile}) => {
|
||||
putFileFun(
|
||||
compressedFile,
|
||||
(progressEvent) => {
|
||||
let complete =
|
||||
((progressEvent.loaded / progressEvent.total) * 100) | 0;
|
||||
onProgress({percent: complete});
|
||||
})
|
||||
.then((res) => {
|
||||
onSuccess(res.data, compressedFile);
|
||||
})
|
||||
.catch(onError);
|
||||
})
|
||||
.catch(onError);
|
||||
}
|
||||
142
src/views/wel/cards/authSteps/index.vue
Normal file
142
src/views/wel/cards/authSteps/index.vue
Normal file
@@ -0,0 +1,142 @@
|
||||
<template>
|
||||
<basic-container>
|
||||
<div class="registerSteps">
|
||||
<!--
|
||||
|
||||
<el-steps :active="active" align-center process-status="finish">
|
||||
<el-step title="企业信息"></el-step>
|
||||
<el-step title="法人认证"></el-step>
|
||||
<el-step title="等待审核"></el-step>
|
||||
<el-step title="完成认证"></el-step>
|
||||
</el-steps>-->
|
||||
<div class="pageContainer">
|
||||
<company-info
|
||||
v-model="form"
|
||||
v-show="active === 0"
|
||||
@submit="setCompany"
|
||||
></company-info>
|
||||
<legal-person
|
||||
v-model="form"
|
||||
v-show="active === 1"
|
||||
@submit="setMaster"
|
||||
:go-back="goBack"
|
||||
></legal-person>
|
||||
<waiting-check
|
||||
:status="form.status"
|
||||
:remarks="form.remarks"
|
||||
v-show="active === 2"
|
||||
@submit="
|
||||
() => {
|
||||
active = 0;
|
||||
}
|
||||
"
|
||||
></waiting-check>
|
||||
<finish v-show="active === 3"></finish>
|
||||
</div>
|
||||
</div>
|
||||
</basic-container>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getBaseDetail } from "@/api/tenant/company";
|
||||
import { submit } from "@/api/tenant/auth";
|
||||
import CompanyInfo from "./companyInfo";
|
||||
import LegalPerson from "./legalPerson";
|
||||
import WaitingCheck from "./waitingCheck";
|
||||
import finish from "./finish";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
CompanyInfo,
|
||||
LegalPerson,
|
||||
WaitingCheck,
|
||||
finish,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
companyName: "",
|
||||
companyTid: "",
|
||||
cityId: "",
|
||||
companyAddress: "",
|
||||
tradeId: "",
|
||||
authUrlId: "",
|
||||
masterName: "",
|
||||
masterIdentity: "",
|
||||
identityUrl4Id: "",
|
||||
identityUrl5Id: "",
|
||||
status: -1,
|
||||
},
|
||||
company: {},
|
||||
active: 0,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getInfo(() => {
|
||||
if (this.form.status === 1) {
|
||||
this.createTimer();
|
||||
}
|
||||
});
|
||||
if (this.auth === "1") {
|
||||
this.active = 2;
|
||||
}
|
||||
console.log('auth:'+this.active);
|
||||
},
|
||||
methods: {
|
||||
/*获取基本信息*/
|
||||
getInfo(cb) {
|
||||
getBaseDetail().then((res) => {
|
||||
console.log(res)
|
||||
this.form = res.data.data;
|
||||
cb && cb();
|
||||
if (this.form.status === 0) {
|
||||
this.active = 3;
|
||||
}
|
||||
});
|
||||
},
|
||||
goBack() {
|
||||
this.active--;
|
||||
},
|
||||
setCompany(info) {
|
||||
this.company = info;
|
||||
this.active = 1;
|
||||
},
|
||||
setMaster(info, cb) {
|
||||
this.master = info;
|
||||
submit({ ...this.company, ...info })
|
||||
.then(() => {
|
||||
cb && cb();
|
||||
this.$store.commit("SET_AUTH", "1");
|
||||
this.active = 2;
|
||||
this.form.status = 1;
|
||||
this.createTimer();
|
||||
})
|
||||
.catch((err) => {
|
||||
cb && cb(err);
|
||||
});
|
||||
},
|
||||
createTimer() {
|
||||
const timer = setInterval(() => {
|
||||
this.getInfo(() => {
|
||||
if (this.form.status !== 1) {
|
||||
clearInterval(timer);
|
||||
}
|
||||
});
|
||||
}, 60000);
|
||||
},
|
||||
},
|
||||
watch: {},
|
||||
computed: {
|
||||
auth() {
|
||||
return this.$store.state.user.auth;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.registerSteps,
|
||||
.pageContainer {
|
||||
margin-top: 15px;
|
||||
}
|
||||
</style>
|
||||
197
src/views/wel/cards/authSteps/legalPerson.vue
Normal file
197
src/views/wel/cards/authSteps/legalPerson.vue
Normal file
@@ -0,0 +1,197 @@
|
||||
<template>
|
||||
<div v-loading="loading">
|
||||
<el-row>
|
||||
<el-col :sm="24" :md="{ span: 12, offset: 6 }">
|
||||
<el-form
|
||||
:model="form"
|
||||
ref="form"
|
||||
class="content"
|
||||
label-position="right"
|
||||
label-width="140px"
|
||||
:rules="rules"
|
||||
>
|
||||
<el-form-item label="法人名称:" prop="masterName">
|
||||
<el-input
|
||||
placeholder="请输入法人名称"
|
||||
v-model.trim="form.masterName"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="法人身份证号:" prop="masterIdentity">
|
||||
<el-input
|
||||
placeholder="请输入法人身份证号"
|
||||
v-model.trim="form.masterIdentity"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="上传身份证件:" prop="identityUrl4Id">
|
||||
<el-upload
|
||||
:action="putFile"
|
||||
:show-file-list="false"
|
||||
:on-progress="
|
||||
() => {
|
||||
uploading.identityUrl4Id = true;
|
||||
}
|
||||
"
|
||||
:on-success="handleAvatarSuccess('identityUrl4Id')"
|
||||
:before-upload="beforeAvatarUpload"
|
||||
:http-request="httpRequest"
|
||||
>
|
||||
<div v-loading="uploading.identityUrl4Id">
|
||||
<img
|
||||
class="companyInfo-upload-image"
|
||||
:src="form.identityUrl4Id || identityUrl4Id"
|
||||
/>
|
||||
</div>
|
||||
<!-- <div class="companyInfo-upload-tip" slot="tip">
|
||||
点击上传身份证(头像面)
|
||||
</div> -->
|
||||
</el-upload>
|
||||
<p class="uploadImgP">上传图片大小限制2M以内</p>
|
||||
</el-form-item>
|
||||
<el-form-item prop="identityUrl5Id">
|
||||
<el-upload
|
||||
:action="putFile"
|
||||
:show-file-list="false"
|
||||
:on-progress="
|
||||
() => {
|
||||
uploading.identityUrl5Id = true;
|
||||
}
|
||||
"
|
||||
:on-success="handleAvatarSuccess('identityUrl5Id')"
|
||||
:before-upload="beforeAvatarUpload"
|
||||
:http-request="httpRequest"
|
||||
>
|
||||
<div v-loading="uploading.identityUrl5Id">
|
||||
<img
|
||||
class="companyInfo-upload-image"
|
||||
:src="form.identityUrl5Id || identityUrl5Id"
|
||||
/>
|
||||
</div>
|
||||
<!-- <div class="companyInfo-upload-tip" slot="tip">
|
||||
点击上传身份证(国徽面)
|
||||
</div> -->
|
||||
</el-upload>
|
||||
<p class="uploadImgP">上传图片大小限制2M以内</p>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button @click="next" type="primary">提交</el-button>
|
||||
<el-button @click="goBack">上一步</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { check18IdCardNo } from "@/util/validate";
|
||||
import { putFile } from "@/api/resource/oss";
|
||||
import lodash from "lodash";
|
||||
import httpRequest from "./httpRequest";
|
||||
|
||||
const accept = ["image/png", "image/jpeg", "image/svg+xml", "image/gif"];
|
||||
|
||||
export default {
|
||||
props: {
|
||||
goBack: Function,
|
||||
value: Object,
|
||||
},
|
||||
data() {
|
||||
const validateIdNumber = (rule, value, callback) => {
|
||||
if (check18IdCardNo(value)) {
|
||||
callback();
|
||||
} else {
|
||||
callback(new Error("身份证格式不正确"));
|
||||
}
|
||||
};
|
||||
return {
|
||||
loading: false,
|
||||
putFile,
|
||||
uploading: { identityUrl4Id: false, identityUrl5Id: false },
|
||||
identityUrl4Id: "/img/idcard-h.png",
|
||||
identityUrl5Id: "/img/idcard-e.png",
|
||||
rules: {
|
||||
masterName: [
|
||||
{ required: true, message: "请输入法人姓名", trigger: "blur" },
|
||||
],
|
||||
masterIdentity: [
|
||||
{ required: true, message: "请输入法人身份证号", trigger: "blur" },
|
||||
{ trigger: "blur", validator: validateIdNumber },
|
||||
],
|
||||
identityUrl4Id: [
|
||||
{
|
||||
required: true,
|
||||
message: "请上传身份证(头像面)",
|
||||
trigger: "change",
|
||||
},
|
||||
],
|
||||
identityUrl5Id: [
|
||||
{
|
||||
required: true,
|
||||
message: "请上传身份证(国徽面)",
|
||||
trigger: "change",
|
||||
},
|
||||
],
|
||||
},
|
||||
form: lodash.clone(this.value || {}),
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
next() {
|
||||
this.$refs.form.validate((valid) => {
|
||||
if (valid) {
|
||||
this.loading = true;
|
||||
this.$emit("submit", this.form, () => {
|
||||
this.loading = false;
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
/**上传图片**/
|
||||
handleAvatarSuccess(type) {
|
||||
return (res, file) => {
|
||||
this[type] = URL.createObjectURL(file.raw);
|
||||
this.$set(this.form, type, res.data.link);
|
||||
this.$set(this.uploading, type, false);
|
||||
};
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
const isJPG = accept.includes(file.type);
|
||||
const is2M=file.size/1024/1024<2;
|
||||
if (!isJPG) {
|
||||
this.$message.error("图片格式不正确!");
|
||||
}
|
||||
if(!is2M){
|
||||
this.$message.error("上传图片大小不能超过2M!");
|
||||
}
|
||||
return isJPG && is2M;
|
||||
},
|
||||
/**上传图片*/
|
||||
httpRequest,
|
||||
},
|
||||
watch: {
|
||||
value(val) {
|
||||
this.form = val;
|
||||
},
|
||||
form: {
|
||||
handler(val) {
|
||||
this.$emit("input", val);
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
computed: {},
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.el-form-item__content{
|
||||
line-height: normal;
|
||||
}
|
||||
.uploadImgP{
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
line-height: 18px;
|
||||
}
|
||||
.companyInfo-upload-image {
|
||||
height: 100px;
|
||||
width: 160px;
|
||||
}
|
||||
</style>
|
||||
82
src/views/wel/cards/authSteps/waitingCheck.vue
Normal file
82
src/views/wel/cards/authSteps/waitingCheck.vue
Normal file
@@ -0,0 +1,82 @@
|
||||
<template>
|
||||
<basic-container>
|
||||
<div class="waiting-check" v-if="status != 0">
|
||||
<div>
|
||||
<i class="waiting-check-icon el-icon-success"></i>
|
||||
</div>
|
||||
<div class="waiting-check-title">信息提交成功</div>
|
||||
<div class="waiting-check-tip">我们将在3-5天内完成审核,请保持电话畅通。有问题请联系业务人员或者客服:185-0020-6848</div>
|
||||
</div>
|
||||
<div class="waiting-check" v-else-if="status === 2">
|
||||
<div>
|
||||
<i class="waiting-check-icon el-icon-error"></i>
|
||||
</div>
|
||||
<div class="waiting-check-title">信息审核失败</div>
|
||||
<div class="waiting-check-tip">
|
||||
<p>请联系业务人员或者客服提交材料重新审核。</p>
|
||||
<p>客服电话:185-0020-6848</p>
|
||||
</div>
|
||||
<!--<div class="waiting-check-tip">{{remarks}}</div>-->
|
||||
<!--
|
||||
<el-button type="primary" @click="$emit('submit')">重新编辑</el-button>
|
||||
-->
|
||||
</div>
|
||||
</basic-container>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
status: Number,
|
||||
remarks: String,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
height: 100,
|
||||
};
|
||||
},
|
||||
mounted() {},
|
||||
methods: {},
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.waiting-check {
|
||||
height: 207px;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
.waiting-check-icon {
|
||||
font-size: 72px;
|
||||
}
|
||||
.waiting-check-icon.el-icon-success {
|
||||
font-size: 72px;
|
||||
color: #64c83c;
|
||||
}
|
||||
.waiting-check-icon.el-icon-error {
|
||||
font-size: 72px;
|
||||
color: #fa6e6e;
|
||||
}
|
||||
.waiting-check-title {
|
||||
font-family: PingFangSC-Medium;
|
||||
font-size: 24px;
|
||||
color: #4f5e7b;
|
||||
letter-spacing: 0;
|
||||
text-align: center;
|
||||
line-height: 24px;
|
||||
margin: 36px auto 16px auto;
|
||||
}
|
||||
/*.waiting-check-tip {
|
||||
font-family: PingFangSC-Regular;
|
||||
font-size: 14px;
|
||||
color: #999999;
|
||||
letter-spacing: 0;
|
||||
text-align: center;
|
||||
margin-bottom: 16px;
|
||||
}*/
|
||||
.waiting-check-tip {
|
||||
font-size: 20px;
|
||||
color: #333333;
|
||||
letter-spacing: 0;
|
||||
text-align: center;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
</style>
|
||||
79
src/views/wel/cards/businesscard.vue
Normal file
79
src/views/wel/cards/businesscard.vue
Normal file
@@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<card title="企业信息">
|
||||
<div class="wel-cards-business">
|
||||
<img src="/manage/svg/pic_business.svg" alt />
|
||||
<div class="wel-cards-txt">
|
||||
<div :title="companyName">
|
||||
<span>{{companyName}}</span>
|
||||
</div>
|
||||
<div>
|
||||
企业资料审核状态:
|
||||
<span v-if="status === 0" class="wel-cards-business-status">已审核</span>
|
||||
<span v-else-if="status === 1" class="wel-cards-business-status">未审核</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import card from "./card";
|
||||
import { getBaseDetail } from "@/api/tenant/company";
|
||||
|
||||
export default {
|
||||
components: { card },
|
||||
data () {
|
||||
return {
|
||||
companyName: "",
|
||||
status: -1
|
||||
};
|
||||
},
|
||||
mounted () {
|
||||
this.getData();
|
||||
},
|
||||
methods: {
|
||||
getData () {
|
||||
getBaseDetail().then(resp => {
|
||||
this.companyName = resp.data.data.companyName;
|
||||
this.status = resp.data.data.status;
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.wel-cards-business {
|
||||
width: 100%;
|
||||
height: calc(100% - 20px);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
.wel-cards-business img {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 0px;
|
||||
right: 10px;
|
||||
margin: auto;
|
||||
width: auto;
|
||||
height: 160px;
|
||||
}
|
||||
.wel-cards-business .wel-cards-txt {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
}
|
||||
.wel-cards-business .wel-cards-txt div {
|
||||
font-size: 16px;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.wel-cards-business .wel-cards-txt div:not(:first-child) {
|
||||
margin-top: 12px;
|
||||
}
|
||||
.wel-cards-business-status {
|
||||
color: #80bf50;
|
||||
}
|
||||
</style>
|
||||
44
src/views/wel/cards/card.vue
Normal file
44
src/views/wel/cards/card.vue
Normal file
@@ -0,0 +1,44 @@
|
||||
<template>
|
||||
<div class="jl-card">
|
||||
<div v-if="title" class="jl-card-title">
|
||||
<span>{{title}}</span>
|
||||
<div class="jl-card-title-tool">
|
||||
<slot name="tool"></slot>
|
||||
</div>
|
||||
</div>
|
||||
<slot></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: { title: String },
|
||||
data () {
|
||||
return {};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.jl-card {
|
||||
width: 100%;
|
||||
height: 320px;
|
||||
background: #fff;
|
||||
padding: 20px 20px;
|
||||
position: relative;
|
||||
color: #333;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.jl-card-title {
|
||||
border: 0px solid #5d9df8;
|
||||
border-left-width: 4px;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
padding-left: 8px;
|
||||
}
|
||||
.jl-card-title-tool {
|
||||
float: right;
|
||||
}
|
||||
</style>
|
||||
68
src/views/wel/cards/hellocard.vue
Normal file
68
src/views/wel/cards/hellocard.vue
Normal file
@@ -0,0 +1,68 @@
|
||||
<template>
|
||||
<card class="wel-admin-hello">
|
||||
<h1>您好,{{userInfo.real_name}}</h1>
|
||||
<span>待办提醒:</span>
|
||||
<span>
|
||||
招聘中
|
||||
<i>{{form.employCount}}</i>
|
||||
</span>
|
||||
<span>
|
||||
任务中
|
||||
<i>{{form.doIngCount}}</i>
|
||||
</span>
|
||||
<span>
|
||||
已完成
|
||||
<i>{{form.completCount}}</i>
|
||||
</span>
|
||||
</card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { missionCount } from "@/api/tenant/index";
|
||||
import { mapGetters } from "vuex";
|
||||
import card from "./card";
|
||||
|
||||
export default {
|
||||
components: { card },
|
||||
data() {
|
||||
return {
|
||||
form: {}
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.getData();
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
missionCount().then(resp => {
|
||||
this.form = resp.data.data;
|
||||
});
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(["userInfo"])
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.wel-admin-hello {
|
||||
height: 160px;
|
||||
padding-left: 30px;
|
||||
}
|
||||
.wel-admin-hello h1 {
|
||||
font-size: 24px;
|
||||
margin: 14px 0 26px 0;
|
||||
}
|
||||
.wel-admin-hello span {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
display: inline-block;
|
||||
line-height: 18px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.wel-admin-hello i {
|
||||
font-style: normal;
|
||||
color: #5d9df8;
|
||||
}
|
||||
</style>
|
||||
82
src/views/wel/cards/quickcard.vue
Normal file
82
src/views/wel/cards/quickcard.vue
Normal file
@@ -0,0 +1,82 @@
|
||||
<template>
|
||||
<card title="快捷工具">
|
||||
<div class="wel-cards-quick">
|
||||
<ul>
|
||||
<li v-for="item in quickBtn" :key="item.id">
|
||||
<router-link tag="div" :to="item.url" :title="item.name">
|
||||
<img :src="item.icon" />
|
||||
<div>{{item.name}}</div>
|
||||
</router-link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import card from "./card";
|
||||
|
||||
export default {
|
||||
components: { card },
|
||||
data () {
|
||||
return {
|
||||
quickBtn: [
|
||||
{ id: 1, url: "/tenant/mission/index", icon: "/manage/img/icon/task.png", name: "发布任务" },
|
||||
{ id: 2, url: "/tenant/talents/index", icon: "/manage/img/icon/m_search.png", name: "人才库查询" },
|
||||
{ id: 3, url: "", icon: "/manage/img/icon/insure_search.png", name: "社区服务站" },
|
||||
{ id: 4, url: "", icon: "/manage/img/icon/count.png", name: "政策制度" }
|
||||
]
|
||||
};
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.wel-cards-quick {
|
||||
/* box-sizing: border-box; */
|
||||
/* padding:32px 0 32px 0; */
|
||||
position: absolute;
|
||||
top: 72px;
|
||||
bottom: 32px;
|
||||
left: 0;
|
||||
right: 0;
|
||||
/* height: 220px; */
|
||||
|
||||
margin: 0 auto;
|
||||
}
|
||||
.wel-cards-quick ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
.wel-cards-quick li {
|
||||
list-style: none;
|
||||
flex-basis: 33.3%;
|
||||
text-align: center;
|
||||
}
|
||||
.wel-cards-quick div {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
.wel-cards-quick img {
|
||||
width: 40px;
|
||||
height: auto;
|
||||
display: block;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.wel-cards-quick div {
|
||||
width: 100%;
|
||||
padding-top: 5px;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
</style>
|
||||
146
src/views/wel/cards/wagecard.vue
Normal file
146
src/views/wel/cards/wagecard.vue
Normal file
@@ -0,0 +1,146 @@
|
||||
<template>
|
||||
<card title="招聘统计">
|
||||
<div ref="main" style="width: 100%;height:260px;margin-top:10px;"></div>
|
||||
<template v-slot:tool>
|
||||
<span style="font-size:12px;margin-right:5px;color:#999999">选择年份</span>
|
||||
<el-select v-model="year" placeholder="请选择" size="mini" style="width:90px">
|
||||
<el-option v-for="item in options" :key="item" :label="item + '年'" :value="item"></el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import card from "./card";
|
||||
import Echarts from "echarts";
|
||||
|
||||
function getOption (data) {
|
||||
const option = {
|
||||
color: ["#5d9df8"],
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
// 坐标轴指示器,坐标轴触发有效
|
||||
type: "shadow" // 默认为直线,可选为:'line' | 'shadow'
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: "3%",
|
||||
right: "4%",
|
||||
bottom: "3%",
|
||||
top: "25",
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: "category",
|
||||
data: [
|
||||
"1月",
|
||||
"2月",
|
||||
"3月",
|
||||
"4月",
|
||||
"5月",
|
||||
"6月",
|
||||
"7月",
|
||||
"8月",
|
||||
"9月",
|
||||
"10月",
|
||||
"11月",
|
||||
"12月"
|
||||
],
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: '#999999', //更改坐标轴文字颜色
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff', // x坐标轴的轴线bai颜色
|
||||
width: 0 //这里是坐标轴的宽度,为0就是不显示
|
||||
}
|
||||
},
|
||||
axisTick: {
|
||||
alignWithLabel: true
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: '#999999', //更改坐标轴文字颜色
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff', // x坐标轴的轴线bai颜色
|
||||
width: 0 //这里是坐标轴的宽度,为0就是不显示
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: "工资",
|
||||
type: "bar",
|
||||
barWidth: "20%",
|
||||
data: data,
|
||||
itemStyle: { barBorderRadius: 25 }
|
||||
}
|
||||
]
|
||||
};
|
||||
return option;
|
||||
}
|
||||
|
||||
export default {
|
||||
components: { card },
|
||||
data () {
|
||||
const options = [];
|
||||
const year = new Date().getFullYear();
|
||||
for (let index = 0; index < 4; index++) {
|
||||
options.push(year - index);
|
||||
}
|
||||
return {
|
||||
options,
|
||||
year,
|
||||
chart: null,
|
||||
sizeInt: null,
|
||||
width: 0
|
||||
};
|
||||
},
|
||||
mounted () {
|
||||
const main = this.$refs.main;
|
||||
this.chart = Echarts.init(main);
|
||||
this.width = main.clientWidth;
|
||||
this.chart.setOption(getOption());
|
||||
this.sizeInt = setInterval(() => {
|
||||
if (this.width !== main.clientWidth) {
|
||||
this.chart.resize();
|
||||
}
|
||||
}, 300);
|
||||
this.getData();
|
||||
},
|
||||
methods: {
|
||||
getData () {
|
||||
// monthPay(this.year).then(resp => {
|
||||
// this.chart.setOption(getOption(resp.data.data));
|
||||
// });
|
||||
this.chart.setOption(getOption(null));
|
||||
}
|
||||
},
|
||||
beforeDestroy () {
|
||||
clearInterval(this.sizeInt);
|
||||
},
|
||||
watch: {
|
||||
year () {
|
||||
this.getData();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
141
src/views/wel/cards/workercard.vue
Normal file
141
src/views/wel/cards/workercard.vue
Normal file
@@ -0,0 +1,141 @@
|
||||
<template>
|
||||
<card title="用工统计">
|
||||
<div ref="main" style="width: 100%;height:260px;margin-top:10px;"></div>
|
||||
<template v-slot:tool>
|
||||
<span style="font-size:12px;margin-right:5px;color:#999999">选择年份</span>
|
||||
<el-select v-model="year" placeholder="请选择" size="mini" style="width:90px">
|
||||
<el-option v-for="item in options" :key="item" :label="item+ '年'" :value="item"></el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</card>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import card from "./card";
|
||||
import Echarts from "echarts";
|
||||
import { employedCount } from "@/api/tenant/index";
|
||||
|
||||
function getOption (data) {
|
||||
const option = {
|
||||
color: ["#5d9df8"],
|
||||
tooltip: {},
|
||||
grid: {
|
||||
left: "3%",
|
||||
right: "4%",
|
||||
bottom: "3%",
|
||||
top: "25",
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
data: [
|
||||
"1月",
|
||||
"2月",
|
||||
"3月",
|
||||
"4月",
|
||||
"5月",
|
||||
"6月",
|
||||
"7月",
|
||||
"8月",
|
||||
"9月",
|
||||
"10月",
|
||||
"11月",
|
||||
"12月"
|
||||
],
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: '#999999', //更改坐标轴文字颜色
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff', // x坐标轴的轴线bai颜色
|
||||
width: 0 //这里是坐标轴的宽度,为0就是不显示
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: '#999999', //更改坐标轴文字颜色
|
||||
}
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#fff', // x坐标轴的轴线bai颜色
|
||||
width: 0 //这里是坐标轴的宽度,为0就是不显示
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: "人数",
|
||||
type: "line",
|
||||
data: data,
|
||||
symbolSize: 15,
|
||||
areaStyle: {
|
||||
color: new Echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(93,157,248,255)"
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "rgba(93,157,248,0)"
|
||||
}
|
||||
])
|
||||
}
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
return option;
|
||||
}
|
||||
|
||||
export default {
|
||||
components: { card },
|
||||
data () {
|
||||
const options = [];
|
||||
const year = new Date().getFullYear();
|
||||
for (let index = 0; index < 4; index++) {
|
||||
options.push(year - index);
|
||||
}
|
||||
return { options, year, chart: null, sizeInt: null, width: 0 };
|
||||
},
|
||||
mounted () {
|
||||
const main = this.$refs.main;
|
||||
this.chart = Echarts.init(main);
|
||||
this.width = main.clientWidth;
|
||||
this.chart.setOption(getOption([]));
|
||||
this.sizeInt = setInterval(() => {
|
||||
if (this.width !== main.clientWidth) {
|
||||
this.chart.resize();
|
||||
}
|
||||
}, 300);
|
||||
this.getData();
|
||||
},
|
||||
methods: {
|
||||
getData () {
|
||||
employedCount(this.year).then(resp => {
|
||||
this.chart.setOption(getOption(resp.data.data));
|
||||
});
|
||||
}
|
||||
},
|
||||
beforeDestroy () {
|
||||
clearInterval(this.sizeInt);
|
||||
},
|
||||
watch: {
|
||||
year () {
|
||||
this.getData();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
Reference in New Issue
Block a user