新闻分页
This commit is contained in:
quantulr
@ -161,7 +161,7 @@ if (route.query.id) {
|
||||
<el-col :span="12">
|
||||
<el-form-item
|
||||
v-if="index === 2 || index === 3"
|
||||
:label="t('admin.form.amount')"
|
||||
:label="`${t('admin.form.amount')}（${t('admin.table.tenThousandYuan')}）`"
|
||||
>
|
||||
<el-input-number
|
||||
v-model="updateStatusList[index].remark"
|
||||
|
||||
@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:label-width="labelWidth + 'px'"
|
||||
:model="modelValue"
|
||||
:rules="rules"
|
||||
ref="formRef"
|
||||
:label-width="labelWidth + 'px'"
|
||||
:model="modelValue"
|
||||
:rules="rules"
|
||||
>
|
||||
<div v-if="showTitle" class="form_title">
|
||||
{{ t("admin.form.basicInfo") }}
|
||||
@ -46,8 +46,8 @@
|
||||
<el-row v-if="isAdd">
|
||||
<el-col :span="24">
|
||||
<el-form-item
|
||||
:label="/*身份证号:*/ t('admin.form.idCardNumber')"
|
||||
prop="idCard"
|
||||
:label="/*身份证号:*/ t('admin.form.idCardNumber')"
|
||||
prop="idCard"
|
||||
>
|
||||
<el-input v-model="modelValue.idCard"></el-input>
|
||||
</el-form-item>
|
||||
@ -57,7 +57,7 @@
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="t('admin.form.workLocation')" prop="wordAddress">
|
||||
<el-input v-model="modelValue.wordAddress" />
|
||||
<el-input v-model="modelValue.wordAddress"/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -66,35 +66,35 @@
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="t('admin.form.workExperience')" prop="experience">
|
||||
<el-input
|
||||
v-model="modelValue.experience"
|
||||
:autosize="{ minRows: 2, maxRows: 10 }"
|
||||
type="textarea"
|
||||
v-model="modelValue.experience"
|
||||
:autosize="{ minRows: 2, maxRows: 10 }"
|
||||
type="textarea"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<field-options ref="researchsFormRef" v-model="modelValue" />
|
||||
<field-options ref="researchsFormRef" v-model="modelValue"/>
|
||||
|
||||
<InputBoxAdd
|
||||
ref="keywordsFormRef"
|
||||
v-model="modelValue"
|
||||
:labelWidth="labelWidth"
|
||||
fieldKey="keywords"
|
||||
:placeholder="t('admin.form.inputKeywords')"
|
||||
:title="t('admin.form.keywords')"
|
||||
ref="keywordsFormRef"
|
||||
v-model="modelValue"
|
||||
:labelWidth="labelWidth"
|
||||
fieldKey="keywords"
|
||||
:placeholder="t('admin.form.inputKeywords')"
|
||||
:title="t('admin.form.keywords')"
|
||||
/>
|
||||
|
||||
<el-row v-if="isAdd">
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="t('admin.form.idCard')">
|
||||
<el-form-item :label="t('admin.form.idCard')" prop="idImage">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<el-form-item prop="idImage.0">
|
||||
<ImageUpload
|
||||
v-model="modelValue.idImage[0]"
|
||||
:isShowTip="false"
|
||||
:limit="1"
|
||||
v-model="modelValue.idImage[0]"
|
||||
:isShowTip="false"
|
||||
:limit="1"
|
||||
/>
|
||||
</el-form-item>
|
||||
<div style="text-align: center">
|
||||
@ -105,9 +105,9 @@
|
||||
<el-col :span="8">
|
||||
<el-form-item prop="idImage.1">
|
||||
<ImageUpload
|
||||
v-model="modelValue.idImage[1]"
|
||||
:isShowTip="false"
|
||||
:limit="1"
|
||||
v-model="modelValue.idImage[1]"
|
||||
:isShowTip="false"
|
||||
:limit="1"
|
||||
/>
|
||||
</el-form-item>
|
||||
<div style="text-align: center">
|
||||
@ -118,9 +118,9 @@
|
||||
<el-col :span="8">
|
||||
<el-form-item prop="idImage.2">
|
||||
<ImageUpload
|
||||
v-model="modelValue.idImage[2]"
|
||||
:isShowTip="false"
|
||||
:limit="1"
|
||||
v-model="modelValue.idImage[2]"
|
||||
:isShowTip="false"
|
||||
:limit="1"
|
||||
/>
|
||||
</el-form-item>
|
||||
<div style="text-align: center">
|
||||
@ -136,14 +136,14 @@
|
||||
<el-row v-if="isAdd">
|
||||
<el-col :span="24">
|
||||
<el-form-item
|
||||
:label="t('admin.form.achievementBroker')"
|
||||
prop="certificatePics"
|
||||
:label="t('admin.form.achievementBroker')"
|
||||
prop="certificatePics"
|
||||
>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="8">
|
||||
<image-upload
|
||||
v-model="modelValue.certificatePics"
|
||||
:isShowTip="false"
|
||||
v-model="modelValue.certificatePics"
|
||||
:isShowTip="false"
|
||||
/>
|
||||
</el-col>
|
||||
</el-row>
|
||||
@ -155,10 +155,10 @@
|
||||
<script setup>
|
||||
import InputBoxAdd from "../InputBoxAdd";
|
||||
import FieldOptions from "../FieldOptions";
|
||||
import { computed, reactive, ref } from "vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import {computed, reactive, ref} from "vue";
|
||||
import {useI18n} from "vue-i18n";
|
||||
|
||||
const { t } = useI18n();
|
||||
const {t} = useI18n();
|
||||
const formRef = ref();
|
||||
const researchsFormRef = ref();
|
||||
const keywordsFormRef = ref();
|
||||
@ -206,11 +206,11 @@ const rules = reactive({
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
mobile: [
|
||||
phone: [
|
||||
{
|
||||
required: true,
|
||||
message: computed(() =>
|
||||
t("admin.form.placeholder", { type: t("admin.form.mobile") })
|
||||
t("admin.form.placeholder", {type: t("admin.form.mobile")})
|
||||
),
|
||||
trigger: "blur",
|
||||
},
|
||||
@ -220,12 +220,20 @@ const rules = reactive({
|
||||
// trigger: "blur",
|
||||
// },
|
||||
],
|
||||
email: [
|
||||
{
|
||||
required: true,
|
||||
message: computed(() =>
|
||||
t("admin.form.placeholder", {type: t("admin.form.email")})
|
||||
),
|
||||
trigger: "blur",
|
||||
},],
|
||||
idCard: [
|
||||
// {
|
||||
// required: true,
|
||||
// message: computed(() => t("admin.form.placeholder")),
|
||||
// trigger: "blur",
|
||||
// },
|
||||
{
|
||||
required: true,
|
||||
message: computed(() => t("admin.form.placeholder")),
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
wordAddress: [
|
||||
{
|
||||
@ -241,34 +249,41 @@ const rules = reactive({
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
idImage: [
|
||||
{
|
||||
required: true,
|
||||
trigger: "change",
|
||||
message: computed(() => t("admin.validation.pleaseUpload")),
|
||||
}
|
||||
],
|
||||
"idImage.0": [
|
||||
// {
|
||||
// required: true,
|
||||
// message: computed(() => t("admin.validation.pleaseUpload")),
|
||||
// trigger: ["blur", "change"],
|
||||
// },
|
||||
],
|
||||
"idImage.1": [
|
||||
// {
|
||||
// required: true,
|
||||
// message: computed(() => t("admin.validation.pleaseUpload")),
|
||||
// trigger: ["blur", "change"],
|
||||
// },
|
||||
],
|
||||
"idImage.2": [
|
||||
// {
|
||||
// required: true,
|
||||
// message: computed(() => t("admin.validation.pleaseUpload")),
|
||||
// trigger: ["blur", "change"],
|
||||
// },
|
||||
],
|
||||
certificatePics: [
|
||||
{
|
||||
required: true,
|
||||
message: computed(() => t("admin.validation.pleaseUpload")),
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
],
|
||||
"idImage.1": [
|
||||
{
|
||||
required: true,
|
||||
message: computed(() => t("admin.validation.pleaseUpload")),
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
],
|
||||
"idImage.2": [
|
||||
{
|
||||
required: true,
|
||||
message: computed(() => t("admin.validation.pleaseUpload")),
|
||||
trigger: ["blur", "change"],
|
||||
},
|
||||
],
|
||||
certificatePics: [
|
||||
// {
|
||||
// required: true,
|
||||
// message: computed(() => t("admin.validation.pleaseUpload")),
|
||||
// trigger: ["blur", "change"],
|
||||
// },
|
||||
],
|
||||
});
|
||||
|
||||
const validateForm = async () => {
|
||||
|
||||
@ -1,21 +1,21 @@
|
||||
<template>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:label-width="labelWidth + 'px'"
|
||||
:model="modelValue"
|
||||
:rules="rules"
|
||||
ref="formRef"
|
||||
:label-width="labelWidth + 'px'"
|
||||
:model="modelValue"
|
||||
:rules="rules"
|
||||
>
|
||||
<div v-if="showTitle" class="form_title">
|
||||
{{ t("admin.form.basicInfo") }}
|
||||
</div>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="t('admin.form.expertAvatar')">
|
||||
<ImageUpload v-model="modelValue.image" :limit="1" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!--FIXME: <el-row>-->
|
||||
<!-- <el-col :span="24">-->
|
||||
<!-- <el-form-item :label="t('admin.form.expertAvatar')">-->
|
||||
<!-- <ImageUpload v-model="modelValue.image" :limit="1" />-->
|
||||
<!-- </el-form-item>-->
|
||||
<!-- </el-col>-->
|
||||
<!-- </el-row>-->
|
||||
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
@ -88,15 +88,15 @@
|
||||
|
||||
<el-form-item :label="t('admin.form.country')" prop="country">
|
||||
<el-select
|
||||
v-model="modelValue.country"
|
||||
:placeholder="
|
||||
v-model="modelValue.country"
|
||||
:placeholder="
|
||||
t('admin.form.pleaseSelect', { type: t('admin.form.country') })
|
||||
"
|
||||
>
|
||||
<el-option
|
||||
v-for="option in countryOptions"
|
||||
:label="option[locale]"
|
||||
:value="option.key"
|
||||
v-for="option in countryOptions"
|
||||
:label="option[locale]"
|
||||
:value="option.key"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
@ -129,18 +129,18 @@
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item
|
||||
:label="t('admin.table.highestEducation')"
|
||||
prop="education"
|
||||
:label="t('admin.table.highestEducation')"
|
||||
prop="education"
|
||||
>
|
||||
<el-select
|
||||
v-model="modelValue.education"
|
||||
:placeholder="t('admin.form.pleaseSelect')"
|
||||
v-model="modelValue.education"
|
||||
:placeholder="t('admin.form.pleaseSelect')"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in educationOptions"
|
||||
:key="item.key"
|
||||
:label="item[locale]"
|
||||
:value="item.key"
|
||||
v-for="item in educationOptions"
|
||||
:key="item.key"
|
||||
:label="item[locale]"
|
||||
:value="item.key"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
@ -170,10 +170,10 @@
|
||||
<el-col :span="12">
|
||||
<el-form-item :label="t('admin.form.workingTime')" prop="workTime">
|
||||
<el-date-picker
|
||||
v-model="modelValue.workTime"
|
||||
:placeholder="t('admin.form.pleaseSelect')"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
v-model="modelValue.workTime"
|
||||
:placeholder="t('admin.form.pleaseSelect')"
|
||||
type="date"
|
||||
value-format="YYYY-MM-DD"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
@ -184,52 +184,52 @@
|
||||
{{ t("gender.male") }}
|
||||
</el-radio>
|
||||
<el-radio v-model="modelValue.gender" label="2"
|
||||
>{{ t("gender.female") }}
|
||||
>{{ t("gender.female") }}
|
||||
</el-radio>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<FieldOptions
|
||||
ref="fieldFormRef"
|
||||
v-model="modelValue"
|
||||
:labelWidth="labelWidth"
|
||||
ref="fieldFormRef"
|
||||
v-model="modelValue"
|
||||
:labelWidth="labelWidth"
|
||||
/>
|
||||
|
||||
<InputBoxAdd
|
||||
ref="keywordsFormRef"
|
||||
v-model="modelValue"
|
||||
:labelWidth="labelWidth"
|
||||
:placeholder="t('admin.form.inputKeywords')"
|
||||
:title="t('admin.form.keywords')"
|
||||
fieldKey="keywords"
|
||||
ref="keywordsFormRef"
|
||||
v-model="modelValue"
|
||||
:labelWidth="labelWidth"
|
||||
:placeholder="t('admin.form.inputKeywords')"
|
||||
:title="t('admin.form.keywords')"
|
||||
fieldKey="keywords"
|
||||
/>
|
||||
<InputBoxAdd
|
||||
ref="researchsFormRef"
|
||||
v-model="modelValue"
|
||||
:labelWidth="labelWidth"
|
||||
:placeholder="
|
||||
ref="researchsFormRef"
|
||||
v-model="modelValue"
|
||||
:labelWidth="labelWidth"
|
||||
:placeholder="
|
||||
t('admin.form.placeholder', {
|
||||
name: t('admin.form.researchDirection'),
|
||||
})
|
||||
"
|
||||
:title="t('admin.form.researchDirection')"
|
||||
fieldKey="researchs"
|
||||
:title="t('admin.form.researchDirection')"
|
||||
fieldKey="researchs"
|
||||
/>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label="t('admin.form.personalProfile')" prop="introduce">
|
||||
<el-input
|
||||
v-model="modelValue.introduce"
|
||||
:placeholder="
|
||||
v-model="modelValue.introduce"
|
||||
:placeholder="
|
||||
t(
|
||||
'admin.validation.pleaseEnterResearchDirectionCoreTechnologyAndProductRepresentativePatentsAndPapersUndertakeTheNameAndAbstractOfScientificResearchProjects'
|
||||
)
|
||||
"
|
||||
type="textarea"
|
||||
:autosize="{ minRows: 6, maxRows: 8 }"
|
||||
show-word-limit
|
||||
type="textarea"
|
||||
:autosize="{ minRows: 6, maxRows: 8 }"
|
||||
show-word-limit
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@ -240,11 +240,11 @@
|
||||
<script name="ExpertForm" setup>
|
||||
import FieldOptions from "@/views/components/FieldOptions";
|
||||
import InputBoxAdd from "@/views/components/InputBoxAdd";
|
||||
import { countryOptions, educationOptions } from "@/utils/parameter";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { computed, toRefs } from "vue";
|
||||
import {countryOptions, educationOptions} from "@/utils/parameter";
|
||||
import {useI18n} from "vue-i18n";
|
||||
import {computed, onActivated, reactive, ref, toRefs} from "vue";
|
||||
|
||||
const { t, locale } = useI18n();
|
||||
const {t, locale} = useI18n();
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: Object,
|
||||
@ -261,7 +261,7 @@ const props = defineProps({
|
||||
default: 120,
|
||||
},
|
||||
});
|
||||
const { modelValue, isAdd, showTitle, labelWidth } = toRefs(props);
|
||||
const {modelValue, isAdd, showTitle, labelWidth} = toRefs(props);
|
||||
const data = reactive({
|
||||
rules: {
|
||||
product: [
|
||||
@ -373,7 +373,7 @@ const data = reactive({
|
||||
{
|
||||
required: true,
|
||||
message: computed(() =>
|
||||
t("admin.validation.required", { type: t("admin.form.workingTime") })
|
||||
t("admin.validation.required", {type: t("admin.form.workingTime")})
|
||||
),
|
||||
trigger: ["change", "blur"],
|
||||
},
|
||||
@ -395,7 +395,7 @@ const data = reactive({
|
||||
},
|
||||
});
|
||||
|
||||
const { rules } = toRefs(data);
|
||||
const {rules} = toRefs(data);
|
||||
const researchOptions = ref([]);
|
||||
const options = ref([]);
|
||||
const formRef = ref();
|
||||
@ -403,7 +403,8 @@ const cityFormRef = ref();
|
||||
const fieldFormRef = ref();
|
||||
const keywordsFormRef = ref();
|
||||
const researchsFormRef = ref();
|
||||
const setLaboratory = () => {};
|
||||
const setLaboratory = () => {
|
||||
};
|
||||
const validateForm = async () => {
|
||||
let formValid;
|
||||
try {
|
||||
@ -416,11 +417,11 @@ const validateForm = async () => {
|
||||
const keywordsFormValid = await keywordsFormRef.value.validateForm(); // 关键词表单验证
|
||||
const researchsFormValid = await researchsFormRef.value.validateForm(); // 研究方向表单验证
|
||||
return (
|
||||
formValid &&
|
||||
// cityFormValid &&
|
||||
fieldFormValid &&
|
||||
keywordsFormValid &&
|
||||
researchsFormValid
|
||||
formValid &&
|
||||
// cityFormValid &&
|
||||
fieldFormValid &&
|
||||
keywordsFormValid &&
|
||||
researchsFormValid
|
||||
);
|
||||
// if (isAdd.value) {
|
||||
// // const directionsFormValid = await directionsFormRef.value.validateForm();
|
||||
|
||||
@ -10,15 +10,16 @@
|
||||
<el-form-item
|
||||
:label="`${title}:`"
|
||||
:prop="fieldKey"
|
||||
:rules="[
|
||||
|
||||
>
|
||||
<!-- :rules="[
|
||||
{
|
||||
required: true,
|
||||
type: 'array',
|
||||
message: t('admin.validation.pleaseInputAndAdd'),
|
||||
trigger: 'change',
|
||||
},
|
||||
]"
|
||||
>
|
||||
]"-->
|
||||
<el-row type="flex" class="input-add-bar" justify="space-between">
|
||||
<el-col :span="20">
|
||||
<el-input v-model="dataVal" :placeholder="placeholder"></el-input>
|
||||
|
||||
@ -1,9 +1,11 @@
|
||||
<script setup>
|
||||
import { reactive, ref, toRefs } from "vue";
|
||||
import { listNews } from "@/api/website/home/news";
|
||||
import {reactive, ref, toRefs} from "vue";
|
||||
import {listNews} from "@/api/website/home/news";
|
||||
import Pagination from "@/components/Pagination/index.vue";
|
||||
import { useI18n } from "vue-i18n";
|
||||
const { t, locale } = useI18n();
|
||||
import {useI18n} from "vue-i18n";
|
||||
import dayjs from "dayjs";
|
||||
|
||||
const {t, locale} = useI18n();
|
||||
const file_base_url = `${import.meta.env.VITE_APP_BASE_API}/file`;
|
||||
const total = ref(0);
|
||||
const newsList = ref([]);
|
||||
@ -12,12 +14,12 @@ const data = reactive({
|
||||
latestNews: {},
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 8,
|
||||
pageSize: 10,
|
||||
classification: "0",
|
||||
},
|
||||
});
|
||||
|
||||
const { queryParams, latestNews } = toRefs(data);
|
||||
const {queryParams, latestNews} = toRefs(data);
|
||||
const getList = () => {
|
||||
listNews(queryParams.value).then((resp) => {
|
||||
newsList.value = resp.rows;
|
||||
@ -26,7 +28,7 @@ const getList = () => {
|
||||
};
|
||||
|
||||
const getLatestNews = () => {
|
||||
listNews({ pageNum: 1, pageSize: 1 }).then((resp) => {
|
||||
listNews({pageNum: 1, pageSize: 1}).then((resp) => {
|
||||
if (resp.total) {
|
||||
latestNews.value = resp.rows[0];
|
||||
}
|
||||
@ -44,13 +46,13 @@ getList();
|
||||
<template>
|
||||
<div class="news-container" style="height: 100%">
|
||||
<div class="left">
|
||||
<img class="cover-image" :src="`${file_base_url}${latestNews?.cover}`" />
|
||||
<img class="cover-image" :src="`${file_base_url}${latestNews?.cover}`"/>
|
||||
<p class="title">{{ latestNews?.title }}</p>
|
||||
</div>
|
||||
<div class="right">
|
||||
<el-tabs
|
||||
@tab-change="handleTabChange"
|
||||
v-model="queryParams.classification"
|
||||
@tab-change="handleTabChange"
|
||||
v-model="queryParams.classification"
|
||||
>
|
||||
<el-tab-pane name="0" :label="t('home.news')"></el-tab-pane>
|
||||
<el-tab-pane name="1" :label="t('home.policyAnalyzing')"></el-tab-pane>
|
||||
@ -58,14 +60,21 @@ getList();
|
||||
</el-tabs>
|
||||
<ul class="news-list">
|
||||
<li class="news-item" v-for="news in newsList" :key="news.id">
|
||||
<span class="title">{{
|
||||
locale === "zh" ? news.title : locale === "ru" ? news.titleRu : null
|
||||
}}</span>
|
||||
<span class="time">
|
||||
{{ news.create_time }}
|
||||
<a :href="`/news/detail/${news.id}`" target="_blank">
|
||||
<span class="title">{{
|
||||
locale === "zh" ? news.title : locale === "ru" ? news.titleRu : null
|
||||
}}</span>
|
||||
<span class="time">
|
||||
{{ dayjs(news.createTime).format("YYYY-MM-DD") }}
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<pagination v-show="total > 0"
|
||||
:total="total"
|
||||
v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize"
|
||||
@pagination="getList"/>
|
||||
</div>
|
||||
|
||||
<!-- <div class="news-list">
|
||||
@ -90,20 +99,26 @@ getList();
|
||||
.news-container {
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
|
||||
.left {
|
||||
flex: 4;
|
||||
height: 100%;
|
||||
// display: flex;
|
||||
// flex-direction: column;
|
||||
// justify-content: center;
|
||||
width: calc(50vw - 20px);
|
||||
height: calc(100vh - 200px);
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.cover-image {
|
||||
height: calc(100vh - 200px - 24px - 12px);
|
||||
//flex: 1;
|
||||
width: 100%;
|
||||
aspect-ratio: 4/3;
|
||||
//aspect-ratio: 4/3;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.title {
|
||||
height: 24px;
|
||||
text-align: center;
|
||||
font-size: 20px;
|
||||
width: 100%;
|
||||
font-weight: bold;
|
||||
margin-top: 12px;
|
||||
margin-bottom: 0;
|
||||
@ -112,22 +127,33 @@ getList();
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.right {
|
||||
flex: 4;
|
||||
width: calc(50vw - 20px);
|
||||
margin-left: 12px;
|
||||
height: 100%;
|
||||
padding: 12px;
|
||||
|
||||
.news-list {
|
||||
.news-item {
|
||||
list-style: disc;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
.title {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
& > a {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.title {
|
||||
flex: 1;
|
||||
width: 100px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.time {
|
||||
color: gray;
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -2,33 +2,33 @@
|
||||
<div ref="fullPageRef" v-loading="loading" class="fullPage">
|
||||
<div class="indicator">
|
||||
<div
|
||||
v-for="idx in 7"
|
||||
:id="idx.toString()"
|
||||
:key="idx"
|
||||
:class="`${indicatorActiveIndex === idx ? 'active' : ''}`"
|
||||
class="point"
|
||||
@click="handleIndicatorClick(idx)"
|
||||
v-for="idx in 7"
|
||||
:id="idx.toString()"
|
||||
:key="idx"
|
||||
:class="`${indicatorActiveIndex === idx ? 'active' : ''}`"
|
||||
class="point"
|
||||
@click="handleIndicatorClick(idx)"
|
||||
></div>
|
||||
</div>
|
||||
<div
|
||||
ref="fullPageContainerRef"
|
||||
:data-index="state.fullpage.current"
|
||||
class="fullPageContainer"
|
||||
@mousewheel="mouseWheelHandle"
|
||||
ref="fullPageContainerRef"
|
||||
:data-index="state.fullpage.current"
|
||||
class="fullPageContainer"
|
||||
@mousewheel="mouseWheelHandle"
|
||||
>
|
||||
<!-- @DOMMouseScroll="mouseWheelHandle" -->
|
||||
<div
|
||||
v-for="(item, $index) in state.boxList"
|
||||
:key="$index"
|
||||
:style="`z-index: ${item.zIndex};`"
|
||||
class="section"
|
||||
v-for="(item, $index) in state.boxList"
|
||||
:key="$index"
|
||||
:style="`z-index: ${item.zIndex};`"
|
||||
class="section"
|
||||
>
|
||||
<!-- v-if="`index${state.fullpage.current}` == item.title" -->
|
||||
<component
|
||||
:is="item.comp"
|
||||
v-if="Math.abs(state.fullpage.current - ($index + 1)) <= 1"
|
||||
:map-index="mapIndex"
|
||||
@changeMapIndex="mapIndex = $event"
|
||||
:is="item.comp"
|
||||
v-if="Math.abs(state.fullpage.current - ($index + 1)) <= 1"
|
||||
:map-index="mapIndex"
|
||||
@changeMapIndex="mapIndex = $event"
|
||||
></component>
|
||||
</div>
|
||||
</div>
|
||||
@ -52,12 +52,14 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, onMounted, reactive, ref, shallowRef } from "vue";
|
||||
import {computed, onActivated, onMounted, reactive, ref, shallowRef} from "vue";
|
||||
import index0 from "./comp/index0.vue";
|
||||
import index1 from "./comp/index1.vue";
|
||||
import index8 from "./comp/index8.vue";
|
||||
import index9 from "@/views/website/home/comp/index9.vue";
|
||||
import {useRoute} from "vue-router";
|
||||
|
||||
const route = useRoute()
|
||||
const loading = ref(true);
|
||||
setTimeout(() => {
|
||||
loading.value = false;
|
||||
@ -68,8 +70,8 @@ const mapIndex = ref(0); // 0-3
|
||||
const mapRef = ref();
|
||||
onMounted(() => {
|
||||
fullPageContainerRef.value.addEventListener(
|
||||
"DOMMouseScroll",
|
||||
mouseWheelHandle
|
||||
"DOMMouseScroll",
|
||||
mouseWheelHandle
|
||||
);
|
||||
});
|
||||
// onUnmounted(() => {
|
||||
@ -193,14 +195,14 @@ const handleIndicatorClick = (idx) => {
|
||||
console.log(idx);
|
||||
let boxIndex;
|
||||
let _mapIndex;
|
||||
if (idx === 1) {
|
||||
boxIndex = 1;
|
||||
if (idx <= 2) {
|
||||
boxIndex = idx;
|
||||
_mapIndex = null;
|
||||
} else if (idx <= 5) {
|
||||
boxIndex = 2;
|
||||
_mapIndex = idx - 2;
|
||||
} else {
|
||||
} else if (idx <= 6) {
|
||||
boxIndex = 3;
|
||||
_mapIndex = idx - 3;
|
||||
} else {
|
||||
boxIndex = 4;
|
||||
_mapIndex = null;
|
||||
}
|
||||
|
||||
@ -219,6 +221,13 @@ const handleIndicatorClick = (idx) => {
|
||||
mapIndex.value = _mapIndex;
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
// console.log(route.name)
|
||||
if (route.name === "news-list") {
|
||||
handleIndicatorClick(2)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
@ -1,12 +1,12 @@
|
||||
<template>
|
||||
<div class="login">
|
||||
<div class="content">
|
||||
<img class="loginImg" src="@/assets/images/login.png" alt="" srcset="" />
|
||||
<img class="loginImg" src="@/assets/images/login.png" alt="" srcset=""/>
|
||||
<div class="login-form">
|
||||
<el-tabs v-model="loginForm.mode" v-if="isLogin == 1">
|
||||
<el-tab-pane
|
||||
:label="t('login.accountLogin')"
|
||||
name="102"
|
||||
:label="t('login.accountLogin')"
|
||||
name="102"
|
||||
></el-tab-pane>
|
||||
<!-- <el-tab-pane label="手机快捷登录" name="101"></el-tab-pane> -->
|
||||
</el-tabs>
|
||||
@ -14,31 +14,31 @@
|
||||
<el-form ref="loginRef" :model="loginForm" :rules="loginRules">
|
||||
<el-form-item prop="username">
|
||||
<el-input
|
||||
v-model="loginForm.username"
|
||||
type="text"
|
||||
auto-complete="off"
|
||||
:placeholder="t('input.inputPhone')"
|
||||
v-model="loginForm.username"
|
||||
type="text"
|
||||
auto-complete="off"
|
||||
:placeholder="t('input.inputPhone')"
|
||||
>
|
||||
<template #prefix>
|
||||
<svg-icon
|
||||
icon-class="user"
|
||||
class="el-input__icon input-icon"
|
||||
icon-class="user"
|
||||
class="el-input__icon input-icon"
|
||||
/>
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="password" v-if="loginForm.mode == 102">
|
||||
<el-input
|
||||
v-model="loginForm.password"
|
||||
type="password"
|
||||
auto-complete="off"
|
||||
:placeholder="t('input.inputPassword')"
|
||||
@keyup.enter="handleLogin"
|
||||
v-model="loginForm.password"
|
||||
type="password"
|
||||
auto-complete="off"
|
||||
:placeholder="t('input.inputPassword')"
|
||||
@keyup.enter="handleLogin"
|
||||
>
|
||||
<template #prefix>
|
||||
<svg-icon
|
||||
icon-class="password"
|
||||
class="el-input__icon input-icon"
|
||||
icon-class="password"
|
||||
class="el-input__icon input-icon"
|
||||
/>
|
||||
</template>
|
||||
</el-input>
|
||||
@ -46,20 +46,20 @@
|
||||
<el-form-item prop="captcha" v-if="loginForm.mode == 101">
|
||||
<div class="captcha-row">
|
||||
<el-input
|
||||
v-model="loginForm.captcha"
|
||||
auto-complete="off"
|
||||
:placeholder="t('input.inputVerificationCode')"
|
||||
style="width: 65%; align-items: center"
|
||||
@keyup.enter="handleLogin"
|
||||
v-model="loginForm.captcha"
|
||||
auto-complete="off"
|
||||
:placeholder="t('input.inputVerificationCode')"
|
||||
style="width: 65%; align-items: center"
|
||||
@keyup.enter="handleLogin"
|
||||
>
|
||||
<template #prefix>
|
||||
<svg-icon
|
||||
icon-class="validCode"
|
||||
class="el-input__icon input-icon"
|
||||
icon-class="validCode"
|
||||
class="el-input__icon input-icon"
|
||||
/>
|
||||
</template>
|
||||
</el-input>
|
||||
<WebGetCode v-model:mobile="loginForm.username" />
|
||||
<WebGetCode v-model:mobile="loginForm.username"/>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
@ -69,12 +69,12 @@
|
||||
</el-form-item>
|
||||
<el-form-item style="width: 100%">
|
||||
<el-button
|
||||
class="x_btns"
|
||||
:loading="loading"
|
||||
size="default"
|
||||
type="primary"
|
||||
style="width: 100%"
|
||||
@click.prevent="handleLogin"
|
||||
class="x_btns"
|
||||
:loading="loading"
|
||||
size="default"
|
||||
type="primary"
|
||||
style="width: 100%"
|
||||
@click.prevent="handleLogin"
|
||||
>
|
||||
<span v-if="!loading">
|
||||
{{ t("login.login") }}
|
||||
@ -86,54 +86,54 @@
|
||||
<div style="overflow: hidden">
|
||||
<div style="float: left" v-if="isLogin == 1">
|
||||
<span
|
||||
class="text_col pointer"
|
||||
:to="'/login'"
|
||||
@click="isLogin = 3"
|
||||
>{{ t("login.forgetPassword") }}</span
|
||||
class="text_col pointer"
|
||||
:to="'/login'"
|
||||
@click="isLogin = 3"
|
||||
>{{ t("login.forgetPassword") }}</span
|
||||
>
|
||||
</div>
|
||||
<div style="float: right" v-if="register">
|
||||
<span
|
||||
@click="isLogin = 2"
|
||||
style="color: #0054ff"
|
||||
class="pointer"
|
||||
>{{ t("login.register") }}</span
|
||||
@click="isLogin = 2"
|
||||
style="color: #0054ff"
|
||||
class="pointer"
|
||||
>{{ t("login.register") }}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<el-form
|
||||
v-if="isLogin == 1"
|
||||
:model="registerForm"
|
||||
status-icon
|
||||
:rules="isCheckRules"
|
||||
ref="isCheckRef"
|
||||
v-if="isLogin == 1"
|
||||
:model="registerForm"
|
||||
status-icon
|
||||
:rules="isCheckRules"
|
||||
ref="isCheckRef"
|
||||
>
|
||||
<el-form-item prop="isCheck">
|
||||
<div style="margin-top: 43px">
|
||||
<div class="text_col" style="display: none">
|
||||
<div>其他登录方式</div>
|
||||
<img
|
||||
class="pointer"
|
||||
src="../../../assets/images/weixin.png"
|
||||
alt=""
|
||||
class="pointer"
|
||||
src="../../../assets/images/weixin.png"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<el-checkbox
|
||||
v-model="registerForm.isCheck"
|
||||
style="margin-top: 43px"
|
||||
v-model="registerForm.isCheck"
|
||||
style="margin-top: 43px"
|
||||
>
|
||||
<span class="text_col">{{ t("login.loginAgreement") }}</span
|
||||
><span style="color: #0054ff"
|
||||
>《{{ t("login.agreement") }}》</span
|
||||
>
|
||||
>《{{ t("login.agreement") }}》</span
|
||||
>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<Register v-model:isLogin="isLogin" v-else-if="isLogin == 2" />
|
||||
<Retrieve v-model:isLogin="isLogin" v-else-if="isLogin == 3" />
|
||||
<Register v-model:isLogin="isLogin" v-else-if="isLogin == 2"/>
|
||||
<Retrieve v-model:isLogin="isLogin" v-else-if="isLogin == 3"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -149,15 +149,15 @@ import Retrieve from "../retrieve";
|
||||
import Register from "../register";
|
||||
import WebGetCode from "@/components/webGetCode";
|
||||
import useUserStore from "@/store/modules/user";
|
||||
import { useRouter } from "vue-router";
|
||||
import { useI18n } from "vue-i18n";
|
||||
import { computed, reactive, ref } from "vue"; // const store = useStore();
|
||||
import {useRouter} from "vue-router";
|
||||
import {useI18n} from "vue-i18n";
|
||||
import {computed, reactive, ref} from "vue"; // const store = useStore();
|
||||
// const store = useStore();
|
||||
const router = useRouter();
|
||||
|
||||
const userStore = useUserStore();
|
||||
// const { proxy } = getCurrentInstance();
|
||||
const { t } = useI18n();
|
||||
const {t} = useI18n();
|
||||
const isLogin = ref(1);
|
||||
|
||||
const loginForm = ref({
|
||||
@ -203,7 +203,7 @@ const isCheck = (rule, value, callback) => {
|
||||
}
|
||||
};
|
||||
const isCheckRules = {
|
||||
isCheck: [{ required: true, validator: isCheck, trigger: "change" }],
|
||||
isCheck: [{required: true, validator: isCheck, trigger: "change"}],
|
||||
};
|
||||
|
||||
// const codeUrl = ref("");
|
||||
@ -218,7 +218,7 @@ const handleLogin = async () => {
|
||||
if (loginValid && isCheckValid) {
|
||||
loading.value = true;
|
||||
if (loginForm.value.rememberMe) {
|
||||
Cookies.set("username", loginForm.value.username, { expires: 30 });
|
||||
Cookies.set("username", loginForm.value.username, {expires: 30});
|
||||
Cookies.set("password", loginForm.value.password, {
|
||||
expires: 30,
|
||||
});
|
||||
@ -238,13 +238,13 @@ const handleLogin = async () => {
|
||||
console.log("123435");
|
||||
formData.mode = formData.mode - 0;
|
||||
userStore
|
||||
.login(formData)
|
||||
.then(() => {
|
||||
router.push({ path: redirect.value || "/identity/index" });
|
||||
})
|
||||
.catch(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
.login(formData)
|
||||
.then(() => {
|
||||
router.push({path: redirect.value || "/identity/index"});
|
||||
})
|
||||
.catch(() => {
|
||||
loading.value = false;
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
@ -276,7 +276,7 @@ getCookie();
|
||||
.content {
|
||||
// padding: 0 250px;
|
||||
// padding: 0 30px;
|
||||
width: 1400px;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
flex: 1;
|
||||
background: #b1ccff;
|
||||
@ -285,8 +285,10 @@ getCookie();
|
||||
justify-content: space-between;
|
||||
|
||||
.loginImg {
|
||||
width: 705px;
|
||||
height: 458px;
|
||||
width: calc(100vw - 516px);
|
||||
//width: 705px;
|
||||
//height: 458px;
|
||||
aspect-ratio: 705/458;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
65
src/views/website/news/detail.vue
Normal file
65
src/views/website/news/detail.vue
Normal file
@ -0,0 +1,65 @@
|
||||
<script setup>
|
||||
import {getNewsInfo} from "@/api/website/home/news";
|
||||
import {useRoute} from "vue-router";
|
||||
import {reactive, toRefs} from "vue";
|
||||
import {useI18n} from "vue-i18n";
|
||||
import WebFooter from "@/components/webFooter/index.vue";
|
||||
|
||||
const {t, locale} = useI18n();
|
||||
const file_base_url = `${import.meta.env.VITE_APP_BASE_API}/file`;
|
||||
const data = reactive({
|
||||
news: {}
|
||||
})
|
||||
const {news} = toRefs(data)
|
||||
const route = useRoute()
|
||||
const getNews = () => {
|
||||
const id = route.params.id
|
||||
getNewsInfo(id).then((resp) => {
|
||||
news.value = resp.data
|
||||
})
|
||||
}
|
||||
|
||||
getNews()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="container">
|
||||
<div class="news-body">
|
||||
<img class="cover-image" :src="`${file_base_url}${news.cover}`"/>
|
||||
<h1 class="title">{{locale === "zh" ? news.title : locale === "ru" ? news.titleRu : null }}</h1>
|
||||
<p class="content">{{ locale === "zh" ? news.content : locale === "ru" ? news.contentRu : null}}</p>
|
||||
</div>
|
||||
<web-footer></web-footer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.container {
|
||||
background-color: #f2f6ff;
|
||||
|
||||
.news-body {
|
||||
background-color: #ffffff;
|
||||
width: 1000px;
|
||||
margin: 0 auto;
|
||||
|
||||
.cover-image {
|
||||
width: 100%;
|
||||
aspect-ratio: 6/2;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
h1.title {
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
p.content {
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
margin: 0;
|
||||
padding: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user