Merge branch 'dev' into dev-yj
This commit is contained in:
yjnoh
commit
8f0cee9d4c
@ -1,5 +1,6 @@
|
||||
import { useMessage } from '@/hooks/useMessage'
|
||||
import { useEffect, useState } from 'react'
|
||||
import { useEvent } from '@/hooks/useEvent'
|
||||
|
||||
const FLOW_LINE_TYPE = {
|
||||
DOWN_LEFT: 'downLeft',
|
||||
@ -44,12 +45,7 @@ export default function FlowLine({ FLOW_LINE_REF }) {
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="outline-form">
|
||||
<div className="input-grid mr5" style={{ width: '100px' }}>
|
||||
<input
|
||||
type="text"
|
||||
className="input-origin block"
|
||||
readOnly={type !== FLOW_LINE_TYPE.DOWN_LEFT}
|
||||
ref={FLOW_LINE_REF.DOWN_LEFT_INPUT_REF}
|
||||
/>
|
||||
<input type="text" className="input-origin block" readOnly={true} ref={FLOW_LINE_REF.DOWN_LEFT_INPUT_REF} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -1,5 +1,8 @@
|
||||
import { useMessage } from '@/hooks/useMessage'
|
||||
import { useEffect, useState } from 'react'
|
||||
import { useEvent } from '@/hooks/useEvent'
|
||||
import { canvasState } from '@/store/canvasAtom'
|
||||
import { useRecoilValue } from 'recoil'
|
||||
|
||||
const UP_DOWN_TYPE = {
|
||||
UP: 'up',
|
||||
@ -9,6 +12,7 @@ const UP_DOWN_TYPE = {
|
||||
export default function Updown({ UP_DOWN_REF }) {
|
||||
const { getMessage } = useMessage()
|
||||
const [type, setType] = useState(UP_DOWN_TYPE.UP)
|
||||
const canvas = useRecoilValue(canvasState)
|
||||
|
||||
useEffect(() => {
|
||||
if (type === UP_DOWN_TYPE.UP) {
|
||||
@ -44,7 +48,7 @@ export default function Updown({ UP_DOWN_REF }) {
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="outline-form">
|
||||
<div className="input-grid mr5" style={{ width: '100px' }}>
|
||||
<input type="text" className="input-origin block" readOnly={type !== UP_DOWN_TYPE.UP} ref={UP_DOWN_REF.UP_INPUT_REF} />
|
||||
<input type="text" className="input-origin block" readOnly={true} ref={UP_DOWN_REF.UP_INPUT_REF} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -240,7 +240,9 @@ export default function Stuff() {
|
||||
schToDt: dayjs(new Date()).format('YYYY-MM-DD'),
|
||||
startRow: (pageNo - 1) * pageSize + 1,
|
||||
endRow: pageNo * pageSize,
|
||||
schSelSaleStoreId: '',
|
||||
schSelSaleStoreId: stuffSearchParams?.schOtherSelSaleStoreId
|
||||
? stuffSearchParams.schOtherSelSaleStoreId
|
||||
: stuffSearchParams.schSelSaleStoreId,
|
||||
schSortType: stuffSearchParams.schSortType,
|
||||
}
|
||||
|
||||
@ -256,12 +258,12 @@ export default function Stuff() {
|
||||
})
|
||||
}
|
||||
fetchData()
|
||||
} else {
|
||||
} else if (stuffSearchParams?.code === 'M') {
|
||||
//메인화면에서 진입
|
||||
const params = {
|
||||
saleStoreId: sessionState?.storeId,
|
||||
schObjectNo: stuffSearchParams.schObjectNo,
|
||||
schAddress: '',
|
||||
schAddress: 'dfdfdfdfdf',
|
||||
schObjectName: '',
|
||||
schSaleStoreName: '',
|
||||
schReceiveUser: '',
|
||||
@ -271,25 +273,31 @@ export default function Stuff() {
|
||||
schToDt: dayjs(new Date()).format('YYYY-MM-DD'),
|
||||
startRow: (pageNo - 1) * pageSize + 1,
|
||||
endRow: pageNo * pageSize,
|
||||
schSelSaleStoreId: '',
|
||||
schSelSaleStoreId: stuffSearchParams?.schOtherSelSaleStoreId
|
||||
? stuffSearchParams.schOtherSelSaleStoreId
|
||||
: stuffSearchParams.schSelSaleStoreId,
|
||||
schSortType: 'R',
|
||||
}
|
||||
|
||||
async function fetchData() {
|
||||
const apiUrl = `/api/object/list?${queryStringFormatter(params)}`
|
||||
await get({
|
||||
url: apiUrl,
|
||||
}).then((res) => {
|
||||
if (!isEmptyArray(res)) {
|
||||
setGridProps({ ...gridProps, gridData: res, count: res[0].totCnt })
|
||||
setTotalCount(res[0].totCnt)
|
||||
}
|
||||
setStuffSearch({
|
||||
...params,
|
||||
})
|
||||
}
|
||||
fetchData()
|
||||
|
||||
// async function fetchData() {
|
||||
// const apiUrl = `/api/object/list?${queryStringFormatter(params)}`
|
||||
// await get({
|
||||
// url: apiUrl,
|
||||
// }).then((res) => {
|
||||
// if (!isEmptyArray(res)) {
|
||||
// setGridProps({ ...gridProps, gridData: res, count: res[0].totCnt })
|
||||
// setTotalCount(res[0].totCnt)
|
||||
// }
|
||||
// })
|
||||
// }
|
||||
// fetchData()
|
||||
}
|
||||
}
|
||||
}, [pageNo, sessionState])
|
||||
// }, [pageNo, sessionState, stuffSearchParams])
|
||||
}, [pageNo, stuffSearchParams])
|
||||
|
||||
useEffect(() => {
|
||||
if (stuffSearchParams?.code === 'E') {
|
||||
@ -298,6 +306,7 @@ export default function Stuff() {
|
||||
stuffSearchParams.schSortType = defaultSortType
|
||||
|
||||
setPageNo(1)
|
||||
|
||||
//조회를 눌렀을때
|
||||
async function fetchData() {
|
||||
const apiUrl = `/api/object/list?saleStoreId=${sessionState?.storeId}&${queryStringFormatter(stuffSearchParams)}`
|
||||
@ -320,10 +329,13 @@ export default function Stuff() {
|
||||
let startRow = (1 - 1) * e.target.value + 1
|
||||
stuffSearchParams.startRow = startRow
|
||||
stuffSearchParams.endRow = 1 * e.target.value
|
||||
stuffSearchParams.schSelSaleStoreId = stuffSearchParams?.schOtherSelSaleStoreId
|
||||
? stuffSearchParams.schOtherSelSaleStoreId
|
||||
: stuffSearchParams.schSelSaleStoreId
|
||||
setPageSize(e.target.value)
|
||||
setStuffSearch({
|
||||
...stuffSearch,
|
||||
code: 'S',
|
||||
...stuffSearchParams,
|
||||
// code: 'P',
|
||||
startRow: startRow,
|
||||
endRow: 1 * e.target.value,
|
||||
})
|
||||
@ -348,6 +360,9 @@ export default function Stuff() {
|
||||
stuffSearchParams.endRow = 1 * pageSize
|
||||
|
||||
stuffSearchParams.schSortType = e.target.value
|
||||
stuffSearchParams.schSelSaleStoreId = stuffSearchParams?.schOtherSelSaleStoreId
|
||||
? stuffSearchParams.schOtherSelSaleStoreId
|
||||
: stuffSearchParams.schSelSaleStoreId
|
||||
setDefaultSortType(e.target.value)
|
||||
setStuffSearch({
|
||||
...stuffSearch,
|
||||
@ -358,7 +373,6 @@ export default function Stuff() {
|
||||
})
|
||||
|
||||
setPageNo(1)
|
||||
|
||||
const apiUrl = `/api/object/list?saleStoreId=${sessionState?.storeId}&${queryStringFormatter(stuffSearchParams)}`
|
||||
get({ url: apiUrl }).then((res) => {
|
||||
if (!isEmptyArray(res)) {
|
||||
@ -382,7 +396,9 @@ export default function Stuff() {
|
||||
// 페이징 현재페이지 변경
|
||||
const handleChangePage = (page) => {
|
||||
stuffSearchParams.code = 'S'
|
||||
|
||||
stuffSearchParams.schSelSaleStoreId = stuffSearchParams?.schOtherSelSaleStoreId
|
||||
? stuffSearchParams.schOtherSelSaleStoreId
|
||||
: stuffSearchParams.schSelSaleStoreId
|
||||
setStuffSearch({
|
||||
...stuffSearch,
|
||||
code: 'S',
|
||||
@ -405,10 +421,7 @@ export default function Stuff() {
|
||||
{getMessage('stuff.search.grid.all')}
|
||||
<span>{convertNumberToPriceDecimal(totalCount)}</span>
|
||||
</li>
|
||||
<li>
|
||||
{/* {getMessage('stuff.search.grid.selected')} */}
|
||||
{/* <span className="red">{convertNumberToPriceDecimal(selectedRowDataCount)}</span> */}
|
||||
</li>
|
||||
<li></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div className="left-unit-box">
|
||||
|
||||
@ -15,12 +15,14 @@ import SingleDatePicker from '../common/datepicker/SingleDatePicker'
|
||||
import { sessionStore } from '@/store/commonAtom'
|
||||
import { useMessage } from '@/hooks/useMessage'
|
||||
import { isObjectNotEmpty } from '@/util/common-utils'
|
||||
import { searchState } from '@/store/boardAtom'
|
||||
export default function StuffSearchCondition() {
|
||||
const sessionState = useRecoilValue(sessionStore)
|
||||
const [appMessageState, setAppMessageState] = useRecoilState(appMessageStore)
|
||||
const globalLocaleState = useRecoilValue(globalLocaleStore)
|
||||
const { getMessage } = useMessage()
|
||||
const ref = useRef()
|
||||
const ref2 = useRef()
|
||||
const { get } = useAxios(globalLocaleState)
|
||||
|
||||
const objectNoRef = useRef(null)
|
||||
@ -59,6 +61,10 @@ export default function StuffSearchCondition() {
|
||||
const [schSelSaleStoreList, setSchSelSaleStoreList] = useState([]) //판매대리점 자동완성 SELECT 전체
|
||||
const [favoriteStoreList, setFavoriteStoreList] = useState([]) //즐겨찾기한 판매점목록
|
||||
const [showSaleStoreList, setShowSaleStoreList] = useState([]) //보여줄 판매점목록
|
||||
|
||||
const [otherSaleStoreList, setOtherSaleStoreList] = useState([]) //1차점 이외 판매점목록
|
||||
const [otherSaleStoreId, setOtherSaleStoreId] = useState('')
|
||||
|
||||
// 조회
|
||||
const onSubmit = () => {
|
||||
let diff = dayjs(endDate).diff(startDate, 'day')
|
||||
@ -73,7 +79,7 @@ export default function StuffSearchCondition() {
|
||||
schAddress: address ? address : stuffSearch?.schAddress,
|
||||
schObjectName: objectName ? objectName : stuffSearch?.schObjectName,
|
||||
schDispCompanyName: dispCompanyName ? dispCompanyName : stuffSearch?.schDispCompanyName,
|
||||
schSelSaleStoreId: stuffSearch?.schSelSaleStoreId ? stuffSearch.schSelSaleStoreId : schSelSaleStoreId,
|
||||
schSelSaleStoreId: stuffSearch?.schOtherSelSaleStoreId ? stuffSearch.schOtherSelSaleStoreId : stuffSearch.schSelSaleStoreId,
|
||||
schReceiveUser: receiveUser ? receiveUser : stuffSearch?.schReceiveUser,
|
||||
schDateType: stuffSearch?.schDateType ? stuffSearch.schDateType : dateType,
|
||||
schFromDt: dayjs(startDate).format('YYYY-MM-DD'),
|
||||
@ -90,7 +96,7 @@ export default function StuffSearchCondition() {
|
||||
schAddress: address ? address : '',
|
||||
schObjectName: objectName ? objectName : '',
|
||||
schDispCompanyName: dispCompanyName ? dispCompanyName : '',
|
||||
schSelSaleStoreId: schSelSaleStoreId ? schSelSaleStoreId : '',
|
||||
schSelSaleStoreId: stuffSearch?.schOtherSelSaleStoreId ? stuffSearch.schOtherSelSaleStoreId : stuffSearch.schSelSaleStoreId,
|
||||
schReceiveUser: receiveUser ? receiveUser : '',
|
||||
schDateType: dateType,
|
||||
schFromDt: dayjs(startDate).format('YYYY-MM-DD'),
|
||||
@ -105,6 +111,7 @@ export default function StuffSearchCondition() {
|
||||
|
||||
//초기화
|
||||
const resetRecoil = () => {
|
||||
//T01아니면 자동완성 초기화 막기
|
||||
objectNoRef.current.value = ''
|
||||
saleStoreNameRef.current.value = ''
|
||||
addressRef.current.value = ''
|
||||
@ -121,49 +128,144 @@ export default function StuffSearchCondition() {
|
||||
setDateType('U')
|
||||
setStartDate(dayjs(new Date()).add(-1, 'year').format('YYYY-MM-DD'))
|
||||
setEndDate(dayjs(new Date()).format('YYYY-MM-DD'))
|
||||
if (sessionState?.storeId === 'T01') {
|
||||
setSchSelSaleStoreId('')
|
||||
handleClear() //판매대리점선택 자동완성 클리어
|
||||
handleClear1() //판매대리점선택 자동완성 클리어
|
||||
resetStuffRecoil()
|
||||
setStuffSearch({
|
||||
...stuffSearch,
|
||||
code: 'C',
|
||||
schSelSaleStoreId: '',
|
||||
schOtherSelSaleStoreId: '',
|
||||
})
|
||||
} else {
|
||||
if (otherSaleStoreList.length > 1) {
|
||||
handleClear2()
|
||||
setOtherSaleStoreId('')
|
||||
stuffSearch.schObjectNo = ''
|
||||
stuffSearch.schDateType = 'U'
|
||||
} else {
|
||||
stuffSearch.schObjectNo = ''
|
||||
stuffSearch.schDateType = 'U'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
if (isObjectNotEmpty(sessionState)) {
|
||||
// storeId가 T01 이거나 1차점일때만 판매대리점 선택 활성화
|
||||
// storeId가 T01 이거나 storeLvl이 1차점일때만 판매대리점 선택 활성화
|
||||
let url
|
||||
if (sessionState?.storeId === 'T01') {
|
||||
// url = `/api/object/saleStore/${sessionState?.storeId}/list?userId=an1`
|
||||
url = `/api/object/saleStore/${sessionState?.storeId}/list?userId=${sessionState?.userId}`
|
||||
//T01일떄
|
||||
url = `/api/object/saleStore/${sessionState?.storeId}/firstList?userId=${sessionState?.userId}`
|
||||
} else {
|
||||
url = `/api/object/saleStore/${sessionState?.storeId}/list`
|
||||
if (sessionState.storeLvl === '1') {
|
||||
//T01아닌 1차점일때
|
||||
url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=1&userId=${sessionState?.userId}`
|
||||
} else {
|
||||
url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=1&userId=${sessionState?.userId}`
|
||||
}
|
||||
}
|
||||
|
||||
get({ url: url }).then((res) => {
|
||||
if (!isEmptyArray(res)) {
|
||||
res.map((row) => {
|
||||
row.value = row.saleStoreId
|
||||
row.label = row.saleStoreName
|
||||
})
|
||||
const allList = res
|
||||
const favList = res.filter((row) => row.priority !== 'B')
|
||||
|
||||
let allList
|
||||
let favList
|
||||
let otherList
|
||||
if (sessionState?.storeId === 'T01') {
|
||||
allList = res
|
||||
allList.sort((a, b) => (a.saleStoreId !== 'T01') - (b.saleStoreId !== 'T01') || a.saleStoreId - b.saleStoreId)
|
||||
favList = res.filter((row) => row.saleStoreId === 'T01' || row.priority !== 'B')
|
||||
setSchSelSaleStoreList(allList)
|
||||
setFavoriteStoreList(favList)
|
||||
setShowSaleStoreList(favList)
|
||||
setSchSelSaleStoreId(sessionState?.storeId)
|
||||
setStuffSearch({
|
||||
...stuffSearch,
|
||||
code: 'S',
|
||||
schSelSaleStoreId: sessionState?.storeId,
|
||||
})
|
||||
|
||||
//T01일때 2차 판매점 호출하기
|
||||
url = `/api/object/saleStore/${sessionState?.storeId}/list?firstFlg=0&userId=${sessionState?.userId}`
|
||||
|
||||
get({ url: url }).then((res) => {
|
||||
if (!isEmptyArray(res)) {
|
||||
res.map((row) => {
|
||||
row.value = row.saleStoreId
|
||||
row.label = row.saleStoreName
|
||||
})
|
||||
|
||||
otherList = res
|
||||
setOtherSaleStoreList(otherList)
|
||||
} else {
|
||||
setOtherSaleStoreList([])
|
||||
}
|
||||
})
|
||||
} else {
|
||||
if (sessionState?.storeLvl === '1') {
|
||||
allList = res
|
||||
favList = res.filter((row) => row.priority !== 'B')
|
||||
otherList = res.filter((row) => row.firstAgentYn === 'N')
|
||||
setSchSelSaleStoreList(allList)
|
||||
setFavoriteStoreList(allList)
|
||||
setShowSaleStoreList(allList)
|
||||
setSchSelSaleStoreId(allList[0].saleStoreId)
|
||||
|
||||
setOtherSaleStoreList(otherList)
|
||||
|
||||
setStuffSearch({
|
||||
...stuffSearch,
|
||||
code: 'S',
|
||||
schSelSaleStoreId: allList[0].saleStoreId,
|
||||
})
|
||||
} else {
|
||||
//201X112 그냥2차점
|
||||
//2차점인데 34들고있는애 202X217
|
||||
setSchSelSaleStoreList(res)
|
||||
setFavoriteStoreList(res)
|
||||
setShowSaleStoreList(res)
|
||||
setSchSelSaleStoreId(res[0].saleStoreId)
|
||||
otherList = res.filter((row) => row.firstAgentYn === 'N')
|
||||
setOtherSaleStoreList(otherList)
|
||||
|
||||
//선택한 2차점 세션으로 자동셋팅
|
||||
setOtherSaleStoreId(sessionState?.storeId)
|
||||
setStuffSearch({
|
||||
...stuffSearch,
|
||||
code: 'S',
|
||||
schSelSaleStoreId: otherList[0].saleStoreId,
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}, [sessionState])
|
||||
|
||||
//초기화 눌렀을 때 자동완성도..
|
||||
const handleClear = () => {
|
||||
//초기화 눌렀을 때 1차판매점 자동완성도..
|
||||
const handleClear1 = () => {
|
||||
if (ref.current) {
|
||||
ref.current.clearValue()
|
||||
}
|
||||
}
|
||||
|
||||
const handleClear2 = () => {
|
||||
if (ref2.current) {
|
||||
ref2.current.clearValue()
|
||||
}
|
||||
}
|
||||
|
||||
//자동완성 인풋
|
||||
const onInputChange = (key) => {
|
||||
if (key !== '') {
|
||||
setShowSaleStoreList(schSelSaleStoreList)
|
||||
setOtherSaleStoreList([])
|
||||
} else {
|
||||
setShowSaleStoreList(favoriteStoreList)
|
||||
}
|
||||
@ -172,15 +274,47 @@ export default function StuffSearchCondition() {
|
||||
//판매대리점 자동완성 변경
|
||||
const onSelectionChange = (key) => {
|
||||
if (isObjectNotEmpty(key)) {
|
||||
setOtherSaleStoreId('')
|
||||
setSchSelSaleStoreId(key.saleStoreId)
|
||||
setStuffSearch({
|
||||
...stuffSearch,
|
||||
code: 'S',
|
||||
schSelSaleStoreId: key.saleStoreId,
|
||||
stuffSearch.schSelSaleStoreId = key.saleStoreId
|
||||
//T01아닌 1차점은 본인으로 디폴트셋팅이고 수정할수없어서 여기안옴
|
||||
//고른 1차점의 saleStoreId로 2차점 API호출하기
|
||||
let url = `/api/object/saleStore/${key.saleStoreId}/list?firstFlg=0&userId=${sessionState?.userId}`
|
||||
let otherList
|
||||
get({ url: url }).then((res) => {
|
||||
if (!isEmptyArray(res)) {
|
||||
res.map((row) => {
|
||||
row.value = row.saleStoreId
|
||||
row.label = row.saleStoreName
|
||||
})
|
||||
|
||||
otherList = res
|
||||
setOtherSaleStoreList(otherList)
|
||||
} else {
|
||||
setOtherSaleStoreList([])
|
||||
}
|
||||
})
|
||||
} else {
|
||||
//X누름
|
||||
setSchSelSaleStoreId('')
|
||||
setStuffSearch({ ...stuffSearch, schSelSaleStoreId: '' })
|
||||
stuffSearch.schSelSaleStoreId = ''
|
||||
|
||||
//2차점 판매점목록비우기
|
||||
setOtherSaleStoreList([])
|
||||
}
|
||||
}
|
||||
|
||||
//2차점 자동완성 변경
|
||||
const onSelectionChange2 = (key) => {
|
||||
if (isObjectNotEmpty(key)) {
|
||||
setOtherSaleStoreId(key.saleStoreId)
|
||||
stuffSearch.schOtherSelSaleStoreId = key.saleStoreId
|
||||
} else {
|
||||
//X누르면 검색조건에 1차점으로 셋팅
|
||||
setOtherSaleStoreId('')
|
||||
setSchSelSaleStoreId(schSelSaleStoreId)
|
||||
stuffSearch.schOtherSelSaleStoreId = ''
|
||||
stuffSearch.schSelSaleStoreId = schSelSaleStoreId
|
||||
}
|
||||
}
|
||||
|
||||
@ -235,6 +369,8 @@ export default function StuffSearchCondition() {
|
||||
<col />
|
||||
<col style={{ width: '160px' }} />
|
||||
<col />
|
||||
<col style={{ width: '160px' }} />
|
||||
<col />
|
||||
</colgroup>
|
||||
<tbody>
|
||||
<tr>
|
||||
@ -283,6 +419,21 @@ export default function StuffSearchCondition() {
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
<th>{getMessage('stuff.search.schDispCompanyName')}</th>
|
||||
<td>
|
||||
<div className="input-wrap">
|
||||
<input
|
||||
type="text"
|
||||
ref={dispCompanyNameRef}
|
||||
className="input-light"
|
||||
defaultValue={stuffSearch.code === 'E' ? stuffSearch?.schDispCompanyName : dispCompanyName}
|
||||
onChange={(e) => {
|
||||
setDispCompanyName(dispCompanyNameRef.current.value)
|
||||
}}
|
||||
onKeyUp={handleByOnKeyUp}
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>{getMessage('stuff.search.schObjectName')}</th>
|
||||
@ -300,63 +451,6 @@ export default function StuffSearchCondition() {
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
<th>{getMessage('stuff.search.schDispCompanyName')}</th>
|
||||
<td>
|
||||
<div className="input-wrap">
|
||||
<input
|
||||
type="text"
|
||||
ref={dispCompanyNameRef}
|
||||
className="input-light"
|
||||
defaultValue={stuffSearch.code === 'E' ? stuffSearch?.schDispCompanyName : dispCompanyName}
|
||||
onChange={(e) => {
|
||||
setDispCompanyName(dispCompanyNameRef.current.value)
|
||||
}}
|
||||
onKeyUp={handleByOnKeyUp}
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
<th>{getMessage('stuff.search.schSelSaleStoreId')}</th>
|
||||
<td>
|
||||
<div className="select-wrap">
|
||||
{schSelSaleStoreList?.length > 0 && (
|
||||
<Select
|
||||
id="long-value-select1"
|
||||
instanceId="long-value-select1"
|
||||
className="react-select-custom"
|
||||
classNamePrefix="custom"
|
||||
placeholder="Select"
|
||||
ref={ref}
|
||||
// options={schSelSaleStoreList}
|
||||
options={showSaleStoreList}
|
||||
onInputChange={onInputChange}
|
||||
onChange={onSelectionChange}
|
||||
getOptionLabel={(x) => x.saleStoreName}
|
||||
getOptionValue={(x) => x.saleStoreId}
|
||||
// value={schSelSaleStoreList.filter(function (option) {
|
||||
value={showSaleStoreList.filter(function (option) {
|
||||
// console.log('자동완성 value::::', option)
|
||||
if (stuffSearch?.code === 'S' && schSelSaleStoreId === '') {
|
||||
return false
|
||||
} else if (stuffSearch?.code === 'S' && schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === schSelSaleStoreId
|
||||
} else if (stuffSearch?.code === 'E' && schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === schSelSaleStoreId
|
||||
} else {
|
||||
if (stuffSearch?.schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === stuffSearch.schSelSaleStoreId
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
}
|
||||
})}
|
||||
isDisabled={sessionState?.storeLvl === '1' ? false : true}
|
||||
isClearable={true}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>{getMessage('stuff.search.schReceiveUser')}</th>
|
||||
<td>
|
||||
<div className="input-wrap">
|
||||
@ -372,8 +466,130 @@ export default function StuffSearchCondition() {
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
<th>{getMessage('stuff.search.period')}</th>
|
||||
<th>{getMessage('stuff.search.schSelSaleStoreId')}</th>
|
||||
<td colSpan={3}>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="select-wrap mr5" style={{ flex: 1 }}>
|
||||
{sessionState?.storeId === 'T01' && (
|
||||
<Select
|
||||
id="long-value-select1"
|
||||
instanceId="long-value-select1"
|
||||
className="react-select-custom"
|
||||
classNamePrefix="custom"
|
||||
placeholder="Select"
|
||||
ref={ref}
|
||||
options={showSaleStoreList}
|
||||
onInputChange={onInputChange}
|
||||
onChange={onSelectionChange}
|
||||
getOptionLabel={(x) => x.saleStoreName}
|
||||
getOptionValue={(x) => x.saleStoreId}
|
||||
value={showSaleStoreList.filter(function (option) {
|
||||
if (stuffSearch?.code === 'S' && schSelSaleStoreId === '') {
|
||||
return false
|
||||
} else if (stuffSearch?.code === 'S' && schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === schSelSaleStoreId
|
||||
} else if (stuffSearch?.code === 'E' && schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === schSelSaleStoreId
|
||||
} else {
|
||||
if (stuffSearch?.schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === stuffSearch.schSelSaleStoreId
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
}
|
||||
})}
|
||||
isDisabled={sessionState?.storeLvl !== '1' ? true : sessionState?.storeId !== 'T01' ? true : false}
|
||||
isClearable={true}
|
||||
/>
|
||||
)}
|
||||
{sessionState?.storeId !== 'T01' && sessionState?.storeLvl === '1' && (
|
||||
<Select
|
||||
id="long-value-select1"
|
||||
instanceId="long-value-select1"
|
||||
className="react-select-custom"
|
||||
classNamePrefix="custom"
|
||||
placeholder="Select"
|
||||
ref={ref}
|
||||
options={showSaleStoreList[0]}
|
||||
onChange={onSelectionChange}
|
||||
getOptionLabel={(x) => x.saleStoreName}
|
||||
getOptionValue={(x) => x.saleStoreId}
|
||||
value={showSaleStoreList.filter(function (option) {
|
||||
if (stuffSearch?.code === 'S' && schSelSaleStoreId === '') {
|
||||
return false
|
||||
} else if (stuffSearch?.code === 'S' && schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === schSelSaleStoreId
|
||||
} else if (stuffSearch?.code === 'E' && schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === schSelSaleStoreId
|
||||
} else {
|
||||
if (stuffSearch?.schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === stuffSearch.schSelSaleStoreId
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
}
|
||||
})}
|
||||
isDisabled={sessionState?.storeLvl !== '1' ? true : sessionState?.storeId !== 'T01' ? true : false}
|
||||
isClearable={false}
|
||||
/>
|
||||
)}
|
||||
{sessionState?.storeId !== 'T01' && sessionState?.storeLvl !== '1' && (
|
||||
<Select
|
||||
id="long-value-select1"
|
||||
instanceId="long-value-select1"
|
||||
className="react-select-custom"
|
||||
classNamePrefix="custom"
|
||||
placeholder="Select"
|
||||
ref={ref}
|
||||
options={showSaleStoreList[0]}
|
||||
onChange={onSelectionChange}
|
||||
getOptionLabel={(x) => x.saleStoreName}
|
||||
getOptionValue={(x) => x.saleStoreId}
|
||||
value={showSaleStoreList.filter(function (option) {
|
||||
if (stuffSearch?.code === 'S' && schSelSaleStoreId === '') {
|
||||
return false
|
||||
} else if (stuffSearch?.code === 'S' && schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === schSelSaleStoreId
|
||||
} else if (stuffSearch?.code === 'E' && schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === schSelSaleStoreId
|
||||
} else {
|
||||
if (stuffSearch?.schSelSaleStoreId !== '') {
|
||||
return option.saleStoreId === stuffSearch.schSelSaleStoreId
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
}
|
||||
})}
|
||||
isDisabled={true}
|
||||
isClearable={false}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
<div className="select-wrap" style={{ flex: 1 }}>
|
||||
<Select
|
||||
id="long-value-select2"
|
||||
instanceId="long-value-select2"
|
||||
className="react-select-custom"
|
||||
classNamePrefix="custom"
|
||||
placeholder="Select"
|
||||
ref={ref2}
|
||||
options={otherSaleStoreList}
|
||||
onChange={onSelectionChange2}
|
||||
getOptionLabel={(x) => x.saleStoreName}
|
||||
getOptionValue={(x) => x.saleStoreId}
|
||||
isDisabled={otherSaleStoreList.length > 1 ? false : true}
|
||||
isClearable={true}
|
||||
value={otherSaleStoreList.filter(function (option) {
|
||||
return option.saleStoreId === otherSaleStoreId
|
||||
})}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>{getMessage('stuff.search.period')}</th>
|
||||
<td colSpan={7}>
|
||||
<div className="form-flex-wrap">
|
||||
<div className="radio-wrap mr10">
|
||||
<div className="d-check-radio light mr10">
|
||||
|
||||
@ -2,7 +2,8 @@ import { useRecoilValue } from 'recoil'
|
||||
import { canvasState } from '@/store/canvasAtom'
|
||||
import { usePopup } from '@/hooks/usePopup'
|
||||
import { useMessage } from '@/hooks/useMessage'
|
||||
import { useRef, useState } from 'react'
|
||||
import { useEffect, useRef, useState } from 'react'
|
||||
import { useEvent } from '@/hooks/useEvent'
|
||||
|
||||
//동선이동 형 올림 내림
|
||||
export function useMovementSetting(id) {
|
||||
@ -11,6 +12,7 @@ export function useMovementSetting(id) {
|
||||
UP_DOWN: 'updown', //형 올림내림
|
||||
}
|
||||
const canvas = useRecoilValue(canvasState)
|
||||
const { initEvent, addCanvasMouseEventListener } = useEvent()
|
||||
const { closePopup } = usePopup()
|
||||
const { getMessage } = useMessage()
|
||||
const buttonType = [
|
||||
@ -18,6 +20,7 @@ export function useMovementSetting(id) {
|
||||
{ id: 2, name: getMessage('modal.movement.flow.line.updown'), type: TYPE.UP_DOWN },
|
||||
]
|
||||
const [type, setType] = useState(TYPE.FLOW_LINE)
|
||||
const typeRef = useRef(type)
|
||||
|
||||
const FLOW_LINE_REF = {
|
||||
DOWN_LEFT_INPUT_REF: useRef(null),
|
||||
@ -33,7 +36,96 @@ export function useMovementSetting(id) {
|
||||
DOWN_RADIO_REF: useRef(null),
|
||||
}
|
||||
|
||||
const handleSave = () => {}
|
||||
useEffect(() => {
|
||||
typeRef.current = type
|
||||
}, [type])
|
||||
|
||||
useEffect(() => {
|
||||
const wallLines = canvas.getObjects().filter((obj) => obj.name === 'wallLine') // 기존 wallLine의 visible false
|
||||
wallLines.forEach((line) => {
|
||||
line.set({ visible: false })
|
||||
})
|
||||
const outerLines = canvas.getObjects().filter((obj) => obj.name === 'outerLine') // 기존 outerLine의 selectable true
|
||||
outerLines.forEach((line) => {
|
||||
line.bringToFront()
|
||||
line.set({ selectable: true })
|
||||
})
|
||||
|
||||
canvas.renderAll()
|
||||
addCanvasMouseEventListener('mouse:move', mouseMoveEvent)
|
||||
return () => {
|
||||
initEvent()
|
||||
const wallLines = canvas.getObjects().filter((obj) => obj.name === 'wallLine')
|
||||
wallLines.forEach((line) => {
|
||||
line.set({ visible: true })
|
||||
})
|
||||
canvas.renderAll()
|
||||
}
|
||||
}, [])
|
||||
|
||||
const mouseMoveEvent = (e) => {
|
||||
if (typeRef.current === TYPE.FLOW_LINE) {
|
||||
flowLineEvent(e)
|
||||
} else {
|
||||
updownEvent(e)
|
||||
}
|
||||
}
|
||||
const flowLineEvent = (e) => {
|
||||
console.log('flow')
|
||||
}
|
||||
|
||||
const updownEvent = (e) => {
|
||||
const target = canvas.getActiveObject()
|
||||
if (!target) {
|
||||
return
|
||||
}
|
||||
const direction = target.direction
|
||||
const { top: targetTop, left: targetLeft } = target
|
||||
const currentX = canvas.getPointer(e.e).x
|
||||
const currentY = Math.floor(canvas.getPointer(e.e).y)
|
||||
|
||||
if (direction === 'left' || direction === 'right') {
|
||||
if (targetTop > currentY) {
|
||||
UP_DOWN_REF.DOWN_RADIO_REF.current.checked = true
|
||||
UP_DOWN_REF.UP_INPUT_REF.current.value = ''
|
||||
|
||||
UP_DOWN_REF.DOWN_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetTop - currentY)) / 10000).toFixed(5) * 100000)
|
||||
} else {
|
||||
UP_DOWN_REF.UP_RADIO_REF.current.checked = true
|
||||
UP_DOWN_REF.DOWN_INPUT_REF.current.value = ''
|
||||
|
||||
UP_DOWN_REF.UP_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetTop - currentY)) / 10000).toFixed(5) * 100000)
|
||||
}
|
||||
} else {
|
||||
if (targetLeft > currentX) {
|
||||
UP_DOWN_REF.DOWN_RADIO_REF.current.checked = true
|
||||
UP_DOWN_REF.UP_INPUT_REF.current.value = ''
|
||||
|
||||
UP_DOWN_REF.DOWN_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetLeft - currentX)) / 10000).toFixed(5) * 100000)
|
||||
} else {
|
||||
UP_DOWN_REF.UP_RADIO_REF.current.checked = true
|
||||
UP_DOWN_REF.DOWN_INPUT_REF.current.value = ''
|
||||
|
||||
UP_DOWN_REF.UP_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetLeft - currentX)) / 10000).toFixed(5) * 100000)
|
||||
}
|
||||
}
|
||||
|
||||
canvas?.renderAll()
|
||||
}
|
||||
|
||||
const getOnlyDecimal = function (_number, _length) {
|
||||
let result
|
||||
|
||||
result = _number % 1
|
||||
|
||||
result = Number(result.toFixed(_length))
|
||||
|
||||
return result * 10
|
||||
}
|
||||
|
||||
const handleSave = () => {
|
||||
closePopup(id)
|
||||
}
|
||||
|
||||
return {
|
||||
TYPE,
|
||||
|
||||
@ -14,7 +14,8 @@ export const stuffSearchState = atom({
|
||||
schFromDt: dayjs(new Date()).add(-1, 'year').format('YYYY-MM-DD'), //시작일
|
||||
schToDt: dayjs(new Date()).format('YYYY-MM-DD'), //종료일
|
||||
code: 'S',
|
||||
schSelSaleStoreId: '', //판매대리점 선택
|
||||
schSelSaleStoreId: '', //1차판매대리점 선택
|
||||
schOtherSelSaleStoreId: '', //1차 이외 판매대리점 선택
|
||||
startRow: 1,
|
||||
endRow: 100,
|
||||
schSortType: 'R', //정렬조건 (R:최근등록일 U:최근수정일)
|
||||
|
||||
@ -26,14 +26,14 @@
|
||||
min-width: 1280px;
|
||||
padding-bottom: 0;
|
||||
background-color: #383838;
|
||||
transition: padding .17s ease-in-out;
|
||||
transition: padding 0.17s ease-in-out;
|
||||
z-index: 999;
|
||||
.canvas-menu-inner {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 40px 0 20px;
|
||||
background-color: #2C2C2C;
|
||||
background-color: #2c2c2c;
|
||||
height: 46.8px;
|
||||
z-index: 999;
|
||||
.canvas-menu-list {
|
||||
@ -53,7 +53,7 @@
|
||||
font-weight: 600;
|
||||
padding: 15px 20px;
|
||||
opacity: 0.55;
|
||||
transition: all .17s ease-in-out;
|
||||
transition: all 0.17s ease-in-out;
|
||||
.menu-icon {
|
||||
display: block;
|
||||
width: 14px;
|
||||
@ -62,13 +62,27 @@
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
margin-right: 10px;
|
||||
&.con00{background-image: url(/static/images/canvas/menu_icon00.svg);}
|
||||
&.con01{background-image: url(/static/images/canvas/menu_icon01.svg);}
|
||||
&.con02{background-image: url(/static/images/canvas/menu_icon02.svg);}
|
||||
&.con03{background-image: url(/static/images/canvas/menu_icon03.svg);}
|
||||
&.con04{background-image: url(/static/images/canvas/menu_icon04.svg);}
|
||||
&.con05{background-image: url(/static/images/canvas/menu_icon05.svg);}
|
||||
&.con06{background-image: url(/static/images/canvas/menu_icon06.svg);}
|
||||
&.con00 {
|
||||
background-image: url(/static/images/canvas/menu_icon00.svg);
|
||||
}
|
||||
&.con01 {
|
||||
background-image: url(/static/images/canvas/menu_icon01.svg);
|
||||
}
|
||||
&.con02 {
|
||||
background-image: url(/static/images/canvas/menu_icon02.svg);
|
||||
}
|
||||
&.con03 {
|
||||
background-image: url(/static/images/canvas/menu_icon03.svg);
|
||||
}
|
||||
&.con04 {
|
||||
background-image: url(/static/images/canvas/menu_icon04.svg);
|
||||
}
|
||||
&.con05 {
|
||||
background-image: url(/static/images/canvas/menu_icon05.svg);
|
||||
}
|
||||
&.con06 {
|
||||
background-image: url(/static/images/canvas/menu_icon06.svg);
|
||||
}
|
||||
}
|
||||
}
|
||||
&.active {
|
||||
@ -100,25 +114,43 @@
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
border-radius: 2px;
|
||||
background-color: #3D3D3D;
|
||||
background-color: #3d3d3d;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 15px 15px;
|
||||
transition: all .17s ease-in-out;
|
||||
&.btn01{background-image: url(../../public/static/images/canvas/side_icon03.svg);}
|
||||
&.btn02{background-image: url(../../public/static/images/canvas/side_icon02.svg);}
|
||||
&.btn03{background-image: url(../../public/static/images/canvas/side_icon01.svg);}
|
||||
&.btn04{background-image: url(../../public/static/images/canvas/side_icon04.svg);}
|
||||
&.btn05{background-image: url(../../public/static/images/canvas/side_icon05.svg);}
|
||||
&.btn06{background-image: url(../../public/static/images/canvas/side_icon06.svg);}
|
||||
&.btn07{background-image: url(../../public/static/images/canvas/side_icon07.svg);}
|
||||
&.btn08{background-image: url(../../public/static/images/canvas/side_icon08.svg);}
|
||||
&.btn09{background-image: url(../../public/static/images/canvas/side_icon09.svg);}
|
||||
transition: all 0.17s ease-in-out;
|
||||
&.btn01 {
|
||||
background-image: url(../../public/static/images/canvas/side_icon03.svg);
|
||||
}
|
||||
&.btn02 {
|
||||
background-image: url(../../public/static/images/canvas/side_icon02.svg);
|
||||
}
|
||||
&.btn03 {
|
||||
background-image: url(../../public/static/images/canvas/side_icon01.svg);
|
||||
}
|
||||
&.btn04 {
|
||||
background-image: url(../../public/static/images/canvas/side_icon04.svg);
|
||||
}
|
||||
&.btn05 {
|
||||
background-image: url(../../public/static/images/canvas/side_icon05.svg);
|
||||
}
|
||||
&.btn06 {
|
||||
background-image: url(../../public/static/images/canvas/side_icon06.svg);
|
||||
}
|
||||
&.btn07 {
|
||||
background-image: url(../../public/static/images/canvas/side_icon07.svg);
|
||||
}
|
||||
&.btn08 {
|
||||
background-image: url(../../public/static/images/canvas/side_icon08.svg);
|
||||
}
|
||||
&.btn09 {
|
||||
background-image: url(../../public/static/images/canvas/side_icon09.svg);
|
||||
}
|
||||
&:hover {
|
||||
background-color: #1083E3;
|
||||
background-color: #1083e3;
|
||||
}
|
||||
&.active {
|
||||
background-color: #1083E3;
|
||||
background-color: #1083e3;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -134,10 +166,18 @@
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
&.ico01{background-image: url(../../public/static/images/canvas/ico-flx01.svg);}
|
||||
&.ico02{background-image: url(../../public/static/images/canvas/ico-flx02.svg);}
|
||||
&.ico03{background-image: url(../../public/static/images/canvas/ico-flx03.svg);}
|
||||
&.ico04{background-image: url(../../public/static/images/canvas/ico-flx04.svg);}
|
||||
&.ico01 {
|
||||
background-image: url(../../public/static/images/canvas/ico-flx01.svg);
|
||||
}
|
||||
&.ico02 {
|
||||
background-image: url(../../public/static/images/canvas/ico-flx02.svg);
|
||||
}
|
||||
&.ico03 {
|
||||
background-image: url(../../public/static/images/canvas/ico-flx03.svg);
|
||||
}
|
||||
&.ico04 {
|
||||
background-image: url(../../public/static/images/canvas/ico-flx04.svg);
|
||||
}
|
||||
}
|
||||
.name {
|
||||
font-size: 12px;
|
||||
@ -167,16 +207,16 @@
|
||||
button {
|
||||
margin-left: auto;
|
||||
height: 100%;
|
||||
background-color: #4B4B4B;
|
||||
background-color: #4b4b4b;
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: #fff;
|
||||
padding: 0 7.5px;
|
||||
transition: all .17s ease-in-out;
|
||||
transition: all 0.17s ease-in-out;
|
||||
}
|
||||
&.on {
|
||||
button {
|
||||
background-color: #1083E3;
|
||||
background-color: #1083e3;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -185,7 +225,7 @@
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 10px;
|
||||
background-color: #3D3D3D;
|
||||
background-color: #3d3d3d;
|
||||
border-radius: 2px;
|
||||
width: 100px;
|
||||
height: 30px;
|
||||
@ -218,7 +258,7 @@
|
||||
background-color: #383838;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
transition: all .17s ease-in-out;
|
||||
transition: all 0.17s ease-in-out;
|
||||
.canvas-depth2-inner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@ -270,7 +310,7 @@
|
||||
align-items: center;
|
||||
margin-right: 34px;
|
||||
height: 100%;
|
||||
transition: all .17s ease-in-out;
|
||||
transition: all 0.17s ease-in-out;
|
||||
button {
|
||||
position: relative;
|
||||
font-size: 12px;
|
||||
@ -310,7 +350,7 @@
|
||||
// canvas-layout
|
||||
.canvas-content {
|
||||
padding-top: 46.8px;
|
||||
transition: all .17s ease-in-out;
|
||||
transition: all 0.17s ease-in-out;
|
||||
.canvas-frame {
|
||||
height: calc(100vh - 129.3px);
|
||||
}
|
||||
@ -328,11 +368,11 @@
|
||||
top: 92.8px;
|
||||
left: 0;
|
||||
display: flex;
|
||||
background-color: #1C1C1C;
|
||||
background-color: #1c1c1c;
|
||||
border-top: 1px solid #000;
|
||||
width: 100%;
|
||||
min-width: 1280px;
|
||||
transition: all .17s ease-in-out;
|
||||
transition: all 0.17s ease-in-out;
|
||||
z-index: 99;
|
||||
&.active {
|
||||
top: calc(92.8px + 50px);
|
||||
@ -348,14 +388,14 @@
|
||||
padding: 9.6px 20px;
|
||||
border-right: 1px solid #000;
|
||||
min-width: 0;
|
||||
transition: all .17s ease-in-out;
|
||||
transition: all 0.17s ease-in-out;
|
||||
span {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
font-size: 12px;
|
||||
font-family: 'Pretendard', sans-serif;
|
||||
color: #AAA;
|
||||
color: #aaa;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
@ -393,9 +433,9 @@
|
||||
justify-content: center;
|
||||
width: 45px;
|
||||
padding: 13.5px 0;
|
||||
background-color: #1C1C1C;
|
||||
background-color: #1c1c1c;
|
||||
border-right: 1px solid #000;
|
||||
transition: all .17s ease-in-out;
|
||||
transition: all 0.17s ease-in-out;
|
||||
span {
|
||||
display: block;
|
||||
width: 9px;
|
||||
@ -413,9 +453,9 @@
|
||||
.canvas-frame {
|
||||
position: relative;
|
||||
// height: calc(100% - 36.5px);
|
||||
background-color: #F4F4F7;
|
||||
background-color: #f4f4f7;
|
||||
overflow: auto;
|
||||
transition: all .17s ease-in-out;
|
||||
transition: all 0.17s ease-in-out;
|
||||
// &::-webkit-scrollbar {
|
||||
// width: 10px;
|
||||
// height: 10px;
|
||||
@ -450,7 +490,7 @@
|
||||
min-width: 1280px;
|
||||
height: 46px;
|
||||
border-bottom: 1px solid #000;
|
||||
background: #2C2C2C;
|
||||
background: #2c2c2c;
|
||||
z-index: 999;
|
||||
.sub-header-inner {
|
||||
display: flex;
|
||||
@ -473,7 +513,9 @@
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
&.drawing{background-image: url(../../public/static/images/main/drawing_icon.svg);}
|
||||
&.drawing {
|
||||
background-image: url(../../public/static/images/main/drawing_icon.svg);
|
||||
}
|
||||
}
|
||||
}
|
||||
&:after {
|
||||
@ -484,7 +526,7 @@
|
||||
transform: translateY(-50%);
|
||||
width: 1px;
|
||||
height: 16px;
|
||||
background-color: #D9D9D9;
|
||||
background-color: #d9d9d9;
|
||||
}
|
||||
&:first-child {
|
||||
padding-left: 0;
|
||||
@ -514,7 +556,7 @@
|
||||
span {
|
||||
display: flex;
|
||||
font-size: 12px;
|
||||
color: #AAA;
|
||||
color: #aaa;
|
||||
font-weight: normal;
|
||||
cursor: default;
|
||||
}
|
||||
@ -572,8 +614,8 @@
|
||||
.sub-table-box {
|
||||
padding: 20px;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #E9EAED;
|
||||
background: #FFF;
|
||||
border: 1px solid #e9eaed;
|
||||
background: #fff;
|
||||
box-shadow: 0px 3px 30px 0px rgba(0, 0, 0, 0.02);
|
||||
.table-box-title-wrap {
|
||||
display: flex;
|
||||
@ -596,7 +638,7 @@
|
||||
position: relative;
|
||||
font-size: 15px;
|
||||
font-weight: 600;
|
||||
color: #1083E3;
|
||||
color: #1083e3;
|
||||
padding-left: 10px;
|
||||
&::before {
|
||||
content: '';
|
||||
@ -606,7 +648,7 @@
|
||||
transform: translateY(-50%);
|
||||
width: 1px;
|
||||
height: 11px;
|
||||
background-color: #D9D9D9;
|
||||
background-color: #d9d9d9;
|
||||
}
|
||||
}
|
||||
.option {
|
||||
@ -627,7 +669,7 @@
|
||||
span {
|
||||
font-weight: 600;
|
||||
&.red {
|
||||
color: #E23D70;
|
||||
color: #e23d70;
|
||||
}
|
||||
}
|
||||
&:after {
|
||||
@ -638,10 +680,17 @@
|
||||
transform: translateY(-50%);
|
||||
width: 1px;
|
||||
height: 11px;
|
||||
background-color: #D9D9D9;
|
||||
background-color: #d9d9d9;
|
||||
}
|
||||
&:first-child {
|
||||
padding-left: 0;
|
||||
}
|
||||
&:last-child {
|
||||
padding-right: 0;
|
||||
&::after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&:first-child{padding-left: 0;}
|
||||
&:last-child{padding-right: 0;&::after{display: none;}}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -734,7 +783,7 @@
|
||||
width: 105px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
background-color: #F4F4F7;
|
||||
background-color: #f4f4f7;
|
||||
border-radius: 100px;
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
@ -749,12 +798,12 @@
|
||||
&.blue {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #1083E3;
|
||||
color: #1083e3;
|
||||
}
|
||||
&.red {
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #D72A2A;
|
||||
color: #d72a2a;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -768,11 +817,11 @@
|
||||
padding: 10px;
|
||||
.btn-area {
|
||||
padding-bottom: 15px;
|
||||
border-bottom: 1px solid #ECF0F4;
|
||||
border-bottom: 1px solid #ecf0f4;
|
||||
.file-upload {
|
||||
display: inline-block;
|
||||
height: 30px;
|
||||
background-color: #94A0AD;
|
||||
background-color: #94a0ad;
|
||||
padding: 0 10px;
|
||||
border-radius: 2px;
|
||||
font-size: 13px;
|
||||
@ -780,9 +829,9 @@
|
||||
color: #fff;
|
||||
font-weight: 500;
|
||||
cursor: pointer;
|
||||
transition: background .15s ease-in-out;
|
||||
transition: background 0.15s ease-in-out;
|
||||
&:hover {
|
||||
background-color: #607F9A;
|
||||
background-color: #607f9a;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -806,7 +855,7 @@
|
||||
span {
|
||||
position: relative;
|
||||
font-size: 13px;
|
||||
color: #45576F;
|
||||
color: #45576f;
|
||||
font-weight: 400;
|
||||
white-space: nowrap;
|
||||
padding-right: 55px;
|
||||
@ -831,13 +880,13 @@
|
||||
.special-note-check-wrap {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(5, 1fr);
|
||||
border: 1px solid #ECF0F4;
|
||||
border: 1px solid #ecf0f4;
|
||||
border-radius: 3px;
|
||||
margin-bottom: 30px;
|
||||
.special-note-check-item {
|
||||
padding: 14px 10px;
|
||||
border-right: 1px solid #ECF0F4;
|
||||
border-top: 1px solid #ECF0F4;
|
||||
border-right: 1px solid #ecf0f4;
|
||||
border-top: 1px solid #ecf0f4;
|
||||
&:nth-child(5n) {
|
||||
border-right: none;
|
||||
}
|
||||
@ -845,13 +894,13 @@
|
||||
border-top: none;
|
||||
}
|
||||
&.act {
|
||||
background-color: #F7F9FA;
|
||||
background-color: #f7f9fa;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.calculation-estimate {
|
||||
border: 1px solid #ECF0F4;
|
||||
border: 1px solid #ecf0f4;
|
||||
border-radius: 3px;
|
||||
padding: 24px;
|
||||
max-height: 350px;
|
||||
@ -865,13 +914,13 @@
|
||||
dt {
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: #1083E3;
|
||||
color: #1083e3;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
dd {
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #45576F;
|
||||
color: #45576f;
|
||||
margin-bottom: 8px;
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
@ -903,7 +952,7 @@
|
||||
.product-price-tit {
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: #45576F;
|
||||
color: #45576f;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.select-wrap {
|
||||
@ -941,7 +990,7 @@
|
||||
transform: translateY(-50%);
|
||||
width: 1px;
|
||||
height: 12px;
|
||||
background-color: #D9D9D9;
|
||||
background-color: #d9d9d9;
|
||||
}
|
||||
&:first-child {
|
||||
padding-left: 0;
|
||||
@ -953,7 +1002,7 @@
|
||||
padding-right: 0;
|
||||
}
|
||||
&.item01 {
|
||||
color: #3BBB48;
|
||||
color: #3bbb48;
|
||||
span {
|
||||
background-image: url(../../public/static/images/sub/open_ico.svg);
|
||||
}
|
||||
@ -965,13 +1014,13 @@
|
||||
}
|
||||
}
|
||||
&.item03 {
|
||||
color: #0191C9;
|
||||
color: #0191c9;
|
||||
span {
|
||||
background-image: url(../../public/static/images/sub/attachment_ico.svg);
|
||||
}
|
||||
}
|
||||
&.item04 {
|
||||
color: #F16A6A;
|
||||
color: #f16a6a;
|
||||
span {
|
||||
background-image: url(../../public/static/images/sub/click_check_ico.svg);
|
||||
}
|
||||
@ -1033,23 +1082,23 @@
|
||||
table {
|
||||
table-layout: fixed;
|
||||
border-collapse: collapse;
|
||||
border: 1px solid #ECF0F4;
|
||||
border: 1px solid #ecf0f4;
|
||||
border-radius: 4px;
|
||||
thead {
|
||||
th {
|
||||
padding: 4.5px 0;
|
||||
border-bottom: 1px solid #ECF0F4;
|
||||
border-bottom: 1px solid #ecf0f4;
|
||||
text-align: center;
|
||||
font-size: 13px;
|
||||
color: #45576F;
|
||||
color: #45576f;
|
||||
font-weight: 500;
|
||||
background-color: #F8F9FA;
|
||||
background-color: #f8f9fa;
|
||||
}
|
||||
}
|
||||
tbody {
|
||||
td {
|
||||
font-size: 13px;
|
||||
color: #45576F;
|
||||
color: #45576f;
|
||||
text-align: center;
|
||||
padding: 4.5px 0;
|
||||
}
|
||||
@ -1063,13 +1112,13 @@
|
||||
.simulation-tit-wrap {
|
||||
flex: none;
|
||||
padding-right: 40px;
|
||||
border-right: 1px solid #EEEEEE;
|
||||
border-right: 1px solid #eeeeee;
|
||||
span {
|
||||
display: block;
|
||||
position: relative;
|
||||
padding-left: 60px;
|
||||
font-size: 15px;
|
||||
color: #14324F;
|
||||
color: #14324f;
|
||||
font-weight: 600;
|
||||
&::before {
|
||||
content: '';
|
||||
@ -1097,7 +1146,7 @@
|
||||
}
|
||||
dd {
|
||||
font-size: 12px;
|
||||
color: #45576F;
|
||||
color: #45576f;
|
||||
font-weight: 400;
|
||||
line-height: 24px;
|
||||
}
|
||||
@ -1105,7 +1154,8 @@
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
ul, ol{
|
||||
ul,
|
||||
ol {
|
||||
list-style: unset;
|
||||
}
|
||||
}
|
||||
@ -1114,10 +1164,10 @@
|
||||
.module-total {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background-color: #F8F9FA;
|
||||
background-color: #f8f9fa;
|
||||
padding: 9px 0;
|
||||
margin-right: 4px;
|
||||
border: 1px solid #ECF0F4;
|
||||
border: 1px solid #ecf0f4;
|
||||
border-top: none;
|
||||
.total-title {
|
||||
flex: 1;
|
||||
@ -1140,7 +1190,7 @@
|
||||
.information-help-wrap {
|
||||
display: flex;
|
||||
padding: 24px;
|
||||
background-color: #F4F4F4;
|
||||
background-color: #f4f4f4;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 15px;
|
||||
.information-help-tit-wrap {
|
||||
@ -1148,7 +1198,7 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 40px;
|
||||
border-right: 1px solid #E0E0E3;
|
||||
border-right: 1px solid #e0e0e3;
|
||||
.help-tit-icon {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
@ -1160,7 +1210,7 @@
|
||||
.help-tit {
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: #45576F;
|
||||
color: #45576f;
|
||||
}
|
||||
}
|
||||
.information-help-guide {
|
||||
@ -1169,7 +1219,7 @@
|
||||
display: block;
|
||||
font-size: 12px;
|
||||
font-weight: 400;
|
||||
color: #45576F;
|
||||
color: #45576f;
|
||||
margin-bottom: 7px;
|
||||
&:last-child {
|
||||
margin-bottom: 0;
|
||||
@ -1183,7 +1233,7 @@
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 10px 0 30px 0;
|
||||
border-bottom: 1px solid #E5E5E5;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
margin-bottom: 24px;
|
||||
.community-search-box {
|
||||
position: relative;
|
||||
@ -1202,7 +1252,7 @@
|
||||
font-weight: 400;
|
||||
color: #101010;
|
||||
&::placeholder {
|
||||
color: #C8C8C8;
|
||||
color: #c8c8c8;
|
||||
}
|
||||
}
|
||||
.community-search-ico {
|
||||
@ -1221,10 +1271,10 @@
|
||||
.community-search-keyword {
|
||||
font-size: 13px;
|
||||
font-weight: 400;
|
||||
color: #45576F;
|
||||
color: #45576f;
|
||||
span {
|
||||
font-weight: 600;
|
||||
color: #F16A6A;
|
||||
color: #f16a6a;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1239,15 +1289,15 @@
|
||||
align-items: center;
|
||||
padding: 24px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #E5E5E5;
|
||||
background: #FFF;
|
||||
transition: all .15s ease-in-out;
|
||||
border: 1px solid #e5e5e5;
|
||||
background: #fff;
|
||||
transition: all 0.15s ease-in-out;
|
||||
.file-item-info {
|
||||
.item-num {
|
||||
display: inline-block;
|
||||
padding: 6px 17.5px;
|
||||
border-radius: 60px;
|
||||
background-color: #F4F4F7;
|
||||
background-color: #f4f4f7;
|
||||
font-size: 13px;
|
||||
font-weight: 600;
|
||||
color: #101010;
|
||||
@ -1279,7 +1329,7 @@
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
background-color: #F4F4F7;
|
||||
background-color: #f4f4f7;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1292,7 +1342,7 @@
|
||||
height: 148px;
|
||||
padding: 24px;
|
||||
border-radius: 4px;
|
||||
border: 1px solid #E5E5E5;
|
||||
border: 1px solid #e5e5e5;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
color: #344356;
|
||||
@ -1304,8 +1354,8 @@
|
||||
align-items: center;
|
||||
width: 200px;
|
||||
height: 30px;
|
||||
background-color: #FAFAFA;
|
||||
border: 1px solid #EEE;
|
||||
background-color: #fafafa;
|
||||
border: 1px solid #eee;
|
||||
padding: 0 10px;
|
||||
input {
|
||||
font-size: 13px;
|
||||
@ -1428,5 +1478,4 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user