Merge branch 'master' into lsf-dev
commit
ceb3e8da4a
|
|
@ -203,3 +203,9 @@ code {
|
||||||
padding: 0 !important;
|
padding: 0 !important;
|
||||||
padding-right: 10px !important;
|
padding-right: 10px !important;
|
||||||
}
|
}
|
||||||
|
.flex{
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.flex-end{
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
|
@ -208,19 +208,46 @@ export async function loadMenu(): Promise<MenuItem[]> {
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: id(), title: '培训管理', redirect: '/mgr/sz/pxgl/pxjhgl',
|
id: id(), title: '水政执法', redirect: '/mgr/sz/szzf/ajdj',
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
id: id(), title: '培训计划管理', path: '/mgr/sz/pxgl/pxjhgl',
|
id: id(), title: '案件登记', path: '/mgr/sz/szzf/ajdj',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: id(), title: '培训记录管理', path: '/mgr/sz/pxgl/pxjlgl',
|
id: id(), title: '案件统计', path: '/mgr/sz/szzf/ajtj',
|
||||||
},
|
},
|
||||||
]
|
{
|
||||||
|
id: id(), title: '处理依据', path: '/mgr/sz/szzf/clyj',
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{ id: id(), title: '四预', redirect: '/mgr/sy/fhxzfx', icon: 'fxzb',
|
{
|
||||||
|
id: id(), title: '监督考核', redirect: '/mgr/sz/jdkh/khtj',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
id: id(), title: '考核统计', path: '/mgr/sz/jdkh/khtj',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: id(), title: '考核任务管理', path: '/mgr/sz/jdkh/khrwgl',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: id(), title: '考核问题整改', path: '/mgr/sz/jdkh/khwtzg',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: id(), title: '考核指标管理', path: '/mgr/sz/jdkh/khzbgl',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: id(), title: '考核模板管理', path: '/mgr/sz/jdkh/khmbgl',
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{ id: id(), title: '法律法规', path: '/mgr/sz/flfg' },
|
||||||
|
{ id: id(), title: '制度管理', path: '/mgr/sz/zdgl' },
|
||||||
|
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: id(), title: '四预', redirect: '/mgr/sy/fhxzfx', icon: 'fxzb',
|
||||||
children: [
|
children: [
|
||||||
{ id: id(), title: '防洪形势', path: '/mgr/sy/fhxzfx' },
|
{ id: id(), title: '防洪形势', path: '/mgr/sy/fhxzfx' },
|
||||||
{ id: id(), title: '天气预报', path: '/mgr/fxzb/tqyb' },
|
{ id: id(), title: '天气预报', path: '/mgr/fxzb/tqyb' },
|
||||||
|
|
@ -246,7 +273,8 @@ export async function loadMenu(): Promise<MenuItem[]> {
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{ id: id(), title: '四管', redirect: '/mgr/sg/xcxj/xcrw', icon: 'fxzb',
|
{
|
||||||
|
id: id(), title: '四管', redirect: '/mgr/sg/xcxj/xcrw', icon: 'fxzb',
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
id: id(), title: '巡查巡检', redirect: '/mgr/sg/xcxj/xcrw',
|
id: id(), title: '巡查巡检', redirect: '/mgr/sg/xcxj/xcrw',
|
||||||
|
|
@ -302,7 +330,8 @@ export async function loadMenu(): Promise<MenuItem[]> {
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{ id: id(), title: '工程安全监测', redirect: '/mgr/gcaqjc/gcaqyj/bzt', icon: 'fxzb',
|
{
|
||||||
|
id: id(), title: '工程安全监测', redirect: '/mgr/gcaqjc/gcaqyj/bzt', icon: 'fxzb',
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
id: id(), title: '布置图', path: '/mgr/gcaqjc/gcaqyj/bzt',
|
id: id(), title: '布置图', path: '/mgr/gcaqjc/gcaqyj/bzt',
|
||||||
|
|
@ -333,14 +362,17 @@ export async function loadMenu(): Promise<MenuItem[]> {
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{ id:id(),title:'四全',redirect:'/mgr/sq/qfg/zcdjxx',
|
{
|
||||||
|
id: id(), title: '四全', redirect: '/mgr/sq/qfg/zcdjxx',
|
||||||
children: [
|
children: [
|
||||||
{ id: id(), title: '全覆盖', redirect: '/mgr/sq/qfg/zcdjxx',
|
{
|
||||||
|
id: id(), title: '全覆盖', redirect: '/mgr/sq/qfg/zcdjxx',
|
||||||
children: [
|
children: [
|
||||||
{ id: id(), title: '注册登记信息', path: '/mgr/sq/qfg/zcdjxx' },
|
{ id: id(), title: '注册登记信息', path: '/mgr/sq/qfg/zcdjxx' },
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{ id: id(), title: '全要素', redirect: '/mgr/sq/qys/kqys',
|
{
|
||||||
|
id: id(), title: '全要素', redirect: '/mgr/sq/qys/kqys',
|
||||||
children: [
|
children: [
|
||||||
{ id: id(), title: '库区要素', path: '/mgr/sq/qys/kqys' },
|
{ id: id(), title: '库区要素', path: '/mgr/sq/qys/kqys' },
|
||||||
{ id: id(), title: '工程要素', path: '/mgr/sq/qys/gcys' },
|
{ id: id(), title: '工程要素', path: '/mgr/sq/qys/gcys' },
|
||||||
|
|
|
||||||
|
|
@ -5,6 +5,7 @@ const pubapi_old = 'https://owrsvr.cloudowr.cn/svr'
|
||||||
const pubapi = 'https://owrsvr.cloudowr.cn/pubapi'
|
const pubapi = 'https://owrsvr.cloudowr.cn/pubapi'
|
||||||
const zdkapi = 'https://slt-sh.chutianyun.gov.cn:8002' //中电科的市级平台
|
const zdkapi = 'https://slt-sh.chutianyun.gov.cn:8002' //中电科的市级平台
|
||||||
const service_fxdd = '/gunshiApp/tsg'
|
const service_fxdd = '/gunshiApp/tsg'
|
||||||
|
const service_xyt = '/gunshiApp/tsg'//登陆先用小玉潭
|
||||||
const service_shzh = '/shzh'
|
const service_shzh = '/shzh'
|
||||||
const apiurl = {
|
const apiurl = {
|
||||||
pxjh: {
|
pxjh: {
|
||||||
|
|
@ -30,10 +31,10 @@ const apiurl = {
|
||||||
setMenu: service_fxdd + '/visitMenuLog/insert',
|
setMenu: service_fxdd + '/visitMenuLog/insert',
|
||||||
setPassword: service_fxdd + '/user/updateSecretKey',
|
setPassword: service_fxdd + '/user/updateSecretKey',
|
||||||
xytlogin: {
|
xytlogin: {
|
||||||
login: service_fxdd + '/login',
|
login: service_xyt + '/login',
|
||||||
info: service_fxdd + '/getInfo',
|
info: service_xyt + '/getInfo',
|
||||||
router: service_fxdd + '/getRouters',
|
router: service_xyt + '/getRouters',
|
||||||
role: service_fxdd + '/system/menu/list'
|
role: service_xyt + '/system/menu/list'
|
||||||
},
|
},
|
||||||
|
|
||||||
// 基本情况
|
// 基本情况
|
||||||
|
|
@ -910,7 +911,155 @@ const apiurl = {
|
||||||
weatherasin: service_fxdd + '/weather/basin', // 24小时流域统计
|
weatherasin: service_fxdd + '/weather/basin', // 24小时流域统计
|
||||||
weatherArea: service_fxdd + '/weather/area', // 24小时区域统计
|
weatherArea: service_fxdd + '/weather/area', // 24小时区域统计
|
||||||
short: service_fxdd + '/weather/short/level ' // 短临预报量级统计
|
short: service_fxdd + '/weather/short/level ' // 短临预报量级统计
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
//檀树岗
|
||||||
|
// 全要素
|
||||||
|
dataResourcesCenter: {
|
||||||
|
projectAndWater: {
|
||||||
|
shuikuBasicinfo: {
|
||||||
|
detail: service_fxdd + "/attResBase/list",
|
||||||
|
update: service_fxdd + "/attResBase/update",
|
||||||
|
getFile:service_fxdd + "/attResBase/file/get"
|
||||||
|
},
|
||||||
|
kr: {
|
||||||
|
list: service_fxdd + "/stZvarlB/list",
|
||||||
|
save: service_fxdd + "/stZvarlB/insert",
|
||||||
|
update: service_fxdd + "/stZvarlB/update",
|
||||||
|
delete: service_fxdd + "/stZvarlB/del"
|
||||||
|
},
|
||||||
|
xl: {
|
||||||
|
list: service_fxdd + "/stZqrlB/list",
|
||||||
|
save: service_fxdd + "/stZqrlB/insert",
|
||||||
|
update: service_fxdd + "/stZqrlB/update",
|
||||||
|
delete: service_fxdd + "/stZqrlB/del"
|
||||||
|
},
|
||||||
|
mangerUnit: {
|
||||||
|
list: service_fxdd + "/resMangUnit/list",
|
||||||
|
update:service_fxdd + "/resMangUnit/update"
|
||||||
|
},
|
||||||
|
zrtx: {
|
||||||
|
list: service_fxdd + "/resSafePersonB/list",
|
||||||
|
save: service_fxdd + "/resSafePersonB/insert",
|
||||||
|
update: service_fxdd + "/resSafePersonB/update",
|
||||||
|
delete:service_fxdd + "/resSafePersonB/del"
|
||||||
|
},
|
||||||
|
monthLl: {
|
||||||
|
page: service_fxdd + "/resMonthEcoFlow/list",
|
||||||
|
update:service_fxdd + "/resMonthEcoFlow/updates"
|
||||||
|
},
|
||||||
|
fxya: {
|
||||||
|
page: service_fxdd + "/resPlanB/list",
|
||||||
|
update: service_fxdd + "/resPlanB/update",
|
||||||
|
save: service_fxdd + "/resPlanB/insert",
|
||||||
|
delete:service_fxdd + "/resPlanB/del",
|
||||||
|
getFile:service_fxdd + "/resPlanB/file/get"
|
||||||
|
},
|
||||||
|
sjtz: {
|
||||||
|
list: service_fxdd + "/attResBase/fileList",
|
||||||
|
upload: service_fxdd + "/attResBase/updateFile",
|
||||||
|
delete: service_fxdd + "/attResBase/del",
|
||||||
|
},
|
||||||
|
projectPic: {
|
||||||
|
list: service_fxdd + "/resProjectImg/list",
|
||||||
|
save: service_fxdd + "/resProjectImg/insert",
|
||||||
|
delete:service_fxdd + "/resProjectImg/del"
|
||||||
|
},
|
||||||
|
yhd: {
|
||||||
|
page: service_fxdd + '/attSpillwayBase/page',
|
||||||
|
save:service_fxdd + '/attSpillwayBase/insert',
|
||||||
|
update: service_fxdd + '/attSpillwayBase/update',
|
||||||
|
delete:service_fxdd + "/attSpillwayBase/del"
|
||||||
|
},
|
||||||
|
db: {
|
||||||
|
page: service_fxdd + '/attDamBase/page',
|
||||||
|
save:service_fxdd + '/attDamBase/insert',
|
||||||
|
update: service_fxdd + '/attDamBase/update',
|
||||||
|
delete: service_fxdd + "/attDamBase/del",
|
||||||
|
getFile:service_fxdd + "/attDamBase/get"
|
||||||
|
},
|
||||||
|
zf: {
|
||||||
|
page: service_fxdd + '/attGateValve/page',
|
||||||
|
save:service_fxdd + '/attGateValve/insert',
|
||||||
|
update: service_fxdd + '/attGateValve/update',
|
||||||
|
delete: service_fxdd + "/attGateValve/del",
|
||||||
|
getFile:service_fxdd + "/attGateValve/get"
|
||||||
|
|
||||||
|
},
|
||||||
|
lsy: {
|
||||||
|
page: service_fxdd + '/attMeaWeir/page',
|
||||||
|
save:service_fxdd + '/attMeaWeir/insert',
|
||||||
|
update: service_fxdd + '/attMeaWeir/update',
|
||||||
|
delete: service_fxdd + "/attMeaWeir/del",
|
||||||
|
list:service_fxdd+"/stAddvcdD/tree"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
basicData: {
|
||||||
|
jczd: {
|
||||||
|
page: service_fxdd + "/stStbprpB/page",
|
||||||
|
save: service_fxdd + "/stStbprpB/insert",
|
||||||
|
update: service_fxdd + "/stStbprpB/update",
|
||||||
|
delete: service_fxdd + "/stStbprpB/del"
|
||||||
|
},
|
||||||
|
dmgl: {
|
||||||
|
page: service_fxdd + "/attDamProfile/page",
|
||||||
|
update: service_fxdd + "/attDamProfile/update",
|
||||||
|
save: service_fxdd + "/attDamProfile/insert",
|
||||||
|
delete: service_fxdd + "/attDamProfile/del",
|
||||||
|
getFile: service_fxdd + "/attDamProfile/file/get"
|
||||||
|
},
|
||||||
|
sysbgl: {
|
||||||
|
page: service_fxdd + "/osmoticPressDevice/page",
|
||||||
|
update: service_fxdd + "/osmoticPressDevice/update",
|
||||||
|
save: service_fxdd + "/osmoticPressDevice/insert",
|
||||||
|
delete: service_fxdd + "/osmoticPressDevice/del",
|
||||||
|
list:service_fxdd + "/osmoticPressDevice/list"
|
||||||
|
},
|
||||||
|
slsbgl: {
|
||||||
|
page: service_fxdd + "/osmoticFlowDevice/page",
|
||||||
|
update: service_fxdd + "/osmoticFlowDevice/update",
|
||||||
|
save: service_fxdd + "/osmoticFlowDevice/insert",
|
||||||
|
delete: service_fxdd + "/osmoticFlowDevice/del",
|
||||||
|
list:service_fxdd + "/osmoticFlowDevice/list"
|
||||||
|
},
|
||||||
|
sjzd: {
|
||||||
|
page: service_fxdd + "/sysDictB/page",
|
||||||
|
update: service_fxdd + "/sysDictB/update",
|
||||||
|
save: service_fxdd + "/sysDictB/insert",
|
||||||
|
delete: service_fxdd + "/sysDictB/del",
|
||||||
|
},
|
||||||
|
spjbxx: {
|
||||||
|
page: service_fxdd + "/attCctvBase/page",
|
||||||
|
update: service_fxdd + "/attCctvBase/update",
|
||||||
|
save: service_fxdd + "/attCctvBase/insert",
|
||||||
|
delete: service_fxdd + "/attCctvBase/del",
|
||||||
|
tree: service_fxdd + "/cctvBMenu/tree",
|
||||||
|
saveTree: service_fxdd + "/cctvBMenu/insert",
|
||||||
|
editTree: service_fxdd + "/cctvBMenu/update",
|
||||||
|
deleteTree: service_fxdd + "/cctvBMenu/del"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
dygxb: {
|
||||||
|
zfysxt: {
|
||||||
|
page: service_fxdd + "/gateValveCctvRel/page",
|
||||||
|
save: service_fxdd + "/gateValveCctvRel/insert",
|
||||||
|
update: service_fxdd + "/gateValveCctvRel/update",
|
||||||
|
delete: service_fxdd + "/gateValveCctvRel/del",
|
||||||
|
zflist: service_fxdd + "/attGateValve/list",
|
||||||
|
splist:service_fxdd + "/attCctvBase/list"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
// 全周期
|
||||||
|
gcdsj:{
|
||||||
|
qzqda:{
|
||||||
|
list:service_fxdd + '/projectEvents/doc/page'
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
export default apiurl
|
export default apiurl
|
||||||
|
|
|
||||||
|
|
@ -89,7 +89,7 @@ import Gcdsj from './sq/qzq/gcdsj'
|
||||||
import Sksq from './sq/qth/sksq'
|
import Sksq from './sq/qth/sksq'
|
||||||
import Hdsq from './sq/qth/hdsq'
|
import Hdsq from './sq/qth/hdsq'
|
||||||
import Ssyq from './sq/qth/ssyq'
|
import Ssyq from './sq/qth/ssyq'
|
||||||
|
import Qzqda from './sq/qzq/qzqda'
|
||||||
// import Zcdjxx from './sq/qys/'
|
// import Zcdjxx from './sq/qys/'
|
||||||
// import Zcdjxx from './sq/qfg/zcdjxx'
|
// import Zcdjxx from './sq/qfg/zcdjxx'
|
||||||
// import Zcdjxx from './sq/qfg/zcdjxx'
|
// import Zcdjxx from './sq/qfg/zcdjxx'
|
||||||
|
|
@ -100,6 +100,12 @@ import Zzjgck from './sz/zzjgck'
|
||||||
import Zrrgl from './sz/zrrgl'
|
import Zrrgl from './sz/zrrgl'
|
||||||
import Pxjhgl from './sz/pxjhgl'
|
import Pxjhgl from './sz/pxjhgl'
|
||||||
import Pxjlgl from './sz/pxjlgl'
|
import Pxjlgl from './sz/pxjlgl'
|
||||||
|
import Flfg from './sz/flfg'
|
||||||
|
import Zdgl from './sz/zdgl'
|
||||||
|
import Ajdj from './sz/szzf/ajdj'
|
||||||
|
import Ajtj from './sz/szzf/ajtj'
|
||||||
|
import Clyj from './sz/szzf/clyj'
|
||||||
|
|
||||||
|
|
||||||
const HomePage = lazy(() => import('./Home'))
|
const HomePage = lazy(() => import('./Home'))
|
||||||
|
|
||||||
|
|
@ -242,12 +248,20 @@ const AppRouters: React.FC = () => {
|
||||||
{ path: 'sq/qys/kqys', element: <Kqys /> },
|
{ path: 'sq/qys/kqys', element: <Kqys /> },
|
||||||
{ path: 'sq/qys/xyys', element: <Xyys /> },
|
{ path: 'sq/qys/xyys', element: <Xyys /> },
|
||||||
{ path: 'sq/qys/gcys', element: <Gcys /> },
|
{ path: 'sq/qys/gcys', element: <Gcys /> },
|
||||||
{ path: 'sq/qzq/Gcdsj', element: <Gcdsj /> },
|
{ path: 'sq/qzq/gcdsj', element: <Gcdsj /> },
|
||||||
|
{ path: 'sq/qys/qzqda', element: <Qzqda /> },
|
||||||
|
|
||||||
// 四制-组织机构查看
|
// 四制-组织机构查看
|
||||||
{ path: 'sz/gltx/zzjgck', element: <Zzjgck /> },
|
{ path: 'sz/gltx/zzjgck', element: <Zzjgck /> },
|
||||||
{ path: 'sz/gltx/zrrgl', element: <Zrrgl /> },
|
{ path: 'sz/gltx/zrrgl', element: <Zrrgl /> },
|
||||||
{ path: 'sz/pxgl/pxjhgl', element: <Pxjhgl /> },
|
{ path: 'sz/pxgl/pxjhgl', element: <Pxjhgl /> },
|
||||||
{ path: 'sz/pxgl/pxjlgl', element: <Pxjlgl /> },
|
{ path: 'sz/pxgl/pxjlgl', element: <Pxjlgl /> },
|
||||||
|
{ path: 'sz/flfg', element: <Flfg /> },
|
||||||
|
{ path: 'sz/zdgl', element: <Zdgl /> },
|
||||||
|
{ path: 'sz/szzf/ajdj', element: <Ajdj /> },
|
||||||
|
{ path: 'sz/szzf/ajtj', element: <Ajtj /> },
|
||||||
|
{ path: 'sz/szzf/clyj', element: <Clyj /> },
|
||||||
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
{ path: '/login', element: <LoginPage /> },
|
{ path: '/login', element: <LoginPage /> },
|
||||||
|
|
|
||||||
|
|
@ -45,7 +45,9 @@ export default function ProjectBasciInfo() {
|
||||||
|
|
||||||
const getData = async () => {
|
const getData = async () => {
|
||||||
try {
|
try {
|
||||||
|
|
||||||
const res = await httppost2(apiurl.dataResourcesCenter.projectAndWater.shuikuBasicinfo.detail)
|
const res = await httppost2(apiurl.dataResourcesCenter.projectAndWater.shuikuBasicinfo.detail)
|
||||||
|
// debugger;
|
||||||
if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
form.setFieldsValue(res.data[0])
|
form.setFieldsValue(res.data[0])
|
||||||
setData(res.data[0])
|
setData(res.data[0])
|
||||||
|
|
|
||||||
|
|
@ -4,8 +4,10 @@ import qys1 from '../../../../assets/img/qys1.png'
|
||||||
import qys2 from '../../../../assets/img/qys2.jpg'
|
import qys2 from '../../../../assets/img/qys2.jpg'
|
||||||
import qys3 from '../../../../assets/img/qys3.jpg'
|
import qys3 from '../../../../assets/img/qys3.jpg'
|
||||||
import qys4 from '../../../../assets/img/qys4.png'
|
import qys4 from '../../../../assets/img/qys4.png'
|
||||||
import './index.less'
|
import stylesCss from './index.module.less'
|
||||||
import { useState } from "react"
|
|
||||||
|
import { Rnd } from "react-rnd"
|
||||||
|
import { useState, useEffect } from "react"
|
||||||
const list = [
|
const list = [
|
||||||
{ name: '水库地理位置图', key: 1, img: qys1 },
|
{ name: '水库地理位置图', key: 1, img: qys1 },
|
||||||
{ name: '水库平面布置图', key: 2, img: qys2 },
|
{ name: '水库平面布置图', key: 2, img: qys2 },
|
||||||
|
|
@ -17,14 +19,57 @@ const Page = () => {
|
||||||
const tabClick = (item) => {
|
const tabClick = (item) => {
|
||||||
setUrl(item.img)
|
setUrl(item.img)
|
||||||
}
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
let scale = 1
|
||||||
|
const img = document.getElementById("img");
|
||||||
|
const fun = (e) => {
|
||||||
|
console.log(1111)
|
||||||
|
// 大于0:滚轮向上滚动 小于0:滚轮向下滚动
|
||||||
|
if (e.wheelDelta > 0) {
|
||||||
|
scale += 0.05;
|
||||||
|
img.style.transform = `scale(${scale})`;
|
||||||
|
} else {
|
||||||
|
if (scale == 1) {
|
||||||
|
img.style.left = 0 + "px";
|
||||||
|
img.style.top = 0 + "px";
|
||||||
|
}
|
||||||
|
// 缩放值大于1时,可以缩小,反之亦然
|
||||||
|
if (scale > 1) {
|
||||||
|
scale -= 0.05;
|
||||||
|
img.style.transform = `scale(${scale})`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
img.addEventListener("wheel", fun)
|
||||||
|
|
||||||
|
// getSyData()
|
||||||
|
// getSlData()
|
||||||
|
// getWyData()
|
||||||
|
// getDmData()
|
||||||
|
return () => {
|
||||||
|
img.removeEventListener("wheel", fun)
|
||||||
|
}
|
||||||
|
|
||||||
|
}, [])
|
||||||
return (
|
return (
|
||||||
<div style={{ backgroundColor: '#fff', height: '100%' }}>
|
<div style={{ backgroundColor: '#fff', height: '100%' }}>
|
||||||
<div style={{ display: 'flex', justifyContent: 'start', alignItems: 'center', }}>
|
<div style={{ display: 'flex', justifyContent: 'start', alignItems: 'center', padding: 10 }}>
|
||||||
{list.map(item=><div className={url==item.img?"active":"tabCheck"} onClick={()=>tabClick(item)}>{item.name}</div>)}
|
{list.map(item => <div className={url == item.img ? stylesCss.active : stylesCss.tabCheck} onClick={() => tabClick(item)}>{item.name}</div>)}
|
||||||
</div>
|
</div>
|
||||||
<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center',overflow:'auto',height:'calc(100% - 100px)' }}>
|
<Rnd
|
||||||
<Image src={url} width='80%' preview={false} />
|
default={{
|
||||||
|
x: 200,
|
||||||
|
y: 60,
|
||||||
|
width: '80%',
|
||||||
|
height: 'calc(100% - 100px)'
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', width:'72%',height:'98%',}}>
|
||||||
|
|
||||||
|
<Image src={url} id="img" preview={false} />
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
</Rnd>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,47 +0,0 @@
|
||||||
.tabCheck{
|
|
||||||
border-width: 0px;
|
|
||||||
width: 125px;
|
|
||||||
height: 36px;
|
|
||||||
background: inherit;
|
|
||||||
background-color: rgba(215, 223, 235, 1);
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-width: 1px;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: rgba(228, 231, 237, 1);
|
|
||||||
border-radius: 10px;
|
|
||||||
border-bottom-right-radius: 0px;
|
|
||||||
border-bottom-left-radius: 0px;
|
|
||||||
-moz-box-shadow: none;
|
|
||||||
-webkit-box-shadow: none;
|
|
||||||
box-shadow: none;
|
|
||||||
font-size: 14px;
|
|
||||||
color: #303133;
|
|
||||||
margin: 10px 0;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 36px;
|
|
||||||
|
|
||||||
}
|
|
||||||
.active{
|
|
||||||
width: 125px;
|
|
||||||
height: 36px;
|
|
||||||
background: inherit;
|
|
||||||
background-color: rgba(255, 255, 255, 1);
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-width: 1px;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: rgba(228, 231, 237, 1);
|
|
||||||
border-bottom: 0px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border-bottom-right-radius: 0px;
|
|
||||||
border-bottom-left-radius: 0px;
|
|
||||||
-moz-box-shadow: none;
|
|
||||||
-webkit-box-shadow: none;
|
|
||||||
box-shadow: none;
|
|
||||||
font-size: 14px;
|
|
||||||
color: #303133;
|
|
||||||
margin: 10px 0;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 36px;
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
@ -0,0 +1,54 @@
|
||||||
|
.tabCheck{
|
||||||
|
width: 120px;
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
margin-right: 5px;
|
||||||
|
border-radius: 10px 10px 0 0;
|
||||||
|
background: #D7DFEB;
|
||||||
|
border: 1px solid rgba(228, 231, 237, 1);
|
||||||
|
text-align: center;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
.active{
|
||||||
|
width: 120px;
|
||||||
|
height: 40px;
|
||||||
|
line-height: 40px;
|
||||||
|
margin-right: 5px;
|
||||||
|
border-radius: 10px 10px 0 0;
|
||||||
|
background: #D7DFEB;
|
||||||
|
border: 1px solid rgba(228, 231, 237, 1);
|
||||||
|
text-align: center;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
color: #409EFF;
|
||||||
|
background: #ffffff;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// .fxdd_hsybjs_toolbar_item{
|
||||||
|
// width: 120px;
|
||||||
|
// height: 40px;
|
||||||
|
// line-height: 40px;
|
||||||
|
// margin-right: 5px;
|
||||||
|
// border-radius: 10px 10px 0 0;
|
||||||
|
// background: #D7DFEB;
|
||||||
|
// border: 1px solid rgba(228, 231, 237, 1);
|
||||||
|
// text-align: center;
|
||||||
|
// font-size: 14px;
|
||||||
|
// font-weight: 500;
|
||||||
|
// color: #333;
|
||||||
|
// cursor: pointer;
|
||||||
|
// }
|
||||||
|
// .hsybjs_checked{
|
||||||
|
// color: #409EFF;
|
||||||
|
// background: #ffffff;
|
||||||
|
// }
|
||||||
|
|
@ -6,7 +6,7 @@ import './index.less'
|
||||||
const Page = () => {
|
const Page = () => {
|
||||||
return (
|
return (
|
||||||
<div style={{ display: 'flex',height:'100%' }}>
|
<div style={{ display: 'flex',height:'100%' }}>
|
||||||
<div style={{ backgroundColor: '#ffffff',width:390,height:'100%',marginRight:10 }}>
|
<div style={{ backgroundColor: '#ffffff',width:390,height:'100%',marginRight:10,padding:10 }}>
|
||||||
<div className="title">
|
<div className="title">
|
||||||
<Image src={title} />保护对象
|
<Image src={title} />保护对象
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -16,7 +16,7 @@ const Page = () => {
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
<div style={{ backgroundColor: '#ffffff',flex:1}}>
|
<div style={{ backgroundColor: '#ffffff',flex:1,padding:10}}>
|
||||||
<div className="title">
|
<div className="title">
|
||||||
<Image src={title} />转移路线示意图
|
<Image src={title} />转移路线示意图
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -44,7 +44,7 @@ const ToolBar = ({ setSearchVal, onSave, storeData,role }) => {
|
||||||
<Button onClick={() => form.resetFields()}>重置</Button>
|
<Button onClick={() => form.resetFields()}>重置</Button>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
{
|
{
|
||||||
(onSave && addBtn) ?
|
(onSave) ?
|
||||||
<Form.Item>
|
<Form.Item>
|
||||||
<Button onClick={onSave}>新增</Button>
|
<Button onClick={onSave}>新增</Button>
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,153 @@
|
||||||
|
import React, { Fragment, useRef, useMemo,useEffect,useState } from 'react';
|
||||||
|
import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
|
||||||
|
import { Table, Card, Modal, Form, Input, Button, Row,Col, Timeline, message, Tabs,Image } from 'antd';
|
||||||
|
import {FileWordOutlined,FilePdfOutlined,FileZipOutlined,FileExcelOutlined } from '@ant-design/icons';
|
||||||
|
import { useSelector } from 'react-redux';
|
||||||
|
import ToolBar from './toolbar';
|
||||||
|
import apiurl from '../../../../service/apiurl';
|
||||||
|
import usePageTable from '../../../../components/crud/usePageTable2';
|
||||||
|
import { createCrudService } from '../../../../components/crud/_';
|
||||||
|
import {CrudOpRender_text} from '../../../../components/crud/CrudOpRender';
|
||||||
|
import './index.less'
|
||||||
|
|
||||||
|
const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
|
||||||
|
const Page = () => {
|
||||||
|
const role = useSelector(state => state.auth.role);
|
||||||
|
const editBtn = role?.rule?.find(item => item.menuName == "编辑");
|
||||||
|
const viewBtn = role?.rule?.find(item => item.menuName == "查看");
|
||||||
|
const delBtn = role?.rule?.find(item => item.menuName == "删除");
|
||||||
|
const refModal = useRef();
|
||||||
|
const [searchVal, setSearchVal] = useState(false)
|
||||||
|
const [isFetch, setIsFetch] = useState(false)
|
||||||
|
|
||||||
|
const command = (type) => (params) => {
|
||||||
|
if (type === 'save') {
|
||||||
|
refModal.current.showSave();
|
||||||
|
} else if (type === 'edit') {
|
||||||
|
refModal.current.showEdit({ ...params });
|
||||||
|
} else if (type === 'view') {
|
||||||
|
refModal.current.showView(params);
|
||||||
|
} else if (type === 'del') {
|
||||||
|
refModal.current.onDeleteGet(apiurl.rcgl.gcdsj.delete + `/${params.id}`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const download = (params) => {
|
||||||
|
let downloadLink = document.createElement("a");
|
||||||
|
downloadLink.href = `http://local.gunshiiot.com:18083/gunshiApp/xyt/projectEvents/file/download/${params}`;
|
||||||
|
downloadLink.download = `${params.fileName}`;
|
||||||
|
downloadLink.style.display = "none";
|
||||||
|
// 将链接添加到页面中
|
||||||
|
document.body.appendChild(downloadLink);
|
||||||
|
|
||||||
|
// 模拟点击事件，开始下载
|
||||||
|
downloadLink.click();
|
||||||
|
}
|
||||||
|
|
||||||
|
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.gcdsj.qzqda.list).find_noCode);
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const viewPdf = (params) => {
|
||||||
|
// setIframeSrc(params)
|
||||||
|
// setPdfViewOPen(true)
|
||||||
|
}
|
||||||
|
useEffect(()=>{
|
||||||
|
const params = {
|
||||||
|
search: {
|
||||||
|
...searchVal,
|
||||||
|
}
|
||||||
|
};
|
||||||
|
search(params)
|
||||||
|
}, [searchVal])
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className='content-root clearFloat xybm' style={{paddingRight:"0",paddingBottom:"0"}}>
|
||||||
|
<div className='lf CrudAdcdTreeTableBox' style={{width:"100%",overflowY:"auto"}}>
|
||||||
|
<Card className='nonebox'>
|
||||||
|
<ToolBar
|
||||||
|
setSearchVal={setSearchVal}
|
||||||
|
onSave={command('save')}
|
||||||
|
role={role}
|
||||||
|
/>
|
||||||
|
</Card>
|
||||||
|
<div className="ant-card-body" style={{ padding: "20px 0 0 0" }}>
|
||||||
|
<div className='time-line'>
|
||||||
|
<Timeline>
|
||||||
|
{tableProps.dataSource?.map((item, index) => (
|
||||||
|
<Timeline.Item key={index}>
|
||||||
|
<div className='time-line-item'>
|
||||||
|
<span style={{width:100}}>{item.eventsDate}</span>
|
||||||
|
<div className='item-right'>
|
||||||
|
<span>{item.eventsDesc}</span>
|
||||||
|
<div style={{ display: "flex"}}>
|
||||||
|
<span>附件：</span>
|
||||||
|
<Row gutter={[16]} style={{flex:1}}>
|
||||||
|
{
|
||||||
|
item.files?.length > 0 && item.files?.map(file => {
|
||||||
|
return (
|
||||||
|
<Col span={12}>
|
||||||
|
<div className="file-item" style={{width:"100%"}}>
|
||||||
|
<div className='file-description'>
|
||||||
|
{file.fileName?.indexOf('.docx') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { download(file.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FileWordOutlined
|
||||||
|
style={{ fontSize: 40 }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
file.fileName?.indexOf('.pdf') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { viewPdf(file?.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FilePdfOutlined style={{ fontSize: 40 }} />
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
file.fileName?.indexOf('.zip') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { download(file?.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FileZipOutlined style={{ fontSize: 40 }} />
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
file.fileName?.indexOf('.xlsx') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { download(file?.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FileExcelOutlined style={{ fontSize: 40 }} />
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
<Image width={60} src={url +file?.filePath} alt='' />
|
||||||
|
}
|
||||||
|
<span>{file.fileName}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</Row>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Timeline.Item>
|
||||||
|
))}
|
||||||
|
</Timeline>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Page;
|
||||||
|
|
@ -0,0 +1,34 @@
|
||||||
|
.basic-info{
|
||||||
|
position: relative;
|
||||||
|
font-size: 16px;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
padding:5px 25px;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
&::before{
|
||||||
|
position: absolute;
|
||||||
|
top:8px;
|
||||||
|
left:0;
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 5px;
|
||||||
|
height: 20px;
|
||||||
|
background-color: #0079fe;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.time-line{
|
||||||
|
width: 50%;
|
||||||
|
margin-left: 6%;
|
||||||
|
margin-top: 1%;
|
||||||
|
.time-line-item{
|
||||||
|
display: flex;
|
||||||
|
// align-items: center;
|
||||||
|
column-gap: 20px;
|
||||||
|
.item-right{
|
||||||
|
flex:1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
height: 70px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,55 @@
|
||||||
|
import React, { useEffect, useState } from 'react';
|
||||||
|
import { Form, Input, Button, DatePicker } from 'antd';
|
||||||
|
|
||||||
|
import moment from 'moment';
|
||||||
|
const { RangePicker } = DatePicker;
|
||||||
|
const ToolBar = ({ setSearchVal, onSave, storeData, role }) => {
|
||||||
|
const addBtn = role?.rule?.find(item => item.menuName == "新增");
|
||||||
|
const searchBtn = role?.rule?.find(item => item.menuName == "查询");
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
|
||||||
|
const onFinish = (values) => {
|
||||||
|
let dataSo;
|
||||||
|
if (values.tm) {
|
||||||
|
dataSo = {
|
||||||
|
start: moment(values.tm[0]).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
end: moment(values.tm[1]).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
delete values.tm
|
||||||
|
setSearchVal({ ...values, dataSo });
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
|
||||||
|
<Form form={form} className='toolbarBox' layout="inline" onFinish={onFinish}>
|
||||||
|
<Form.Item label="名称" name="name">
|
||||||
|
<Input allowClear style={{ width: '150px' }} />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="发生日期" name="tm">
|
||||||
|
<RangePicker
|
||||||
|
allowClear
|
||||||
|
showTime
|
||||||
|
style={{ width: "300px" }}
|
||||||
|
format="YYYY-MM-DD HH:mm:ss"
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
{searchBtn ? <Form.Item>
|
||||||
|
<Button type="primary" htmlType="submit">查询</Button>
|
||||||
|
</Form.Item> : null}
|
||||||
|
|
||||||
|
<Form.Item>
|
||||||
|
<Button onClick={() => form.resetFields()}>重置</Button>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item>
|
||||||
|
<Button type="primary" onClick={onSave}>导出</Button>
|
||||||
|
</Form.Item>
|
||||||
|
</Form>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ToolBar;
|
||||||
|
|
@ -0,0 +1,308 @@
|
||||||
|
import React, { useEffect, useState, useMemo, useRef } from 'react';
|
||||||
|
import { Form, Button, Input, Row, Upload, Col, Table, DatePicker, InputNumber, message, Image, Modal, Typography, Select } from 'antd';
|
||||||
|
import { DeleteOutlined, FileWordOutlined, FilePdfOutlined, FileZipOutlined, FileExcelOutlined } from '@ant-design/icons';
|
||||||
|
import { formItemLayout, btnItemLayout } from '../../../components/crud/FormLayoutProps';
|
||||||
|
|
||||||
|
import apiurl from '../../../service/apiurl';
|
||||||
|
|
||||||
|
import NormalSelect from '../../../components/Form/NormalSelect';
|
||||||
|
|
||||||
|
// import "./index.less"
|
||||||
|
import moment from 'moment';
|
||||||
|
const { RangePicker } = DatePicker
|
||||||
|
const { Dragger } = Upload;
|
||||||
|
const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
|
||||||
|
|
||||||
|
const opntios=[
|
||||||
|
{label:'宪法',value:'宪法'},
|
||||||
|
{label:'法律',value:'法律'},
|
||||||
|
{label:'行政法规',value:'行政法规'},
|
||||||
|
{label:'督察法规',value:'督察法规'},
|
||||||
|
{label:'司法解释',value:'司法解释'},
|
||||||
|
{label:'地方性法规',value:'地方性法规'},
|
||||||
|
]
|
||||||
|
const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave }) => {
|
||||||
|
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
const [fileList, setFileList] = useState([]) //上传文件列表
|
||||||
|
const [fileIds, setFileIds] = useState([])
|
||||||
|
const [iframeSrc, setIframeSrc] = useState('')
|
||||||
|
const [pdfViewOPen, setPdfViewOPen] = useState(false)
|
||||||
|
|
||||||
|
const [loading, setLoading] = useState(false)
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 文件下载
|
||||||
|
* @param {String} params 文件fileId
|
||||||
|
*/
|
||||||
|
const download = (params) => {
|
||||||
|
let downloadLink = document.createElement("a");
|
||||||
|
downloadLink.href = `http://local.gunshiiot.com:18083/gunshiApp/xyt/projectEvents/file/download/${params}`;
|
||||||
|
downloadLink.download = `${params.fileName}`;
|
||||||
|
downloadLink.style.display = "none";
|
||||||
|
// 将链接添加到页面中
|
||||||
|
document.body.appendChild(downloadLink);
|
||||||
|
|
||||||
|
// 模拟点击事件，开始下载
|
||||||
|
downloadLink.click();
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* @description 上传图片
|
||||||
|
* @param {string} file 上传的文件
|
||||||
|
*/
|
||||||
|
const fileChange = (info) => {
|
||||||
|
if (info.file.status === "done") {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
if (info.file.status === "uploading") {
|
||||||
|
setLoading(true);
|
||||||
|
}
|
||||||
|
if (info.file.status === "error") {
|
||||||
|
message.error("文件上传失败")
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
let fileIds = info.fileList.map(file => {
|
||||||
|
return file.response?.data?.fileId
|
||||||
|
})
|
||||||
|
setFileIds(fileIds)
|
||||||
|
setFileList(info.fileList)
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* @description pdf文件预览
|
||||||
|
* @param {String} params 文件预览url
|
||||||
|
*/
|
||||||
|
const viewPdf = (params) => {
|
||||||
|
setIframeSrc(params)
|
||||||
|
setPdfViewOPen(true)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const onfinish = (values) => {
|
||||||
|
values.eventsDate = values.eventsDate ? moment(values.eventsDate).format("YYYY-MM-DD 00:00:00") : ''
|
||||||
|
let oldFiles = fileList.map(item => ({ fileId: item.response?.data?.fileId }))
|
||||||
|
if (mode === 'edit') {
|
||||||
|
values.files = oldFiles;
|
||||||
|
values.id = record.id;
|
||||||
|
onEdit(apiurl.rcgl.gcdsj.edit, values)
|
||||||
|
}
|
||||||
|
if (mode === 'save') {
|
||||||
|
values.files = oldFiles
|
||||||
|
onSave(apiurl.rcgl.gcdsj.save, values)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 删除上传的图片
|
||||||
|
* @param {string} id 删除的id
|
||||||
|
*/
|
||||||
|
const deleteFile = (fileId) => {
|
||||||
|
console.log(fileId);
|
||||||
|
let filterFile = fileList.filter(item => item.response?.data?.fileId !== fileId);
|
||||||
|
setFileList(filterFile)
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
if (mode != 'save') {
|
||||||
|
const imgFile = record?.files?.map(o => ({
|
||||||
|
name: o.fileName,
|
||||||
|
response: {
|
||||||
|
data: {
|
||||||
|
filePath: o.filePath,
|
||||||
|
fileId: o.fileId
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}))
|
||||||
|
setFileList(imgFile)
|
||||||
|
}
|
||||||
|
}, [record, mode])
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Form
|
||||||
|
form={form}
|
||||||
|
{...formItemLayout}
|
||||||
|
onFinish={onfinish}
|
||||||
|
initialValues={record}
|
||||||
|
>
|
||||||
|
<Row>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="标题"
|
||||||
|
name="name"
|
||||||
|
rules={[{ required: true }]}
|
||||||
|
>
|
||||||
|
<Input disabled={mode === 'view'} style={{ width: '100%' }} allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="制定机关"
|
||||||
|
name="name"
|
||||||
|
rules={[{ required: true }]}
|
||||||
|
>
|
||||||
|
<Input disabled={mode === 'view'} style={{ width: '100%' }} allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item label="制定机关" name="name">
|
||||||
|
<Select allowClear style={{ width: '150px' }} options={opntios} />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item label="失效性" name="name">
|
||||||
|
<Select allowClear style={{ width: '150px' }} options={opntios} />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="公布日期"
|
||||||
|
name="eventsDate"
|
||||||
|
getValueFromEvent={(e, dateString) => dateString}
|
||||||
|
getValueProps={(value) => ({ value: value ? moment(value) : undefined })}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
>
|
||||||
|
<DatePicker disabled={mode === 'view'} format={'YYYY-MM-DD'} style={{ width: '100%' }} allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="施行日期"
|
||||||
|
name="eventsDate"
|
||||||
|
getValueFromEvent={(e, dateString) => dateString}
|
||||||
|
getValueProps={(value) => ({ value: value ? moment(value) : undefined })}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
>
|
||||||
|
<DatePicker disabled={mode === 'view'} format={'YYYY-MM-DD'} style={{ width: '100%' }} allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
<Row>
|
||||||
|
<Col span={24}>
|
||||||
|
<Form.Item
|
||||||
|
label="附件"
|
||||||
|
name="fieldId"
|
||||||
|
labelCol={{ span: 3 }}
|
||||||
|
wrapperCol={{ span: 19 }}
|
||||||
|
>
|
||||||
|
{mode !== "view" &&
|
||||||
|
<Dragger
|
||||||
|
name='file'
|
||||||
|
// multiple
|
||||||
|
action="/gunshiApp/xyt/projectEvents/file/upload/singleSimple"
|
||||||
|
onChange={fileChange}
|
||||||
|
onDrop={(info) => { console.log(info.dataTransfer.files); }}
|
||||||
|
fileList={fileList}
|
||||||
|
disabled={loading}
|
||||||
|
// onSuccess={handleSuccess}
|
||||||
|
>
|
||||||
|
<p className="ant-upload-text">点击或拖拽文件到此区域上传</p>
|
||||||
|
<p className="ant-upload-hint">
|
||||||
|
支持扩展名：.doc .docx .pdf .jpg .png .ppt
|
||||||
|
</p>
|
||||||
|
</Dragger>
|
||||||
|
}
|
||||||
|
<Row gutter={[16]}>
|
||||||
|
{
|
||||||
|
fileList.length > 0 && fileList.map(file => {
|
||||||
|
return (
|
||||||
|
<Col span={12}>
|
||||||
|
<div className="file-item" style={{ width: "75%" }}>
|
||||||
|
<div className='file-description'>
|
||||||
|
{file.name.indexOf('.docx') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { download(file.response?.data?.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FileWordOutlined
|
||||||
|
style={{ fontSize: 40 }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
file.name.indexOf('.pdf') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { viewPdf(file.response?.data?.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FilePdfOutlined style={{ fontSize: 40 }} />
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
file.name.indexOf('.zip') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { download(file.response?.data?.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FileZipOutlined style={{ fontSize: 40 }} />
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
file.name.indexOf('.xlsx') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { download(file.response?.data?.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FileExcelOutlined style={{ fontSize: 40 }} />
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
<Image width={60} src={url + file.response?.data?.filePath} alt='' />
|
||||||
|
}
|
||||||
|
<span>{file.name}</span>
|
||||||
|
</div>
|
||||||
|
<div className={mode == "view" ? 'delete-icon disable-icon' : 'delete-icon'} onClick={() => deleteFile(file.response?.data?.fileId)}>
|
||||||
|
<DeleteOutlined />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</Row>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
{
|
||||||
|
mode === 'view' ? null : (
|
||||||
|
<>
|
||||||
|
<Form.Item {...btnItemLayout}>
|
||||||
|
<Button type="primary" htmlType="submit">
|
||||||
|
{mode === 'save' ? '提交' : '修改'}
|
||||||
|
</Button>
|
||||||
|
</Form.Item>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
</Form>
|
||||||
|
<Modal
|
||||||
|
open={pdfViewOPen}
|
||||||
|
width={1000}
|
||||||
|
title=""
|
||||||
|
footer={null}
|
||||||
|
style={{ marginTop: "-5%" }}
|
||||||
|
onCancel={() => {
|
||||||
|
setPdfViewOPen(false)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<iframe
|
||||||
|
style={{
|
||||||
|
height: '80vh',
|
||||||
|
width: '100%',
|
||||||
|
border: 0,
|
||||||
|
marginTop: 20,
|
||||||
|
}}
|
||||||
|
src={`${process.env.PUBLIC_URL}/static/pdf/web/viewer.html?file=${encodeURIComponent(`/gunshiApp/xyt/projectEvents/file/download/${iframeSrc}`)}`}
|
||||||
|
/>
|
||||||
|
</Modal>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ModalForm;
|
||||||
|
|
@ -0,0 +1,150 @@
|
||||||
|
import React, { Fragment, useRef, useMemo, useEffect, useState } from 'react';
|
||||||
|
import BasicCrudModal from '../../../components/crud/BasicCrudModal';
|
||||||
|
import { Table, Card, Modal, Form, Input, Button, Row, Col, Timeline, message, Tabs, Image } from 'antd';
|
||||||
|
import { FileWordOutlined, FilePdfOutlined, FileZipOutlined, FileExcelOutlined } from '@ant-design/icons';
|
||||||
|
import { useSelector } from 'react-redux';
|
||||||
|
import ToolBar from './toolbar';
|
||||||
|
import ModalForm from './form';
|
||||||
|
import apiurl from '../../../service/apiurl';
|
||||||
|
import usePageTable from '../../../components/crud/usePageTable2';
|
||||||
|
import { createCrudService } from '../../../components/crud/_';
|
||||||
|
import { CrudOpRender_text } from '../../../components/crud/CrudOpRender';
|
||||||
|
|
||||||
|
const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
|
||||||
|
const Page = () => {
|
||||||
|
const role = useSelector(state => state.auth.role);
|
||||||
|
const editBtn = role?.rule?.find(item => item.menuName == "编辑");
|
||||||
|
const viewBtn = role?.rule?.find(item => item.menuName == "查看");
|
||||||
|
const delBtn = role?.rule?.find(item => item.menuName == "删除");
|
||||||
|
const refModal = useRef();
|
||||||
|
const [searchVal, setSearchVal] = useState(false)
|
||||||
|
const [iframeSrc, setIframeSrc] = useState('')
|
||||||
|
const [pdfViewOPen, setPdfViewOPen] = useState(false)
|
||||||
|
const [isFetch, setIsFetch] = useState(false)
|
||||||
|
const columns = [
|
||||||
|
{ title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align: "center" },
|
||||||
|
{ title: '标题', key: 'name', dataIndex: 'name', width: 250, ellipsis: true },
|
||||||
|
{
|
||||||
|
title: '制定机关', key: 'eventsDate', dataIndex: 'eventsDate', width: 140,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '法律性质', key: 'eventsType', dataIndex: 'eventsType', width: 140,
|
||||||
|
render: (value) => <span>{value == 1 ? "综合大事记" : value == 2 ? "专题大事记" : ''}</span>,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '时效性', key: 'eventsDesc', dataIndex: 'eventsDesc', width: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '公布日期', key: 'eventsDesc', dataIndex: 'eventsDesc', width: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '施行日期', key: 'eventsDesc', dataIndex: 'eventsDesc', width: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '上传时间', key: 'eventsDesc', dataIndex: 'eventsDesc', width: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '附件', key: 'fileName', dataIndex: 'fileName', width: 300,render:(v,r)=><a onClick={()=>viewPdf(r.fileId)}>{v}</a>
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作', key: 'operation', width: 240, fixed: 'right', align: 'center',
|
||||||
|
render: (value, row, index) => (
|
||||||
|
<CrudOpRender_text
|
||||||
|
edit={true}
|
||||||
|
del={true}
|
||||||
|
view={true}
|
||||||
|
command={(cmd) => () => command(cmd)(row)} />)
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
|
||||||
|
const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
|
||||||
|
|
||||||
|
const command = (type) => (params) => {
|
||||||
|
if (type === 'save') {
|
||||||
|
refModal.current.showSave();
|
||||||
|
} else if (type === 'edit') {
|
||||||
|
refModal.current.showEdit({ ...params });
|
||||||
|
} else if (type === 'view') {
|
||||||
|
refModal.current.showView(params);
|
||||||
|
} else if (type === 'del') {
|
||||||
|
refModal.current.onDeleteGet(apiurl.rcgl.gcdsj.delete + `/${params.id}`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.rcgl.gcdsj.page).find_noCode);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 处理成功的回调
|
||||||
|
*/
|
||||||
|
const successCallback = () => {
|
||||||
|
refresh()
|
||||||
|
setIsFetch(!isFetch)
|
||||||
|
}
|
||||||
|
|
||||||
|
const viewPdf = (params) => {
|
||||||
|
setIframeSrc(params)
|
||||||
|
setPdfViewOPen(true)
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
const params = {
|
||||||
|
search: {
|
||||||
|
...searchVal,
|
||||||
|
}
|
||||||
|
};
|
||||||
|
search(params)
|
||||||
|
}, [searchVal])
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className='content-root clearFloat xybm' style={{ paddingRight: "0", paddingBottom: "0" }}>
|
||||||
|
<div className='lf CrudAdcdTreeTableBox' style={{ width: "100%", overflowY: "auto" }}>
|
||||||
|
<Card className='nonebox'>
|
||||||
|
<ToolBar
|
||||||
|
setSearchVal={setSearchVal}
|
||||||
|
onSave={command('save')}
|
||||||
|
role={role}
|
||||||
|
/>
|
||||||
|
</Card>
|
||||||
|
<div className="ant-card-body" style={{ padding: "20px 0 0 0" }}>
|
||||||
|
<Table columns={columns} rowKey="inx" {...tableProps} scroll={{ x: width, y: "calc( 100vh - 400px )" }} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<BasicCrudModal
|
||||||
|
width={1000}
|
||||||
|
ref={refModal}
|
||||||
|
title=""
|
||||||
|
component={ModalForm}
|
||||||
|
onCrudSuccess={successCallback}
|
||||||
|
// onCrudSuccess={()=>{refresh({addvcd:localStorage.getItem('ADCD6')})}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Modal
|
||||||
|
open={pdfViewOPen}
|
||||||
|
width={1000}
|
||||||
|
title=""
|
||||||
|
footer={null}
|
||||||
|
style={{ marginTop: "-5%" }}
|
||||||
|
onCancel={() => {
|
||||||
|
setPdfViewOPen(false)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<iframe
|
||||||
|
style={{
|
||||||
|
height: '80vh',
|
||||||
|
width: '100%',
|
||||||
|
border: 0,
|
||||||
|
marginTop: 20,
|
||||||
|
}}
|
||||||
|
src={`${process.env.PUBLIC_URL}/static/pdf/web/viewer.html?file=${encodeURIComponent(`/gunshiApp/xyt/projectEvents/file/download/${iframeSrc}`)}`}
|
||||||
|
/>
|
||||||
|
</Modal>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Page;
|
||||||
|
|
@ -0,0 +1,91 @@
|
||||||
|
import React, { useEffect,useState } from 'react';
|
||||||
|
import { Form, Input, Button, DatePicker, Select } from 'antd';
|
||||||
|
import { DownOutlined, UpOutlined } from '@ant-design/icons'
|
||||||
|
|
||||||
|
import moment from 'moment';
|
||||||
|
const { RangePicker } = DatePicker;
|
||||||
|
const ToolBar = ({ setSearchVal, onSave, storeData,role }) => {
|
||||||
|
const addBtn = role?.rule?.find(item => item.menuName == "新增");
|
||||||
|
const searchBtn = role?.rule?.find(item => item.menuName == "查询");
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
const [showGj , setShowGj] =useState(false)
|
||||||
|
const onFinish = (values) => {
|
||||||
|
let dataSo;
|
||||||
|
if (values.tm) {
|
||||||
|
dataSo = {
|
||||||
|
start: moment(values.tm[0]).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
end: moment(values.tm[1]).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
delete values.tm
|
||||||
|
setSearchVal({...values, dataSo});
|
||||||
|
}
|
||||||
|
|
||||||
|
const opntios=[
|
||||||
|
{label:'宪法',value:'宪法'},
|
||||||
|
{label:'法律',value:'法律'},
|
||||||
|
{label:'行政法规',value:'行政法规'},
|
||||||
|
{label:'督察法规',value:'督察法规'},
|
||||||
|
{label:'司法解释',value:'司法解释'},
|
||||||
|
{label:'地方性法规',value:'地方性法规'},
|
||||||
|
]
|
||||||
|
const styles={
|
||||||
|
fontFamily: '微软雅黑 Bold", "微软雅黑 Regular", 微软雅黑, sans-serif',
|
||||||
|
fontWeight: '700',
|
||||||
|
fontStyle: 'normal',
|
||||||
|
fontSize: '16px'
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div style={{display:'flex',justifyContent:'space-between'}}>
|
||||||
|
<Form form={form} className='toolbarBox' layout="inline" onFinish={onFinish}>
|
||||||
|
<div style={{display:'flex'}}>
|
||||||
|
<Form.Item label="标题" name="name">
|
||||||
|
<Input allowClear style={{width:'150px'}}/>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="制定机关" name="name">
|
||||||
|
<Input allowClear style={{width:'150px'}}/>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="制定机关" name="name">
|
||||||
|
<Select allowClear style={{width:'150px'}} options={opntios}/>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item>
|
||||||
|
<Button type="primary" htmlType="submit">查询</Button>
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
<Form.Item>
|
||||||
|
<Button onClick={() => form.resetFields()}>重置</Button>
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
{
|
||||||
|
(onSave) ?
|
||||||
|
<Form.Item>
|
||||||
|
<Button onClick={onSave}>新增</Button>
|
||||||
|
</Form.Item>
|
||||||
|
:null
|
||||||
|
}
|
||||||
|
<Form.Item>
|
||||||
|
<div style={styles} onClick={()=>setShowGj(!showGj)}>高级搜索 {!showGj&&<DownOutlined />} {showGj&&<UpOutlined />}</div>
|
||||||
|
</Form.Item>
|
||||||
|
</div>
|
||||||
|
{showGj&&<div style={{display:'flex'}}>
|
||||||
|
<Form.Item label="时效性" name="name">
|
||||||
|
<Select allowClear style={{width:'150px'}} options={opntios}/>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="公布日期" name="name">
|
||||||
|
<RangePicker allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="施行日期" name="name">
|
||||||
|
<RangePicker allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="上传时间" name="name">
|
||||||
|
<RangePicker allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</div>}
|
||||||
|
</Form>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ToolBar;
|
||||||
|
|
@ -0,0 +1,101 @@
|
||||||
|
import { Space, Table, Radio, DatePicker, Form, Select, Button, message, Upload, Input, Row, Col, Switch, Image } from 'antd';
|
||||||
|
import { InboxOutlined, LinkOutlined, DeleteOutlined, LoadingOutlined,VerticalAlignBottomOutlined } from '@ant-design/icons'
|
||||||
|
import { useForm } from 'antd/lib/form/Form';
|
||||||
|
import { useState } from 'react';
|
||||||
|
const { Dragger } = Upload;
|
||||||
|
|
||||||
|
const list = [
|
||||||
|
{
|
||||||
|
type:'立案'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type:'调查取证'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type:'审查处理'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type:'送达执行'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type:'结案'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
const Page = () => {
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
const [fileList ,setFileList] =useState()
|
||||||
|
const props = {
|
||||||
|
name: 'file',
|
||||||
|
multiple: true,
|
||||||
|
fileList: fileList,
|
||||||
|
showUploadList: false,
|
||||||
|
beforeUpload: (file, fileList) => {
|
||||||
|
// if (fileType == "pic" &&
|
||||||
|
// (file.type != "image/jpeg" || file.type != "image/png" || file.type != "image/jpg")) {
|
||||||
|
// message.error('仅支持上传jpg/png/jpeg格式的图片');
|
||||||
|
// return false;
|
||||||
|
// } else {
|
||||||
|
// return true;
|
||||||
|
// }
|
||||||
|
},
|
||||||
|
onChange(e) {
|
||||||
|
// httpPostFile(apiUrl.service.uploadFile.uploadUrl + "?group=" + typeUpload, e).then(res => {
|
||||||
|
// setFileList([...fileList, res.data])
|
||||||
|
// })
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const onFinish = () =>{
|
||||||
|
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<Form form={form} onFinish={onFinish} >
|
||||||
|
<Row>
|
||||||
|
<Col span={2}>
|
||||||
|
<div style={{display:'flex',alignItems:'center'}}>
|
||||||
|
<div style={{width:3,height:12,background:'#259def',marginRight:5}}></div>
|
||||||
|
案卷存档</div>
|
||||||
|
</Col>
|
||||||
|
<Col span={10}>
|
||||||
|
<Form.Item
|
||||||
|
label='保管人员'
|
||||||
|
name='name'
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={10}>
|
||||||
|
<Form.Item
|
||||||
|
label='保管地点'
|
||||||
|
name='adress'
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
{list.map(item=>(
|
||||||
|
<Row>
|
||||||
|
<Col span={2}>
|
||||||
|
<div style={{display:'flex',alignItems:'center'}}>
|
||||||
|
<div style={{width:3,height:12,background:'#259def',marginRight:5}}></div>
|
||||||
|
{item.type}</div>
|
||||||
|
</Col>
|
||||||
|
<Col span={22}>
|
||||||
|
<Form.Item
|
||||||
|
label='附件'
|
||||||
|
name='name'
|
||||||
|
>
|
||||||
|
<Dragger {...props}>
|
||||||
|
<p className="ant-upload-drag-icon">
|
||||||
|
<InboxOutlined />
|
||||||
|
</p>
|
||||||
|
<p className="ant-upload-text">点击或将文件拖拽到这里上传 支持扩展名：jpeg、png</p>
|
||||||
|
</Dragger>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>))}
|
||||||
|
</Form >
|
||||||
|
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Page
|
||||||
|
|
@ -0,0 +1,243 @@
|
||||||
|
const basicData = [
|
||||||
|
{
|
||||||
|
label: '填报人',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12,
|
||||||
|
disabled: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '填报时间',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12,
|
||||||
|
disabled: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '案件编号',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '案件名称',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12,
|
||||||
|
required: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '案件类型',
|
||||||
|
key: 'name',
|
||||||
|
type: 'Select',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '案发地点',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '案件来源',
|
||||||
|
key: 'name',
|
||||||
|
type: 'Radio',
|
||||||
|
span: 12,
|
||||||
|
options: [
|
||||||
|
{ label: '自然人', value: 'Apple' },
|
||||||
|
{ label: '法人或其他组织', value: 'Pear' },
|
||||||
|
{ label: '待定', value: 'Orange' },
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '违法时间',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 24
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '案件来源',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 24
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '姓名',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '身份证号',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '住址',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '联系方式',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '简要案情',
|
||||||
|
key: 'name',
|
||||||
|
type: 'TextArea',
|
||||||
|
span: 24
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '附件',
|
||||||
|
key: 'name',
|
||||||
|
type: 'upload',
|
||||||
|
span: 24
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
const clqkData = [
|
||||||
|
{
|
||||||
|
label: '处理程序',
|
||||||
|
key: 'name',
|
||||||
|
type: 'Select',
|
||||||
|
span: 12,
|
||||||
|
disabled: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '处理依据',
|
||||||
|
key: 'name',
|
||||||
|
type: 'Select',
|
||||||
|
span: 12,
|
||||||
|
disabled: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '处理措施',
|
||||||
|
key: 'name',
|
||||||
|
type: 'Select',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '移送处理情况',
|
||||||
|
key: 'name',
|
||||||
|
type: 'Radio',
|
||||||
|
span: 24,
|
||||||
|
options: [
|
||||||
|
{ label: '移送单位', value: 'Apple' },
|
||||||
|
{ label: '不移送', value: 'Pear' },
|
||||||
|
],
|
||||||
|
required: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '案件执行情况',
|
||||||
|
key: 'name',
|
||||||
|
type: 'Radio',
|
||||||
|
options: [
|
||||||
|
{ label: '当事人自动履行', value: 'Apple' },
|
||||||
|
{ label: '行政强制执行', value: 'Pear' },
|
||||||
|
],
|
||||||
|
span: 24
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '自动履行情况',
|
||||||
|
key: 'name',
|
||||||
|
type: 'TextArea',
|
||||||
|
|
||||||
|
span: 24
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '伤亡人数(人)',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '直接损失金额(万元)',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '结案情况',
|
||||||
|
key: 'name',
|
||||||
|
type: 'Select',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '结案时间',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '文件编号及名称',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 24
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '督办单位类型',
|
||||||
|
key: 'name',
|
||||||
|
type: 'Select',
|
||||||
|
span: 12
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '督办单位名称',
|
||||||
|
key: 'name',
|
||||||
|
type: 'input',
|
||||||
|
span: 24
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '附件',
|
||||||
|
key: 'name',
|
||||||
|
type: 'upload',
|
||||||
|
span: 24
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
const xzfy = [
|
||||||
|
{
|
||||||
|
label: '处理程序',
|
||||||
|
key: 'name',
|
||||||
|
type: 'Select',
|
||||||
|
span: 12,
|
||||||
|
options:[
|
||||||
|
{
|
||||||
|
label:'维护'
|
||||||
|
},
|
||||||
|
{label:'变更'},
|
||||||
|
{label:'撤销'},
|
||||||
|
{label:'和解'},
|
||||||
|
{label:'调解'},
|
||||||
|
|
||||||
|
],
|
||||||
|
disabled: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: '处理依据',
|
||||||
|
key: 'name',
|
||||||
|
type: 'Select',
|
||||||
|
span: 12,
|
||||||
|
disabled: true,
|
||||||
|
options:[
|
||||||
|
{
|
||||||
|
label:'驳回原告诉讼'
|
||||||
|
},
|
||||||
|
{label:'变更'},
|
||||||
|
{label:'撤销'},
|
||||||
|
{label:'确认违法'},
|
||||||
|
{label:'确认无效'},
|
||||||
|
{label:'其他'},
|
||||||
|
|
||||||
|
|
||||||
|
],
|
||||||
|
},
|
||||||
|
]
|
||||||
|
export {
|
||||||
|
basicData,
|
||||||
|
clqkData,
|
||||||
|
xzfy
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,51 @@
|
||||||
|
import React, { useState } from 'react';
|
||||||
|
import { Tabs } from 'antd';
|
||||||
|
import BascForm from '../form/index'
|
||||||
|
import { basicData,clqkData,xzfy} from './config'
|
||||||
|
import Bajz from './bajz'
|
||||||
|
import Lsyx from './lsyx'
|
||||||
|
const items = [
|
||||||
|
{
|
||||||
|
key: '1',
|
||||||
|
label: '基本情况',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '2',
|
||||||
|
label: '处理情况',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '3',
|
||||||
|
label: '行政复议、行政应诉情况',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '4',
|
||||||
|
label: '办案宗卷',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: '5',
|
||||||
|
label: '历史影像及图片',
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
|
||||||
|
const Page = () => {
|
||||||
|
const [key , setKeys] = useState('1')
|
||||||
|
const onChange = (key) => {
|
||||||
|
console.log(key);
|
||||||
|
setKeys(key)
|
||||||
|
};
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Tabs defaultActiveKey="1" items={items} onChange={onChange} />
|
||||||
|
<>
|
||||||
|
{key==1&& <BascForm formJson={basicData}></BascForm>}
|
||||||
|
{key==2&& <BascForm formJson={clqkData}></BascForm>}
|
||||||
|
{key==3&& <BascForm formJson={xzfy}></BascForm>}
|
||||||
|
{key==4&& <Bajz ></Bajz>}
|
||||||
|
{key==5&& <Lsyx ></Lsyx>}
|
||||||
|
</>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Page
|
||||||
|
|
@ -0,0 +1,150 @@
|
||||||
|
import React, { Fragment, useRef, useMemo, useEffect, useState } from 'react';
|
||||||
|
import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
|
||||||
|
import { Table, Card, Modal, Form, Input, Button, Row, Col, Timeline, message, Tabs, Image } from 'antd';
|
||||||
|
import { FileWordOutlined, FilePdfOutlined, FileZipOutlined, FileExcelOutlined } from '@ant-design/icons';
|
||||||
|
import { useSelector } from 'react-redux';
|
||||||
|
import ToolBar from './toolbar';
|
||||||
|
import ModalForm from './editTabs';
|
||||||
|
import apiurl from '../../../../service/apiurl';
|
||||||
|
import usePageTable from '../../../../components/crud/usePageTable2';
|
||||||
|
import { createCrudService } from '../../../../components/crud/_';
|
||||||
|
import { CrudOpRender_text } from '../../../../components/crud/CrudOpRender';
|
||||||
|
|
||||||
|
const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
|
||||||
|
const Page = () => {
|
||||||
|
const role = useSelector(state => state.auth.role);
|
||||||
|
const editBtn = role?.rule?.find(item => item.menuName == "编辑");
|
||||||
|
const viewBtn = role?.rule?.find(item => item.menuName == "查看");
|
||||||
|
const delBtn = role?.rule?.find(item => item.menuName == "删除");
|
||||||
|
const refModal = useRef();
|
||||||
|
const [searchVal, setSearchVal] = useState(false)
|
||||||
|
const [iframeSrc, setIframeSrc] = useState('')
|
||||||
|
const [pdfViewOPen, setPdfViewOPen] = useState(false)
|
||||||
|
const [isFetch, setIsFetch] = useState(false)
|
||||||
|
const columns = [
|
||||||
|
{ title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align: "center" },
|
||||||
|
{ title: '标题', key: 'name', dataIndex: 'name', width: 250, ellipsis: true },
|
||||||
|
{
|
||||||
|
title: '制定机关', key: 'eventsDate', dataIndex: 'eventsDate', width: 140,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '法律性质', key: 'eventsType', dataIndex: 'eventsType', width: 140,
|
||||||
|
render: (value) => <span>{value == 1 ? "综合大事记" : value == 2 ? "专题大事记" : ''}</span>,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '时效性', key: 'eventsDesc', dataIndex: 'eventsDesc', width: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '公布日期', key: 'eventsDesc', dataIndex: 'eventsDesc', width: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '施行日期', key: 'eventsDesc', dataIndex: 'eventsDesc', width: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '上传时间', key: 'eventsDesc', dataIndex: 'eventsDesc', width: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '附件', key: 'fileName', dataIndex: 'fileName', width: 300,render:(v,r)=><a onClick={()=>viewPdf(r.fileId)}>{v}</a>
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作', key: 'operation', width: 240, fixed: 'right', align: 'center',
|
||||||
|
render: (value, row, index) => (
|
||||||
|
<CrudOpRender_text
|
||||||
|
edit={true}
|
||||||
|
del={true}
|
||||||
|
view={true}
|
||||||
|
command={(cmd) => () => command(cmd)(row)} />)
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
|
||||||
|
const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
|
||||||
|
|
||||||
|
const command = (type) => (params) => {
|
||||||
|
if (type === 'save') {
|
||||||
|
refModal.current.showSave();
|
||||||
|
} else if (type === 'edit') {
|
||||||
|
refModal.current.showEdit({ ...params });
|
||||||
|
} else if (type === 'view') {
|
||||||
|
refModal.current.showView(params);
|
||||||
|
} else if (type === 'del') {
|
||||||
|
refModal.current.onDeleteGet(apiurl.rcgl.gcdsj.delete + `/${params.id}`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.rcgl.gcdsj.page).find_noCode);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 处理成功的回调
|
||||||
|
*/
|
||||||
|
const successCallback = () => {
|
||||||
|
refresh()
|
||||||
|
setIsFetch(!isFetch)
|
||||||
|
}
|
||||||
|
|
||||||
|
const viewPdf = (params) => {
|
||||||
|
setIframeSrc(params)
|
||||||
|
setPdfViewOPen(true)
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
const params = {
|
||||||
|
search: {
|
||||||
|
...searchVal,
|
||||||
|
}
|
||||||
|
};
|
||||||
|
search(params)
|
||||||
|
}, [searchVal])
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className='content-root clearFloat xybm' style={{ paddingRight: "0", paddingBottom: "0" }}>
|
||||||
|
<div className='lf CrudAdcdTreeTableBox' style={{ width: "100%", overflowY: "auto" }}>
|
||||||
|
<Card className='nonebox'>
|
||||||
|
<ToolBar
|
||||||
|
setSearchVal={setSearchVal}
|
||||||
|
onSave={command('save')}
|
||||||
|
role={role}
|
||||||
|
/>
|
||||||
|
</Card>
|
||||||
|
<div className="ant-card-body" style={{ padding: "20px 0 0 0" }}>
|
||||||
|
<Table columns={columns} rowKey="inx" {...tableProps} scroll={{ x: width, y: "calc( 100vh - 400px )" }} dataSource={[{name:1}]}/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<BasicCrudModal
|
||||||
|
width={1000}
|
||||||
|
ref={refModal}
|
||||||
|
title=""
|
||||||
|
component={ModalForm}
|
||||||
|
onCrudSuccess={successCallback}
|
||||||
|
// onCrudSuccess={()=>{refresh({addvcd:localStorage.getItem('ADCD6')})}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Modal
|
||||||
|
open={pdfViewOPen}
|
||||||
|
width={1000}
|
||||||
|
title=""
|
||||||
|
footer={null}
|
||||||
|
style={{ marginTop: "-5%" }}
|
||||||
|
onCancel={() => {
|
||||||
|
setPdfViewOPen(false)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<iframe
|
||||||
|
style={{
|
||||||
|
height: '80vh',
|
||||||
|
width: '100%',
|
||||||
|
border: 0,
|
||||||
|
marginTop: 20,
|
||||||
|
}}
|
||||||
|
src={`${process.env.PUBLIC_URL}/static/pdf/web/viewer.html?file=${encodeURIComponent(`/gunshiApp/xyt/projectEvents/file/download/${iframeSrc}`)}`}
|
||||||
|
/>
|
||||||
|
</Modal>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Page;
|
||||||
|
|
@ -0,0 +1,69 @@
|
||||||
|
import { Space, Table, Radio, DatePicker, Form, Select, Button, message, Upload, Input, Row, Col, Switch, Image } from 'antd';
|
||||||
|
import { InboxOutlined, LinkOutlined, DeleteOutlined, LoadingOutlined,VerticalAlignBottomOutlined } from '@ant-design/icons'
|
||||||
|
import { useForm } from 'antd/lib/form/Form';
|
||||||
|
import { useState } from 'react';
|
||||||
|
const { Dragger } = Upload;
|
||||||
|
|
||||||
|
const list = [
|
||||||
|
{
|
||||||
|
type:'整改前'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type:'整改后'
|
||||||
|
}
|
||||||
|
]
|
||||||
|
const Page = () => {
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
const [fileList ,setFileList] =useState()
|
||||||
|
const props = {
|
||||||
|
name: 'file',
|
||||||
|
multiple: true,
|
||||||
|
fileList: fileList,
|
||||||
|
showUploadList: false,
|
||||||
|
beforeUpload: (file, fileList) => {
|
||||||
|
// if (fileType == "pic" &&
|
||||||
|
// (file.type != "image/jpeg" || file.type != "image/png" || file.type != "image/jpg")) {
|
||||||
|
// message.error('仅支持上传jpg/png/jpeg格式的图片');
|
||||||
|
// return false;
|
||||||
|
// } else {
|
||||||
|
// return true;
|
||||||
|
// }
|
||||||
|
},
|
||||||
|
onChange(e) {
|
||||||
|
// httpPostFile(apiUrl.service.uploadFile.uploadUrl + "?group=" + typeUpload, e).then(res => {
|
||||||
|
// setFileList([...fileList, res.data])
|
||||||
|
// })
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const onFinish = () =>{
|
||||||
|
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<Form form={form} onFinish={onFinish} >
|
||||||
|
{list.map(item=>(
|
||||||
|
<Row>
|
||||||
|
<Col span={2}>
|
||||||
|
<div style={{display:'flex',alignItems:'center'}}>
|
||||||
|
<div style={{width:3,height:12,background:'#259def',marginRight:5}}></div>
|
||||||
|
{item.type}</div>
|
||||||
|
</Col>
|
||||||
|
<Col span={22}>
|
||||||
|
<Form.Item
|
||||||
|
label='附件'
|
||||||
|
name='name'
|
||||||
|
>
|
||||||
|
<Dragger {...props}>
|
||||||
|
<p className="ant-upload-drag-icon">
|
||||||
|
<InboxOutlined />
|
||||||
|
</p>
|
||||||
|
<p className="ant-upload-text">点击或将文件拖拽到这里上传 支持扩展名：jpeg、png</p>
|
||||||
|
</Dragger>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>))}
|
||||||
|
</Form >
|
||||||
|
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Page
|
||||||
|
|
@ -0,0 +1,91 @@
|
||||||
|
import React, { useEffect,useState } from 'react';
|
||||||
|
import { Form, Input, Button, DatePicker, Select } from 'antd';
|
||||||
|
import { DownOutlined, UpOutlined } from '@ant-design/icons'
|
||||||
|
|
||||||
|
import moment from 'moment';
|
||||||
|
const { RangePicker } = DatePicker;
|
||||||
|
const ToolBar = ({ setSearchVal, onSave, storeData,role }) => {
|
||||||
|
const addBtn = role?.rule?.find(item => item.menuName == "新增");
|
||||||
|
const searchBtn = role?.rule?.find(item => item.menuName == "查询");
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
const [showGj , setShowGj] =useState(false)
|
||||||
|
const onFinish = (values) => {
|
||||||
|
let dataSo;
|
||||||
|
if (values.tm) {
|
||||||
|
dataSo = {
|
||||||
|
start: moment(values.tm[0]).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
end: moment(values.tm[1]).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
delete values.tm
|
||||||
|
setSearchVal({...values, dataSo});
|
||||||
|
}
|
||||||
|
|
||||||
|
const opntios=[
|
||||||
|
{label:'宪法',value:'宪法'},
|
||||||
|
{label:'法律',value:'法律'},
|
||||||
|
{label:'行政法规',value:'行政法规'},
|
||||||
|
{label:'督察法规',value:'督察法规'},
|
||||||
|
{label:'司法解释',value:'司法解释'},
|
||||||
|
{label:'地方性法规',value:'地方性法规'},
|
||||||
|
]
|
||||||
|
const styles={
|
||||||
|
fontFamily: '微软雅黑 Bold", "微软雅黑 Regular", 微软雅黑, sans-serif',
|
||||||
|
fontWeight: '700',
|
||||||
|
fontStyle: 'normal',
|
||||||
|
fontSize: '16px'
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div style={{display:'flex',justifyContent:'space-between'}}>
|
||||||
|
<Form form={form} className='toolbarBox' layout="inline" onFinish={onFinish}>
|
||||||
|
<div style={{display:'flex'}}>
|
||||||
|
<Form.Item label="标题" name="name">
|
||||||
|
<Input allowClear style={{width:'150px'}}/>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="制定机关" name="name">
|
||||||
|
<Input allowClear style={{width:'150px'}}/>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="制定机关" name="name">
|
||||||
|
<Select allowClear style={{width:'150px'}} options={opntios}/>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item>
|
||||||
|
<Button type="primary" htmlType="submit">查询</Button>
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
<Form.Item>
|
||||||
|
<Button onClick={() => form.resetFields()}>重置</Button>
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
{
|
||||||
|
(onSave) ?
|
||||||
|
<Form.Item>
|
||||||
|
<Button onClick={onSave}>新增</Button>
|
||||||
|
</Form.Item>
|
||||||
|
:null
|
||||||
|
}
|
||||||
|
<Form.Item>
|
||||||
|
<div style={styles} onClick={()=>setShowGj(!showGj)}>高级搜索 {!showGj&&<DownOutlined />} {showGj&&<UpOutlined />}</div>
|
||||||
|
</Form.Item>
|
||||||
|
</div>
|
||||||
|
{showGj&&<div style={{display:'flex'}}>
|
||||||
|
<Form.Item label="时效性" name="name">
|
||||||
|
<Select allowClear style={{width:'150px'}} options={opntios}/>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="公布日期" name="name">
|
||||||
|
<RangePicker allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="施行日期" name="name">
|
||||||
|
<RangePicker allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="上传时间" name="name">
|
||||||
|
<RangePicker allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</div>}
|
||||||
|
</Form>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ToolBar;
|
||||||
|
|
@ -0,0 +1,94 @@
|
||||||
|
import dayjs from 'dayjs';
|
||||||
|
import { Space, Table, Tag, DatePicker, Form, Select, Button, Card } from 'antd';
|
||||||
|
import ReactECharts from 'echarts-for-react';
|
||||||
|
import { useEffect, useState, useMemo } from 'react';
|
||||||
|
|
||||||
|
const Page = ({ title = '标题' }) => {
|
||||||
|
const [echart2, setEchart2] = useState(Object())
|
||||||
|
const [inspectordata, setInspectorData] = useState([{}])
|
||||||
|
const [plandata, setPlanData] = useState(Object())
|
||||||
|
const [problemdata, setProblemData] = useState(Object())
|
||||||
|
const getPlanOption = useMemo((name, data) => {
|
||||||
|
// let total = 0
|
||||||
|
// for (let i = 0; i < data.length; i++) {
|
||||||
|
// total = total + Number(data[i].value)
|
||||||
|
// }
|
||||||
|
return {
|
||||||
|
title: {},
|
||||||
|
tooltip: {},
|
||||||
|
// legend: {
|
||||||
|
// data: name
|
||||||
|
// },
|
||||||
|
graphic: {
|
||||||
|
type: 'text',
|
||||||
|
top: 'center',
|
||||||
|
left: 'center',
|
||||||
|
style: {
|
||||||
|
text: `总计\n${0}`,
|
||||||
|
fontSize: 20,
|
||||||
|
fontWeight: 'bold',
|
||||||
|
// textAlign: 'center'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
series: {
|
||||||
|
name: '圆环图系列名称',
|
||||||
|
type: 'pie',
|
||||||
|
// center: ['50%', '50%'],
|
||||||
|
// radius: ['35%', '50%'],
|
||||||
|
hoverAnimation: true,
|
||||||
|
data: plandata,
|
||||||
|
label: {
|
||||||
|
normal: {
|
||||||
|
show: true,
|
||||||
|
position: 'outside',
|
||||||
|
formatter: '{c}'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
}, [plandata])
|
||||||
|
console.log(getPlanOption);
|
||||||
|
|
||||||
|
const onOk = (event, index) => {
|
||||||
|
if (event !== null) {
|
||||||
|
let params = {
|
||||||
|
stm: dayjs(new Date(event[0])).format('YYYY-MM-DD'),
|
||||||
|
etm: dayjs(new Date(event[1])).format('YYYY-MM-DD'),
|
||||||
|
}
|
||||||
|
// getStm(params, index)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
let data = [
|
||||||
|
{ value: 1048, name: 'Search Engine' },
|
||||||
|
{ value: 735, name: 'Direct' },
|
||||||
|
{ value: 580, name: 'Email' },
|
||||||
|
{ value: 484, name: 'Union Ads' },
|
||||||
|
{ value: 300, name: 'Video Ads' }
|
||||||
|
]
|
||||||
|
setPlanData(data)
|
||||||
|
})
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className='top' style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}>
|
||||||
|
<div style={{ fontSize: 20, fontWeight: 'bold', display: 'flex', alignItems: 'center' }}>
|
||||||
|
<div style={{ width: 5, height: 25, backgroundColor: '#259def', marginRight: 10 }}></div>
|
||||||
|
{title}
|
||||||
|
</div>
|
||||||
|
<DatePicker.RangePicker
|
||||||
|
style={{ width: 220, }}
|
||||||
|
onChange={(e, index) => onOk(e, 2)}
|
||||||
|
defaultValue={[dayjs().startOf("year"), dayjs()]}
|
||||||
|
></DatePicker.RangePicker>
|
||||||
|
</div>
|
||||||
|
<ReactECharts
|
||||||
|
ref={(e) => setEchart2(e)}
|
||||||
|
option={getPlanOption}
|
||||||
|
style={{ height: 350 }}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
export default Page
|
||||||
|
|
@ -0,0 +1,94 @@
|
||||||
|
import dayjs from 'dayjs';
|
||||||
|
import { Space, Table, Tag, DatePicker, Form, Select, Button, Card } from 'antd';
|
||||||
|
import ReactECharts from 'echarts-for-react';
|
||||||
|
import { useEffect, useState, useMemo } from 'react';
|
||||||
|
|
||||||
|
const Page = ({ title = '标题' }) => {
|
||||||
|
const [echart2, setEchart2] = useState(Object())
|
||||||
|
const [inspectordata, setInspectorData] = useState([{}])
|
||||||
|
const [plandata, setPlanData] = useState(Object())
|
||||||
|
const [problemdata, setProblemData] = useState(Object())
|
||||||
|
const getPlanOption = useMemo((name, data) => {
|
||||||
|
// let total = 0
|
||||||
|
// for (let i = 0; i < data.length; i++) {
|
||||||
|
// total = total + Number(data[i].value)
|
||||||
|
// }
|
||||||
|
return {
|
||||||
|
title: {},
|
||||||
|
tooltip: {},
|
||||||
|
// legend: {
|
||||||
|
// data: name
|
||||||
|
// },
|
||||||
|
graphic: {
|
||||||
|
type: 'text',
|
||||||
|
top: 'center',
|
||||||
|
left: 'center',
|
||||||
|
style: {
|
||||||
|
text: `总计\n${0}`,
|
||||||
|
fontSize: 20,
|
||||||
|
fontWeight: 'bold',
|
||||||
|
// textAlign: 'center'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
series: {
|
||||||
|
name: '圆环图系列名称',
|
||||||
|
type: 'pie',
|
||||||
|
center: ['50%', '50%'],
|
||||||
|
radius: ['60%', '80%'],
|
||||||
|
hoverAnimation: true,
|
||||||
|
data: plandata,
|
||||||
|
label: {
|
||||||
|
normal: {
|
||||||
|
show: true,
|
||||||
|
position: 'outside',
|
||||||
|
formatter: '{c}'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
}, [plandata])
|
||||||
|
console.log(getPlanOption);
|
||||||
|
|
||||||
|
const onOk = (event, index) => {
|
||||||
|
if (event !== null) {
|
||||||
|
let params = {
|
||||||
|
stm: dayjs(new Date(event[0])).format('YYYY-MM-DD'),
|
||||||
|
etm: dayjs(new Date(event[1])).format('YYYY-MM-DD'),
|
||||||
|
}
|
||||||
|
// getStm(params, index)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
let data = [
|
||||||
|
{ value: 1048, name: 'Search Engine' },
|
||||||
|
{ value: 735, name: 'Direct' },
|
||||||
|
{ value: 580, name: 'Email' },
|
||||||
|
{ value: 484, name: 'Union Ads' },
|
||||||
|
{ value: 300, name: 'Video Ads' }
|
||||||
|
]
|
||||||
|
setPlanData(data)
|
||||||
|
})
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className='top' style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}>
|
||||||
|
<div style={{ fontSize: 20, fontWeight: 'bold', display: 'flex', alignItems: 'center' }}>
|
||||||
|
<div style={{ width: 5, height: 25, backgroundColor: '#259def', marginRight: 10 }}></div>
|
||||||
|
{title}
|
||||||
|
</div>
|
||||||
|
<DatePicker.RangePicker
|
||||||
|
style={{ width: 220, }}
|
||||||
|
onChange={(e, index) => onOk(e, 2)}
|
||||||
|
defaultValue={[dayjs().startOf("year"), dayjs()]}
|
||||||
|
></DatePicker.RangePicker>
|
||||||
|
</div>
|
||||||
|
<ReactECharts
|
||||||
|
ref={(e) => setEchart2(e)}
|
||||||
|
option={getPlanOption}
|
||||||
|
style={{ height: 350 }}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
export default Page
|
||||||
|
|
@ -0,0 +1,30 @@
|
||||||
|
import Charts from './bincharts'
|
||||||
|
import BarCharts from './barCharts'
|
||||||
|
import LineCharts from './lincharts'
|
||||||
|
import LdCharts from './ldCharts'
|
||||||
|
|
||||||
|
|
||||||
|
const Page = () => {
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div style={{ display: 'flex',height:'50%'}}>
|
||||||
|
<div style={{width:'33%',backgroundColor:'#ffffff',margin:5,padding:10}}>
|
||||||
|
<Charts />
|
||||||
|
</div>
|
||||||
|
<div style={{width:'33%',backgroundColor:'#ffffff',margin:5,padding:10}}>
|
||||||
|
<LdCharts />
|
||||||
|
</div>
|
||||||
|
<div style={{width:'33%',backgroundColor:'#ffffff',margin:5,padding:10}}>
|
||||||
|
<BarCharts />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div style={{backgroundColor:'#ffffff',padding:10,height:'50%'}}>
|
||||||
|
<LineCharts />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
export default Page
|
||||||
|
|
@ -0,0 +1,136 @@
|
||||||
|
import dayjs from 'dayjs';
|
||||||
|
import { Space, Table, Tag, DatePicker, Form, Select, Button, Card } from 'antd';
|
||||||
|
import ReactECharts from 'echarts-for-react';
|
||||||
|
import { useEffect, useState, useMemo } from 'react';
|
||||||
|
|
||||||
|
const Page = ({ title = '标题' }) => {
|
||||||
|
const [echart2, setEchart2] = useState(Object())
|
||||||
|
const [inspectordata, setInspectorData] = useState([{}])
|
||||||
|
const [plandata, setPlanData] = useState(Object())
|
||||||
|
const [problemdata, setProblemData] = useState(Object())
|
||||||
|
const getPlanOption = useMemo((name, data) => {
|
||||||
|
// let total = 0
|
||||||
|
// for (let i = 0; i < data.length; i++) {
|
||||||
|
// total = total + Number(data[i].value)
|
||||||
|
// }
|
||||||
|
return {
|
||||||
|
angleAxis: {
|
||||||
|
type: 'category',
|
||||||
|
data: ['应用服务中心', '技术管理', '综合管理', '进度管理', '质量管理', '安全管理', '其它']
|
||||||
|
},
|
||||||
|
radar: [
|
||||||
|
{
|
||||||
|
indicator: [
|
||||||
|
{ text: '' },
|
||||||
|
{ text: '' },
|
||||||
|
{ text: '' },
|
||||||
|
{ text: '' },
|
||||||
|
{ text: '' },
|
||||||
|
{ text: '' },
|
||||||
|
{ text: '' },
|
||||||
|
],
|
||||||
|
radius: '80%',
|
||||||
|
splitNumber: 12,
|
||||||
|
shape: 'circle',
|
||||||
|
splitArea: {
|
||||||
|
areaStyle: {
|
||||||
|
color: '#fff',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#d4d4d4'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
radiusAxis: {
|
||||||
|
min: 0,
|
||||||
|
max: 20,
|
||||||
|
interval: 2,
|
||||||
|
// 刻度
|
||||||
|
axisTick: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
//刻度数值
|
||||||
|
axisLabel: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
// 线
|
||||||
|
axisLine: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
},
|
||||||
|
polar: {},
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
stack: 'a',
|
||||||
|
type: 'pie',
|
||||||
|
center: ['50%', '50%'],
|
||||||
|
selectedOffset: 0,
|
||||||
|
radius: [0, 140],
|
||||||
|
roseType: 'area',
|
||||||
|
itemStyle: { //去除饼图的指示折线label
|
||||||
|
normal: {
|
||||||
|
label: {
|
||||||
|
show: false,
|
||||||
|
},
|
||||||
|
borderRadius: 8
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data: [
|
||||||
|
{ value: 40, name: '应用服务中心' },
|
||||||
|
{ value: 32, name: '技术管理' },
|
||||||
|
{ value: 30, name: '综合管理' },
|
||||||
|
{ value: 30, name: '进度管理' },
|
||||||
|
{ value: 28, name: '质量管理' },
|
||||||
|
{ value: 28, name: '安全管理' },
|
||||||
|
{ value: 18, name: '其它' },
|
||||||
|
]
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}, [plandata])
|
||||||
|
console.log(getPlanOption);
|
||||||
|
|
||||||
|
const onOk = (event, index) => {
|
||||||
|
if (event !== null) {
|
||||||
|
let params = {
|
||||||
|
stm: dayjs(new Date(event[0])).format('YYYY-MM-DD'),
|
||||||
|
etm: dayjs(new Date(event[1])).format('YYYY-MM-DD'),
|
||||||
|
}
|
||||||
|
// getStm(params, index)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
let data = [
|
||||||
|
{ value: 1048, name: 'Search Engine' },
|
||||||
|
{ value: 735, name: 'Direct' },
|
||||||
|
{ value: 580, name: 'Email' },
|
||||||
|
{ value: 484, name: 'Union Ads' },
|
||||||
|
{ value: 300, name: 'Video Ads' }
|
||||||
|
]
|
||||||
|
setPlanData(data)
|
||||||
|
})
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className='top' style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}>
|
||||||
|
<div style={{ fontSize: 20, fontWeight: 'bold', display: 'flex', alignItems: 'center' }}>
|
||||||
|
<div style={{ width: 5, height: 25, backgroundColor: '#259def', marginRight: 10 }}></div>
|
||||||
|
{title}
|
||||||
|
</div>
|
||||||
|
<DatePicker.RangePicker
|
||||||
|
style={{ width: 220, }}
|
||||||
|
onChange={(e, index) => onOk(e, 2)}
|
||||||
|
defaultValue={[dayjs().startOf("year"), dayjs()]}
|
||||||
|
></DatePicker.RangePicker>
|
||||||
|
</div>
|
||||||
|
<ReactECharts
|
||||||
|
ref={(e) => setEchart2(e)}
|
||||||
|
option={getPlanOption}
|
||||||
|
style={{ height: 350 }}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
export default Page
|
||||||
|
|
@ -0,0 +1,95 @@
|
||||||
|
import dayjs from 'dayjs';
|
||||||
|
import { Space, Table, Tag, DatePicker, Form, Select, Button, Card } from 'antd';
|
||||||
|
import ReactECharts from 'echarts-for-react';
|
||||||
|
import { useEffect, useState, useMemo } from 'react';
|
||||||
|
import { encode } from 'punycode';
|
||||||
|
|
||||||
|
const Page = ({ title = '标题' }) => {
|
||||||
|
const [echart2, setEchart2] = useState(Object())
|
||||||
|
const [inspectordata, setInspectorData] = useState([{}])
|
||||||
|
const [plandata, setPlanData] = useState([])
|
||||||
|
const [problemdata, setProblemData] = useState(Object())
|
||||||
|
const getPlanOption = useMemo((name, data) => {
|
||||||
|
return {
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis',
|
||||||
|
position: ['20%', '50%'],
|
||||||
|
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
data: ['运行调度指令'],
|
||||||
|
},
|
||||||
|
|
||||||
|
dataset: [
|
||||||
|
{ source: plandata },
|
||||||
|
]
|
||||||
|
,
|
||||||
|
xAxis:
|
||||||
|
{
|
||||||
|
type: 'category',
|
||||||
|
}
|
||||||
|
,
|
||||||
|
yAxis: [
|
||||||
|
{
|
||||||
|
name: 'mm',
|
||||||
|
type: 'value'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '2量',
|
||||||
|
type: 'line',
|
||||||
|
datasetIndex: 0,
|
||||||
|
encode: {
|
||||||
|
x: 'name',
|
||||||
|
y: 'value'
|
||||||
|
},
|
||||||
|
itemStyle: {
|
||||||
|
color: 'skyblue'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
]
|
||||||
|
}
|
||||||
|
}, [plandata])
|
||||||
|
|
||||||
|
const onOk = (event, index) => {
|
||||||
|
if (event !== null) {
|
||||||
|
let params = {
|
||||||
|
stm: dayjs(new Date(event[0])).format('YYYY-MM-DD'),
|
||||||
|
etm: dayjs(new Date(event[1])).format('YYYY-MM-DD'),
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
let data = [
|
||||||
|
{ value: 1048, name: 'Search Engine' },
|
||||||
|
{ value: 735, name: 'Direct' },
|
||||||
|
{ value: 580, name: 'Email' },
|
||||||
|
{ value: 484, name: 'Union Ads' },
|
||||||
|
{ value: 300, name: 'Video Ads' }
|
||||||
|
]
|
||||||
|
setPlanData(data)
|
||||||
|
})
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className='top' style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between' }}>
|
||||||
|
<div style={{ fontSize: 20, fontWeight: 'bold', display: 'flex', alignItems: 'center' }}>
|
||||||
|
<div style={{ width: 5, height: 25, backgroundColor: '#259def', marginRight: 10 }}></div>
|
||||||
|
{title}
|
||||||
|
</div>
|
||||||
|
<DatePicker.RangePicker
|
||||||
|
style={{ width: 220, }}
|
||||||
|
onChange={(e, index) => onOk(e, 2)}
|
||||||
|
defaultValue={[dayjs().startOf("year"), dayjs()]}
|
||||||
|
></DatePicker.RangePicker>
|
||||||
|
</div>
|
||||||
|
<ReactECharts
|
||||||
|
ref={(e) => setEchart2(e)}
|
||||||
|
option={getPlanOption}
|
||||||
|
style={{ height: 350 }}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
export default Page
|
||||||
|
|
@ -0,0 +1,55 @@
|
||||||
|
import styles from './content.module.less'
|
||||||
|
import { Button } from 'antd'
|
||||||
|
import ModalForm from './form';
|
||||||
|
import BasicCrudModal from '../../../../components/crud/BasicCrudModal';
|
||||||
|
import React, { Fragment, useRef, useMemo, useEffect, useState } from 'react';
|
||||||
|
const Page = ({ data }) => {
|
||||||
|
const refModal = useRef();
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 处理成功的回调
|
||||||
|
*/
|
||||||
|
const successCallback = () => {
|
||||||
|
// refresh()
|
||||||
|
// setIsFetch(!isFetch)
|
||||||
|
}
|
||||||
|
const dataPahe = {
|
||||||
|
title: '侵占、毁坏水工程及堤防、护岸等有关设施',
|
||||||
|
zhunag: '1'
|
||||||
|
}
|
||||||
|
const edit = () => {
|
||||||
|
refModal.current.showEdit({});
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className={styles.list} style={{ padding: '0 10px', marginBottom: 5 }}>{dataPahe.title}<Button type="primary" onClick={edit}>编辑</Button></div>
|
||||||
|
|
||||||
|
<div className={styles.listborder} style={{ padding: '0 10px', }}>{dataPahe.title}</div>
|
||||||
|
<div className={styles.listborder} style={{ padding: '0 10px', marginBottom: 5 }}>{dataPahe.title}</div>
|
||||||
|
<div className={styles.contentBor} style={{ padding: '0 10px', marginBottom: 5, height: '35%' }}>
|
||||||
|
<div className={styles.listborder} style={{ padding: '0 10px', height: '30%' }}>{dataPahe.title}</div>
|
||||||
|
{dataPahe.title ?? '无内容请添加'}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style={{ display: 'flex', height: '33%' }}>
|
||||||
|
<div className={styles.contentBor} style={{ flex: 1, marginRight: 5 }}>
|
||||||
|
<div className={styles.listborder} style={{ height: '30%', padding: '0 10px', }}>{dataPahe.title}</div>
|
||||||
|
<div style={{ padding: '0 10px' }}>{dataPahe.title ?? '无内容请添加'}</div>
|
||||||
|
</div>
|
||||||
|
<div className={styles.contentBor} style={{ flex: 1 }}>
|
||||||
|
<div className={styles.listborder} style={{ height: '30%', padding: '0 10px', }}>{dataPahe.title}</div>
|
||||||
|
<div style={{ padding: '0 10px' }}>{dataPahe.title ?? '无内容请添加'}</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<BasicCrudModal
|
||||||
|
width={800}
|
||||||
|
ref={refModal}
|
||||||
|
title=""
|
||||||
|
component={ModalForm}
|
||||||
|
onCrudSuccess={successCallback}
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
export default Page
|
||||||
|
|
@ -0,0 +1,23 @@
|
||||||
|
.list{
|
||||||
|
height: 10%;
|
||||||
|
// margin: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
background-color: #fff;
|
||||||
|
|
||||||
|
}
|
||||||
|
.listborder{
|
||||||
|
height: 10%;
|
||||||
|
// margin: 5px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
background-color: #fff;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
.contentBor{
|
||||||
|
|
||||||
|
background-color: #fff;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,137 @@
|
||||||
|
import React, { useEffect, useState, useMemo, useRef } from 'react';
|
||||||
|
import { Space, Table, Radio, DatePicker, Form, Select, Button, message, Upload, Input, Row, Col, Switch, Image } from 'antd';
|
||||||
|
import { DeleteOutlined, FileWordOutlined, FilePdfOutlined, FileZipOutlined, FileExcelOutlined } from '@ant-design/icons';
|
||||||
|
import { formItemLayout, btnItemLayout } from '../../../../components/crud/FormLayoutProps';
|
||||||
|
|
||||||
|
import apiurl from '../../../../service/apiurl';
|
||||||
|
|
||||||
|
// import "./index.less"
|
||||||
|
import moment from 'moment';
|
||||||
|
const { TextArea } = Input;
|
||||||
|
|
||||||
|
const options=[
|
||||||
|
{label:'禁用'},
|
||||||
|
{label:'启用'}
|
||||||
|
]
|
||||||
|
const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave }) => {
|
||||||
|
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
const [fileList, setFileList] = useState([]) //上传文件列表
|
||||||
|
|
||||||
|
const [loading, setLoading] = useState(false)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
const onfinish = (values) => {
|
||||||
|
values.eventsDate = values.eventsDate ? moment(values.eventsDate).format("YYYY-MM-DD 00:00:00") : ''
|
||||||
|
let oldFiles = fileList.map(item => ({ fileId: item.response?.data?.fileId }))
|
||||||
|
if (mode === 'edit') {
|
||||||
|
values.files = oldFiles;
|
||||||
|
values.id = record.id;
|
||||||
|
onEdit(apiurl.rcgl.gcdsj.edit, values)
|
||||||
|
}
|
||||||
|
if (mode === 'save') {
|
||||||
|
values.files = oldFiles
|
||||||
|
onSave(apiurl.rcgl.gcdsj.save, values)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
if (mode != 'save') {
|
||||||
|
const imgFile = record?.files?.map(o => ({
|
||||||
|
name: o.fileName,
|
||||||
|
response: {
|
||||||
|
data: {
|
||||||
|
filePath: o.filePath,
|
||||||
|
fileId: o.fileId
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}))
|
||||||
|
setFileList(imgFile)
|
||||||
|
}
|
||||||
|
}, [record, mode])
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Form
|
||||||
|
form={form}
|
||||||
|
{...formItemLayout}
|
||||||
|
onFinish={onfinish}
|
||||||
|
initialValues={record}
|
||||||
|
>
|
||||||
|
<Row>
|
||||||
|
<Col span={24}>
|
||||||
|
<Form.Item
|
||||||
|
label="节点"
|
||||||
|
name="name"
|
||||||
|
rules={[{ required: true }]}
|
||||||
|
>
|
||||||
|
<Input disabled style={{ width: '100%' }} allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={24}>
|
||||||
|
<Form.Item
|
||||||
|
label="状态"
|
||||||
|
name="name"
|
||||||
|
rules={[{ required: true }]}
|
||||||
|
>
|
||||||
|
<Radio.Group options={options}/>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={24}>
|
||||||
|
<Form.Item
|
||||||
|
label="法律名称"
|
||||||
|
name="name"
|
||||||
|
rules={[{ required: true }]}
|
||||||
|
>
|
||||||
|
<Input style={{ width: '100%' }} allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={24}>
|
||||||
|
<Form.Item
|
||||||
|
label="法条内容"
|
||||||
|
name="name"
|
||||||
|
>
|
||||||
|
<Input style={{ width: '100%' }} allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
|
||||||
|
<Col span={24}>
|
||||||
|
<Form.Item
|
||||||
|
label="违法行为描述"
|
||||||
|
name="name"
|
||||||
|
>
|
||||||
|
<TextArea rows={4} />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={24}>
|
||||||
|
<Form.Item
|
||||||
|
label="处罚措施"
|
||||||
|
name="name"
|
||||||
|
>
|
||||||
|
<TextArea rows={4} />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
{
|
||||||
|
mode === 'view' ? null : (
|
||||||
|
<>
|
||||||
|
<Form.Item {...btnItemLayout}>
|
||||||
|
<Button type="primary" htmlType="submit">
|
||||||
|
{mode === 'save' ? '提交' : '修改'}
|
||||||
|
</Button>
|
||||||
|
</Form.Item>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
</Form>
|
||||||
|
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ModalForm;
|
||||||
|
|
@ -0,0 +1,21 @@
|
||||||
|
import { Card } from 'antd'
|
||||||
|
import TreeSelectZdy from './treeSelectZdy'
|
||||||
|
|
||||||
|
import ContentPage from './content'
|
||||||
|
|
||||||
|
|
||||||
|
const Page = () => {
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div style={{display:'flex',height: '100%'}}>
|
||||||
|
<div style={{ width: 320, backgroundColor: '#fff', padding: 10 }}>
|
||||||
|
<TreeSelectZdy />
|
||||||
|
</div>
|
||||||
|
<div style={{ flex:1 ,marginLeft:10}}>
|
||||||
|
<ContentPage />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
export default Page
|
||||||
|
|
@ -0,0 +1,123 @@
|
||||||
|
import React, { useState, useMemo } from 'react';
|
||||||
|
import { Tree, Input } from 'antd';
|
||||||
|
const { Search } = Input;
|
||||||
|
|
||||||
|
const data = [
|
||||||
|
{
|
||||||
|
key: 'parent 1',
|
||||||
|
title: '违反水利工程建设与管理类行为',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
value: 'parent 1-0',
|
||||||
|
title: '侵占、毁坏水法规定相关设施',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
key: 'leaf1',
|
||||||
|
title: '侵占、毁坏水工程及堤防、护岸...',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'leaf2',
|
||||||
|
title: '毁坏防汛、水文监测、水文地质...',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'leaf3',
|
||||||
|
title: '在水工程保护范围内，从事影响..',
|
||||||
|
}
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'parent 1-1',
|
||||||
|
title: '破坏大坝管理设施、妨碍大坝',
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
key: 'leaf4',
|
||||||
|
title: '毁坏大坝及其管理设施',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'leaf5',
|
||||||
|
title: '危害大坝安全或破坏大坝正常运行',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: 'leaf6',
|
||||||
|
title: '在岸区或坝体从事生产活动',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
];
|
||||||
|
let dataList = [];
|
||||||
|
|
||||||
|
const Page = () => {
|
||||||
|
const [expandedKeys, setExpandedKeys] = useState([]);
|
||||||
|
const [searchValue, setSearchValue] = useState('');
|
||||||
|
const [autoExpandParent, setAutoExpandParent] = useState(true);
|
||||||
|
|
||||||
|
|
||||||
|
const onExpand = (newExpandedKeys) => {
|
||||||
|
setExpandedKeys(newExpandedKeys);
|
||||||
|
setAutoExpandParent(false);
|
||||||
|
|
||||||
|
};
|
||||||
|
const onSearch = (value) => {
|
||||||
|
// const newExpandedKeys = dataList
|
||||||
|
// .map((item) => {
|
||||||
|
// if (item.title.indexOf(value) > -1) {
|
||||||
|
// return getParentKey(item.key, data);
|
||||||
|
// }
|
||||||
|
// return null;
|
||||||
|
// })
|
||||||
|
// .filter((item, i, self) => !!(item && self.indexOf(item) === i));
|
||||||
|
// setExpandedKeys(newExpandedKeys);
|
||||||
|
setSearchValue(value);
|
||||||
|
setAutoExpandParent(true);
|
||||||
|
|
||||||
|
};
|
||||||
|
const treeData = useMemo(() => {
|
||||||
|
const loop = (data) =>
|
||||||
|
data.map((item) => {
|
||||||
|
const strTitle = item.title;
|
||||||
|
const index = strTitle?.indexOf(searchValue);
|
||||||
|
const beforeStr = strTitle.substring(0, index);
|
||||||
|
const afterStr = strTitle.slice(index + searchValue.length);
|
||||||
|
const title =
|
||||||
|
index > -1 ? (
|
||||||
|
<span key={item.key}>
|
||||||
|
{beforeStr}
|
||||||
|
<span className="site-tree-search-value" style={{ color: 'red' }}>{searchValue}</span>
|
||||||
|
{afterStr}
|
||||||
|
</span>
|
||||||
|
) : (
|
||||||
|
<span key={item.key}>{strTitle}</span>
|
||||||
|
);
|
||||||
|
if (item.children) {
|
||||||
|
return { title, key: item.key, children: loop(item.children) };
|
||||||
|
}
|
||||||
|
if (index > -1) {
|
||||||
|
dataList.push(item.key)
|
||||||
|
setExpandedKeys(dataList);
|
||||||
|
}
|
||||||
|
return {
|
||||||
|
title,
|
||||||
|
key: item.key,
|
||||||
|
};
|
||||||
|
});
|
||||||
|
|
||||||
|
return loop(data);
|
||||||
|
}, [searchValue]);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div style={{ margin: '10px 0' }}><Search onSearch={onSearch} /></div>
|
||||||
|
<Tree
|
||||||
|
onExpand={onExpand}
|
||||||
|
expandedKeys={expandedKeys}
|
||||||
|
treeData={treeData}
|
||||||
|
autoExpandParent={autoExpandParent}
|
||||||
|
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Page;
|
||||||
|
|
@ -0,0 +1,27 @@
|
||||||
|
.ddForm .ant-form-item-label {
|
||||||
|
width: 110px;
|
||||||
|
}
|
||||||
|
.zxform .ant-form-item-control {
|
||||||
|
border: 1px solid;
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
.zxform .ant-form-item-label {
|
||||||
|
border: 1px solid;
|
||||||
|
width: 110px;
|
||||||
|
height: 50px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
.zxform .ant-input-outlined {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
.zxform .ant-form-item {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
.zxform .ant-input {
|
||||||
|
height: 48px;
|
||||||
|
}
|
||||||
|
.zxform .ant-input-disabled {
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,50 @@
|
||||||
|
|
||||||
|
.ddForm{
|
||||||
|
.ant-form-item-label{
|
||||||
|
width: 110px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.zxform{
|
||||||
|
.ant-form-item{
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
.ant-form-item-control{
|
||||||
|
border: 1px solid;
|
||||||
|
height: 50px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-form-item-label{
|
||||||
|
border: 1px solid;
|
||||||
|
// border-right:none;
|
||||||
|
width: 110px;
|
||||||
|
height: 50px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
|
// .ant-input-outlined {
|
||||||
|
// border:none
|
||||||
|
// }
|
||||||
|
|
||||||
|
.ant-input{
|
||||||
|
height: 40px;
|
||||||
|
width: 90%;
|
||||||
|
|
||||||
|
}
|
||||||
|
.empty{
|
||||||
|
.ant-input-disabled{
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-select-single{
|
||||||
|
height: 40px;
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -0,0 +1,221 @@
|
||||||
|
import React, { useEffect, useState, useRef } from 'react';
|
||||||
|
import { Space, Table, Radio, DatePicker, Form, Select, Button, message, Upload, Input, Row, Col, Switch, Image } from 'antd';
|
||||||
|
import './ddForm.less'
|
||||||
|
import dayjs from 'dayjs'
|
||||||
|
import { InboxOutlined, LinkOutlined, DeleteOutlined, LoadingOutlined,VerticalAlignBottomOutlined } from '@ant-design/icons'
|
||||||
|
import { httpPostFile } from '../../../../utils/request';
|
||||||
|
import apiUrl from '../../../../service/apiurl'
|
||||||
|
import PdfView from './pdfView'
|
||||||
|
const { RangePicker } = DatePicker;
|
||||||
|
const { TextArea } = Input;
|
||||||
|
|
||||||
|
const baseUrl = "http://local.gunshiiot.com:18083/gunshiApp/xintankou"
|
||||||
|
|
||||||
|
const FormZdy = ({ typeName = "ddForm", formJson, getFormInfo, type, formJsonData, typeUpload = 'dispatch', isModalOpen,fileType,footer=true }) => {
|
||||||
|
const [fileList, setFileList] = useState([])
|
||||||
|
const [fileListUp, setFileLisUp] = useState([])
|
||||||
|
const [url, setUrl] = useState('')
|
||||||
|
const [isModal, setIsModal] = useState(false)
|
||||||
|
|
||||||
|
|
||||||
|
// debugger;
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
|
||||||
|
// function onDocumentLoadSuccess({ numPages }) {
|
||||||
|
// setRenderNumPages(numPages);
|
||||||
|
// }
|
||||||
|
const onFinish = (e) => {
|
||||||
|
}
|
||||||
|
const getInfo = () => {
|
||||||
|
form.validateFields().then((values) => {
|
||||||
|
getFormInfo({ ...values, files: fileList, fileIds: fileList.map(item => item.id) })
|
||||||
|
form.resetFields()
|
||||||
|
setFileList([])
|
||||||
|
}).catch((errorInfo) => {
|
||||||
|
console.log(errorInfo, 'error');
|
||||||
|
})
|
||||||
|
//
|
||||||
|
}
|
||||||
|
const cancel = () => {
|
||||||
|
getFormInfo(false)
|
||||||
|
form.resetFields()
|
||||||
|
setFileList([])
|
||||||
|
|
||||||
|
}
|
||||||
|
const { Dragger } = Upload;
|
||||||
|
// const preView = (e) => {
|
||||||
|
// window.open('http://local.gunshiiot.com:18083/xintankou/api/file/preview/104')
|
||||||
|
// }
|
||||||
|
const deleteFile = (e) => {
|
||||||
|
let arr = fileList.filter(item => item.id !== e)
|
||||||
|
setFileList(arr)
|
||||||
|
}
|
||||||
|
const props = {
|
||||||
|
name: 'file',
|
||||||
|
multiple: true,
|
||||||
|
fileList: fileList,
|
||||||
|
showUploadList: false,
|
||||||
|
beforeUpload: (file, fileList) => {
|
||||||
|
if (fileType == "pic" &&
|
||||||
|
(file.type != "image/jpeg" || file.type != "image/png" || file.type != "image/jpg")) {
|
||||||
|
message.error('仅支持上传jpg/png/jpeg格式的图片');
|
||||||
|
return false;
|
||||||
|
} else {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onChange(e) {
|
||||||
|
setFileLisUp([...fileListUp, e.file])
|
||||||
|
httpPostFile(apiUrl.service.uploadFile.uploadUrl + "?group=" + typeUpload, e).then(res => {
|
||||||
|
setFileList([...fileList, res.data])
|
||||||
|
})
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const onChange = () => { }
|
||||||
|
function checkMediaType(url) {
|
||||||
|
// 创建URL对象
|
||||||
|
var link = url;
|
||||||
|
// 获取路径的最后一个点之后的内容作为文件扩展名
|
||||||
|
var extension = link.split('.').pop().toLowerCase();
|
||||||
|
|
||||||
|
// 声明支持的图片和视频文件扩展名
|
||||||
|
var imageExtensions = ['jpg', 'jpeg', 'gif', 'png'];
|
||||||
|
var file = ['pdf', 'word', 'xslx', 'xsl', 'txt',"pptx"];
|
||||||
|
|
||||||
|
// 判断文件扩展名是否在图片扩展名数组中
|
||||||
|
if (imageExtensions.includes(extension)) {
|
||||||
|
return 'image';
|
||||||
|
}
|
||||||
|
|
||||||
|
// 判断文件扩展名是否在视频扩展名数组中
|
||||||
|
if (file.includes(extension)) {
|
||||||
|
return extension;
|
||||||
|
}
|
||||||
|
|
||||||
|
// 扩展名不在图片或视频数组中，返回null表示无法确定媒体类型
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
const preView = (item) => {
|
||||||
|
if (checkMediaType(item.name) == 'pdf') {
|
||||||
|
// window.open(baseUrl + item.previewUrl)
|
||||||
|
setUrl(`${`http://local.gunshiiot.com:18083/xintankou`}/static/pdf/web/viewer.html?file=${encodeURIComponent(`http://local.gunshiiot.com:18083/gunshiApp/xintankou/${item.previewUrl}`)}`)
|
||||||
|
setIsModal(true)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 文件下载
|
||||||
|
* @param {String} params 文件fileId
|
||||||
|
*/
|
||||||
|
const download = (id,name) => {
|
||||||
|
let downloadLink = document.createElement("a");
|
||||||
|
downloadLink.href = `http://local.gunshiiot.com:18083/gunshiApp/xintankou/api/file/download/${id}`;
|
||||||
|
downloadLink.download = `${name}`;
|
||||||
|
downloadLink.style.display = "none";
|
||||||
|
// 将链接添加到页面中
|
||||||
|
document.body.appendChild(downloadLink);
|
||||||
|
|
||||||
|
// 模拟点击事件，开始下载
|
||||||
|
downloadLink.click();
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
form.resetFields()
|
||||||
|
let formType = type
|
||||||
|
if(type='edit'){
|
||||||
|
formType=2
|
||||||
|
}
|
||||||
|
if(type == 'view'){
|
||||||
|
formType =1
|
||||||
|
}
|
||||||
|
if(type=='save'){
|
||||||
|
formType =0
|
||||||
|
}
|
||||||
|
if (formType == 1 || formType == 2 || formType == 3) {
|
||||||
|
form.setFieldsValue(formJsonData)
|
||||||
|
if (formJsonData?.files) {
|
||||||
|
setFileList(formJsonData.files)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
return () => {
|
||||||
|
setFileList([])
|
||||||
|
}
|
||||||
|
|
||||||
|
}, [type, formJsonData, isModalOpen])
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div style={{ backgroundColor: '#fff' }}>
|
||||||
|
<Form form={form} name="searchTabel" onFinish={onFinish} className={typeName}>
|
||||||
|
<Row>
|
||||||
|
{formJson.map(item => {
|
||||||
|
return (
|
||||||
|
<Col span={item.span} >
|
||||||
|
<Form.Item
|
||||||
|
label={item.label}
|
||||||
|
name={item.key}
|
||||||
|
rules={[{ required: item.required, message: '请输入' + item.label }]}
|
||||||
|
className={item.type == 'empty'?'empty':'noempty'}
|
||||||
|
>
|
||||||
|
{item.type == "input" && <Input disabled={type == 1 || item.disabled} placeholder={item.placeholder} />}
|
||||||
|
{item.type == "Select" && <Select disabled={type == 1} options={item.options} />}
|
||||||
|
{item.type == "empty" && <Input disabled={item.type == "empty" ? true : false} />}
|
||||||
|
{item.type == "Switch" && <Switch defaultChecked onChange={onChange} disabled={type == 1} />}
|
||||||
|
{item.type == "DatePicker" && <DatePicker disabled={type == 1} style={{width:"100%"}} />}
|
||||||
|
{item.type == "TextArea" && <TextArea rows={4} disabled={type == 1} />}
|
||||||
|
{item.type == "Radio" &&<Radio.Group options={item.options} />}
|
||||||
|
{item.type == "RangePicker" &&
|
||||||
|
<RangePicker disabled={type=='view'} />}
|
||||||
|
{item.type == "upload" &&
|
||||||
|
<>
|
||||||
|
{type !== 1 && <Dragger {...props}>
|
||||||
|
<p className="ant-upload-drag-icon">
|
||||||
|
<InboxOutlined />
|
||||||
|
</p>
|
||||||
|
|
||||||
|
{fileType == "pic" ? <p className="ant-upload-text">点击或将文件拖拽到这里上传 支持扩展名：jpeg、png</p>: <p className="ant-upload-text">点击或将文件拖拽到这里上传</p>}
|
||||||
|
|
||||||
|
</Dragger>}
|
||||||
|
<div>
|
||||||
|
{fileList?.map((item) => {
|
||||||
|
return <div className='flex align-center' style={{ minHeight: "50px", fontSize: 14,columnGap:10, cursor: checkMediaType(item.name) == 'image' || checkMediaType(item.name) == 'pdf'?'pointer':"not-allowed" }}>
|
||||||
|
<div style={{width:40,height:40,display:"flex",alignItems:'center'}}>
|
||||||
|
{checkMediaType(item.name) == 'image' && <Image
|
||||||
|
height={40}
|
||||||
|
src={baseUrl + item.previewUrl}
|
||||||
|
/>}
|
||||||
|
{
|
||||||
|
checkMediaType(item.name) !== 'image' &&
|
||||||
|
<span >{checkMediaType(item.name)?.toUpperCase()}</span>
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<span onClick={() => preView(item)}>{item.name}</span>
|
||||||
|
{type==2&&<DeleteOutlined onClick={() => deleteFile(item.id)} />}
|
||||||
|
<VerticalAlignBottomOutlined onClick={() => download(item.id,item.name)} />
|
||||||
|
</div>
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
</>}
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
)
|
||||||
|
})}
|
||||||
|
</Row>
|
||||||
|
</Form >
|
||||||
|
{type !== 1 &&<div className="flex flex-end" style={{ marginTop: 10 }}>
|
||||||
|
<Button type="" style={{ marginRight: 10 }} onClick={cancel}>取消</Button>
|
||||||
|
<Button type="primary" onClick={getInfo}>确定</Button>
|
||||||
|
</div>}
|
||||||
|
<PdfView url={url} isModal={isModal} setModalN={(e)=>setIsModal(e)}/>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export default FormZdy;
|
||||||
|
|
@ -0,0 +1,46 @@
|
||||||
|
import React, { Component, useEffect, useState } from 'react';
|
||||||
|
import { Document, Page, pdfjs } from 'react-pdf';
|
||||||
|
import { Modal } from 'antd';
|
||||||
|
|
||||||
|
const Pdf = ({ url,isModal,setModalN }) => {
|
||||||
|
const [isModalOpen, setIsModalOpen] = useState(false);
|
||||||
|
|
||||||
|
const handleOk = () => {
|
||||||
|
setIsModalOpen(false);
|
||||||
|
setModalN(false)
|
||||||
|
};
|
||||||
|
|
||||||
|
const handleCancel = () => {
|
||||||
|
setIsModalOpen(false);
|
||||||
|
setModalN(false)
|
||||||
|
};
|
||||||
|
useEffect(()=>{
|
||||||
|
setIsModalOpen(isModal)
|
||||||
|
},[isModal])
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<Modal
|
||||||
|
title={<div style={{ backgroundColor: '#259dff', padding: 10, color: "#fff" }}>pdf</div>}
|
||||||
|
open={isModalOpen}
|
||||||
|
width={1000}
|
||||||
|
onOk={handleOk}
|
||||||
|
footer={false}
|
||||||
|
onCancel={handleCancel}
|
||||||
|
destroyOnClose>
|
||||||
|
<div style={{ padding: "0 10px" }}>
|
||||||
|
<iframe
|
||||||
|
style={{
|
||||||
|
height: '80vh',
|
||||||
|
width: '100%',
|
||||||
|
border: 0,
|
||||||
|
marginTop: 20,
|
||||||
|
}}
|
||||||
|
src={url}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</Modal>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
export default Pdf
|
||||||
|
|
@ -0,0 +1,287 @@
|
||||||
|
import React, { useEffect, useState, useMemo, useRef } from 'react';
|
||||||
|
import { Form, Button, Input, Row, Upload, Col, Table, DatePicker, InputNumber, message, Image, Modal, Typography, Select } from 'antd';
|
||||||
|
import { DeleteOutlined, FileWordOutlined, FilePdfOutlined, FileZipOutlined, FileExcelOutlined } from '@ant-design/icons';
|
||||||
|
import { formItemLayout, btnItemLayout } from '../../../components/crud/FormLayoutProps';
|
||||||
|
|
||||||
|
import apiurl from '../../../service/apiurl';
|
||||||
|
|
||||||
|
import NormalSelect from '../../../components/Form/NormalSelect';
|
||||||
|
|
||||||
|
// import "./index.less"
|
||||||
|
import moment from 'moment';
|
||||||
|
const { RangePicker } = DatePicker
|
||||||
|
const { Dragger } = Upload;
|
||||||
|
const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
|
||||||
|
|
||||||
|
const opntios=[
|
||||||
|
{label:'宪法',value:'宪法'},
|
||||||
|
{label:'法律',value:'法律'},
|
||||||
|
{label:'行政法规',value:'行政法规'},
|
||||||
|
{label:'督察法规',value:'督察法规'},
|
||||||
|
{label:'司法解释',value:'司法解释'},
|
||||||
|
{label:'地方性法规',value:'地方性法规'},
|
||||||
|
]
|
||||||
|
const ModalForm = ({ mode, record, onEdit, onSave, onSimilarSave }) => {
|
||||||
|
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
const [fileList, setFileList] = useState([]) //上传文件列表
|
||||||
|
const [fileIds, setFileIds] = useState([])
|
||||||
|
const [iframeSrc, setIframeSrc] = useState('')
|
||||||
|
const [pdfViewOPen, setPdfViewOPen] = useState(false)
|
||||||
|
|
||||||
|
const [loading, setLoading] = useState(false)
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 文件下载
|
||||||
|
* @param {String} params 文件fileId
|
||||||
|
*/
|
||||||
|
const download = (params) => {
|
||||||
|
let downloadLink = document.createElement("a");
|
||||||
|
downloadLink.href = `http://local.gunshiiot.com:18083/gunshiApp/xyt/projectEvents/file/download/${params}`;
|
||||||
|
downloadLink.download = `${params.fileName}`;
|
||||||
|
downloadLink.style.display = "none";
|
||||||
|
// 将链接添加到页面中
|
||||||
|
document.body.appendChild(downloadLink);
|
||||||
|
|
||||||
|
// 模拟点击事件，开始下载
|
||||||
|
downloadLink.click();
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* @description 上传图片
|
||||||
|
* @param {string} file 上传的文件
|
||||||
|
*/
|
||||||
|
const fileChange = (info) => {
|
||||||
|
if (info.file.status === "done") {
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
if (info.file.status === "uploading") {
|
||||||
|
setLoading(true);
|
||||||
|
}
|
||||||
|
if (info.file.status === "error") {
|
||||||
|
message.error("文件上传失败")
|
||||||
|
setLoading(false);
|
||||||
|
}
|
||||||
|
let fileIds = info.fileList.map(file => {
|
||||||
|
return file.response?.data?.fileId
|
||||||
|
})
|
||||||
|
setFileIds(fileIds)
|
||||||
|
setFileList(info.fileList)
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* @description pdf文件预览
|
||||||
|
* @param {String} params 文件预览url
|
||||||
|
*/
|
||||||
|
const viewPdf = (params) => {
|
||||||
|
setIframeSrc(params)
|
||||||
|
setPdfViewOPen(true)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const onfinish = (values) => {
|
||||||
|
values.eventsDate = values.eventsDate ? moment(values.eventsDate).format("YYYY-MM-DD 00:00:00") : ''
|
||||||
|
let oldFiles = fileList.map(item => ({ fileId: item.response?.data?.fileId }))
|
||||||
|
if (mode === 'edit') {
|
||||||
|
values.files = oldFiles;
|
||||||
|
values.id = record.id;
|
||||||
|
onEdit(apiurl.rcgl.gcdsj.edit, values)
|
||||||
|
}
|
||||||
|
if (mode === 'save') {
|
||||||
|
values.files = oldFiles
|
||||||
|
onSave(apiurl.rcgl.gcdsj.save, values)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 删除上传的图片
|
||||||
|
* @param {string} id 删除的id
|
||||||
|
*/
|
||||||
|
const deleteFile = (fileId) => {
|
||||||
|
console.log(fileId);
|
||||||
|
let filterFile = fileList.filter(item => item.response?.data?.fileId !== fileId);
|
||||||
|
setFileList(filterFile)
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
if (mode != 'save') {
|
||||||
|
const imgFile = record?.files?.map(o => ({
|
||||||
|
name: o.fileName,
|
||||||
|
response: {
|
||||||
|
data: {
|
||||||
|
filePath: o.filePath,
|
||||||
|
fileId: o.fileId
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}))
|
||||||
|
setFileList(imgFile)
|
||||||
|
}
|
||||||
|
}, [record, mode])
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<Form
|
||||||
|
form={form}
|
||||||
|
{...formItemLayout}
|
||||||
|
onFinish={onfinish}
|
||||||
|
initialValues={record}
|
||||||
|
>
|
||||||
|
<Row>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="标题"
|
||||||
|
name="name"
|
||||||
|
rules={[{ required: true }]}
|
||||||
|
>
|
||||||
|
<Input disabled={mode === 'view'} style={{ width: '100%' }} allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item label="制度类型" name="name">
|
||||||
|
<Select allowClear style={{ width: '150px' }} options={opntios} />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="公布日期"
|
||||||
|
name="eventsDate"
|
||||||
|
getValueFromEvent={(e, dateString) => dateString}
|
||||||
|
getValueProps={(value) => ({ value: value ? moment(value) : undefined })}
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
>
|
||||||
|
<DatePicker disabled={mode === 'view'} format={'YYYY-MM-DD'} style={{ width: '100%' }} allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<Form.Item
|
||||||
|
label="发布单位"
|
||||||
|
name="name"
|
||||||
|
rules={[{ required: true }]}
|
||||||
|
>
|
||||||
|
<Input disabled={mode === 'view'} style={{ width: '100%' }} allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
<Row>
|
||||||
|
<Col span={24}>
|
||||||
|
<Form.Item
|
||||||
|
label="附件"
|
||||||
|
name="fieldId"
|
||||||
|
labelCol={{ span: 3 }}
|
||||||
|
wrapperCol={{ span: 19 }}
|
||||||
|
>
|
||||||
|
{mode !== "view" &&
|
||||||
|
<Dragger
|
||||||
|
name='file'
|
||||||
|
// multiple
|
||||||
|
action="/gunshiApp/xyt/projectEvents/file/upload/singleSimple"
|
||||||
|
onChange={fileChange}
|
||||||
|
onDrop={(info) => { console.log(info.dataTransfer.files); }}
|
||||||
|
fileList={fileList}
|
||||||
|
disabled={loading}
|
||||||
|
// onSuccess={handleSuccess}
|
||||||
|
>
|
||||||
|
<p className="ant-upload-text">点击或拖拽文件到此区域上传</p>
|
||||||
|
<p className="ant-upload-hint">
|
||||||
|
支持扩展名：.doc .docx .pdf .jpg .png .ppt
|
||||||
|
</p>
|
||||||
|
</Dragger>
|
||||||
|
}
|
||||||
|
<Row gutter={[16]}>
|
||||||
|
{
|
||||||
|
fileList.length > 0 && fileList.map(file => {
|
||||||
|
return (
|
||||||
|
<Col span={12}>
|
||||||
|
<div className="file-item" style={{ width: "75%" }}>
|
||||||
|
<div className='file-description'>
|
||||||
|
{file.name.indexOf('.docx') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { download(file.response?.data?.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FileWordOutlined
|
||||||
|
style={{ fontSize: 40 }}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
file.name.indexOf('.pdf') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { viewPdf(file.response?.data?.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FilePdfOutlined style={{ fontSize: 40 }} />
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
file.name.indexOf('.zip') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { download(file.response?.data?.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FileZipOutlined style={{ fontSize: 40 }} />
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
file.name.indexOf('.xlsx') > -1 ?
|
||||||
|
<div
|
||||||
|
onClick={() => { download(file.response?.data?.fileId) }}
|
||||||
|
style={{ cursor: 'pointer' }}
|
||||||
|
>
|
||||||
|
<FileExcelOutlined style={{ fontSize: 40 }} />
|
||||||
|
</div>
|
||||||
|
:
|
||||||
|
<Image width={60} src={url + file.response?.data?.filePath} alt='' />
|
||||||
|
}
|
||||||
|
<span>{file.name}</span>
|
||||||
|
</div>
|
||||||
|
<div className={mode == "view" ? 'delete-icon disable-icon' : 'delete-icon'} onClick={() => deleteFile(file.response?.data?.fileId)}>
|
||||||
|
<DeleteOutlined />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Col>
|
||||||
|
)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</Row>
|
||||||
|
</Form.Item>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
{
|
||||||
|
mode === 'view' ? null : (
|
||||||
|
<>
|
||||||
|
<Form.Item {...btnItemLayout}>
|
||||||
|
<Button type="primary" htmlType="submit">
|
||||||
|
{mode === 'save' ? '提交' : '修改'}
|
||||||
|
</Button>
|
||||||
|
</Form.Item>
|
||||||
|
</>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
</Form>
|
||||||
|
<Modal
|
||||||
|
open={pdfViewOPen}
|
||||||
|
width={1000}
|
||||||
|
title=""
|
||||||
|
footer={null}
|
||||||
|
style={{ marginTop: "-5%" }}
|
||||||
|
onCancel={() => {
|
||||||
|
setPdfViewOPen(false)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<iframe
|
||||||
|
style={{
|
||||||
|
height: '80vh',
|
||||||
|
width: '100%',
|
||||||
|
border: 0,
|
||||||
|
marginTop: 20,
|
||||||
|
}}
|
||||||
|
src={`${process.env.PUBLIC_URL}/static/pdf/web/viewer.html?file=${encodeURIComponent(`/gunshiApp/xyt/projectEvents/file/download/${iframeSrc}`)}`}
|
||||||
|
/>
|
||||||
|
</Modal>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ModalForm;
|
||||||
|
|
@ -0,0 +1,143 @@
|
||||||
|
import React, { Fragment, useRef, useMemo, useEffect, useState } from 'react';
|
||||||
|
import BasicCrudModal from '../../../components/crud/BasicCrudModal';
|
||||||
|
import { Table, Card, Modal, Form, Input, Button, Row, Col, Timeline, message, Tabs, Image } from 'antd';
|
||||||
|
import { FileWordOutlined, FilePdfOutlined, FileZipOutlined, FileExcelOutlined } from '@ant-design/icons';
|
||||||
|
import { useSelector } from 'react-redux';
|
||||||
|
import ToolBar from './toolbar';
|
||||||
|
import ModalForm from './form';
|
||||||
|
import apiurl from '../../../service/apiurl';
|
||||||
|
import usePageTable from '../../../components/crud/usePageTable2';
|
||||||
|
import { createCrudService } from '../../../components/crud/_';
|
||||||
|
import { CrudOpRender_text } from '../../../components/crud/CrudOpRender';
|
||||||
|
|
||||||
|
const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
|
||||||
|
const Page = () => {
|
||||||
|
const role = useSelector(state => state.auth.role);
|
||||||
|
const editBtn = role?.rule?.find(item => item.menuName == "编辑");
|
||||||
|
const viewBtn = role?.rule?.find(item => item.menuName == "查看");
|
||||||
|
const delBtn = role?.rule?.find(item => item.menuName == "删除");
|
||||||
|
const refModal = useRef();
|
||||||
|
const [searchVal, setSearchVal] = useState(false)
|
||||||
|
const [iframeSrc, setIframeSrc] = useState('')
|
||||||
|
const [pdfViewOPen, setPdfViewOPen] = useState(false)
|
||||||
|
const [isFetch, setIsFetch] = useState(false)
|
||||||
|
const columns = [
|
||||||
|
{ title: '序号', key: 'inx', dataIndex: 'inx', width: 60, align: "center" },
|
||||||
|
{ title: '标题', key: 'name', dataIndex: 'name', width: 250, ellipsis: true },
|
||||||
|
{
|
||||||
|
title: '制度类型', key: 'eventsDate', dataIndex: 'eventsDate', width: 140,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '发布日期', key: 'eventsDesc', dataIndex: 'eventsDesc', width: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '发布单位', key: 'eventsDesc', dataIndex: 'eventsDesc', width: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '上传时间', key: 'eventsDesc', dataIndex: 'eventsDesc', width: 300
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '附件', key: 'fileName', dataIndex: 'fileName', width: 300,render:(v,r)=><a onClick={()=>viewPdf(r.fileId)}>{v}</a>
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作', key: 'operation', width: 240, fixed: 'right', align: 'center',
|
||||||
|
render: (value, row, index) => (
|
||||||
|
<CrudOpRender_text
|
||||||
|
edit={true}
|
||||||
|
del={true}
|
||||||
|
view={true}
|
||||||
|
command={(cmd) => () => command(cmd)(row)} />)
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
|
||||||
|
const width = useMemo(() => columns.reduce((total, cur) => total + (cur.width), 0), [columns]);
|
||||||
|
|
||||||
|
const command = (type) => (params) => {
|
||||||
|
if (type === 'save') {
|
||||||
|
refModal.current.showSave();
|
||||||
|
} else if (type === 'edit') {
|
||||||
|
refModal.current.showEdit({ ...params });
|
||||||
|
} else if (type === 'view') {
|
||||||
|
refModal.current.showView(params);
|
||||||
|
} else if (type === 'del') {
|
||||||
|
refModal.current.onDeleteGet(apiurl.rcgl.gcdsj.delete + `/${params.id}`);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.rcgl.gcdsj.page).find_noCode);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @description 处理成功的回调
|
||||||
|
*/
|
||||||
|
const successCallback = () => {
|
||||||
|
refresh()
|
||||||
|
setIsFetch(!isFetch)
|
||||||
|
}
|
||||||
|
|
||||||
|
const viewPdf = (params) => {
|
||||||
|
setIframeSrc(params)
|
||||||
|
setPdfViewOPen(true)
|
||||||
|
}
|
||||||
|
useEffect(() => {
|
||||||
|
const params = {
|
||||||
|
search: {
|
||||||
|
...searchVal,
|
||||||
|
}
|
||||||
|
};
|
||||||
|
search(params)
|
||||||
|
}, [searchVal])
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div className='content-root clearFloat xybm' style={{ paddingRight: "0", paddingBottom: "0" }}>
|
||||||
|
<div className='lf CrudAdcdTreeTableBox' style={{ width: "100%", overflowY: "auto" }}>
|
||||||
|
<Card className='nonebox'>
|
||||||
|
<ToolBar
|
||||||
|
setSearchVal={setSearchVal}
|
||||||
|
onSave={command('save')}
|
||||||
|
role={role}
|
||||||
|
/>
|
||||||
|
</Card>
|
||||||
|
<div className="ant-card-body" style={{ padding: "20px 0 0 0" }}>
|
||||||
|
<Table columns={columns} rowKey="inx" {...tableProps} scroll={{ x: width, y: "calc( 100vh - 400px )" }} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<BasicCrudModal
|
||||||
|
width={1000}
|
||||||
|
ref={refModal}
|
||||||
|
title=""
|
||||||
|
component={ModalForm}
|
||||||
|
onCrudSuccess={successCallback}
|
||||||
|
// onCrudSuccess={()=>{refresh({addvcd:localStorage.getItem('ADCD6')})}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Modal
|
||||||
|
open={pdfViewOPen}
|
||||||
|
width={1000}
|
||||||
|
title=""
|
||||||
|
footer={null}
|
||||||
|
style={{ marginTop: "-5%" }}
|
||||||
|
onCancel={() => {
|
||||||
|
setPdfViewOPen(false)
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<iframe
|
||||||
|
style={{
|
||||||
|
height: '80vh',
|
||||||
|
width: '100%',
|
||||||
|
border: 0,
|
||||||
|
marginTop: 20,
|
||||||
|
}}
|
||||||
|
src={`${process.env.PUBLIC_URL}/static/pdf/web/viewer.html?file=${encodeURIComponent(`/gunshiApp/xyt/projectEvents/file/download/${iframeSrc}`)}`}
|
||||||
|
/>
|
||||||
|
</Modal>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Page;
|
||||||
|
|
@ -0,0 +1,76 @@
|
||||||
|
import React, { useEffect, useState } from 'react';
|
||||||
|
import { Form, Input, Button, DatePicker, Select } from 'antd';
|
||||||
|
import { DownOutlined, UpOutlined } from '@ant-design/icons'
|
||||||
|
|
||||||
|
import moment from 'moment';
|
||||||
|
const { RangePicker } = DatePicker;
|
||||||
|
const ToolBar = ({ setSearchVal, onSave, storeData, role }) => {
|
||||||
|
const addBtn = role?.rule?.find(item => item.menuName == "新增");
|
||||||
|
const searchBtn = role?.rule?.find(item => item.menuName == "查询");
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
const [showGj, setShowGj] = useState(false)
|
||||||
|
const onFinish = (values) => {
|
||||||
|
let dataSo;
|
||||||
|
if (values.tm) {
|
||||||
|
dataSo = {
|
||||||
|
start: moment(values.tm[0]).format('YYYY-MM-DD HH:mm:ss'),
|
||||||
|
end: moment(values.tm[1]).format('YYYY-MM-DD HH:mm:ss')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
delete values.tm
|
||||||
|
setSearchVal({ ...values, dataSo });
|
||||||
|
}
|
||||||
|
|
||||||
|
const opntios = [
|
||||||
|
{ label: '宪法', value: '宪法' },
|
||||||
|
{ label: '法律', value: '法律' },
|
||||||
|
{ label: '行政法规', value: '行政法规' },
|
||||||
|
{ label: '督察法规', value: '督察法规' },
|
||||||
|
{ label: '司法解释', value: '司法解释' },
|
||||||
|
{ label: '地方性法规', value: '地方性法规' },
|
||||||
|
]
|
||||||
|
const styles = {
|
||||||
|
fontFamily: '微软雅黑 Bold", "微软雅黑 Regular", 微软雅黑, sans-serif',
|
||||||
|
fontWeight: '700',
|
||||||
|
fontStyle: 'normal',
|
||||||
|
fontSize: '16px'
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<>
|
||||||
|
<div style={{ display: 'flex', justifyContent: 'space-between' }}>
|
||||||
|
<Form form={form} className='toolbarBox' layout="inline" onFinish={onFinish}>
|
||||||
|
<Form.Item label="标题" name="name">
|
||||||
|
<Input allowClear style={{ width: '150px' }} />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="制度类型" name="name">
|
||||||
|
<Select allowClear style={{ width: '150px' }} options={opntios} />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="发布日期" name="name">
|
||||||
|
<RangePicker allowClear />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item label="发布单位" name="name">
|
||||||
|
<Input allowClear style={{ width: '150px' }} />
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item>
|
||||||
|
<Button type="primary" htmlType="submit">查询</Button>
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
<Form.Item>
|
||||||
|
<Button onClick={() => form.resetFields()}>重置</Button>
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
{
|
||||||
|
(onSave) ?
|
||||||
|
<Form.Item>
|
||||||
|
<Button onClick={onSave}>新增</Button>
|
||||||
|
</Form.Item>
|
||||||
|
: null
|
||||||
|
}
|
||||||
|
|
||||||
|
</Form>
|
||||||
|
</div>
|
||||||
|
</>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ToolBar;
|
||||||
Loading…
Reference in New Issue