Tenlion/system-copyright-react
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

套餐包使用详情

Browse Source
This commit is contained in:
lyp 2025-05-21 09:39:30 +08:00
parent eecabc4fb0
commit b2b474f14f
4 changed files with 368 additions and 355 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

474
src/components/PackageModal/PackageModal.tsx
View File

@ -1,283 +1,293 @@
import { useEffect, useState, useContext } from 'react' import { useState, useEffect, useContext } from 'react'
// import { GlobalContext } from "../../../context/GlobalContext.ts"; import { Table, Spin, message, Modal } from 'antd';
import {
get,
} from "../../util/AjaxUtils.ts";
import { getPackageDetail } from '../../request/api.ts'
import { GlobalContext } from "../../context/GlobalContext.ts"; import { GlobalContext } from "../../context/GlobalContext.ts";
import useMessage from "antd/es/message/useMessage";
import { Table, Spin, DatePicker, Button, Input, Pagination } from 'antd';
import dayjs, { } from 'dayjs';
const { Search } = Input;
import { ClearOutlined } from '@ant-design/icons';
import type { import type {
TableProps, TableColumnsType,
DatePickerProps
} from 'antd'; } from 'antd';
import { getPackageDetail } from '../../request/api'
// import dayjs, { } from 'dayjs';
import locale from 'antd/es/date-picker/locale/zh_CN';
export default function PackageModal() { export default function PackageModal() {
interface DataType { interface DataType {
index?: number; usericId: string;
icPriceMaterial: number;
icPriceAll: number;
createTime: string;
packageOrderId: string;
} }
const columns: TableProps<DataType>['columns'] = [
interface DetailType {
orderTitle: string; //项目名称
description: string; //描述
gmtCreate: string; //创建时间
mode: number;//类型 1退回 2使用
}
const [messageApi, contextHolder] = message.useMessage();
const [packList, setPackList] = useState<any[]>([]) //服务包列表
const [packPage, setPackPage] = useState(1) //服务包分页
const [packTotal, setPackTotal] = useState(0) //服务包总数
const [packDetailModal, setPackDetailModal] = useState(false) //服务包详情
const [detailPage, setDetailPage] = useState(1) //服务包详情分页
const [detailTotal, setDetailTotal] = useState(0) //服务包详情总数
const [detailList, setDetailList] = useState<any[]>([]) //服务包详情列表
// const [packageOrderId, setPackageOrderId] = useState('') //服务包id
const [packloading, setPackloading] = useState(false)
// 获取我得服务包信息
const getPickList = (page: number, packageType: string) => {
get<any>({
messageApi,
url: `/api/proj/servicepkg/packageorder/listpage/self`,
config: {
params: {
page: page,
rows: 10,
packageType: packageType
}
},
onBefore() {
setPackloading(true)
},
onSuccess({ data }) {
setPackList(data.rows)
setPackTotal(data.total)
},
onFinally() {
setPackloading(false)
}
})
}
const globalContext = useContext(GlobalContext);
const [packageOrderId, setPackageOrderId] = useState('') //服务包id
// 获取服务包详情
const packageDetail = async (packageOrderId: string, page: number) => {
const res: any = await getPackageDetail(globalContext.user.userId, packageOrderId, { page: page, rows: 10 })
console.log(res);
setDetailList(res.rows)
setDetailTotal(res.total)
}
useEffect(() => {
getPickList(packPage, '')
}, [packPage])
useEffect(() => {
packageDetail(packageOrderId, detailPage)
}, [detailPage])
const packColumns: TableColumnsType<DataType> = [
{ {
title: () => <div style={{ textAlign: 'center' }}>序号</div>, title: '序号',
dataIndex: 'index', dataIndex: 'index',
width: 70, // 设置宽度 key: 'packageOrderId',
key: 'index',
align: 'center', align: 'center',
render: (_text, _record, index) => (page - 1) * 10 + index + 1, render: (_text, _record, index) => (packPage - 1) * 10 + index + 1, // 显示序号，从1开始
}, },
{ {
title: <div style={{ textAlign: 'center' }}>套餐包名称</div>, title: '套餐名称',
dataIndex: 'packageName', dataIndex: 'packageName',
// fixed: 'right', key: 'packageOrderId',
width: 120, // 居中显示
align: 'center', align: 'center',
},
// packageType
{
title: '套餐类型',
dataIndex: 'packageInfoAppDTO',
key: 'packageOrderId',
// 居中显示
align: 'center',
render: (text) => {
return <div>{text.packageType == "ALL" ? '全托管' : '写材料'} </div>
}
},
// {
// title: '套餐类型',
// dataIndex: 'packageInfoAppDTO',
// key: 'packageOrderId',
// // 居中显示
// align: 'center',
// render: (text) => {
// return <div>{text} </div>
// }
// },
{
title: '价格',
dataIndex: 'packageTotalMoney',
key: 'packageOrderId',
// 居中显示
align: 'center',
render: (text) => {
return <div>{text / 100}元</div>
}
},
{
title: '剩余次数',
dataIndex: 'packageTotalSurplusCount',
align: 'center',
key: 'packageOrderId',
render: (text: number) => {
return <div>{text} </div>
}
},
{
title: '总次数',
dataIndex: 'packageTotalCount',
align: 'center',
key: 'packageOrderId',
render: (text: any) => {
return <div>{text} </div>
}
},
{
title: '下单时间',
align: 'center',
dataIndex: 'gmtCreate',
key: 'packageOrderId',
// render: (text: string) => {
// return <div title={text} style={{ width: 200, whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>{text}</div>
// }
},
{
title: '操作',
align: 'center',
dataIndex: 'operate',
key: 'packageOrderId',
render: (_value, record) => {
return <a onClick={() => {
// console.log(record);
setPackDetailModal(true)
packageDetail(record.packageOrderId, 1)
setPackageOrderId(record.packageOrderId)
setDetailPage(1)
}}>查看详情</a>
}
},
];
const detailColums: TableColumnsType<DetailType> = [
{
title: '序号',
dataIndex: 'index',
key: 'packageOrderItemId', key: 'packageOrderItemId',
ellipsis: { align: 'center',
showTitle: true, width: 100,
}, render: (_text, _record, index) => (detailPage - 1) * 10 + index + 1, // 显示序号，从1开始
}, },
{ {
title: <div style={{ textAlign: 'center' }}>项目名称</div>, title: '项目名称',
dataIndex: 'orderTitle', dataIndex: 'orderTitle',
// fixed: 'right',
width: 120,
align: 'center',
key: 'packageOrderItemId', key: 'packageOrderItemId',
align: 'center',
width: 150,
ellipsis: { ellipsis: {
showTitle: true, showTitle: true,
}, },
}, },
{ {
title: <div style={{ textAlign: 'center' }}>类型</div>, title: '类型',
dataIndex: 'mode', dataIndex: 'mode',
// fixed: 'right',
width: 80,
align: 'center',
key: 'packageOrderItemId', key: 'packageOrderItemId',
render: (text) => ( align: 'center',
<div >{text == '1'? '退回' : '使用'}</div> width: 120,
) render: (text) => {
return <span>
{text == 1 ? '退回' : '使用'}
</span>
}
}, },
{
title: <div style={{ textAlign: 'center' }}>使用数量</div>,
dataIndex: 'itemUseCount',
// fixed: 'right',
width: 80,
align: 'center',
key: 'packageOrderItemId',
},
{
title: <div style={{ textAlign: 'center' }}>剩余数量</div>,
dataIndex: 'itemCount',
// fixed: 'right',
width: 80,
align: 'center',
key: 'packageOrderItemId',
},
// {
// title: <div style={{ textAlign: 'center' }}>关联订单编号</div>,
// dataIndex: 'orderId',
// // fixed: 'right',
// width: 120,
// align: 'center',
// key: 'packageOrderItemId',
// ellipsis: {
// showTitle: true,
// },
// },
// {
// title: <div style={{ textAlign: 'center' }}>关联订单类型</div>,
// dataIndex: 'orderType',
// key: 'orderType',
// width: 160,
// align: 'center',
// render: (text) => (
// <div >{text == 'ai' ? 'AI喵著' : text}</div>
// )
// },
{ {
title: <div style={{ textAlign: 'center' }}>交易时间</div>, title: '创建时间',
dataIndex: 'gmtCreate', dataIndex: 'gmtCreate',
key: 'packageOrderItemId', key: 'packageOrderItemId',
align: 'center', align: 'center',
width: 160, width: 200,
},
{
title: '使用数量',
dataIndex: 'itemUseCount',
key: 'packageOrderItemId',
align: 'center',
width: 100,
},
{
title: '剩余数量',
dataIndex: 'itemCount',
key: 'packageOrderItemId',
align: 'center',
width: 100,
}, },
{ {
title: <div style={{ textAlign: 'center' }}>描述</div>, title: '描述',
width: 400,
dataIndex: 'description', dataIndex: 'description',
key: 'packageOrderItemId', key: 'packageOrderItemId',
align: 'center', align: 'center',
width: 400,
ellipsis: { ellipsis: {
showTitle: true, showTitle: true,
}, },
}, },
];
const dateFormat = 'YYYY-MM-DD';
const [messageApi, messageContext] = useMessage();
const [isLoading, setIsLoading] = useState(false)
const [page, setPage] = useState(1);
const [total, setTotal] = useState(0);
const [nowValue, setNowValue] = useState('');
const [tableData, setTableData] = useState<any[]>([]);
const [keyWords, setKeyWords] = useState('')
const [startTime, setStartTime] = useState<any | null>(null)
const [endTime, setEndTime] = useState<any | null>(null)
// 更改开始日期
const startTimeChange: DatePickerProps['onChange'] = (date) => {
// const time = dayjs(date).format(dateFormat)
// console.log('日期', date, dateString);
setStartTime(date)
};
const endTimeChange: DatePickerProps['onChange'] = (date) => {
// console.log(date, dateString);
// console.log('日期', date, dateString);
setEndTime(date)
// dayjs(formInfo.getFieldValue('projDevCompleteDate')).format(dateFormat),
};
// 初始化搜索条件及分页
const init = () => {
setNowValue('')
setKeyWords('')
setStartTime(null)
setEndTime(null)
setPage(1)
}
const globalContext = useContext(GlobalContext);
const getData = async (page: any) => {
setIsLoading(true)
try {
const res: any = await getPackageDetail(globalContext.user.userId, {
page: page,
rows: 10,
keywords: keyWords,
startTime: startTime ? dayjs(startTime).format(dateFormat) : '',
endTime: endTime ? dayjs(endTime).format(dateFormat) : '',
})
setIsLoading(false)
setTableData(res.rows)
setTotal(res.total)
} catch (error: any) {
if (error.response) {
const data = error.response.data;
messageApi.open({
type: 'error',
content: data.msg ? data.msg : `${data.path}(${data.status})`,
});
} else {
console.error(error)
}
}
// setPage(res.page)
}
useEffect(() => {
getData(page)
}, [page])
useEffect(() => {
getData(1)
}, [keyWords, startTime, endTime])
]
return ( return (
<div> <Spin tip="加载中..." spinning={packloading} >
{messageContext} {contextHolder}
<Spin tip="加载中..." spinning={isLoading}> <Table
<div style={{ marginBottom: 10 }}> columns={packColumns}
<Search placeholder="请输入关键字" dataSource={packList}
value={nowValue} pagination={{
allowClear defaultPageSize: 10, // 设置默认一页显示 5 条数据,
// value={keyWords} current: packPage,
onChange={(e: any) => { total: packTotal,
setNowValue(e.target.value) onChange: (page: number) => {
if (!e.target.value) { setPackPage(page);
setKeyWords('') getPickList(page, '')
} // console.log(page);
}} }
onSearch={(value: string) => { }}
console.log(value); rowKey="packageOrderId"
setKeyWords(value) />
<Modal title="套餐包使用详情"
centered
footer={null}
destroyOnClose
open={packDetailModal}
width={1200}
onCancel={() => {
setPackDetailModal(false)
}}
style={{ width: 198, height: 36, marginRight: 12 }}
></Search>
<DatePicker placeholder="开始时间"
style={{ width: 198, marginRight: 12 }}
locale={locale}
onChange={startTimeChange}
value={startTime}
allowClear
/>
<DatePicker placeholder="结束时间"
style={{ width: 198, marginRight: 12 }}
locale={locale}
onChange={endTimeChange}
value={endTime}
allowClear
/>
<Button
style={{
// marginLeft: 10,
// backgroundColor: '#FF9F08'
}}
icon={<ClearOutlined />}
onClick={() => {
init()
}}
>
清除
</Button>
</div>
<div style={{
height: 620,
}}> }}>
<Table columns={columns} dataSource={tableData}
// pagination={
// {
// pageSize: 10,
// total: total,
// onChange: (currentPage) => {
// setPage(currentPage);
// },
// showSizeChanger: false,
// current: page
// } <Table
// } columns={detailColums}
pagination={false} dataSource={detailList}
// scroll={{ y: 500 }} pagination={{
bordered defaultPageSize: 10, // 设置默认一页显示 5 条数据,
key="packageOrderItemId" rowKey="packageOrderItemId" current: detailPage,
/> total: detailTotal,
</div> onChange: (page: number) => {
<div className='product-release-pagination'> setDetailPage(page);
<Pagination current={page} total={total} defaultPageSize={10} onChange={(page) => { packageDetail(packageOrderId, page)
setPage(page) // console.log(page);
}} /> }
</div> }}
</Spin> rowKey="packageOrderItemId"
</div> />
</Modal>
</Spin>
) )
} }

4
src/components/balance/BalanceHead.tsx
View File

@ -130,12 +130,12 @@ export default function BalanceHead() {
<RecordModal></RecordModal> <RecordModal></RecordModal>
</Modal> </Modal>
<Modal title="套餐包使用详情" <Modal title="套餐包使用明细"
centered centered
footer={null} footer={null}
destroyOnClose destroyOnClose
open={packageModal} open={packageModal}
width={1500} width={1200}
onCancel={() => { onCancel={() => {
setPackageModal(false) setPackageModal(false)

243
src/layout/head/Head.tsx
View File

@ -19,7 +19,9 @@ import BalanceHead from '../../components/balance/BalanceHead.tsx';
import RechargeHead from '../../components/recharge/RechargeHead.tsx'; import RechargeHead from '../../components/recharge/RechargeHead.tsx';
import { import {
// Empty, // Empty,
Dropdown, MenuProps, message, Modal, Space, Spin, Input, Table, Form, Button Dropdown, MenuProps, message, Modal, Space, Spin, Input,
// Table,
Form, Button
// Form, Button, InputNumber // Form, Button, InputNumber
} from "antd"; } from "antd";
// import { // import {
@ -30,16 +32,16 @@ import titleB from '../../static/Phone/titleB.png'
import line from '../../static/Phone/line.png' import line from '../../static/Phone/line.png'
import pack from '@theme/img/pack.png' import pack from '@theme/img/pack.png'
import PackAgeModal from '../../components/PackageModal/PackageModal.tsx'
// import pack from '@theme/pack.png' // import pack from '@theme/pack.png'
// import type { TableProps, FormProps } from 'antd'; // import type { TableProps, FormProps } from 'antd';
interface DataType { // interface DataType {
usericId: string; // usericId: string;
icPriceMaterial: number; // icPriceMaterial: number;
icPriceAll: number; // icPriceAll: number;
createTime: string; // createTime: string;
} // }
// interface icDataType { // interface icDataType {
// contactName: string;//联系人姓名 // contactName: string;//联系人姓名
// contactPhone: string;//联系人电话 // contactPhone: string;//联系人电话
@ -150,9 +152,9 @@ import ContactPeople from '../../components/ContactPeople/ContactPeople.tsx'
import inv from '../../static/inv.png' import inv from '../../static/inv.png'
import MyOrder from '../../components/myOrder/MyOrder.tsx' import MyOrder from '../../components/myOrder/MyOrder.tsx'
import NoticeModal from '../../components/NoticeModal/NoticeModal.tsx'; import NoticeModal from '../../components/NoticeModal/NoticeModal.tsx';
import type { // import type {
TableColumnsType, // TableColumnsType,
} from 'antd'; // } from 'antd';
// import { log } from 'console'; // import { log } from 'console';
// import HeadCouponModal from '../../components/CouponModal/HeadCouponModal.tsx' // import HeadCouponModal from '../../components/CouponModal/HeadCouponModal.tsx'
export default function Head() { export default function Head() {
@ -328,38 +330,38 @@ export default function Head() {
const [packloading, setPackloading] = useState(false) // const [packloading, setPackloading] = useState(false)
const [packList, setPackList] = useState<any[]>([]) //服务包列表 // const [packList, setPackList] = useState<any[]>([]) //服务包列表
const [packPage, setPackPage] = useState(1) //服务包分页 // const [packPage, setPackPage] = useState(1) //服务包分页
const [packTotal, setPackTotal] = useState(0) //服务包总数 // const [packTotal, setPackTotal] = useState(0) //服务包总数
// const [packageType, setPackageType] = useState('') // const [packageType, setPackageType] = useState('')
// 获取我得服务包信息 // 获取我得服务包信息
const getPickList = (page: number, packageType: string) => { // const getPickList = (page: number, packageType: string) => {
get<any>({ // get<any>({
messageApi, // messageApi,
url: `/api/proj/servicepkg/packageorder/listpage/self`, // url: `/api/proj/servicepkg/packageorder/listpage/self`,
config: { // config: {
params: { // params: {
page: page, // page: page,
rows: 10, // rows: 10,
packageType: packageType // packageType: packageType
} // }
}, // },
onBefore() { // onBefore() {
setPackloading(true) // setPackloading(true)
}, // },
onSuccess({ data }) { // onSuccess({ data }) {
setPackList(data.rows) // setPackList(data.rows)
setPackTotal(data.total) // setPackTotal(data.total)
}, // },
onFinally() { // onFinally() {
setPackloading(false) // setPackloading(false)
} // }
}) // })
} // }
// useEffect(() => { // useEffect(() => {
// console.log('路径',currentUrl); // console.log('路径',currentUrl);
@ -888,81 +890,81 @@ export default function Head() {
applyContactPhone: '', applyContactPhone: '',
applyContactCompany: '' applyContactCompany: ''
}) })
const packColumns: TableColumnsType<DataType> = [ // const packColumns: TableColumnsType<DataType> = [
{ // {
title: '序号', // title: '序号',
dataIndex: 'index', // dataIndex: 'index',
key: 'packageOrderId', // key: 'packageOrderId',
align: 'center', // align: 'center',
render: (_text, _record, index) => (packPage - 1) * 10 + index + 1, // 显示序号，从1开始 // render: (_text, _record, index) => (packPage - 1) * 10 + index + 1, // 显示序号，从1开始
}, // },
{ // {
title: '套餐名称', // title: '套餐名称',
dataIndex: 'packageName', // dataIndex: 'packageName',
key: 'packageOrderId', // key: 'packageOrderId',
// 居中显示 // // 居中显示
align: 'center', // align: 'center',
}, // },
// packageType // // packageType
{ // {
title: '套餐类型', // title: '套餐类型',
dataIndex: 'packageInfoAppDTO', // dataIndex: 'packageInfoAppDTO',
key: 'packageOrderId', // key: 'packageOrderId',
// 居中显示 // // 居中显示
align: 'center', // align: 'center',
render: (text) => { // render: (text) => {
return <div>{text.packageType == "ALL" ? '全托管' : '写材料'} </div> // return <div>{text.packageType == "ALL" ? '全托管' : '写材料'} </div>
} // }
}, // },
// { // // {
// title: '套餐类型', // // title: '套餐类型',
// dataIndex: 'packageInfoAppDTO', // // dataIndex: 'packageInfoAppDTO',
// key: 'packageOrderId', // // key: 'packageOrderId',
// // 居中显示 // // // 居中显示
// align: 'center', // // align: 'center',
// render: (text) => { // // render: (text) => {
// return <div>{text} </div> // // return <div>{text} </div>
// } // // }
// }, // // },
{ // {
title: '价格', // title: '价格',
dataIndex: 'packageTotalMoney', // dataIndex: 'packageTotalMoney',
key: 'packageOrderId', // key: 'packageOrderId',
// 居中显示 // // 居中显示
align: 'center', // align: 'center',
render: (text) => { // render: (text) => {
return <div>{text / 100}元</div> // return <div>{text / 100}元</div>
} // }
}, // },
{ // {
title: '剩余次数', // title: '剩余次数',
dataIndex: 'packageTotalSurplusCount', // dataIndex: 'packageTotalSurplusCount',
align: 'center', // align: 'center',
key: 'packageOrderId', // key: 'packageOrderId',
render: (text: number) => { // render: (text: number) => {
return <div>{text} </div> // return <div>{text} </div>
} // }
}, // },
{ // {
title: '总次数', // title: '总次数',
dataIndex: 'packageTotalCount', // dataIndex: 'packageTotalCount',
align: 'center', // align: 'center',
key: 'packageOrderId', // key: 'packageOrderId',
render: (text: any) => { // render: (text: any) => {
return <div>{text} </div> // return <div>{text} </div>
} // }
}, // },
{ // {
title: '下单时间', // title: '下单时间',
align: 'center', // align: 'center',
dataIndex: 'gmtCreate', // dataIndex: 'gmtCreate',
key: 'packageOrderId', // key: 'packageOrderId',
// render: (text: string) => { // // render: (text: string) => {
// return <div title={text} style={{ width: 200, whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>{text}</div> // // return <div title={text} style={{ width: 200, whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }}>{text}</div>
// } // // }
}, // },
]; // ];
// 优惠券弹窗 // 优惠券弹窗
// const [couponModal, setCouponModal] = useState(false) // const [couponModal, setCouponModal] = useState(false)
// const [belongArray,setBelongArray] = useState([]) // const [belongArray,setBelongArray] = useState([])
@ -1237,8 +1239,8 @@ export default function Head() {
onClick: () => { onClick: () => {
// setCouponModal(true) // setCouponModal(true)
setPackageModal(true) setPackageModal(true)
setPackPage(1); // setPackPage(1);
getPickList(1, '') // getPickList(1, '')
// setPackageType('') // setPackageType('')
} }
}, },
@ -1363,8 +1365,8 @@ export default function Head() {
}} }}
onClick={() => { onClick={() => {
setPackageModal(true) setPackageModal(true)
setPackPage(1); // setPackPage(1);
getPickList(1, '') // getPickList(1, '')
}} }}
> >
<img src={pack} width={19} height={19} alt="" /> <img src={pack} width={19} height={19} alt="" />
@ -1642,13 +1644,14 @@ export default function Head() {
destroyOnClose destroyOnClose
centered centered
open={packageModal} open={packageModal}
width={1000} width={1200}
footer={null} footer={null}
onCancel={() => { onCancel={() => {
setPackageModal(false) setPackageModal(false)
setPackPage(1); // setPackPage(1);
}}> }}>
<Spin tip="加载中..." spinning={packloading} > <PackAgeModal></PackAgeModal>
{/* <Spin tip="加载中..." spinning={packloading} >
<Table <Table
columns={packColumns} columns={packColumns}
dataSource={packList} dataSource={packList}
@ -1664,7 +1667,7 @@ export default function Head() {
}} }}
rowKey="packageOrderId" rowKey="packageOrderId"
/> />
</Spin> </Spin> */}
</Modal> </Modal>
<Modal title="邀请码" <Modal title="邀请码"
destroyOnClose destroyOnClose

2
src/request/api.ts
View File

@ -32,7 +32,7 @@ export const getInvoiceInfoByinvoiceRechargeId = (invoiceRechargeId: string) =>
export const updateInvoiceInfoByinvoiceRechargeId = (invoiceRechargeId: string, params: any) => request.put(`/operator-plugin/api/invoicerecharge/update/${invoiceRechargeId}`, params) export const updateInvoiceInfoByinvoiceRechargeId = (invoiceRechargeId: string, params: any) => request.put(`/operator-plugin/api/invoicerecharge/update/${invoiceRechargeId}`, params)
// 获取套餐包使用详情 // 获取套餐包使用详情
export const getPackageDetail = (userId:string,params:any) => request.get(`/operator-plugin/app/packageorderitem/listpagerelease/${userId}`, { params }) export const getPackageDetail = (userId:string,packageOrderId:string,params:any) => request.get(`/operator-plugin/app/packageorderitem/listpagerelease/${userId}?packageOrderId=${packageOrderId}`, { params })
//--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- //---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------