yygl.vue 23 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552
  1. <script setup lang="ts">
  2. import { ref, getCurrentInstance, reactive } from "vue";
  3. import { useRouter } from "vue-router";
  4. import request, { download } from '~/utils/request';
  5. import { pick } from 'lodash-es';
  6. import { ElMessage } from 'element-plus'
  7. import type { FormInstance, FormRules } from 'element-plus'
  8. import type { AxiosRequestConfig } from 'axios'
  9. // #region (constant)
  10. const TABLE_KEY = 'xhzz_id'
  11. const URL_CUT = '/xdhq/hqgl_zyyyzy'
  12. const URL_CUT_REF = ref(URL_CUT)
  13. const URL_SUBMIT_KEY = URL_CUT.split('/').join('_').slice(1)
  14. const instance = getCurrentInstance()
  15. const router = useRouter()
  16. // #endregion
  17. // #region (variable)
  18. const loading_table = ref(true)
  19. let whichDialogSubmit: 'add' | 'edit'
  20. // #endregion
  21. // #region (type)
  22. type TYPE_TABLE_FIELD = {
  23. [TABLE_KEY]: string;
  24. 'xhzz_cdbh': string; // 场地编号
  25. 'xhzz_cdmc': string; // 场地名称
  26. 'xhzl_flbm': string; // 场地类别编号
  27. 'xhzl_flmc': string; // 场地类别名称
  28. 'xhzz_ssxq': string; // 所属校区
  29. 'xhzz_zdmj': string; // 占地面积
  30. 'xhzz_dz': string; // 地址
  31. 'xhzz_tp': string; // 图片
  32. 'xhzz_sfkjy': string; // 是否可借用
  33. 'xhzz_fzr': string; // 负责人
  34. 'xhzz_fzr_uid': string; // 负责人ID
  35. 'xhzz_bz': string; // 备注
  36. }
  37. // #endregion
  38. // #region (props)
  39. // #endregion
  40. // #region (query row)
  41. const queryForm_Data = ref<Partial<TYPE_TABLE_FIELD> & { keyword?: string }>({})
  42. const handleQueryFormBtn_search = () => {
  43. queryApi()
  44. }
  45. const handleQueryFormBtn_clear = () => {
  46. queryForm_Data.value = {}
  47. }
  48. // #endregion
  49. // #region (table selection)
  50. const multipleSelection = ref<TYPE_TABLE_FIELD[]>([])
  51. const handleSelectionChange = (val: TYPE_TABLE_FIELD[]) => {
  52. multipleSelection.value = val
  53. }
  54. // #endregion
  55. // #region (table row)
  56. const handleTableRowBtn_import = async ({ file }: { file: File }) => {
  57. const res = await API_MAP['import']({ file })
  58. if (res.code === '1') {
  59. queryApi()
  60. ElMessage.success(res.msg)
  61. }
  62. }
  63. const handleTableRowBtn_export = () => {
  64. if (multipleSelection.value.length === 0) return ElMessage.info('请先勾选导出文件'); exportApi({ [TABLE_KEY]: multipleSelection.value.map((item: TYPE_TABLE_FIELD) => item[TABLE_KEY])?.join() })
  65. }
  66. const handleTableRowBtn_add = () => {
  67. whichDialogSubmit = 'add'
  68. dialogForm_Data.value = {}
  69. dialogVisible_addOrEdit.value = true
  70. }
  71. const handleTableRowBtn_delete = async () => {
  72. if (multipleSelection.value.length === 0) return ElMessage.info('请先勾选文件'); const resp = await deleteApi(multipleSelection.value.map((item: TYPE_TABLE_FIELD) => item[TABLE_KEY])); if (resp.code !== '1') return; ElMessage.success('删除成功');
  73. queryApi()
  74. }
  75. // #endregion
  76. // #region (table body)
  77. const tableData = ref<TYPE_TABLE_FIELD[]>([])
  78. const DetailName = '-ZYYY-CDGL'
  79. const DetailParam = 'aid'
  80. const handleTableColBtn_edit = async (scope: { row: TYPE_TABLE_FIELD }) => {
  81. whichDialogSubmit = 'edit'
  82. const res = await detailApi(scope.row[TABLE_KEY])
  83. dialogForm_Data.value = (res.data.one_info)
  84. dialogVisible_addOrEdit.value = true
  85. }
  86. const handleTableColBtn_audit = (scope: { row: TYPE_TABLE_FIELD }) => {
  87. whichDialogSubmit = 'edit'
  88. dialogForm_Data.value = pick(scope.row, [`${TABLE_KEY}`, ...Object.keys(dialogForm_Rules_audit)])
  89. dialogVisible_audit.value = true
  90. }
  91. const handleTableColBtn_detail = (scope: { row: TYPE_TABLE_FIELD }) => {
  92. router.push({ name: DetailName, params: { [DetailParam]: scope.row[TABLE_KEY] } })
  93. }
  94. const handleTableColBtn_delete = async (scope: { row: TYPE_TABLE_FIELD }) => {
  95. const resp = await deleteApi(scope.row[TABLE_KEY]); if (resp.code !== '1') return; ElMessage.success('删除成功');
  96. queryApi()
  97. }
  98. // #endregion
  99. // #region (pagination)
  100. const total = ref(0)
  101. const limit = ref(10)
  102. const currentPage = ref(1)
  103. function handleCurrentChange() {
  104. queryApi()
  105. }
  106. // #endregion
  107. // #region (dialog base)
  108. const dialogForm_Data = ref<Partial<TYPE_TABLE_FIELD> & { keyword?: string }>({})
  109. const handleDialogFormBtn_submit = async (formRefKey: string, extendData?: Partial<TYPE_TABLE_FIELD>) => {
  110. const isValid = await (instance?.refs[formRefKey] as FormInstance).validate((valid: boolean) => valid)
  111. if (isValid) {
  112. const resp = await API_MAP[whichDialogSubmit](<TYPE_TABLE_FIELD>({ ...dialogForm_Data.value, ...extendData }))
  113. if (resp.code !== '1') return; ElMessage.success('操作成功'); handleDialogFormBtn_cancel()
  114. queryApi()
  115. }
  116. }
  117. const handleDialogFormBtn_cancel = (formRefKey?: string) => {
  118. dialogVisible_addOrEdit.value = false
  119. dialogVisible_audit.value = false
  120. dialogVisible_booking.value = false
  121. }
  122. // #endregion
  123. // #region (dialog booking)
  124. type TYPE_TABLE_FIELD_BOOKING = {
  125. [TABLE_KEY]: string;
  126. 'xhzz_cdbh': string; // 场地编号
  127. 'xhz_cdmc': string; // 场地名称
  128. 'xhz_ssbm': string; // 所属部门
  129. 'xhz_jyr': string; // 借用人
  130. 'xhz_yt': string; // 用途
  131. 'xhz_pzr': string; // 批准人
  132. 'xhz_jysj_ks': string; // 借用时间_开始
  133. 'xhz_jysj_js': string; // 借用时间_结束
  134. // 'xhz_zt': string; // 状态
  135. 'xhz_yy': string; // 原因
  136. }
  137. const handleTableColBtn_booking = async (scope: { row: TYPE_TABLE_FIELD }) => {
  138. dialogForm_Data_booking.value = {
  139. xhzz_cdbh: scope.row.xhzz_cdbh,
  140. xhz_cdmc: scope.row.xhzz_cdmc,
  141. }
  142. dialogVisible_booking.value = true
  143. }
  144. const dialogVisible_booking = ref<boolean>(false)
  145. const dialogForm_Ref_booking = ref<FormInstance>()
  146. const dialogForm_Rules_booking = reactive({
  147. 'xhz_cdmc': { required: true, message: '场地名称不能为空', trigger: 'submit' },
  148. 'xhz_ssbm': { required: true, message: '所属部门不能为空', trigger: 'submit' },
  149. 'xhz_jyr': { required: true, message: '借用人不能为空', trigger: 'submit' },
  150. 'xhz_yt': { required: true, message: '用途不能为空', trigger: 'submit' },
  151. 'xhz_pzr': { required: true, message: '批准人不能为空', trigger: 'submit' },
  152. 'xhz_jysj_ks': { required: true, message: '借用时间_开始不能为空', trigger: 'submit' },
  153. 'xhz_jysj_js': { required: true, message: '借用时间_结束不能为空', trigger: 'submit' },
  154. 'xhz_zt': { required: true, message: '状态不能为空', trigger: 'submit' },
  155. 'xhz_yy': { required: true, message: '原因不能为空', trigger: 'submit' },
  156. })
  157. const dialogForm_Data_booking = ref<Partial<TYPE_TABLE_FIELD_BOOKING>>({})
  158. const handleDialogFormBtn_submit_booking = async (formRefKey: string, extendData?: Partial<TYPE_TABLE_FIELD>) => {
  159. const isValid = await (instance?.refs[formRefKey] as FormInstance).validate((valid: boolean) => valid)
  160. if (isValid) {
  161. const resp = await request({
  162. url: '/xdhq/hqgl_zyyy/add',
  163. data: {
  164. 'xdhq_hqgl_zyyy': {
  165. ...dialogForm_Data_booking.value,
  166. ...extendData
  167. }
  168. }
  169. })
  170. if (resp.code !== '1') return; ElMessage.success('预约成功等待审核'); handleDialogFormBtn_cancel(); init();
  171. }
  172. }
  173. // #endregion
  174. // #region (dialog add/edit)
  175. const dialogVisible_addOrEdit = ref<boolean>(false)
  176. const dialogForm_Ref_addOrEdit = ref<FormInstance>()
  177. const dialogForm_Rules_addOrEdit = reactive({
  178. 'xhzz_cdbh': { required: true, message: '场地编号不能为空', trigger: 'submit' },
  179. 'xhzz_cdmc': { required: true, message: '场地名称不能为空', trigger: 'submit' },
  180. 'xhzl_flbm': { required: true, message: '场地类别不能为空', trigger: 'submit' },
  181. 'xhzl_flmc': { required: true, message: '场地类别不能为空', trigger: 'submit' },
  182. 'xhzz_ssxq': { required: false, message: '所属校区不能为空', trigger: 'submit' },
  183. 'xhzz_zdmj': { required: false, message: '占地面积不能为空', trigger: 'submit' },
  184. 'xhzz_dz': { required: false, message: '地址不能为空', trigger: 'submit' },
  185. 'xhzz_tp': { required: true, message: '图片不能为空', trigger: 'submit' },
  186. 'xhzz_sfkjy': { required: true, message: '是否可借用不能为空', trigger: 'submit' },
  187. 'xhzz_fzr': { required: true, message: '负责人不能为空', trigger: 'submit' },
  188. 'xhzz_fzr_uid': { required: true, message: '负责人ID不能为空', trigger: 'submit' },
  189. 'xhzz_bz': { required: false, message: '备注不能为空', trigger: 'submit' },
  190. })
  191. // #endregion
  192. // #region (dialog audit)
  193. const dialogVisible_audit = ref<boolean>(false)
  194. const dialogForm_Field_audit = reactive<{
  195. FLAG: keyof TYPE_TABLE_FIELD,
  196. REASON?: keyof TYPE_TABLE_FIELD
  197. }>({
  198. FLAG: 'xhzz_id',
  199. // REASON:'xhzz_id'
  200. })
  201. const dialogForm_Ref_audit = ref<FormInstance>()
  202. const dialogForm_Rules_audit = reactive<FormRules>({
  203. 'xhzz_cdbh': { required: true, message: '场地编号不能为空', trigger: 'submit' },
  204. 'xhzz_cdmc': { required: true, message: '场地名称不能为空', trigger: 'submit' },
  205. 'xhzl_flbm': { required: true, message: '场地类别不能为空', trigger: 'submit' },
  206. 'xhzz_ssxq': { required: true, message: '所属校区不能为空', trigger: 'submit' },
  207. 'xhzz_zdmj': { required: true, message: '占地面积不能为空', trigger: 'submit' },
  208. 'xhzz_dz': { required: true, message: '地址不能为空', trigger: 'submit' },
  209. 'xhzz_tp': { required: true, message: '图片不能为空', trigger: 'submit' },
  210. 'xhzz_sfkjy': { required: true, message: '是否可借用不能为空', trigger: 'submit' },
  211. 'xhzz_fzr': { required: true, message: '负责人不能为空', trigger: 'submit' },
  212. 'xhzz_fzr_uid': { required: true, message: '负责人ID不能为空', trigger: 'submit' },
  213. 'xhzz_bz': { required: true, message: '备注不能为空', trigger: 'submit' },
  214. })
  215. // #endregion
  216. // #region (request api):
  217. function queryApi() {
  218. loading_table.value = true
  219. return request({
  220. url: URL_CUT + '/index',
  221. data: {
  222. ...queryForm_Data.value,
  223. limit: limit.value,
  224. page: currentPage.value
  225. }
  226. }).then((response: { data: { total_rows: string, page_data: TYPE_TABLE_FIELD[] } }) => {
  227. const { data } = response
  228. total.value = parseInt(data.total_rows)
  229. tableData.value = data.page_data
  230. return response
  231. }).then(() => {
  232. loading_table.value = false
  233. })
  234. }
  235. function addApi(data: TYPE_TABLE_FIELD) {
  236. return request({
  237. url: URL_CUT + '/add',
  238. data: {
  239. [URL_SUBMIT_KEY]: data,
  240. }
  241. })
  242. }
  243. function editApi(data: Partial<TYPE_TABLE_FIELD>) {
  244. return request({
  245. url: URL_CUT + '/edit',
  246. data: {
  247. [TABLE_KEY]: data[TABLE_KEY],
  248. [URL_SUBMIT_KEY]: pick(data, ['xhzz_cdbh', 'xhzz_cdmc', 'xhzl_flbm', 'xhzl_flmc', 'xhzz_ssxq', 'xhzz_zdmj', 'xhzz_dz', 'xhzz_tp', 'xhzz_sfkjy', 'xhzz_fzr', 'xhzz_fzr_uid', 'xhzz_bz',]),
  249. }
  250. })
  251. }
  252. function deleteApi(id: string | string[]) {
  253. return request({
  254. url: URL_CUT + '/delete',
  255. data: {
  256. [TABLE_KEY]: id,
  257. }
  258. })
  259. }
  260. function detailApi(id: string) {
  261. return request({
  262. url: URL_CUT + '/detail',
  263. data: {
  264. [TABLE_KEY]: id,
  265. }
  266. })
  267. }
  268. function importApi(data: { file: File }) {
  269. return request({
  270. $type: 'import',
  271. url: URL_CUT + '/import',
  272. data
  273. } as AxiosRequestConfig)
  274. }
  275. function exportApi(d) {
  276. return download(URL_CUT + '/index', { ...queryForm_Data.value, ...d })
  277. }
  278. const API_MAP = {
  279. query: queryApi,
  280. add: addApi,
  281. edit: editApi,
  282. delete: deleteApi,
  283. detail: detailApi,
  284. import: importApi,
  285. export: exportApi,
  286. }
  287. // #endregion
  288. // #region (page init)
  289. function init() {
  290. queryApi()
  291. }
  292. init()
  293. // #endregion
  294. </script>
  295. <template>
  296. <div class="card flex-grow flex flex-col">
  297. <div class="flex justify-between">
  298. <div></div>
  299. <el-form inline :model="queryForm_Data">
  300. <!-- <el-form-item label="关键字"><el-input v-model="queryForm_Data.keyword" ></el-input></el-form-item> -->
  301. <el-form-item>
  302. <el-input placeholder="场地编号" v-model="queryForm_Data.xhzz_cdbh" clearable />
  303. </el-form-item>
  304. <el-form-item>
  305. <el-input placeholder="场地名称" v-model="queryForm_Data.xhzz_cdmc" clearable />
  306. </el-form-item>
  307. <el-form-item>
  308. <!-- <el-input v-model="queryForm_Data.xhzl_flbm" clearable /> -->
  309. <remote-select placeholder="场地类别" url="/xdhq/hqgl_zyyylb/index" :fields="['xhzl_flbm', 'xhzl_flmc']"
  310. v-model="queryForm_Data.xhzl_flbm" v-model:modelName="queryForm_Data.xhzl_flmc"></remote-select>
  311. </el-form-item>
  312. <!-- <el-form-item label="所属校区">
  313. <el-input v-model="queryForm_Data.xhzz_ssxq" clearable />
  314. </el-form-item>
  315. <el-form-item label="占地面积">
  316. <el-input v-model="queryForm_Data.xhzz_zdmj" clearable />
  317. </el-form-item>
  318. <el-form-item label="地址">
  319. <el-input v-model="queryForm_Data.xhzz_dz" clearable />
  320. </el-form-item>
  321. <el-form-item label="图片">
  322. <el-input v-model="queryForm_Data.xhzz_tp" clearable />
  323. </el-form-item>
  324. <el-form-item label="是否可借用">
  325. <el-select v-model="queryForm_Data.xhzz_sfkjy" clearable filterable>
  326. <el-option label="是" value="1" />
  327. <el-option label="否" value="2" />
  328. </el-select>
  329. </el-form-item> -->
  330. <el-form-item>
  331. <el-input placeholder="负责人" v-model="queryForm_Data.xhzz_fzr" clearable />
  332. </el-form-item>
  333. <!-- <el-form-item label="负责人ID">
  334. <el-input v-model="queryForm_Data.xhzz_fzr_uid" clearable />
  335. </el-form-item>
  336. <el-form-item label="备注">
  337. <el-input v-model="queryForm_Data.xhzz_bz" clearable />
  338. </el-form-item> -->
  339. <el-form-item>
  340. <el-button @click="handleQueryFormBtn_search" type="primary">搜索</el-button>
  341. <!-- <el-button @click="handleQueryFormBtn_clear" type="warning">清空</el-button> -->
  342. </el-form-item>
  343. </el-form>
  344. </div>
  345. <!-- <div class="divider"></div>
  346. <div>
  347. <import-button @success="queryApi" :url="URL_CUT_REF"></import-button>
  348. <el-button @click="handleTableRowBtn_export" type="success">导出</el-button>
  349. <el-button @click="handleTableRowBtn_add" type="primary">新增</el-button>
  350. <el-button @click="handleTableRowBtn_delete" type="danger">删除</el-button>
  351. </div> -->
  352. <div class="divider"></div>
  353. <div class="flex-auto">
  354. <el-table :data="tableData" @selection-change="handleSelectionChange" v-loading="loading_table"
  355. element-loading-background="#ffffff70">
  356. <el-table-column type="selection"></el-table-column>
  357. <el-table-column prop="xhzz_cdbh" label="场地编号" width="auto" show-overflow-tooltip></el-table-column>
  358. <el-table-column prop="xhzz_cdmc" label="场地名称" width="auto" show-overflow-tooltip></el-table-column>
  359. <!-- <el-table-column prop="xhzl_flbm" label="场地类别" width="auto" show-overflow-tooltip></el-table-column> -->
  360. <el-table-column prop="xhzl_flmc" label="场地类别" width="auto" show-overflow-tooltip></el-table-column>
  361. <el-table-column prop="xhzz_ssxq" label="所属校区" width="auto" show-overflow-tooltip></el-table-column>
  362. <el-table-column prop="xhzz_zdmj" label="占地面积" width="auto" show-overflow-tooltip></el-table-column>
  363. <el-table-column prop="xhzz_dz" label="地址" width="auto" show-overflow-tooltip></el-table-column>
  364. <el-table-column prop="xhzz_tp" label="图片" width="auto" show-overflow-tooltip>
  365. <template #default="scope">
  366. <table-item-image :src="scope.row.xhzz_tp" class="h-23px"></table-item-image>
  367. </template>
  368. </el-table-column>
  369. <!-- <el-table-column prop="xhzz_sfkjy" label="是否可借用" width="auto" show-overflow-tooltip></el-table-column> -->
  370. <el-table-column prop="xhzz_fzr" label="负责人" width="auto" show-overflow-tooltip></el-table-column>
  371. <!-- <el-table-column prop="xhzz_fzr_uid" label="负责人ID" width="auto" show-overflow-tooltip></el-table-column> -->
  372. <!-- <el-table-column prop="xhzz_bz" label="备注" width="auto" show-overflow-tooltip></el-table-column> -->
  373. <el-table-column label="操作" fixed="right">
  374. <template #default="scope">
  375. <!-- <el-button link :auto-insert-space="false" @click="handleTableColBtn_edit(scope)" type="primary">编辑
  376. </el-button> -->
  377. <!-- <el-button link :auto-insert-space="false" @click="handleTableColBtn_audit(scope)" type="primary">审核
  378. </el-button>
  379. <el-button link :auto-insert-space="false" @click="handleTableColBtn_detail(scope)" type="primary">详情
  380. </el-button> -->
  381. <!-- <el-button link :auto-insert-space="false" @click="handleTableColBtn_delete(scope)" type="primary">删除
  382. </el-button> -->
  383. <el-button link :auto-insert-space="false" @click="handleTableColBtn_booking(scope)" type="primary">预约
  384. </el-button>
  385. </template>
  386. </el-table-column>
  387. </el-table>
  388. </div>
  389. <div class="flex justify-end mt-10 py-4">
  390. <el-pagination :page-size="limit" v-model:current-page="currentPage" @current-change="handleCurrentChange"
  391. background layout="total, prev, pager, next" :total="total" />
  392. </div>
  393. </div>
  394. <el-dialog v-model="dialogVisible_booking" append-to-body destroy-on-close>
  395. <el-form :model="dialogForm_Data_booking" ref="dialogForm_Ref_booking" :rules="dialogForm_Rules_booking"
  396. label-width="120px">
  397. <el-form-item label="场地编号" prop="xhz_cdmc">
  398. <el-input v-model="dialogForm_Data_booking.xhzz_cdbh" disabled />
  399. </el-form-item>
  400. <el-form-item label="场地名称" prop="xhz_cdmc">
  401. <el-input v-model="dialogForm_Data_booking.xhz_cdmc" disabled />
  402. </el-form-item>
  403. <el-form-item label="所属部门" prop="xhz_ssbm">
  404. <el-input v-model="dialogForm_Data_booking.xhz_ssbm" clearable />
  405. </el-form-item>
  406. <el-form-item label="借用人" prop="xhz_jyr">
  407. <el-input v-model="dialogForm_Data_booking.xhz_jyr" clearable />
  408. </el-form-item>
  409. <el-form-item label="批准人" prop="xhz_pzr">
  410. <el-input v-model="dialogForm_Data_booking.xhz_pzr" clearable />
  411. </el-form-item>
  412. <el-form-item label="借用时间_开始" prop="xhz_jysj_ks">
  413. <el-date-picker type="datetime" v-model="dialogForm_Data_booking.xhz_jysj_ks" value-format="YYYY-MM-DD HH:mm:ss"
  414. clearable />
  415. </el-form-item>
  416. <el-form-item label="借用时间_结束" prop="xhz_jysj_js">
  417. <el-date-picker type="datetime" v-model="dialogForm_Data_booking.xhz_jysj_js" value-format="YYYY-MM-DD HH:mm:ss"
  418. clearable />
  419. </el-form-item>
  420. <el-form-item label="用途" prop="xhz_yt">
  421. <el-input v-model="dialogForm_Data_booking.xhz_yt" type="textarea" :row="5" clearable />
  422. </el-form-item>
  423. <!-- <el-form-item label="状态" prop="xhz_zt">
  424. <el-radio-group v-model="dialogForm_Data_booking.xhz_zt">
  425. <el-radio label="1">未通过</el-radio>
  426. <el-radio label="2">通过</el-radio>
  427. </el-radio-group>
  428. </el-form-item> -->
  429. <!-- <el-form-item label="原因" prop="xhz_yy">
  430. <el-input v-model="dialogForm_Data_booking.xhz_yy" type="textarea" :row="5" clearable />
  431. </el-form-item> -->
  432. <div class="flex justify-center">
  433. <el-button @click="handleDialogFormBtn_submit_booking('dialogForm_Ref_booking')" type="primary">提交</el-button>
  434. <el-button @click="handleDialogFormBtn_cancel('dialogForm_Ref_booking')" type="default">取消</el-button>
  435. </div>
  436. </el-form>
  437. </el-dialog>
  438. <el-dialog v-model="dialogVisible_addOrEdit" append-to-body destroy-on-close>
  439. <el-form :model="dialogForm_Data" ref="dialogForm_Ref_addOrEdit" :rules="dialogForm_Rules_addOrEdit"
  440. label-width="120px">
  441. <el-form-item label="场地编号" prop="xhzz_cdbh">
  442. <el-input v-model="dialogForm_Data.xhzz_cdbh" clearable />
  443. </el-form-item>
  444. <el-form-item label="场地名称" prop="xhzz_cdmc">
  445. <el-input v-model="dialogForm_Data.xhzz_cdmc" clearable />
  446. </el-form-item>
  447. <el-form-item label="场地类别" prop="xhzl_flbm">
  448. <!-- <el-input v-model="dialogForm_Data.xhzl_flbm" clearable /> -->
  449. <remote-select url="/xdhq/hqgl_zyyylb/index" :fields="['xhzl_flbm', 'xhzl_flmc']"
  450. v-model="dialogForm_Data.xhzl_flbm" v-model:modelName="dialogForm_Data.xhzl_flmc"></remote-select>
  451. </el-form-item>
  452. <el-form-item label="所属校区" prop="xhzz_ssxq">
  453. <el-input v-model="dialogForm_Data.xhzz_ssxq" clearable />
  454. </el-form-item>
  455. <el-form-item label="占地面积" prop="xhzz_zdmj">
  456. <el-input v-model="dialogForm_Data.xhzz_zdmj" clearable><template #append>平方米</template></el-input>
  457. </el-form-item>
  458. <el-form-item label="地址" prop="xhzz_dz">
  459. <el-input v-model="dialogForm_Data.xhzz_dz" clearable />
  460. </el-form-item>
  461. <el-form-item label="图片" prop="xhzz_tp">
  462. <!-- <el-input v-model="dialogForm_Data.xhzz_tp" clearable /> -->
  463. <file-upload v-model:part="dialogForm_Data.xhzz_tp" clearable />
  464. </el-form-item>
  465. <!-- <el-form-item label="是否可借用" prop="xhzz_sfkjy">
  466. <el-radio-group v-model="dialogForm_Data.xhzz_sfkjy">
  467. <el-radio label="1">是</el-radio>
  468. <el-radio label="2">否</el-radio>
  469. </el-radio-group>
  470. </el-form-item> -->
  471. <el-form-item label="负责人" prop="xhzz_fzr">
  472. <el-input v-model="dialogForm_Data.xhzz_fzr" clearable />
  473. </el-form-item>
  474. <!-- <el-form-item label="负责人ID" prop="xhzz_fzr_uid">
  475. <el-input v-model="dialogForm_Data.xhzz_fzr_uid" clearable />
  476. </el-form-item> -->
  477. <el-form-item label="备注" prop="xhzz_bz">
  478. <el-input v-model="dialogForm_Data.xhzz_bz" clearable />
  479. </el-form-item>
  480. <div class="flex justify-center">
  481. <el-button @click="handleDialogFormBtn_submit('dialogForm_Ref_addOrEdit')" type="primary">提交</el-button>
  482. <el-button @click="handleDialogFormBtn_cancel('dialogForm_Ref_addOrEdit')" type="default">取消</el-button>
  483. </div>
  484. </el-form>
  485. </el-dialog>
  486. <el-dialog v-model="dialogVisible_audit" append-to-body destroy-on-close>
  487. <el-form :model="dialogForm_Data" ref="dialogForm_Ref_audit" :rules="dialogForm_Rules_audit" label-width="120px">
  488. <el-form-item label="状态">
  489. <el-radio-group v-model="dialogForm_Data[dialogForm_Field_audit.FLAG]">
  490. <el-radio label="1">通过</el-radio>
  491. <el-radio label="2">未通过</el-radio>
  492. </el-radio-group>
  493. </el-form-item>
  494. <!-- <el-form-item label="原因" v-show="dialogForm_Data[dialogForm_Field_audit.FLAG] === '1'">
  495. <el-input type="textarea" v-model="dialogForm_Data[dialogForm_Field_audit.REASON]" :rows="5" />
  496. </el-form-item> -->
  497. <div class="flex justify-center">
  498. <el-button @click="handleDialogFormBtn_submit('dialogForm_Ref_audit')" type="primary">提交</el-button>
  499. <el-button @click="handleDialogFormBtn_cancel('dialogForm_Ref_audit')" type="default">取消</el-button>
  500. </div>
  501. </el-form>
  502. </el-dialog>
  503. </template>