parent
1e23fff664
commit
2e5734176e
@ -1,5 +1,5 @@ |
|||||||
#TARO_APP_API=https://yjx.dev.yaojiankang.top |
TARO_APP_API=https://yjx.dev.yaojiankang.top |
||||||
TARO_APP_API=https://playedu.yaojiankang.top |
#TARO_APP_API=https://playedu.yaojiankang.top |
||||||
TARO_APP_LGOIN=true |
TARO_APP_LGOIN=true |
||||||
|
|
||||||
|
|
||||||
|
@ -0,0 +1,93 @@ |
|||||||
|
import {FC, useCallback, useEffect, useState} from "react"; |
||||||
|
import {Input, Radio, Text, View} from "@tarojs/components"; |
||||||
|
import styles from "../courseAdmin.module.scss"; |
||||||
|
import Icon from "@/components/icon"; |
||||||
|
import {CourseAllParam, curriculum} from "@/api"; |
||||||
|
import CustomPageContainer from "@/components/custom-page-container/custom-page-container"; |
||||||
|
import Empty from "@/components/empty/empty"; |
||||||
|
import MyButton from "@/components/button/MyButton"; |
||||||
|
|
||||||
|
interface Props { |
||||||
|
param: CourseAllParam |
||||||
|
setParam: (data: CourseAllParam) => void |
||||||
|
} |
||||||
|
|
||||||
|
export const Search: FC<Props> = ({param, setParam}) => { |
||||||
|
const [show, setShow] = useState(false) |
||||||
|
const [deps, setDeps] = useState<Manage[]>([]) |
||||||
|
const [depId, setDepId] = useState<number | null>(param.dep_id) |
||||||
|
|
||||||
|
async function getDepList() { |
||||||
|
try { |
||||||
|
const res = await curriculum.department() |
||||||
|
setDeps(res.data) |
||||||
|
} catch (e) { |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
const changeDepId = useCallback((id: number) => { |
||||||
|
if (id === depId) { |
||||||
|
setDepId(null) |
||||||
|
} else { |
||||||
|
setDepId(id) |
||||||
|
} |
||||||
|
}, [depId]) |
||||||
|
|
||||||
|
const putParam = useCallback(() => { |
||||||
|
setShow(false) |
||||||
|
if (param.dep_id !== depId) { |
||||||
|
setParam({...param, dep_id: depId}) |
||||||
|
} |
||||||
|
}, [depId]) |
||||||
|
|
||||||
|
useEffect(() => { |
||||||
|
getDepList() |
||||||
|
}, []) |
||||||
|
|
||||||
|
return ( |
||||||
|
<> |
||||||
|
<View className={styles.searchBox}> |
||||||
|
<View className={styles.searchInput}> |
||||||
|
<Icon name='search' size={18}/> |
||||||
|
<Input |
||||||
|
placeholder='搜索名称' |
||||||
|
className='ml-1 flex-1' |
||||||
|
value={param.title} |
||||||
|
onBlur={(e) => setParam({...param, title: e.detail.value})}/> |
||||||
|
</View> |
||||||
|
<View onClick={() => setShow(true)}> |
||||||
|
<Text>筛选</Text> |
||||||
|
</View> |
||||||
|
</View> |
||||||
|
|
||||||
|
<CustomPageContainer show={show} position='top' onClickOverlay={() => setShow(false)}> |
||||||
|
<View className={styles.custom}> |
||||||
|
{deps.length ? |
||||||
|
<> |
||||||
|
{ |
||||||
|
deps.map(dep => <View |
||||||
|
className={styles.radioBox} |
||||||
|
onClick={() => changeDepId(dep.id)}> |
||||||
|
<Radio |
||||||
|
value={String(dep.id)} |
||||||
|
checked={depId === dep.id}/> |
||||||
|
{dep.name} |
||||||
|
</View>) |
||||||
|
} |
||||||
|
|
||||||
|
<View className='flex justify-around mt-2'> |
||||||
|
<View onClick={() => setShow(false)}> |
||||||
|
<MyButton type='default' fillet width={150}>取消</MyButton> |
||||||
|
</View> |
||||||
|
<View> |
||||||
|
<MyButton fillet width={150} onClick={putParam}>确定</MyButton> |
||||||
|
</View> |
||||||
|
</View> |
||||||
|
</> |
||||||
|
: <Empty name='暂无部门'/>} |
||||||
|
|
||||||
|
</View> |
||||||
|
</CustomPageContainer> |
||||||
|
</> |
||||||
|
) |
||||||
|
} |
@ -0,0 +1,3 @@ |
|||||||
|
export default definePageConfig({ |
||||||
|
navigationBarTitleText: '课程管理', |
||||||
|
}) |
@ -0,0 +1,30 @@ |
|||||||
|
.searchBox { |
||||||
|
background: #fff; |
||||||
|
padding: 24rpx 30rpx; |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: top; |
||||||
|
} |
||||||
|
|
||||||
|
.searchInput{ |
||||||
|
width: 570rpx; |
||||||
|
height: 68rpx; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
padding-left: 24rpx; |
||||||
|
background: #F5F8F7; |
||||||
|
border-radius: 32rpx; |
||||||
|
color: #909795; |
||||||
|
overflow: hidden; |
||||||
|
} |
||||||
|
|
||||||
|
.radioBox{ |
||||||
|
border-bottom: 1px solid #F5F8F7; |
||||||
|
padding: 20px 0; |
||||||
|
} |
||||||
|
|
||||||
|
.custom{ |
||||||
|
max-height: 60vh; |
||||||
|
overflow: auto; |
||||||
|
padding: 20px 0; |
||||||
|
} |
@ -0,0 +1,25 @@ |
|||||||
|
import {FC, useEffect, useState} from "react"; |
||||||
|
import {View} from "@tarojs/components"; |
||||||
|
import {Search} from "./components/search"; |
||||||
|
import {CourseAllParam, courseApi} from "@/api"; |
||||||
|
|
||||||
|
const CourseAdmin: FC = () => { |
||||||
|
const [param, setParam] = useState<CourseAllParam>({ |
||||||
|
page: 1, |
||||||
|
page_size: 10, |
||||||
|
title: '', |
||||||
|
dep_id: null |
||||||
|
}) |
||||||
|
|
||||||
|
useEffect(() => { |
||||||
|
courseApi.getCourseAll(param) |
||||||
|
}, [param]) |
||||||
|
|
||||||
|
return ( |
||||||
|
<View> |
||||||
|
<Search param={param} setParam={setParam}/> |
||||||
|
</View> |
||||||
|
) |
||||||
|
} |
||||||
|
|
||||||
|
export default CourseAdmin |
After Width: | Height: | Size: 1.1 KiB |
Loading…
Reference in new issue