site config

dev
Wayne 2 years ago
parent 62d4fe8fe9
commit ed33c2619c

@ -0,0 +1,2 @@
# 普達國際 CMS

@ -0,0 +1,7 @@
import ajax from "@/utils/request";
export const getConfig = async () =>
ajax(`/config/getConfig`, "GET");
export const updateConfig = async (params) =>
ajax(`/config/updateConfig`, "POST", params);

@ -117,6 +117,11 @@ const menuData = ([
}, },
], ],
}, },
{
title: "站台設定",
icon: Lock,
path: "/site/config",
},
]); ]);
const handleSelect = (key, keyPath) => { const handleSelect = (key, keyPath) => {

@ -185,7 +185,7 @@ const submitForm = (formEl) => {
<el-form-item label="電腦版背景圖" prop="imageurl1"> <el-form-item label="電腦版背景圖" prop="imageurl1">
<el-upload class="avatar-uploader" action="#" accept="image/*" :show-file-list="false" :auto-upload="true" <el-upload class="avatar-uploader" action="#" accept="image/*" :show-file-list="false" :auto-upload="true"
:on-success="handleAvatarSuccess" :before-upload="(file) => beforeAvatarUpload(file, 1)"> :on-success="handleAvatarSuccess" :before-upload="(file) => beforeAvatarUpload(file, 1)">
<img v-if="form.imageurl1" :src="'http://localhost:6060'+form.imageurl1" class="avatar1" id="imageurl1" /> <img v-if="form.imageurl1" :src="form.imageurl1" class="avatar1" id="imageurl1" />
<el-icon v-else class="avatar-uploader-icon1"> <el-icon v-else class="avatar-uploader-icon1">
<Plus /> <Plus />
</el-icon> </el-icon>
@ -197,7 +197,7 @@ const submitForm = (formEl) => {
<el-form-item label="手機版背景圖" prop="imageurl2"> <el-form-item label="手機版背景圖" prop="imageurl2">
<el-upload class="avatar-uploader" action="#" accept="image/*" :show-file-list="false" :auto-upload="true" <el-upload class="avatar-uploader" action="#" accept="image/*" :show-file-list="false" :auto-upload="true"
:on-success="handleAvatarSuccess" :before-upload="(file) => beforeAvatarUpload(file, 2)"> :on-success="handleAvatarSuccess" :before-upload="(file) => beforeAvatarUpload(file, 2)">
<img v-if="form.imageurl2" :src="'http://localhost:6060'+form.imageurl2" class="avatar2" id="imageurl1" /> <img v-if="form.imageurl2" :src="form.imageurl2" class="avatar2" id="imageurl1" />
<el-icon v-else class="avatar-uploader-icon2"> <el-icon v-else class="avatar-uploader-icon2">
<Plus /> <Plus />
</el-icon> </el-icon>

@ -1,162 +0,0 @@
<script setup>
import { ref, reactive, onMounted, toRefs } from "vue";
import { Plus, Edit, Delete, ArrowDown } from "@element-plus/icons-vue";
import AscForm from "./components/Form.vue";
import { getAdminUserList, deleteAdminUser } from "@/api/adminuser";
const state = reactive({
page: 1,
pageSize: 10,
});
const { page, pageSize } = toRefs(state);
const total = ref(0);
const loading = ref(false);
const showFormDraw = ref(false);
const tableData = ref([]);
onMounted(() => {
getTableData();
});
const getTableData = async () => {
loading.value = true;
let res = await getAdminUserList(state);
if (res.code === 200) {
tableData.value = res.data.list;
total.value = res.data.total;
}
loading.value = false;
};
const handleAdd = () => {
editid.value = 0;
showFormDraw.value = true;
};
const handleEdit = (id) => {
editid.value = id;
showFormDraw.value = true;
};
const handleDelete = (id) => {
ElMessageBox.confirm('確認刪除此紀錄?')
.then(async () => {
let res = await deleteAdminUser(id);
if (res.code === 200) {
ElMessage({
message: '刪除成功.',
type: 'success',
});
getTableData();
}else{
ElMessage({
message: '刪除失敗.',
type: 'error',
});
}
})
.catch(() => {
})
};
// Pagination
const handleSizeChange = (val) => {
state.pageSize = val;
getTableData();
};
const handleCurrentChange = (val) => {
state.page = val;
getTableData();
};
const handlePrevClick = (val) => {
state.page = val;
getTableData();
};
const handleNextClick = (val) => {
state.page = val;
getTableData();
};
// Drawer
const editid = ref(0);
const handleCloseFormDraw = (val) => {
showFormDraw.value = false;
if(val){
getTableData();
}
};
</script>
<template>
<div class="main">
<!-- Breadcrumb: Start -->
<div class="breadcrumb-section">
<div>
<el-breadcrumb separator="/">
<el-breadcrumb-item> 經銷商系統 </el-breadcrumb-item>
<el-breadcrumb-item>管理員列表</el-breadcrumb-item>
</el-breadcrumb>
</div>
<div>
<el-button type="primary" :icon="Plus" @click="handleAdd">新增管理員</el-button>
</div>
</div>
<!-- Breadcrumb: End -->
<el-card :body-style="{ padding: '0px' }">
<div v-loading="loading">
<el-table :data="tableData" style="width: 100%">
<el-table-column label="#" prop="id" width="50" />
<el-table-column label="管理員名稱" prop="username" />
<el-table-column label="上次登入" prop="login_time" />
<el-table-column label="登入次數" prop="login_num" />
<el-table-column label="操作" width="105" fixed="right">
<template #default="scope">
<el-dropdown>
<el-button type="danger">
操作<el-icon class="el-icon--right"><arrow-down /></el-icon>
</el-button>
<template #dropdown>
<el-dropdown-menu>
<el-dropdown-item :icon="Edit" @click="handleEdit(scope.row.id)">編輯</el-dropdown-item>
<el-dropdown-item v-if="scope.row.is_main !== 1" :icon="Delete" @click="handleDelete(scope.row.id)">刪除</el-dropdown-item>
</el-dropdown-menu>
</template>
</el-dropdown>
</template>
</el-table-column>
</el-table>
<div class="pagination-block">
<el-pagination
v-model:current-page="page"
v-model:page-size="pageSize"
:page-sizes="[10, 20, 50, 100]"
layout="->,total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
@prev-click="handlePrevClick"
@next-click="handleNextClick"
/>
</div>
</div>
</el-card>
</div>
<div>
<el-drawer ref="drawerRef" v-model="showFormDraw" :destroy-on-close="true" title="新增管理員" direction="rtl" size="50%">
<asc-form :editid="editid" @close="handleCloseFormDraw"/>
</el-drawer>
</div>
</template>

@ -0,0 +1,115 @@
<script setup>
import { ref, reactive, onMounted, watch } from "vue";
import { useRouter, useRoute } from "vue-router";
const route = useRoute();
const router = useRouter();
import { getConfig, updateConfig } from "@/api/config";
const formType = ref("insert");
const loading = ref(false);
const formRef = ref(null);
const form = ref({});
onMounted(async () => {
let res = await getConfig();
if (res.code === 200) {
form.value = res.data;
formType.value = "update";
}else{
ElMessage({
message: "取得資料失敗.",
type: 'error',
});
}
});
const rules = reactive({
})
const submitForm = (formEl) => {
if (!formEl) return
formEl.validate(async (valid) => {
if (valid) {
let res;
let message;
res = await updateConfig(form.value);
message = "修改成功.";
if (res.code === 200) {
ElMessage({
message: message,
type: 'success',
});
}
} else {
ElMessage({
message: "操作失敗.",
type: 'error',
});
return false
}
})
};
</script>
<template>
<div class="main">
<!-- Breadcrumb: Start -->
<div class="breadcrumb-section">
<div>
<el-breadcrumb separator="/">
<el-breadcrumb-item> 站台設定 </el-breadcrumb-item>
</el-breadcrumb>
</div>
<div>
</div>
</div>
<!-- Breadcrumb: End -->
<el-card>
<el-form
ref="formRef"
:model="form"
status-icon
:rules="rules"
label-width="120px">
<el-form-item label="公司名稱" prop="company_name">
<el-input v-model="form.company_name" />
</el-form-item>
<el-form-item label="地址" prop="address">
<el-input v-model="form.address" />
</el-form-item>
<el-form-item label="Email" prop="email">
<el-input v-model="form.email" />
</el-form-item>
<el-form-item label="電話" prop="tel">
<el-input v-model="form.tel" />
</el-form-item>
<el-form-item label="傳真" prop="fax">
<el-input v-model="form.fax" />
</el-form-item>
<el-form-item label="產品與服務" prop="products">
<el-input type="textarea" :rows="3" v-model="form.products" />
</el-form-item>
<el-form-item label="企業永續發展" prop="development">
<el-input type="textarea" :rows="3" v-model="form.development" />
</el-form-item>
</el-form>
<div class="demo-drawer__footer" style="text-align: right;">
<el-button type="primary" :loading="loading" @click="submitForm(formRef)">{{
loading ? '提交中 ...' : '修改'
}}</el-button>
</div>
</el-card>
</div>
</template>
<style lang="less" scoped>
</style>

@ -132,6 +132,14 @@ let routes = [
}, },
component: () => import("../pages/Contact/map/Index.vue"), component: () => import("../pages/Contact/map/Index.vue"),
}, },
{
path: "/site/config",
name: "SiteConfig",
meta: {
title: "站台設定",
},
component: () => import("../pages/Site/config.vue"),
},
], ],
}, },
{ {

@ -0,0 +1,52 @@
<?php
namespace app\adminapi\controller;
use app\adminapi\BaseController;
use support\Request;
use think\facade\Db;
class ConfigController extends BaseController
{
public function getConfig(Request $request)
{
$param = $request->get();
// $where[] = ['lang', $param['lang']];
$list = Db::name('config')
->where('lang',$param['lang'])
->select()
->toArray();
$result = [];
foreach ($list as $key => $val) {
$result[$val['code']] = $val['value'];
}
return $this->Success($result);
}
public function updateConfig(Request $request)
{
$param = $request->post();
try{
foreach ($param as $key => $val) {
if($key != 'lang'){
$data = [
'value' => $val,
];
Db::name('config')
->where('code',$key)
->where('lang',$param['lang'])
->update($data);
}
}
return $this->Success('更新成功');
}catch(\Exception $e){
return $this->Error('更新失敗');
}
}
}

@ -8,10 +8,6 @@ use think\facade\Db;
class IndexController extends BaseController class IndexController extends BaseController
{ {
public function index(Request $request)
{
return json(['code' => 0, 'msg' => 'success', 'data' => ['name' => 'adminapi']]);
}
public function getBannerList(Request $request) public function getBannerList(Request $request)
{ {
$param = $request->get(); $param = $request->get();
@ -128,7 +124,7 @@ class IndexController extends BaseController
$filename = uniqid() . '.' . $file->getUploadExtension(); $filename = uniqid() . '.' . $file->getUploadExtension();
$file->move(public_path().'/storage/banner/'. $filename); $file->move(public_path().'/storage/banner/'. $filename);
$savePath = '/storage/banner/'. $filename; $savePath = getUrl().'/storage/banner/'. $filename;
return $this->Success($savePath); return $this->Success($savePath);
} }
return $this->Error('操作失敗'); return $this->Error('操作失敗');

@ -7,10 +7,6 @@ use think\facade\Db;
class IndexController extends BaseController class IndexController extends BaseController
{ {
public function index(Request $request)
{
return response('appapi index');
}
public function getConfig(Request $request) public function getConfig(Request $request)
{ {
$param = $request->get(); $param = $request->get();
@ -35,7 +31,7 @@ class IndexController extends BaseController
// $where[] = ['lang', $param['lang']]; // $where[] = ['lang', $param['lang']];
$list = Db::name('banner') $list = Db::name('banner')
// ->where('lang',$param['lang']) ->where('lang',$param['lang'])
->order('id', 'desc') ->order('id', 'desc')
->select() ->select()
->toArray(); ->toArray();

@ -9,21 +9,33 @@ class SocialController extends BaseController
{ {
public function getNewsList(Request $request) public function getNewsList(Request $request)
{ {
$param = $request->get(); $param = $request->post();
// $where[] = ['lang', $param['lang']];
$page = isset($param['page']) ? $param['page'] : 1;
$pageSize = isset($param['pageSize']) ? $param['pageSize'] : 10;
$search = isset($param['search']) ? $param['search'] : [];
$where = [
];
$list = Db::name('news') $list = Db::name('news')
// ->where('lang',$param['lang']) ->where($where)
->order('id', 'desc') ->order('id', 'asc')
->page($page, $pageSize)
->select() ->select()
->toArray(); ->toArray();
$total = Db::name('news')
->where($where)
->count();
foreach($list as $key => $val){ // foreach($list as $key => $val){
// }
}
$result = $list; $result = [
'list' => $list,
'total' => $total
];
return $this->Success($result); return $this->Success($result);
} }
@ -49,23 +61,15 @@ class SocialController extends BaseController
public function getActivityList(Request $request) public function getActivityList(Request $request)
{ {
$param = $request->get(); $param = $request->post();
// $where[] = ['lang', $param['lang']];
$list = Db::name('activity') $result = \app\common\GetData::getPageList('activity',$param);
// ->where('lang',$param['lang'])
->order('id', 'desc')
->select()
->toArray();
foreach($result['list'] as $key => $val){
foreach($list as $key => $val){ $result['list'][$key]['imageList'] = json_decode($val['image_list']);
$list[$key]['imageList'] = json_decode($val['image_list']); unset($result['list'][$key]['image_list']);
unset($list[$key]['image_list']);
} }
$result = $list;
return $this->Success($result); return $this->Success($result);
} }

@ -0,0 +1,54 @@
<?php
namespace app\common;
use think\facade\Db;
class GetData{
/**
* 取得無分頁資料
* db:資料表
* param:參數
* @return array list
*/
public static function getList(){
}
/**
* 取得分頁資料
* db:資料表
* param:參數
* @return array list
* list->totle: 總筆數
* list->list: 資料
*/
public static function getPageList($db,$param){
$page = isset($param['page']) ? $param['page'] : 1;
$pageSize = isset($param['pageSize']) ? $param['pageSize'] : 10;
$search = isset($param['search']) ? $param['search'] : [];
$where = [
];
$list = Db::name($db)
->where($where)
->order('id', 'asc')
->page($page, $pageSize)
->select()
->toArray();
$total = Db::name('activity')
->where($where)
->count();
// foreach($list as $key => $val){
// }
$result = [
'list' => $list,
'total' => $total
];
return $result;
}
}

@ -1,47 +1,55 @@
version: '3.8' version: '3.8'
services: services:
nginx-php: web:
build: build:
context: . context: .
dockerfile: ./nginx-php/Dockerfile dockerfile: ./nuxt/Dockerfile
container_name: "utel-nginx-php" container_name: "prodio-web"
ports: ports:
- 6050:80 - "6061:3000"
volumes: volumes:
- "./app:/var/www" - ./nuxt/app:/app
- "./data/logs:/log"
networks: networks:
- utel-network - prodio-internal
api:
image: krisss/docker-webman:8.2-cli-alpine
container_name: "prodio-api"
ports:
- "6060:8787"
volumes:
- ./app:/app
networks:
- prodio-internal
mysql: mysql:
build: build:
context: . context: .
dockerfile: ./mysql/Dockerfile dockerfile: ./mysql/Dockerfile
container_name: "utel-mysql" container_name: "prodio-mysql"
ports: #ports:
- "3306:3306" # - "3306:3306"
networks: networks:
- utel-network - prodio-internal
volumes: volumes:
- ./data/mysql:/var/lib/mysql - ./data/mysql:/var/lib/mysql
environment: environment:
MYSQL_ROOT_PASSWORD: 1qazvfr4 MYSQL_ROOT_PASSWORD: admin
# redis: # redis:
# image: redis # image: redis
# container_name: "bdshop-redis" # container_name: "prodio-redis"
# networks: # networks:
# - bdshop-network # - internal
phpmyadmin: phpmyadmin:
image: phpmyadmin/phpmyadmin image: phpmyadmin/phpmyadmin
container_name: "utel-myadmin" container_name: "prodio-myadmin"
ports: ports:
- "6059:80" - "6069:80"
networks: networks:
- utel-network - prodio-internal
environment: environment:
PMA_HOST: mysql PMA_HOST: mysql
PMA_PORT: 3306 PMA_PORT: 3306
UPLOAD_LIMIT: 100M UPLOAD_LIMIT: 100M
networks: networks:
utel-network: prodio-internal:
driver: bridge driver: bridge

@ -24,4 +24,5 @@ export const useMyFetch = (request, method="GET" ,opts={}, headers ={}) => {
} }
return useFetch(request, options) return useFetch(request, options)
} }

@ -0,0 +1,30 @@
import Cookies from 'js-cookie'
export const useRequest = (request, method="GET" ,opts={}, headers ={}) => {
let locale = Cookies.get('i18n_redirected');
const config = useRuntimeConfig()
const options = {
baseURL: config.public.apiBaseUrl,
method: method,
headers: {
"Content-Type": "application/json",
// "Authorization": Cookies.get('token'),
...headers,
}
};
let data = {
...opts,
lang: locale
}
if (method === "GET" || method === "DELETE") {
options.params = data;
}
if (method === "POST" || method === "PUT") {
options.body = data;
}
return $fetch(request, options)
}

@ -58,19 +58,19 @@ const { data: cateRes } = await useMyFetch('/index/getCateList', "GET")
<li class="nav-item"> <li class="nav-item">
<div class="nav-link">{{ $t('news') }}</div> <div class="nav-link">{{ $t('news') }}</div>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
<li><a class="dropdown-item" href="javascript:;" <li><a class="dropdown-item"
@click="router.push(localeLocation('/social/news'))">產業動態</a></li> @click="router.push(localeLocation('/social/news'))">{{ $t('Social.news') }}</a></li>
<li><a class="dropdown-item" href="javascript:;" <li><a class="dropdown-item"
@click="router.push(localeLocation('/social/activity'))">公司活動</a></li> @click="router.push(localeLocation('/social/activity'))">{{ $t('Social.activity') }}</a></li>
</ul> </ul>
</li> </li>
<li class="nav-item"> <li class="nav-item">
<div class="nav-link">{{ $t('contact') }}</div> <div class="nav-link">{{ $t('contact') }}</div>
<ul class="dropdown-menu"> <ul class="dropdown-menu">
<li><a class="dropdown-item" href="javascript:;" <li><a class="dropdown-item" href="javascript:;"
@click="router.push(localeLocation('/contact/form'))">聯絡表單</a></li> @click="router.push(localeLocation('/contact/form'))">{{ $t('Contact.form') }}</a></li>
<li><a class="dropdown-item" href="javascript:;" <li><a class="dropdown-item" href="javascript:;"
@click="router.push(localeLocation('/contact/company'))">公司據點</a></li> @click="router.push(localeLocation('/contact/company'))">{{ $t('Contact.branch') }}</a></li>
</ul> </ul>
</li> </li>
</ul> </ul>

@ -7,12 +7,21 @@ export default {
productandservice: '产品与服务', productandservice: '产品与服务',
development: '企业永续发展', development: '企业永续发展',
contactinfo: '联络资讯', contactinfo: '联络资讯',
copyright: '普达国际 版权所有 © All Rights Reserved Copyright © 2013. All rights reserved.', copyright: '普达国际 版权所有 © All Rights Reserved Copyright © 2013. All rights reserved.',
Form: {
submit: '确认送出',
},
about: { about: {
company: '公司简介', company: '公司简介',
concept: '经营理念', concept: '经营理念',
}, },
Social: {
news: '产业动态',
activity: '公司活动',
},
Contact: { Contact: {
form: '联络表单',
branch: '公司据点',
company: '公司名称', company: '公司名称',
name: '姓名', name: '姓名',
email: '电子邮件', email: '电子邮件',

@ -3,24 +3,33 @@ export default {
products: 'PRODUCTS', products: 'PRODUCTS',
news: 'NEWS', news: 'NEWS',
contact: 'CONTACT US', contact: 'CONTACT US',
branch: 'BRANCH', branch: 'Company Locations',
productandservice: 'Products and Services', productandservice: 'Products and Services',
development: 'Sustainable development of enterprises', development: 'Sustainable Development',
contactinfo: 'CONTACT INFORMATION', contactinfo: 'Contact Information',
copyright: '普達國際 版權所有 © All Rights Reserved Copyright © 2013. All rights reserved.', copyright: 'Puda International. All Rights Reserved © Copyright 2013. All rights reserved.',
Form: {
submit: 'Submit',
},
about: { about: {
company: 'Company Profile', company: 'Company Overview',
concept: 'Business Philosophy', concept: 'Business Philosophy',
}, },
Social: {
news: 'Industry Updates',
activity: 'Company Activities',
},
Contact: { Contact: {
form: 'Contact Form',
branch: 'Company Locations',
company: 'Company', company: 'Company',
name: 'Name', name: 'Name',
email: 'Email', email: 'Email',
tel: 'Telephone', tel: 'Phone',
content: 'Content', content: 'Content',
submit: 'Submit', submit: 'Submit',
success: 'Success', success: 'Success',
fail: 'Fail', fail: 'Failure',
formmessage : 'We welcome you to provide relevant suggestions through this email form. Your encouragement is our driving force for growth, and we will respond to all inquiries as soon as possible.' formmessage: 'We welcome you to provide suggestions through this email form. Your encouragement is our driving force, and we will respond to all inquiries as soon as possible.'
} },
}; };

@ -15,7 +15,13 @@ export default {
company: '公司簡介', company: '公司簡介',
concept: '經營理念', concept: '經營理念',
}, },
Social: {
news: '產業動態',
activity: '公司活動',
},
Contact: { Contact: {
form: '聯絡表單',
branch: '公司據點',
company: '公司名稱', company: '公司名稱',
name: '姓名', name: '姓名',
email: '電子郵件', email: '電子郵件',

@ -12,7 +12,7 @@ export default defineNuxtConfig({
link: [ link: [
{ {
rel: 'stylesheet', rel: 'stylesheet',
href: 'js/libs/bootstrap/bootstrap-submenu.min.css' href: '/home/js/libs/bootstrap/bootstrap-submenu.min.css'
}, },
{ {
rel: 'stylesheet', rel: 'stylesheet',

@ -26,10 +26,11 @@ const menuList = [
}, },
] ]
const currentRoute = ref(0); const currentRoute = ref('');
onMounted(() => { onMounted(() => {
currentRoute.value = route.path; currentRoute.value = route.path;
console.log('route',route)
}); });
watch(() => route.params, watch(() => route.params,
@ -51,7 +52,7 @@ watch(() => route.params,
<div class="col-12 col-lg-auto"> <div class="col-12 col-lg-auto">
<div class="list-group"> <div class="list-group">
<a class="list-group-item" <a class="list-group-item"
:class="{ 'active': currentRoute === item.path }" :class="{ 'active': currentRoute.includes(item.path) }"
href="javascript:;" href="javascript:;"
v-for="(item,index) in menuList" :key="index" v-for="(item,index) in menuList" :key="index"
@click="router.push(localeLocation(item.path));" @click="router.push(localeLocation(item.path));"

@ -28,7 +28,7 @@ const menuList = [
}, },
] ]
const currentRoute = ref(0); const currentRoute = ref('');
onMounted(() => { onMounted(() => {
currentRoute.value = route.path; currentRoute.value = route.path;
@ -53,7 +53,7 @@ watch(() => route.params,
<div class="col-12 col-lg-auto"> <div class="col-12 col-lg-auto">
<div class="list-group"> <div class="list-group">
<a class="list-group-item" <a class="list-group-item"
:class="{ 'active': currentRoute === item.path }" :class="{ 'active': currentRoute.includes(item.path) }"
href="javascript:;" href="javascript:;"
v-for="(item,index) in menuList" :key="index" v-for="(item,index) in menuList" :key="index"
@click="router.push(localeLocation(item.path));" @click="router.push(localeLocation(item.path));"

@ -9,15 +9,15 @@ const store = useStore();
const { config } = storeToRefs(store); const { config } = storeToRefs(store);
const bannerData = ref([]); const bannerData = computed(() => bannerRes.value.data);
const cateData = ref([]); const cateData = ref([]);
const supplierData = ref([]); const supplierData = ref([]);
const { data: bannerRes } = await useMyFetch('/index/getBannerList', "GET") const { data: bannerRes } = await useMyFetch('/index/getBannerList', "GET")
if (bannerRes.value.code === 200) { // if (bannerRes.value.code === 200) {
bannerData.value = bannerRes.value.data // bannerData.value = bannerRes.value.data
} // }
const { data: cateRes } = await useMyFetch('/index/getParentCateList', "GET") const { data: cateRes } = await useMyFetch('/index/getParentCateList', "GET")

@ -7,6 +7,8 @@ import PageBanner from "@/components/PageBanner.vue";
import featureImg from '@/assets/img/feature.jpg'; import featureImg from '@/assets/img/feature.jpg';
import bannerImg from '@/assets/img/pageBanner/p1.jpg'; import bannerImg from '@/assets/img/pageBanner/p1.jpg';
const { t } = useI18n();
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
@ -19,16 +21,16 @@ const bannerObj = {
const menuList = [ const menuList = [
{ {
"name":"產業動態", "name":t('Social.news'),
"path":"/social/news" "path":"/social/news"
}, },
{ {
"name":"公司活動", "name":t('Social.activity'),
"path":"/social/activity" "path":"/social/activity"
}, },
] ]
const currentRoute = ref(0); const currentRoute = ref('');
onMounted(() => { onMounted(() => {
currentRoute.value = route.path; currentRoute.value = route.path;
@ -52,7 +54,7 @@ watch(() => route.params,
<div class="col-12 col-lg-auto"> <div class="col-12 col-lg-auto">
<div class="list-group"> <div class="list-group">
<a class="list-group-item" <a class="list-group-item"
:class="{ 'active': currentRoute === item.path }" :class="{ 'active': currentRoute.includes(item.path) }"
href="javascript:;" href="javascript:;"
v-for="(item,index) in menuList" :key="index" v-for="(item,index) in menuList" :key="index"
@click="router.push(item.path);" @click="router.push(item.path);"

@ -2,8 +2,24 @@
const activityList = computed(() => res.value.data); const activityList = computed(() => res.value.data);
const page = ref(1)
const pageSize = ref(10)
// //
const { data: res } = await useMyFetch('/social/getActivityList', "GET") const { data: res } = await useMyFetch('/social/getActivityList', "POST", {
page: page.value,
pageSize: pageSize.value,
})
const handlePageChange = async (npage,npageSize) => {
page.value = npage
pageSize.value = npageSize
res.value = await useRequest('/social/getActivityList', "POST", {
page: page.value,
pageSize: pageSize.value,
})
}
</script> </script>
@ -14,11 +30,11 @@ const { data: res } = await useMyFetch('/social/getActivityList', "GET")
<div class="content"> <div class="content">
<div> <div>
<div class="row"> <div class="row">
<div class="col-12 col-lg-6 col-xl-4" v-for="(item, index) in activityList" :key="index"> <div class="col-12 col-lg-6 col-xl-4" v-for="(item, index) in activityList.list" :key="index">
<NuxtLinkLocale class="card" <NuxtLinkLocale class="card" :to="'/social/activity/detail/' + item.id">
:to="'/social/activity/detail/'+item.id">
<div class="card-body"> <div class="card-body">
<div class="imgCnt lg"><img :src="'https://prodio.zltest.com.tw' + item.imageList[0].url" :alt="item.title"></div> <div class="imgCnt lg"><img :src="'https://prodio.zltest.com.tw' + item.imageList[0].url" :alt="item.title">
</div>
</div> </div>
<div class="card-footer"> <div class="card-footer">
<div class="clip"> <div class="clip">
@ -29,8 +45,16 @@ const { data: res } = await useMyFetch('/social/getActivityList', "GET")
</NuxtLinkLocale> </NuxtLinkLocale>
</div> </div>
</div> </div>
<div class="pagination-block">
<el-pagination layout="->, prev, pager, next" :total="activityList.total"
@change="handlePageChange"/>
</div>
</div> </div>
</div> </div>
</template> </template>
<style lang="less"></style> <style lang="less">
.pagination-block {
margin-bottom: 16px;
}
</style>

@ -1,9 +1,25 @@
<script setup> <script setup>
const newsList = computed(() => newsRes.value.data); const newsData = computed(() => newsRes.value.data);
const page = ref(1)
const pageSize = ref(10)
// //
const { data: newsRes } = await useMyFetch('/social/getNewsList', "GET") const { data: newsRes } = await useMyFetch('/social/getNewsList', "POST", {
page: page.value,
pageSize: pageSize.value,
})
const handlePageChange = async (npage,npageSize) => {
page.value = npage
pageSize.value = npageSize
newsRes.value = await useRequest('/social/getNewsList', "POST", {
page: page.value,
pageSize: pageSize.value,
})
}
</script> </script>
@ -13,15 +29,21 @@ const { data: newsRes } = await useMyFetch('/social/getNewsList', "GET")
</div> </div>
<div class="content"> <div class="content">
<div> <div>
<NuxtLinkLocale :to="'/social/news/detail/'+item.id" class="item" v-for="(item, index) in newsList" <NuxtLinkLocale :to="'/social/news/detail/' + item.id" class="item" v-for="(item, index) in newsData.list" :key="index">
:key="index">
<div class="title ellipsis">{{ item.title }}</div> <div class="title ellipsis">{{ item.title }}</div>
<div class="date">{{ item.create_time }}</div> <div class="date">{{ item.create_time }}</div>
</NuxtLinkLocale> </NuxtLinkLocale>
</div> </div>
<div class="pagination-block">
<el-pagination layout="->, prev, pager, next" :total="newsData.total"
@change="handlePageChange"
/>
</div>
</div> </div>
</template> </template>
<style lang="less"> <style lang="less">
.pagination-block {
margin-bottom: 16px;
}
</style> </style>

Loading…
Cancel
Save