|
|
@@ -0,0 +1,1861 @@
|
|
|
+<template>
|
|
|
+ <el-card shadow="never">
|
|
|
+ <el-form :model="crudForm" label-width="120px">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="{:__('数据表')}:">
|
|
|
+ <select-page url="develop/getTable" key-field="name" label-field="title" @change="changeTable"></select-page>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="{:__('控制器')}:">
|
|
|
+ <el-input :disabled="!crudForm.table" placeholder="{:__('请输入控制器')}" v-model="crudForm.controller"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="{:__('数据模型')}:">
|
|
|
+ <el-input :disabled="!crudForm.table" placeholder="{:__('请输入数据模型')}" v-model="crudForm.model"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12">
|
|
|
+ <el-form-item label="{:__('代码风格')}:">
|
|
|
+ <el-radio-group v-model="crudForm.reduced">
|
|
|
+ <el-radio :label="true">干净简洁版</el-radio>
|
|
|
+ <el-radio :label="false">带功能描述且注释版</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="12" v-if="crudForm.actionList">
|
|
|
+ <el-form-item label="{:__('操作功能')}:">
|
|
|
+ <field-list @change="changeAction" :label="[__('方法名'),__('功能描述')]" :value="crudForm.actionList"></field-list>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-form-item>
|
|
|
+ <el-divider>
|
|
|
+ <el-checkbox-group v-model="actions">
|
|
|
+ <el-checkbox label="table"><span style="font-weight: bolder;">{:__('配置表格')}</span></el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </el-divider>
|
|
|
+ </el-form-item>
|
|
|
+ <template v-if="crudForm.table && inArray(actions,'table')">
|
|
|
+ <el-form-item label="{:__('表格列表')}:">
|
|
|
+ <el-table v-if="tableData" :data="tableData" border style="width: 100%">
|
|
|
+ <el-table-column prop="field" label="{:__('字段')}" width="150" fixed="left"></el-table-column>
|
|
|
+ <el-table-column label="{:__('标题')}" width="150">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-input v-model="row.title"></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="{:__('展示状态')}" width="150">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-select v-model="row.visible" @change="parseSearchList(row)">
|
|
|
+ <el-option label="展示" :value="true"></el-option>
|
|
|
+ <el-option label="不展示" value="none"></el-option>
|
|
|
+ <el-option label="展示关联表" value="relation"></el-option>
|
|
|
+ <el-option label="默认隐藏" :value="false"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="{:__('展示样式')}" width="150">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-select v-model="row.formatter" @change="parseFields(row)" v-if="row.visible!='none'">
|
|
|
+ <el-option v-for="(label,key) in formatter" :label="label" :key="key" :value="key"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="{:__('过滤方式')}" width="300">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-input v-model="row.operate" v-if="row.visible!='none'">
|
|
|
+ <template #append>
|
|
|
+ <el-button size="small" type="primary" @click="showOperate(row)">编辑</el-button>
|
|
|
+ </template>
|
|
|
+ </el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="{:__('选择项')}" width="300">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-input v-model="row.searchList" v-if="row.visible!='none'">
|
|
|
+ <template #append>
|
|
|
+ <el-button size="small" type="primary" @click="showSearchList(row)">编辑</el-button>
|
|
|
+ </template>
|
|
|
+ </el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="{:__('关联表')}" width="300">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-input v-model="row.relation" v-if="row.visible=='relation'">
|
|
|
+ <template #append>
|
|
|
+ <el-button size="small" type="primary" @click="showRelation(row)">编辑</el-button>
|
|
|
+ </template>
|
|
|
+ </el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="{:__('允许排序')}" width="100">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-checkbox-group v-model="row.sortable" v-if="row.visible!='none'">
|
|
|
+ <el-checkbox label="是"></el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="{:__('快速搜索')}" width="100">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-checkbox-group v-model="row.search" v-if="row.visible!='none'">
|
|
|
+ <el-checkbox label="是"></el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="{:__('回收站')}" width="100" v-if="crudForm.recyclebin">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-checkbox-group v-model="row.recyclebin" v-if="row.visible!='none'">
|
|
|
+ <el-checkbox label="是"></el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-form-item>
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
|
|
|
+ <el-form-item label="{:__('顶部分栏')}:">
|
|
|
+ <el-select v-model="crudForm.tabs" style="width: 100%">
|
|
|
+ <el-option label="不分栏显示" value=""></el-option>
|
|
|
+ <template v-for="xtable in tableData" :key="xtable.field">
|
|
|
+ <el-option v-if="xtable.searchList" :label="xtable.title" :value="xtable.field"></el-option>
|
|
|
+ </template>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
|
|
|
+ <el-form-item label="{:__('不要分页')}:">
|
|
|
+ <label class="checklabel">
|
|
|
+ <input type="checkbox" v-model="crudForm.pagination"/>
|
|
|
+ <span>{:__('是')}</span>
|
|
|
+ </label>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
|
|
|
+ <el-form-item label="{:__('展示统计')}:">
|
|
|
+ <label class="checklabel">
|
|
|
+ <input type="checkbox" v-model="crudForm.summary"/>
|
|
|
+ <span>{:__('是')}</span>
|
|
|
+ </label>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
|
|
|
+ <el-form-item label="{:__('展示扩展')}:">
|
|
|
+ <label class="checklabel">
|
|
|
+ <input type="checkbox" v-model="crudForm.expand"/>
|
|
|
+ <span>{:__('是')}</span>
|
|
|
+ </label>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <template v-if="havaPid()">
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
|
|
|
+ <el-form-item label="{:__('树形表格')}:">
|
|
|
+ <label class="checklabel">
|
|
|
+ <input type="checkbox" v-model="crudForm.isTree"/>
|
|
|
+ <span>{:__('是')}</span>
|
|
|
+ </label>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" v-if="crudForm.isTree">
|
|
|
+ <el-form-item label="{:__('树形表格标题')}:">
|
|
|
+ <el-select v-model="crudForm.treeTitle" style="width: 100%">
|
|
|
+ <template v-for="xtable in tableData" :key="xtable.field">
|
|
|
+ <el-option :label="xtable.title" :value="xtable.field"></el-option>
|
|
|
+ </template>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </template>
|
|
|
+ </el-row>
|
|
|
+ </template>
|
|
|
+ <el-form-item>
|
|
|
+ <el-divider>
|
|
|
+ <el-checkbox-group v-model="actions">
|
|
|
+ <el-checkbox label="form"><span style="font-weight: bolder;">{:__('配置表单')}</span></el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </el-divider>
|
|
|
+ </el-form-item>
|
|
|
+ <template v-if="crudForm.table && inArray(actions,'form')">
|
|
|
+ <el-form-item label="{:__('表单列表')}:">
|
|
|
+ <el-table v-if="tableData" :data="tableData" border style="width: 100%">
|
|
|
+ <el-table-column prop="field" label="{:__('字段')}" width="150" fixed="left"></el-table-column>
|
|
|
+ <el-table-column label="{:__('标题')}" width="150">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-input v-model="row.title"></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="{:__('表单')}" width="300">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-input v-model="row.edit">
|
|
|
+ <template #append>
|
|
|
+ <el-button size="small" type="primary" @click="showFormDialog(row)">编辑</el-button>
|
|
|
+ </template>
|
|
|
+ </el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="{:__('验证')}" width="300">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-input v-model="row.rules" placeholder="多项验证用“;”隔开" v-if="isShowEdit(row)"></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="{:__('选择项')}" width="300">
|
|
|
+ <template #default="{row}">
|
|
|
+ <el-input v-model="row.searchList" v-if="isShowEdit(row)">
|
|
|
+ <template #append>
|
|
|
+ <el-button size="small" type="primary" @click="showSearchList(row)">编辑</el-button>
|
|
|
+ </template>
|
|
|
+ </el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-form-item>
|
|
|
+ <template v-if="havaPid()">
|
|
|
+ <el-row>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6">
|
|
|
+ <el-form-item label="{:__('树形结构')}:">
|
|
|
+ <label class="checklabel">
|
|
|
+ <input type="checkbox" v-model="crudForm.isTree"/>
|
|
|
+ <span>{:__('是')}</span>
|
|
|
+ </label>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" v-if="crudForm.isTree">
|
|
|
+ <el-form-item label="{:__('树形结构标题')}:">
|
|
|
+ <el-select v-model="crudForm.treeTitle" style="width: 100%">
|
|
|
+ <template v-for="xtable in tableData" :key="xtable.field">
|
|
|
+ <el-option :label="xtable.title" :value="xtable.field"></el-option>
|
|
|
+ </template>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button :disabled="!crudForm.table || !crudForm.controller || !crudForm.model" type="primary" @click="submit('code')"><i class="fa fa-code"></i> 生成代码</el-button>
|
|
|
+ <el-button :disabled="!crudForm.table || !crudForm.controller || !crudForm.model" type="primary" @click="submit('file')"><i class="fa fa-file"></i> 生成文件</el-button>
|
|
|
+ <el-button :disabled="!crudForm.table || !crudForm.controller || !crudForm.model" type="danger" @click="clear"><i class="fa fa-remove"></i> 清除文件</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-card>
|
|
|
+ <el-dialog
|
|
|
+ v-model="operateDialog.show"
|
|
|
+ title="{:__('编辑过滤方式')}"
|
|
|
+ width="800">
|
|
|
+ <el-scrollbar height="400px">
|
|
|
+ <el-form label-width="100px">
|
|
|
+ <el-form-item label="{:__('过滤简写')}:">
|
|
|
+ <el-select v-model="operateDialog.data.short" @change="changeShort('table')" style="width:100%">
|
|
|
+ <el-option v-for="item in short.table" :key="item.key" :value="item.key">
|
|
|
+ <span>{{item.key}}</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{{item.label}}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('表单类型')}:">
|
|
|
+ <el-select v-model="operateDialog.data.form" @change="changeForm('table')" style="width: 100%">
|
|
|
+ <el-option v-for="item in formtype.form" :key="item.key" :value="item.key">
|
|
|
+ <span>{{item.key}}</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{{item.label}}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <template v-if="operateDialog.data.form=='input'">
|
|
|
+ <el-form-item label="{:__('文本类型')}:">
|
|
|
+ <el-select v-model="operateDialog.data.type" style="width: 100%">
|
|
|
+ <el-option key="text" value="text">
|
|
|
+ <span>text</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('输入文本')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="number" value="number">
|
|
|
+ <span>number</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('输入数字')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="password" value="password">
|
|
|
+ <span>password</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('输入密码')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="color" value="color">
|
|
|
+ <span>color</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('输入颜色')}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="operateDialog.data.form=='date-picker'">
|
|
|
+ <el-form-item label="{:__('日期类型')}:">
|
|
|
+ <el-select v-model="operateDialog.data.type" style="width: 100%" @change="changeForm('table')">
|
|
|
+ <el-option key="date" value="date">
|
|
|
+ <span>date</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('选择日期')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="datetime" value="datetime">
|
|
|
+ <span>datetime</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('选择日期+时间')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="daterange" value="daterange">
|
|
|
+ <span>daterange</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('选择日期区间')}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="operateDialog.data.form=='time-picker'">
|
|
|
+ <el-form-item label="{:__('时间类型')}:">
|
|
|
+ <el-select v-model="operateDialog.data.type" style="width: 100%" @change="changeForm('table')">
|
|
|
+ <el-option key="time" value="time">
|
|
|
+ <span>time</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('选择时间')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="timerange" value="timerange">
|
|
|
+ <span>timerange</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('选择时间区间')}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="operateDialog.data.form=='input'">
|
|
|
+ <el-form-item label="{:__('前置内容')}:">
|
|
|
+ <el-input v-model="operateDialog.data.prepend"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('后置内容')}:">
|
|
|
+ <el-input v-model="operateDialog.data.append"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="operateDialog.searchList && (operateDialog.data.form=='checkbox' || operateDialog.data.form=='radio' || operateDialog.data.form=='select')">
|
|
|
+ <el-form-item label="{:__('选择项')}:">
|
|
|
+ <field-list field="operate" @change="changeSearchList" :value="operateDialog.searchList"></field-list>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="inArray(['input','select','date-picker','time-picker','cascader','selectpage'],operateDialog.data.form)">
|
|
|
+ <el-form-item label="{:__('提示文字')}:">
|
|
|
+ <el-input v-model="operateDialog.data.placeholder" placeholder="{:__('不填默认显示为字段标题')}"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="operateDialog.data.form!='hidden'">
|
|
|
+ <el-form-item label="{:__('表单尺寸')}:">
|
|
|
+ <el-select v-model="operateDialog.data.size" style="width: 100%">
|
|
|
+ <el-option label="{:__('大')}" key="large" value="large"></el-option>
|
|
|
+ <el-option label="{:__('中')}" key="default" value="default"></el-option>
|
|
|
+ <el-option label="{:__('小')}" key="small" value="small"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="operateDialog.data.filter!='IS NULL' && operateDialog.data.filter!='IS NOT NULL'">
|
|
|
+ <el-form-item label="{:__('默认值')}:">
|
|
|
+ <el-input v-model="operateDialog.data.value"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="operateDialog.data.form=='cascader'">
|
|
|
+ <el-form-item label="{:__('数据获取方式')}:">
|
|
|
+ <el-select v-model="operateDialog.data.cascaderType" style="width: 100%">
|
|
|
+ <el-option label="{:__('JSON数据')}" key="options" value="options"></el-option>
|
|
|
+ <el-option label="{:__('网络获取')}" key="url" value="url"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <template v-if="operateDialog.data.cascaderType=='url'">
|
|
|
+ <el-form-item label="{:__('请求地址')}:">
|
|
|
+ <el-input v-model="operateDialog.data.url"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('获取级数')}:">
|
|
|
+ <el-input v-model="operateDialog.data.level"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="operateDialog.data.cascaderType=='options'">
|
|
|
+ <el-form-item label="{:__('JSON树')}:">
|
|
|
+ <el-input type="textarea" rows="4" v-model="operateDialog.data.options"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ <template v-if="operateDialog.data.form=='selectpage'">
|
|
|
+ <el-form-item label="{:__('请求地址')}:">
|
|
|
+ <el-input v-model="operateDialog.data.url"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('存储字段')}:">
|
|
|
+ <el-input v-model="operateDialog.data.keyField"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('显示字段')}:">
|
|
|
+ <el-input v-model="operateDialog.data.labelField"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="operateDialog.data.form=='select' || operateDialog.data.form=='cascader' || operateDialog.data.form=='selectpage'">
|
|
|
+ <el-form-item label="{:__('是否多选')}:">
|
|
|
+ <el-select v-model="operateDialog.data.multiple" style="width: 100%" @change="changeForm('table')">
|
|
|
+ <el-option label="{:__('是')}" :key="1" :value="1"></el-option>
|
|
|
+ <el-option label="{:__('否')}" :key="0" :value="0"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <el-form-item label="{:__('过滤方式')}:">
|
|
|
+ <el-select v-model="operateDialog.data.filter" style="width: 100%">
|
|
|
+ <el-option v-for="item in operateDialog.filter" :key="item.key" :value="item.key">
|
|
|
+ <span>{{item.key}}</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{{item.label}}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-scrollbar>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button type="info" @click="operateDialog.show = false">{:__('取消')}</el-button>
|
|
|
+ <el-button type="primary" @click="confirmFilter">{:__('确定')}</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ v-model="searchListDialog.show"
|
|
|
+ title="{:__('编辑选择项')}"
|
|
|
+ width="800">
|
|
|
+ <el-scrollbar height="400px">
|
|
|
+ <el-form label-width="100px">
|
|
|
+ <template v-if="searchListDialog.searchList">
|
|
|
+ <el-form-item label="{:__('选择项')}:">
|
|
|
+ <field-list field="searchlist" @change="changeSearchList" :value="searchListDialog.searchList"></field-list>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-form>
|
|
|
+ </el-scrollbar>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button type="info" @click="searchListDialog.show = false">{:__('取消')}</el-button>
|
|
|
+ <el-button type="primary" @click="confirmSearchList">{:__('确定')}</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ v-model="relationDialog.show"
|
|
|
+ title="{:__('编辑关联表')}"
|
|
|
+ width="800">
|
|
|
+ <el-scrollbar height="400px">
|
|
|
+ <el-form label-width="100px">
|
|
|
+ <el-form-item label="{:__('关联表')}:">
|
|
|
+ <select-page url="develop/getTable" key-field="name" label-field="title" @change="changeRelationTable"></select-page>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('关联方式')}:">
|
|
|
+ <el-select v-model="relationDialog.data.ralationType" style="width: 100%">
|
|
|
+ <el-option label="{:__('一对一关联')}" key="one" value="one"></el-option>
|
|
|
+ <el-option label="{:__('一对多关联')}" key="many" value="many"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('关联字段')}:">
|
|
|
+ <el-select v-model="relationDialog.data.relationField" style="width: 100%">
|
|
|
+ <el-option :label="field.name" :key="field.name" :value="field.name" v-for="field in relationDialog.fields"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('展示字段')}:">
|
|
|
+ <el-select v-model="relationDialog.data.showField" style="width: 100%">
|
|
|
+ <el-option :label="field.name" :key="field.name" :value="field.name" v-for="field in relationDialog.fields"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('过滤字段')}:">
|
|
|
+ <el-select v-model="relationDialog.data.filterField" style="width: 100%">
|
|
|
+ <el-option :label="field.name" :key="field.name" :value="field.name" v-for="field in relationDialog.fields"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </el-scrollbar>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button type="info" @click="relationDialog.show = false">{:__('取消')}</el-button>
|
|
|
+ <el-button type="primary" @click="confirmRelation">{:__('确定')}</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ v-model="formDialog.show"
|
|
|
+ title="{:__('编辑输入类型')}"
|
|
|
+ width="800">
|
|
|
+ <el-scrollbar height="400px">
|
|
|
+ <el-form label-width="100px">
|
|
|
+ <el-form-item label="{:__('表单简写')}:">
|
|
|
+ <el-select v-model="formDialog.data.short" @change="changeShort('form')" style="width:100%">
|
|
|
+ <el-option v-for="item in short.form" :key="item.key" :value="item.key">
|
|
|
+ <span>{{item.key}}</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{{item.label}}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('表单类型')}:">
|
|
|
+ <el-select v-model="formDialog.data.form" @change="changeForm('form')" style="width: 100%">
|
|
|
+ <el-option v-for="item in formtype.form" :key="item.key" :value="item.key">
|
|
|
+ <span>{{item.key}}</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{{item.label}}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <template v-if="formDialog.data.form=='input'">
|
|
|
+ <el-form-item label="{:__('文本类型')}:">
|
|
|
+ <el-select v-model="formDialog.data.type" style="width: 100%">
|
|
|
+ <el-option key="text" value="text">
|
|
|
+ <span>text</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('单行文本')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="textarea" value="textarea">
|
|
|
+ <span>textarea</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('多行文本')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="hidden" value="hidden">
|
|
|
+ <span>hidden</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('隐藏输入')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="number" value="number">
|
|
|
+ <span>number</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('输入数字')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="password" value="password">
|
|
|
+ <span>password</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('输入密码')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="color" value="color">
|
|
|
+ <span>color</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('输入颜色')}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form=='date-picker'">
|
|
|
+ <el-form-item label="{:__('日期类型')}:">
|
|
|
+ <el-select v-model="formDialog.data.type" style="width: 100%" @change="changeForm('form')">
|
|
|
+ <el-option key="date" value="date">
|
|
|
+ <span>date</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('选择日期')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="datetime" value="datetime">
|
|
|
+ <span>datetime</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('选择日期+时间')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="daterange" value="daterange">
|
|
|
+ <span>daterange</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('选择日期区间')}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form=='time-picker'">
|
|
|
+ <el-form-item label="{:__('时间类型')}:">
|
|
|
+ <el-select v-model="formDialog.data.type" style="width: 100%" @change="changeForm('form')">
|
|
|
+ <el-option key="time" value="time">
|
|
|
+ <span>time</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('选择时间')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="timerange" value="timerange">
|
|
|
+ <span>timerange</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('选择时间区间')}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form=='input' && formDialog.data.type!='hidden' && formDialog.data.type!='textarea'">
|
|
|
+ <el-form-item label="{:__('前置内容')}:">
|
|
|
+ <el-input v-model="formDialog.data.prepend"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('后置内容')}:">
|
|
|
+ <el-input v-model="formDialog.data.append"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('只读')}:">
|
|
|
+ <el-switch v-model="formDialog.data.readonly" :active-value="1" :inactive-value="0"></el-switch>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form=='input' && formDialog.data.type=='textarea'">
|
|
|
+ <el-form-item label="{:__('显示行数')}:">
|
|
|
+ <el-input v-model="formDialog.data.rows" type="number"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form=='attachment' || formDialog.data.form=='files'">
|
|
|
+ <el-form-item label="{:__('允许上传数量')}:">
|
|
|
+ <el-input v-model="formDialog.data.limit" type="number"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form=='files'">
|
|
|
+ <el-form-item label="{:__('支持文件类型')}:">
|
|
|
+ <el-input v-model="formDialog.data.accept"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('存储方式')}:">
|
|
|
+ <el-select v-model="formDialog.data.disks" style="width: 100%">
|
|
|
+ <el-option key="local_public" value="local_public">
|
|
|
+ <span>local_public</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('本地开放文件')}</span>
|
|
|
+ </el-option>
|
|
|
+ <el-option key="local_private" value="local_private">
|
|
|
+ <span>local_private</span>
|
|
|
+ <span style="float: right;font-size: 13px;color: #a2a2a2">{:__('本地私有文件')}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form=='fieldlist'">
|
|
|
+ <el-form-item label="{:__('项目标题')}:">
|
|
|
+ <el-input v-model="formDialog.data.label"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.searchList && (formDialog.data.form=='switch' || formDialog.data.form=='checkbox' || formDialog.data.form=='radio' || formDialog.data.form=='select')">
|
|
|
+ <el-form-item label="{:__('选择项')}:">
|
|
|
+ <field-list field="form" @change="changeSearchList" :value="formDialog.searchList"></field-list>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="inArray(['input','select','date-picker','time-picker','cascader','selectpage'],formDialog.data.form)">
|
|
|
+ <el-form-item label="{:__('提示文字')}:">
|
|
|
+ <el-input v-model="formDialog.data.placeholder" placeholder="{:__('不填默认显示为字段标题')}"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form=='editor'">
|
|
|
+ <el-form-item label="{:__('宽度')}:">
|
|
|
+ <el-input v-model="formDialog.data.width" placeholder="{:__('支持数字,像素,百分比如:300,300px,100%')}"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('高度')}:">
|
|
|
+ <el-input v-model="formDialog.data.height" placeholder="{:__('支持数字,像素:300,300px')}"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form!='slot'">
|
|
|
+ <el-form-item label="{:__('默认值')}:">
|
|
|
+ <el-input v-model="formDialog.data.value"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form=='cascader'">
|
|
|
+ <el-form-item label="{:__('数据获取方式')}:">
|
|
|
+ <el-select v-model="formDialog.data.cascaderType" style="width: 100%">
|
|
|
+ <el-option label="{:__('JSON数据')}" key="options" value="options"></el-option>
|
|
|
+ <el-option label="{:__('网络获取')}" key="url" value="url"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <template v-if="formDialog.data.cascaderType=='url'">
|
|
|
+ <el-form-item label="{:__('请求地址')}:">
|
|
|
+ <el-input v-model="formDialog.data.url"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('获取级数')}:">
|
|
|
+ <el-input v-model="formDialog.data.level"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.cascaderType=='options'">
|
|
|
+ <el-form-item label="{:__('JSON树')}:">
|
|
|
+ <el-input type="textarea" rows="4" v-model="formDialog.data.options"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form=='selectpage'">
|
|
|
+ <el-form-item label="{:__('请求地址')}:">
|
|
|
+ <el-input v-model="formDialog.data.url"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('存储字段')}:">
|
|
|
+ <el-input v-model="formDialog.data.keyField"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="{:__('显示字段')}:">
|
|
|
+ <el-input v-model="formDialog.data.labelField"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ <template v-if="formDialog.data.form=='select' || formDialog.data.form=='cascader' || formDialog.data.form=='selectpage'">
|
|
|
+ <el-form-item label="{:__('是否多选')}:">
|
|
|
+ <el-select v-model="formDialog.data.multiple" style="width: 100%" @change="changeForm('form')">
|
|
|
+ <el-option label="{:__('是')}" :key="1" :value="1"></el-option>
|
|
|
+ <el-option label="{:__('否')}" :key="0" :value="0"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-form>
|
|
|
+ </el-scrollbar>
|
|
|
+ <template #footer>
|
|
|
+ <span class="dialog-footer">
|
|
|
+ <el-button type="info" @click="formDialog.show = false">{:__('取消')}</el-button>
|
|
|
+ <el-button type="primary" @click="confirmForm">{:__('确定')}</el-button>
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ v-model="codeDialog.show"
|
|
|
+ title="{:__('生成代码')}"
|
|
|
+ :destroy-on-close="true"
|
|
|
+ height="500"
|
|
|
+ width="80%">
|
|
|
+ <el-tabs type="border-card">
|
|
|
+ <el-tab-pane :label="key+'文件'" v-for="(code,key) in codeDialog.row">
|
|
|
+ <el-scrollbar style="height: 400px">
|
|
|
+ <div v-if="key=='view'">
|
|
|
+ <template v-for="(view,name) in code">
|
|
|
+ <el-divider>{{name}}</el-divider>
|
|
|
+ <el-input style="border: 0" autosize type="textarea" :value="view"></el-input>
|
|
|
+ </template>
|
|
|
+ </div>
|
|
|
+ <div v-else>
|
|
|
+ <el-input style="border: 0" autosize type="textarea" :value="code"></el-input>
|
|
|
+ </div>
|
|
|
+ </el-scrollbar>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ <template #footer>
|
|
|
+ <el-button type="primary">
|
|
|
+ 复制
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ import selectpage from "@components/SelectPage.js";
|
|
|
+ import fieldlist from '@components/Fieldlist.js';
|
|
|
+ import {inArray} from "@util.js";
|
|
|
+ function isImage(name)
|
|
|
+ {
|
|
|
+ if(
|
|
|
+ name.indexOf('imgs')!=-1 ||
|
|
|
+ name.indexOf('images')!=-1 ||
|
|
|
+ name.indexOf('logos')!=-1 ||
|
|
|
+ name.indexOf('photos')!=-1 ||
|
|
|
+ name.indexOf('pictures')!=-1 ||
|
|
|
+ name.indexOf('icons')!=-1
|
|
|
+ ){
|
|
|
+ return 'images';
|
|
|
+ }
|
|
|
+ if(
|
|
|
+ name.indexOf('img')!=-1 ||
|
|
|
+ name.indexOf('image')!=-1 ||
|
|
|
+ name.indexOf('logo')!=-1 ||
|
|
|
+ name.indexOf('photo')!=-1 ||
|
|
|
+ name.indexOf('picture')!=-1 ||
|
|
|
+ name.indexOf('icon')!=-1
|
|
|
+ ){
|
|
|
+ return 'image';
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ function getAccept()
|
|
|
+ {
|
|
|
+ let mimetype=Yunqi.config.upload.mimetype.split(',');
|
|
|
+ let accept=[];
|
|
|
+ mimetype.forEach(res=>{
|
|
|
+ accept.push('.'+res);
|
|
|
+ });
|
|
|
+ accept=accept.join(',');
|
|
|
+ return accept;
|
|
|
+ }
|
|
|
+ function parseShort(data){
|
|
|
+ let short=data.short;
|
|
|
+ switch (short){
|
|
|
+ case '=':
|
|
|
+ data.form='input';
|
|
|
+ data.type='text';
|
|
|
+ data.filter='=';
|
|
|
+ break;
|
|
|
+ case '<>':
|
|
|
+ data.form='input';
|
|
|
+ data.type='text';
|
|
|
+ data.filter='<>';
|
|
|
+ break;
|
|
|
+ case 'like':
|
|
|
+ data.form='input';
|
|
|
+ data.type='text';
|
|
|
+ data.filter='LIKE';
|
|
|
+ break;
|
|
|
+ case 'not like':
|
|
|
+ data.form='input';
|
|
|
+ data.type='text';
|
|
|
+ data.filter='NOT LIKE';
|
|
|
+ break;
|
|
|
+ case 'null':
|
|
|
+ data.form='hidden';
|
|
|
+ data.filter='IS NULL';
|
|
|
+ break;
|
|
|
+ case 'not null':
|
|
|
+ data.form='hidden';
|
|
|
+ data.filter='IS NOT NULL';
|
|
|
+ break;
|
|
|
+ case 'select':
|
|
|
+ data.form='select';
|
|
|
+ data.filter='=';
|
|
|
+ break;
|
|
|
+ case 'selects':
|
|
|
+ data.form='select';
|
|
|
+ data.filter='IN';
|
|
|
+ data.multiple=1;
|
|
|
+ data.value='[]';
|
|
|
+ break;
|
|
|
+ case 'checkbox':
|
|
|
+ data.form='checkbox';
|
|
|
+ data.filter='IN';
|
|
|
+ data.value='[]';
|
|
|
+ break;
|
|
|
+ case 'radio':
|
|
|
+ data.form='radio';
|
|
|
+ data.filter='=';
|
|
|
+ break;
|
|
|
+ case 'find_in_set':
|
|
|
+ data.form='select';
|
|
|
+ data.filter='FIND_IN_SET';
|
|
|
+ break;
|
|
|
+ case 'between':
|
|
|
+ data.form='between';
|
|
|
+ data.filter='BETWEEN';
|
|
|
+ data.value='[]';
|
|
|
+ break;
|
|
|
+ case 'not between':
|
|
|
+ data.form='between';
|
|
|
+ data.filter='NOT BETWEEN';
|
|
|
+ data.value='[]';
|
|
|
+ break;
|
|
|
+ case 'date':
|
|
|
+ data.form='date-picker';
|
|
|
+ data.type='date';
|
|
|
+ data.filter='=';
|
|
|
+ break;
|
|
|
+ case 'datetime':
|
|
|
+ data.form='date-picker';
|
|
|
+ data.type='datetime';
|
|
|
+ data.filter='=';
|
|
|
+ break;
|
|
|
+ case 'daterange':
|
|
|
+ data.form='date-picker';
|
|
|
+ data.type='daterange';
|
|
|
+ data.filter='BETWEEN TIME';
|
|
|
+ break;
|
|
|
+ case 'time':
|
|
|
+ data.form='time-picker';
|
|
|
+ data.type='time';
|
|
|
+ data.filter='=';
|
|
|
+ break;
|
|
|
+ case 'timerange':
|
|
|
+ data.form='time-picker';
|
|
|
+ data.type='timerange';
|
|
|
+ data.filter='BETWEEN';
|
|
|
+ break;
|
|
|
+ case 'selectpage':
|
|
|
+ data.form='selectpage';
|
|
|
+ data.filter='=';
|
|
|
+ data.keyField='id';
|
|
|
+ data.labelField='name';
|
|
|
+ data.url='';
|
|
|
+ break;
|
|
|
+ case 'cascader':
|
|
|
+ data.form='cascader';
|
|
|
+ data.filter='=';
|
|
|
+ data.cascaderType='url';
|
|
|
+ data.level=2;
|
|
|
+ data.url='';
|
|
|
+ break;
|
|
|
+ case 'area':
|
|
|
+ data.form='cascader';
|
|
|
+ data.filter='=';
|
|
|
+ data.cascaderType='url';
|
|
|
+ data.level=3;
|
|
|
+ data.url='ajax/area';
|
|
|
+ break;
|
|
|
+ case 'category':
|
|
|
+ data.form='cascader';
|
|
|
+ data.filter='=';
|
|
|
+ data.cascaderType='url';
|
|
|
+ data.level=2;
|
|
|
+ data.url='ajax/category';
|
|
|
+ break;
|
|
|
+ case 'hidden':
|
|
|
+ data.form='input';
|
|
|
+ data.type='hidden';
|
|
|
+ break;
|
|
|
+ case 'text':
|
|
|
+ data.form='input';
|
|
|
+ data.type='text';
|
|
|
+ break;
|
|
|
+ case 'password':
|
|
|
+ data.form='input';
|
|
|
+ data.type='password';
|
|
|
+ break;
|
|
|
+ case 'readonly':
|
|
|
+ data.form='input';
|
|
|
+ data.type='text';
|
|
|
+ data.readonly=1;
|
|
|
+ break;
|
|
|
+ case 'number':
|
|
|
+ data.form='input';
|
|
|
+ data.type='number';
|
|
|
+ break;
|
|
|
+ case 'textarea':
|
|
|
+ data.form='input';
|
|
|
+ data.type='textarea';
|
|
|
+ data.rows=4;
|
|
|
+ break;
|
|
|
+ case 'editor':
|
|
|
+ data.form='editor';
|
|
|
+ data.width='100%';
|
|
|
+ data.height='350px';
|
|
|
+ break;
|
|
|
+ case 'switch':
|
|
|
+ data.form='switch';
|
|
|
+ break;
|
|
|
+ case 'image':
|
|
|
+ data.form='attachment';
|
|
|
+ data.limit=1;
|
|
|
+ break;
|
|
|
+ case 'images':
|
|
|
+ data.form='attachment';
|
|
|
+ data.limit=10;
|
|
|
+ break;
|
|
|
+ case 'file':
|
|
|
+ data.form='files';
|
|
|
+ data.limit=1;
|
|
|
+ break;
|
|
|
+ case 'files':
|
|
|
+ data.form='files';
|
|
|
+ data.limit=10;
|
|
|
+ break;
|
|
|
+ case 'fieldlist':
|
|
|
+ data.form='fieldlist';
|
|
|
+ data.label=['键名','键值'];
|
|
|
+ data.value='{}';
|
|
|
+ break;
|
|
|
+ case 'slot':
|
|
|
+ data.form='slot';
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ export default{
|
|
|
+ components:{'SelectPage':selectpage,'FieldList':fieldlist},
|
|
|
+ data:{
|
|
|
+ fields:[],
|
|
|
+ actions:[],
|
|
|
+ operateDialog:{
|
|
|
+ show:false,
|
|
|
+ row:'',
|
|
|
+ filter:[],
|
|
|
+ searchList: '',
|
|
|
+ data:''
|
|
|
+ },
|
|
|
+ searchListDialog:{
|
|
|
+ show: false,
|
|
|
+ row: '',
|
|
|
+ searchList: ''
|
|
|
+ },
|
|
|
+ relationDialog:{
|
|
|
+ show: false,
|
|
|
+ row: '',
|
|
|
+ fields:[],
|
|
|
+ data:{
|
|
|
+ table:'',
|
|
|
+ relationField:'',
|
|
|
+ filterField:'',
|
|
|
+ showField:'',
|
|
|
+ ralationType:'one'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ formDialog:{
|
|
|
+ show:false,
|
|
|
+ row:'',
|
|
|
+ searchList: '',
|
|
|
+ data:''
|
|
|
+ },
|
|
|
+ codeDialog:{
|
|
|
+ show:false,
|
|
|
+ row:[],
|
|
|
+ },
|
|
|
+ formatter:{
|
|
|
+ text:__('文本'),
|
|
|
+ image:__('图片'),
|
|
|
+ images:__('多图'),
|
|
|
+ date:__('日期'),
|
|
|
+ datetime:__('日期时间'),
|
|
|
+ tag:__('标签'),
|
|
|
+ tags:__('多标签'),
|
|
|
+ switch:__('开关'),
|
|
|
+ select:__('下拉框'),
|
|
|
+ link:__('链接'),
|
|
|
+ html:__('HTML'),
|
|
|
+ slot:__('自定义插槽'),
|
|
|
+ },
|
|
|
+ short:{
|
|
|
+ table:[
|
|
|
+ {key:'=',label:__('单行文本框,field等于输入值')},
|
|
|
+ {key:'<>',label:__('单行文本框,field不等于输入值')},
|
|
|
+ {key:'like',label:__('单行文本框,field文本包含输入值')},
|
|
|
+ {key:'not like',label:__('单行文本框,field文本不包含输入值')},
|
|
|
+ {key:'null',label:__('隐藏过滤器,field字段为空值')},
|
|
|
+ {key:'not null',label:__('隐藏过滤器,field字段为非空值')},
|
|
|
+ {key:'select',label:__('下拉框(单选),field等于选项')},
|
|
|
+ {key:'selects',label:__('下拉框(多选),field包含于选项,如2包含于[1,2,3]')},
|
|
|
+ {key:'checkbox',label:__('多选输入框,field包含于选项,,如2包含于[1,2,3]')},
|
|
|
+ {key:'radio',label:__('单选输入框,field等于选项')},
|
|
|
+ {key:'find_in_set',label:__('下拉框(单选),field文本包含选项,如“1,2,3”包含2')},
|
|
|
+ {key:'between',label:__('并排输入框,field介于两个数字之间')},
|
|
|
+ {key:'not between',label:__('并排输入框,field介于两个数字之外')},
|
|
|
+ {key:'date',label:__('日期选择框,field等于选项')},
|
|
|
+ {key:'datetime',label:__('日期+时间选择框,field等于选项')},
|
|
|
+ {key:'daterange',label:__('日期区间选择框,field介于两个日期之间')},
|
|
|
+ {key:'time',label:__('时间选择框,field等于选项')},
|
|
|
+ {key:'timerange',label:__('时间区间选择框,field介于两个时间之间')},
|
|
|
+ {key:'selectpage',label:__('关联表分页选择框,field等于表的keyField')},
|
|
|
+ {key:'cascader',label:__('多级树形选择框,field等于最后一级的id')},
|
|
|
+ {key:'area',label:__('省/市/区县选择框,field等于最后一级的id')},
|
|
|
+ {key:'category',label:__('分类表category选择框,field等于最后一级的id')}
|
|
|
+ ],
|
|
|
+ form:[
|
|
|
+ {key:'hidden',label:__('隐藏表单')},
|
|
|
+ {key:'text',label:__('单行文本输入框')},
|
|
|
+ {key:'number',label:__('数字输入框')},
|
|
|
+ {key:'readonly',label:__('单行只读文本输入框')},
|
|
|
+ {key:'password',label:__('密码输入框')},
|
|
|
+ {key:'textarea',label:__('多行文本输入框')},
|
|
|
+ {key:'editor',label:__('富文本输入框')},
|
|
|
+ {key:'select',label:__('下拉框(单选)')},
|
|
|
+ {key:'selects',label:__('下拉框(多选)')},
|
|
|
+ {key:'radio',label:__('单选框')},
|
|
|
+ {key:'checkbox',label:__('复选框')},
|
|
|
+ {key:'switch',label:__('开关')},
|
|
|
+ {key:'date',label:__('选择日期')},
|
|
|
+ {key:'datetime',label:__('选择日期+时间')},
|
|
|
+ {key:'daterange',label:__('选择日期区间')},
|
|
|
+ {key:'time',label:__('选择时间')},
|
|
|
+ {key:'timerange',label:__('选择时间区间')},
|
|
|
+ {key:'selectpage',label:__('关联表分页选择框')},
|
|
|
+ {key:'cascader',label:__('多级树形选择框')},
|
|
|
+ {key:'image',label:__('选择单张图片')},
|
|
|
+ {key:'images',label:__('选择多张图片')},
|
|
|
+ {key:'file',label:__('选择单个文件')},
|
|
|
+ {key:'files',label:__('选择多个文件')},
|
|
|
+ {key:'fieldlist',label:__('JSON输入框')},
|
|
|
+ {key:'area',label:__('选择省/市/区县')},
|
|
|
+ {key:'category',label:__('分类表category选择框')},
|
|
|
+ {key:'slot',label:__('自定义插槽')},
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ formtype:{
|
|
|
+ table:[
|
|
|
+ {key:'hidden',label:__('隐藏表单')},
|
|
|
+ {key:'input',label:__('文本输入框')},
|
|
|
+ {key:'select',label:__('下拉框')},
|
|
|
+ {key:'radio',label:__('单选框')},
|
|
|
+ {key:'checkbox',label:__('复选框')},
|
|
|
+ {key:'between',label:__('并排输入框')},
|
|
|
+ {key:'date-picker',label:__('日期选择框')},
|
|
|
+ {key:'time-picker',label:__('时间选择框')},
|
|
|
+ {key:'cascader',label:__('多级树形选择框')},
|
|
|
+ {key:'selectpage',label:__('关联表分页选择框')},
|
|
|
+ ],
|
|
|
+ form:[
|
|
|
+ {key:'input',label:__('文本输入框')},
|
|
|
+ {key:'select',label:__('下拉框')},
|
|
|
+ {key:'radio',label:__('单选框')},
|
|
|
+ {key:'checkbox',label:__('复选框')},
|
|
|
+ {key:'editor',label:__('富文本输入框')},
|
|
|
+ {key:'switch',label:__('开关')},
|
|
|
+ {key:'date-picker',label:__('日期选择框')},
|
|
|
+ {key:'time-picker',label:__('时间选择框')},
|
|
|
+ {key:'cascader',label:__('多级树形选择框')},
|
|
|
+ {key:'selectpage',label:__('关联表分页选择框')},
|
|
|
+ {key:'attachment',label:__('相册')},
|
|
|
+ {key:'files',label:__('上传文件')},
|
|
|
+ {key:'fieldlist',label:__('输入JSON')},
|
|
|
+ {key:'slot',label:__('自定义插槽')},
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ filter:[
|
|
|
+ {key:'=',label:__('等于')},
|
|
|
+ {key:'<>',label:__('不等于')},
|
|
|
+ {key:'>',label:__('大于')},
|
|
|
+ {key:'>=',label:__('大于等于')},
|
|
|
+ {key:'<',label:__('小于')},
|
|
|
+ {key:'<=',label:__('小于等于')},
|
|
|
+ {key:'< TIME',label:__('早于')},
|
|
|
+ {key:'<= TIME',label:__('早于等于')},
|
|
|
+ {key:'> TIME',label:__('晚于')},
|
|
|
+ {key:'>= TIME',label:__('晚于等于')},
|
|
|
+ {key:'BETWEEN TIME',label:__('时间介于')},
|
|
|
+ {key:'NOT BETWEEN TIME',label:__('时间不介于')},
|
|
|
+ {key:'LIKE',label:__('包含字符')},
|
|
|
+ {key:'NOT LIKE',label:__('不包含字符')},
|
|
|
+ {key:'FIND_IN_SET',label:__('序列包含')},
|
|
|
+ {key:'NOT FIND_IN_SET',label:__('序列不包含')},
|
|
|
+ {key:'IN',label:__('包含于数组')},
|
|
|
+ {key:'NOT IN',label:__('不包含于数组')},
|
|
|
+ {key:'BETWEEN',label:__('介于')},
|
|
|
+ {key:'NOT BETWEEN',label:__('不介于')},
|
|
|
+ {key:'IS NULL',label:__('为空')},
|
|
|
+ {key:'IS NOT NULL',label:__('不为空')},
|
|
|
+ ],
|
|
|
+ tableData:'',
|
|
|
+ crudForm:{
|
|
|
+ table:'',
|
|
|
+ controller:'',
|
|
|
+ model:'',
|
|
|
+ reduced:false,
|
|
|
+ isTree:false,
|
|
|
+ treeTitle:'',
|
|
|
+ pagination:false,
|
|
|
+ summary:false,
|
|
|
+ expand:false,
|
|
|
+ tabs:'',
|
|
|
+ actionList:'',
|
|
|
+ recyclebin:false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ inArray:inArray,
|
|
|
+ havaPid:function (){
|
|
|
+ if(!this.tableData){
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ for(let k in this.tableData){
|
|
|
+ if(this.tableData[k].field=='pid'){
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return false;
|
|
|
+ },
|
|
|
+ changeTable:function (table){
|
|
|
+ this.crudForm.table=table;
|
|
|
+ Yunqi.ajax.get('develop/getFields',{table:table}).then(res=>{
|
|
|
+ this.fields=res;
|
|
|
+ this.parseAction();
|
|
|
+ this.parseController();
|
|
|
+ this.parseModel();
|
|
|
+ this.parseTable();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ parseTable:function (){
|
|
|
+ this.tableData='';
|
|
|
+ let list=[];
|
|
|
+ for(let k in this.fields){
|
|
|
+ let item=this.fields[k];
|
|
|
+ let obj={
|
|
|
+ field:item.name,
|
|
|
+ title:this.parseTitle(item),
|
|
|
+ type:item.type,
|
|
|
+ visible:this.parseVisible(item),
|
|
|
+ formatter:this.parseFormatter(item),
|
|
|
+ operate:'',
|
|
|
+ searchList:'',
|
|
|
+ relation:'',
|
|
|
+ sortable:[],
|
|
|
+ search:[],
|
|
|
+ edit:'',
|
|
|
+ rules:'',
|
|
|
+ recyclebin:[]
|
|
|
+ };
|
|
|
+ this.parseFields(obj);
|
|
|
+ list.push(obj);
|
|
|
+ }
|
|
|
+ Vue.nextTick(()=>{
|
|
|
+ this.tableData=list;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ parseTitle:function (row){
|
|
|
+ if(row.title){
|
|
|
+ return row.title;
|
|
|
+ }
|
|
|
+ if(row.name=='deletetime'){
|
|
|
+ return __('删除时间');
|
|
|
+ }
|
|
|
+ if(row.name=='createtime'){
|
|
|
+ return __('创建时间');
|
|
|
+ }
|
|
|
+ if(row.name=='updatetime'){
|
|
|
+ return __('修改时间');
|
|
|
+ }
|
|
|
+ if(row.name=='pid'){
|
|
|
+ return __('父级');
|
|
|
+ }
|
|
|
+ if(row.name=='status'){
|
|
|
+ return __('状态');
|
|
|
+ }
|
|
|
+ if(row.name=='id'){
|
|
|
+ return __('ID');
|
|
|
+ }
|
|
|
+ if(row.name=='weigh'){
|
|
|
+ return __('权重');
|
|
|
+ }
|
|
|
+ return row.name;
|
|
|
+ },
|
|
|
+ parseController:function (){
|
|
|
+ let table=this.crudForm.table.replace(Yunqi.data.tablePrefix,'');
|
|
|
+ table=table.replace(table[0],table[0].toUpperCase());
|
|
|
+ table=table.replace(/_([a-z])/g,function (all,letter){
|
|
|
+ return letter.toUpperCase();
|
|
|
+ });
|
|
|
+ this.crudForm.controller='app\\admin\\controller\\'+table;
|
|
|
+ },
|
|
|
+ parseModel:function (){
|
|
|
+ let table=this.crudForm.table.replace(Yunqi.data.tablePrefix,'');
|
|
|
+ table=table.replace(table[0],table[0].toUpperCase());
|
|
|
+ table=table.replace(/_([a-z])/g,function (all,letter){
|
|
|
+ return letter.toUpperCase();
|
|
|
+ });
|
|
|
+ this.crudForm.model='app\\common\\model\\'+table;
|
|
|
+ },
|
|
|
+ parseAction:function (){
|
|
|
+ this.crudForm.actionList='';
|
|
|
+ let list={index:__('查看'),add:__('添加'),edit:__('编辑'),multi:__('更新'),del:__('删除'),import:__('导入'),download:__('下载')};
|
|
|
+ for(let k in this.fields){
|
|
|
+ let item=this.fields[k];
|
|
|
+ if(item.name=='deletetime'){
|
|
|
+ list.recyclebin=__('回收站');
|
|
|
+ this.crudForm.recyclebin=true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ Vue.nextTick(()=>{
|
|
|
+ this.crudForm.actionList=list;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ parseFormatter:function (row){
|
|
|
+ if(row.name.endsWith('time')){
|
|
|
+ return 'datetime';
|
|
|
+ }
|
|
|
+ let image=isImage(row.name);
|
|
|
+ if(image){
|
|
|
+ return image;
|
|
|
+ }
|
|
|
+ if(row.name=='status'){
|
|
|
+ return 'switch';
|
|
|
+ }
|
|
|
+ if(row.type=='tinyint'){
|
|
|
+ return 'select';
|
|
|
+ }
|
|
|
+ return 'text';
|
|
|
+ },
|
|
|
+ parseVisible:function (row){
|
|
|
+ if(row.name=='deletetime'){
|
|
|
+ return 'none';
|
|
|
+ }
|
|
|
+ if(row.name=='updatetime'){
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ return true;
|
|
|
+ },
|
|
|
+ parseFields:function (obj){
|
|
|
+ obj.operate=this.parseOperate(obj);
|
|
|
+ obj.searchList=this.parseSearchList(obj);
|
|
|
+ obj.edit=this.parseEdit(obj);
|
|
|
+ obj.rules=this.parseRules(obj);
|
|
|
+ },
|
|
|
+ parseEdit:function (row){
|
|
|
+ if(row.field=='id'){
|
|
|
+ return 'hidden';
|
|
|
+ }
|
|
|
+ if(row.field=='pid'){
|
|
|
+ return 'slot';
|
|
|
+ }
|
|
|
+ if(row.field=='createtime' || row.field=='updatetime' || row.field=='deletetime'){
|
|
|
+ return '';
|
|
|
+ }
|
|
|
+ let image=isImage(row.field);
|
|
|
+ if(image){
|
|
|
+ return image;
|
|
|
+ }
|
|
|
+ if(row.field=='status'){
|
|
|
+ return 'switch';
|
|
|
+ }
|
|
|
+ if(row.searchList){
|
|
|
+ return 'select';
|
|
|
+ }
|
|
|
+ if(row.type=='tinyint' || row.type=='int'){
|
|
|
+ return 'number';
|
|
|
+ }
|
|
|
+ return 'text';
|
|
|
+ },
|
|
|
+ parseRules:function (row){
|
|
|
+ if(row.edit=='hidden' || !row.edit){
|
|
|
+ return '';
|
|
|
+ }
|
|
|
+ if(row.field=='pid'){
|
|
|
+ return 'required';
|
|
|
+ }
|
|
|
+ if(row.field=='status' || row.type=='int'){
|
|
|
+ return '';
|
|
|
+ }
|
|
|
+ return 'required';
|
|
|
+ },
|
|
|
+ parseOperate:function (row){
|
|
|
+ if(row.field=='pid' || row.field=='id'){
|
|
|
+ return '';
|
|
|
+ }
|
|
|
+ if(row.formatter=='text'){
|
|
|
+ return '=';
|
|
|
+ }
|
|
|
+ if(row.formatter=='date'){
|
|
|
+ return 'date';
|
|
|
+ }
|
|
|
+ if(row.formatter=='datetime'){
|
|
|
+ return 'daterange';
|
|
|
+ }
|
|
|
+ if(row.formatter=='tag'){
|
|
|
+ return 'like';
|
|
|
+ }
|
|
|
+ if(row.formatter=='tags'){
|
|
|
+ return 'find_in_set';
|
|
|
+ }
|
|
|
+ if(row.formatter=='switch' || row.formatter=='select'){
|
|
|
+ return 'select';
|
|
|
+ }
|
|
|
+ return '';
|
|
|
+ },
|
|
|
+ parseSearchList:function (row){
|
|
|
+ let r='';
|
|
|
+ if(row.visible=='none'){
|
|
|
+ return r;
|
|
|
+ }
|
|
|
+ if(row.formatter=='switch' || row.formatter=='select'){
|
|
|
+ if(row.field=='status'){
|
|
|
+ r={'normal':__('正常'),'hidden':__('隐藏')};
|
|
|
+ }else if(row.type=='tinyint' || row.type=='int'){
|
|
|
+ r={'1':__('是'),'0':__('否')};
|
|
|
+ }else{
|
|
|
+ r={'key1':'选项1','key2':'选项2'};
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(!r && (
|
|
|
+ row.operate=='SELECT' ||
|
|
|
+ row.operate=='SELECTS' ||
|
|
|
+ row.operate=='RADIO' ||
|
|
|
+ row.operate=='FIND_IN_SET' ||
|
|
|
+ row.operate=='CHECKBOX')
|
|
|
+ ){
|
|
|
+ r={'key1':'选项1','key2':'选项2'};
|
|
|
+ }
|
|
|
+ if(r){
|
|
|
+ r=JSON.stringify(r);
|
|
|
+ }
|
|
|
+ return r;
|
|
|
+ },
|
|
|
+ parseOperateForm:function (){
|
|
|
+ let data=this.operateDialog.data;
|
|
|
+ let showFilter=[];
|
|
|
+ let form=data.form;
|
|
|
+ switch (form){
|
|
|
+ case 'hidden':
|
|
|
+ showFilter='all';
|
|
|
+ break;
|
|
|
+ case 'input':
|
|
|
+ if(!inArray(['text','number','password','color'],data.type)){
|
|
|
+ data.type='text';
|
|
|
+ }
|
|
|
+ showFilter=['=','<>','>','>=','<','<=','LIKE','NOT LIKE','FIND_IN_SET','NOT FIND_IN_SET'];
|
|
|
+ break;
|
|
|
+ case 'select':
|
|
|
+ case 'cascader':
|
|
|
+ case 'selectpage':
|
|
|
+ if(data.multiple){
|
|
|
+ showFilter=['IN','NOT IN'];
|
|
|
+ }else{
|
|
|
+ showFilter=['=','<>','>','>=','<','<=','LIKE','NOT LIKE','FIND_IN_SET','NOT FIND_IN_SET'];
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 'radio':
|
|
|
+ showFilter=['=','<>','>','>=','<','<=','LIKE','NOT LIKE','FIND_IN_SET','NOT FIND_IN_SET'];
|
|
|
+ break;
|
|
|
+ case 'checkbox':
|
|
|
+ showFilter=['IN','NOT IN'];
|
|
|
+ break;
|
|
|
+ case 'between':
|
|
|
+ showFilter=['BETWEEN','NOT BETWEEN'];
|
|
|
+ break;
|
|
|
+ case 'date-picker':
|
|
|
+ if(!inArray(['date','datetime','daterange'],data.type)){
|
|
|
+ data.type='date';
|
|
|
+ }
|
|
|
+ if(data.type=='date' || data.type=='datetime'){
|
|
|
+ showFilter=['=','< TIME','<= TIME','> TIME','>= TIME'];
|
|
|
+ }
|
|
|
+ if(data.type=='daterange'){
|
|
|
+ showFilter=['BETWEEN TIME','NOT BETWEEN TIME'];
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 'time-picker':
|
|
|
+ if(!inArray(['time','timerange'],data.type)){
|
|
|
+ data.type='time';
|
|
|
+ }
|
|
|
+ if(data.type=='time'){
|
|
|
+ showFilter=['=','< TIME','<= TIME','> TIME','>= TIME'];
|
|
|
+ }
|
|
|
+ if(data.type=='timerange'){
|
|
|
+ showFilter=['BETWEEN TIME','NOT BETWEEN TIME'];
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ this.operateDialog.searchList='';
|
|
|
+ if(form=='checkbox' || form=='select' || form=='radio'){
|
|
|
+ Vue.nextTick(()=>{
|
|
|
+ let searchList=this.operateDialog.row.searchList?JSON.parse(this.operateDialog.row.searchList): {};
|
|
|
+ this.operateDialog.searchList=searchList;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.operateDialog.filter=this.parseFilter(showFilter);
|
|
|
+ },
|
|
|
+ parseFilter:function (arr){
|
|
|
+ if(arr=='all'){
|
|
|
+ return this.filter;
|
|
|
+ }else{
|
|
|
+ let filter=[];
|
|
|
+ for(let i=0;i<this.filter.length;i++){
|
|
|
+ if(inArray(arr,this.filter[i].key)){
|
|
|
+ filter.push(this.filter[i]);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return filter;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ showOperate:function (row){
|
|
|
+ this.operateDialog.row=row;
|
|
|
+ let obj={
|
|
|
+ short:row.operate,
|
|
|
+ form:'',
|
|
|
+ type:'',
|
|
|
+ filter:'',
|
|
|
+ placeholder:'',
|
|
|
+ size:'default',
|
|
|
+ append:'',
|
|
|
+ prepend:'',
|
|
|
+ value:'',
|
|
|
+ url:'',
|
|
|
+ labelField:'name',
|
|
|
+ keyField:'id',
|
|
|
+ cascaderType:'url',
|
|
|
+ options:'',
|
|
|
+ level:2,
|
|
|
+ multiple:0
|
|
|
+ };
|
|
|
+ if(row.operate.startsWith("{") && row.operate.endsWith("}")){
|
|
|
+ let operate=JSON.parse(row.operate);
|
|
|
+ if(operate.multiple){
|
|
|
+ operate.multiple=1;
|
|
|
+ }
|
|
|
+ this.operateDialog.data=Object.assign(obj,operate);
|
|
|
+ }else{
|
|
|
+ this.operateDialog.data=obj;
|
|
|
+ parseShort(this.operateDialog.data);
|
|
|
+ this.parseOperateForm();
|
|
|
+ }
|
|
|
+ this.operateDialog.show=true;
|
|
|
+ },
|
|
|
+ changeShort:function (type){
|
|
|
+ if(type=='table'){
|
|
|
+ this.operateDialog.data.value='';
|
|
|
+ parseShort(this.operateDialog.data);
|
|
|
+ this.parseOperateForm();
|
|
|
+ }
|
|
|
+ if(type=='form'){
|
|
|
+ this.formDialog.data.value='';
|
|
|
+ this.formDialog.data.readonly=0;
|
|
|
+ parseShort(this.formDialog.data);
|
|
|
+ this.parseForm();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ changeForm:function (type){
|
|
|
+ if(type=='table'){
|
|
|
+ this.parseOperateForm();
|
|
|
+ this.operateDialog.data.value='';
|
|
|
+ this.operateDialog.data.filter=this.operateDialog.filter[0].key;
|
|
|
+ if(this.operateDialog.data.form=='select' || this.operateDialog.data.form=='selectpage' || this.operateDialog.data.form=='cascader'){
|
|
|
+ if(this.operateDialog.data.multiple){
|
|
|
+ this.operateDialog.data.value='[]';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(this.operateDialog.data.form=='date-picker' || this.operateDialog.data.form=='time-picker'){
|
|
|
+ if(this.operateDialog.data.type=='daterange' || this.operateDialog.data.type=='timerange'){
|
|
|
+ this.operateDialog.data.value='[]';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(this.operateDialog.data.form=='checkbox' || this.operateDialog.data.form=='between'){
|
|
|
+ this.operateDialog.data.value='[]';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(type=='form'){
|
|
|
+ this.parseForm();
|
|
|
+ this.formDialog.data.value='';
|
|
|
+ if(this.formDialog.data.form=='select' || this.formDialog.data.form=='selectpage' || this.formDialog.data.form=='cascader'){
|
|
|
+ if(this.formDialog.data.multiple){
|
|
|
+ this.formDialog.data.value='[]';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(this.formDialog.data.form=='date-picker' || this.formDialog.data.form=='time-picker'){
|
|
|
+ if(this.formDialog.data.type=='daterange' || this.formDialog.data.type=='timerange'){
|
|
|
+ this.formDialog.data.value='[]';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(this.formDialog.data.form=='checkbox'){
|
|
|
+ this.formDialog.data.value='[]';
|
|
|
+ }
|
|
|
+ if(this.formDialog.data.form=='fieldlist'){
|
|
|
+ this.formDialog.data.value='{}';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ parseForm:function (){
|
|
|
+ let data=this.formDialog.data;
|
|
|
+ let form=data.form;
|
|
|
+ this.formDialog.searchList='';
|
|
|
+ if(form=='input' && !inArray(['text','number','hidden','textarea','password','color'],data.type)){
|
|
|
+ data.type='text';
|
|
|
+ }
|
|
|
+ if(form=='date-picker' && !inArray(['date','datetime','daterange'],data.type)){
|
|
|
+ data.type='date';
|
|
|
+ }
|
|
|
+ if(form=='time-picker' && !inArray(['time','timerange'],data.type)){
|
|
|
+ data.type='time';
|
|
|
+ }
|
|
|
+ if(form=='checkbox' || form=='select' || form=='radio'){
|
|
|
+ Vue.nextTick(()=>{
|
|
|
+ let searchList=this.formDialog.row.searchList?JSON.parse(this.formDialog.row.searchList): {};
|
|
|
+ this.formDialog.searchList=searchList;
|
|
|
+ });
|
|
|
+
|
|
|
+ }else if(form=='switch'){
|
|
|
+ Vue.nextTick(()=>{
|
|
|
+ let json={'normal':'正常','hidden':'隐藏'};
|
|
|
+ data.value='normal';
|
|
|
+ let type=this.formDialog.row.type;
|
|
|
+ if(type=='int'){
|
|
|
+ json={'0':'否','1':'是'};
|
|
|
+ data.value='1';
|
|
|
+ }
|
|
|
+ let searchList=this.formDialog.row.searchList?JSON.parse(this.formDialog.row.searchList):json;
|
|
|
+ this.formDialog.searchList=searchList;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ confirmFilter:function (){
|
|
|
+ let data=this.operateDialog.data;
|
|
|
+ let row=this.operateDialog.row;
|
|
|
+ let field=[];
|
|
|
+ switch (data.form){
|
|
|
+ case 'hidden':
|
|
|
+ field=['form','filter','value'];
|
|
|
+ break;
|
|
|
+ case 'input':
|
|
|
+ field=['form','type','filter','placeholder','size','append','prepend','value'];
|
|
|
+ break;
|
|
|
+ case 'select':
|
|
|
+ field=['form','filter','placeholder','size','value','multiple'];
|
|
|
+ break;
|
|
|
+ case 'cascader':
|
|
|
+ if(data.cascaderType=='url'){
|
|
|
+ field=['form','filter','placeholder','size','value','url','level','multiple'];
|
|
|
+ }
|
|
|
+ if(data.cascaderType=='options'){
|
|
|
+ field=['form','filter','placeholder','size','value','options','multiple'];
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 'selectpage':
|
|
|
+ field=['form','filter','placeholder','size','value','url','labelField','keyField','multiple'];
|
|
|
+ break;
|
|
|
+ case 'radio':
|
|
|
+ field=['form','filter','size','value'];
|
|
|
+ break;
|
|
|
+ case 'checkbox':
|
|
|
+ field=['form','filter','size','value'];
|
|
|
+ break;
|
|
|
+ case 'between':
|
|
|
+ field=['form','filter','size','value'];
|
|
|
+ break;
|
|
|
+ case 'date-picker':
|
|
|
+ field=['form','type','placeholder','filter','size','value'];
|
|
|
+ break;
|
|
|
+ case 'time-picker':
|
|
|
+ field=['form','type','placeholder','filter','size','value'];
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ let r={};
|
|
|
+ for(let key in data){
|
|
|
+ if(inArray(field,key)){
|
|
|
+ if(!data[key]){
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+ if(key=='multiple'){
|
|
|
+ if(!data[key]){
|
|
|
+ continue;
|
|
|
+ }else{
|
|
|
+ data[key]=true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(key=='size' && data[key]=='default'){
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+ r[key]=data[key];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ row.operate=JSON.stringify(r);
|
|
|
+ if(this.operateDialog.searchList && Object.keys(this.operateDialog.searchList).length>0){
|
|
|
+ row.searchList=JSON.stringify(this.operateDialog.searchList);
|
|
|
+ }else{
|
|
|
+ row.searchList='';
|
|
|
+ }
|
|
|
+ this.operateDialog.show=false;
|
|
|
+ },
|
|
|
+ changeSearchList:function (row){
|
|
|
+ if(row.field=='searchlist'){
|
|
|
+ this.searchListDialog.searchList=row.value;
|
|
|
+ }
|
|
|
+ if(row.field=='operate'){
|
|
|
+ this.operateDialog.searchList=row.value;
|
|
|
+ }
|
|
|
+ if(row.field=='form'){
|
|
|
+ this.formDialog.searchList=row.value;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ showSearchList:function (row){
|
|
|
+ this.searchListDialog.searchList='';
|
|
|
+ Vue.nextTick(()=>{
|
|
|
+ this.searchListDialog.searchList=row.searchList?JSON.parse(row.searchList): {};
|
|
|
+ });
|
|
|
+ this.searchListDialog.row=row;
|
|
|
+ this.searchListDialog.show=true;
|
|
|
+ },
|
|
|
+ confirmSearchList:function (){
|
|
|
+ let row= this.searchListDialog.row;
|
|
|
+ if(this.searchListDialog.searchList && Object.keys(this.searchListDialog.searchList).length>0){
|
|
|
+ row.searchList=JSON.stringify(this.searchListDialog.searchList);
|
|
|
+ }else{
|
|
|
+ row.searchList='';
|
|
|
+ }
|
|
|
+ this.searchListDialog.show=false;
|
|
|
+ },
|
|
|
+ showRelation:function (row){
|
|
|
+ this.relationDialog.row=row;
|
|
|
+ this.relationDialog.show=true;
|
|
|
+ },
|
|
|
+ changeRelationTable:function (table){
|
|
|
+ this.relationDialog.data.table=table;
|
|
|
+ Yunqi.ajax.get('develop/getFields',{table:table}).then(res=>{
|
|
|
+ this.relationDialog.fields=res;
|
|
|
+ this.relationDialog.data.relationField=res[0].name;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ confirmRelation:function (){
|
|
|
+ let row=this.relationDialog.row;
|
|
|
+ let data=this.relationDialog.data;
|
|
|
+ for(let k in data){
|
|
|
+ if(!data[k]){
|
|
|
+ Yunqi.message.error(__('每一项都必须填写完整'));
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ row.relation=JSON.stringify(data);
|
|
|
+ if(row.operate.startsWith('{') && row.operate.endsWith('}')){
|
|
|
+ let operate=JSON.parse(row.operate);
|
|
|
+ let table=data.table.replace(Yunqi.data.tablePrefix,'');
|
|
|
+ operate.name=table+'.'+data.filterField;
|
|
|
+ row.operate=JSON.stringify(operate);
|
|
|
+ }else{
|
|
|
+ let obj={
|
|
|
+ short:row.operate
|
|
|
+ };
|
|
|
+ parseShort(obj);
|
|
|
+ let table=data.table.replace(Yunqi.data.tablePrefix,'');
|
|
|
+ obj.name=table+'.'+data.filterField;
|
|
|
+ delete obj.short;
|
|
|
+ row.operate=JSON.stringify(obj);
|
|
|
+ }
|
|
|
+ this.relationDialog.show=false;
|
|
|
+ this.relationDialog.data={
|
|
|
+ table:'',
|
|
|
+ relationField:'',
|
|
|
+ filterField:'',
|
|
|
+ showField:'',
|
|
|
+ ralationType:'one'
|
|
|
+ };
|
|
|
+ },
|
|
|
+ showFormDialog:function (row){
|
|
|
+ this.formDialog.row=row;
|
|
|
+ let obj={
|
|
|
+ short:row.edit,
|
|
|
+ form:'',
|
|
|
+ type:'',
|
|
|
+ placeholder:'',
|
|
|
+ append:'',
|
|
|
+ prepend:'',
|
|
|
+ readonly:0,
|
|
|
+ value:'',
|
|
|
+ url:'',
|
|
|
+ labelField:'name',
|
|
|
+ keyField:'id',
|
|
|
+ cascaderType:'url',
|
|
|
+ options:'',
|
|
|
+ level:2,
|
|
|
+ width:'100%',
|
|
|
+ height:'400px',
|
|
|
+ limit:1,
|
|
|
+ disks:'local_public',
|
|
|
+ accept:getAccept(),
|
|
|
+ multiple:0,
|
|
|
+ label:['键名','键值']
|
|
|
+ };
|
|
|
+ if(row.edit.startsWith("{") && row.edit.endsWith("}")){
|
|
|
+ let edit=JSON.parse(row.edit);
|
|
|
+ if(edit.multiple){
|
|
|
+ edit.multiple=1;
|
|
|
+ }
|
|
|
+ if(edit.readonly){
|
|
|
+ edit.readonly=1;
|
|
|
+ }
|
|
|
+ this.formDialog.data=Object.assign(obj,edit);
|
|
|
+ }else{
|
|
|
+ this.formDialog.data=obj;
|
|
|
+ parseShort(this.formDialog.data);
|
|
|
+ this.parseForm();
|
|
|
+ }
|
|
|
+ this.formDialog.show=true;
|
|
|
+ },
|
|
|
+ confirmForm:function (){
|
|
|
+ let data=this.formDialog.data;
|
|
|
+ let row=this.formDialog.row;
|
|
|
+ let field=[];
|
|
|
+ switch (data.form){
|
|
|
+ case 'input':
|
|
|
+ field=['form','type','placeholder','append','prepend','readonly','value'];
|
|
|
+ break;
|
|
|
+ case 'select':
|
|
|
+ field=['form','placeholder','placeholder','value','multiple'];
|
|
|
+ break;
|
|
|
+ case 'radio':
|
|
|
+ case 'checkbox':
|
|
|
+ case 'switch':
|
|
|
+ field=['form','value'];
|
|
|
+ break;
|
|
|
+ case 'editor':
|
|
|
+ field=['form','width','height','value'];
|
|
|
+ break;
|
|
|
+ case 'date-picker':
|
|
|
+ case 'time-picker':
|
|
|
+ field=['form','type','placeholder','value'];
|
|
|
+ break;
|
|
|
+ case 'cascader':
|
|
|
+ if(data.cascaderType=='url'){
|
|
|
+ field=['form','placeholder','url','level','multiple','value'];
|
|
|
+ }
|
|
|
+ if(data.cascaderType=='options'){
|
|
|
+ field=['form','placeholder','options','multiple','value'];
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 'selectpage':
|
|
|
+ field=['form','placeholder','url','labelField','keyField','multiple','value'];
|
|
|
+ break;
|
|
|
+ case 'attachment':
|
|
|
+ field=['form','limit','value'];
|
|
|
+ break;
|
|
|
+ case 'files':
|
|
|
+ if(data.limit>1){
|
|
|
+ data.multiple=1;
|
|
|
+ }
|
|
|
+ field=['form','limit','accept','disks','value','multiple'];
|
|
|
+ break;
|
|
|
+ case 'fieldlist':
|
|
|
+ field=['form','label','value'];
|
|
|
+ break;
|
|
|
+ case 'slot':
|
|
|
+ field=['form'];
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ let r={};
|
|
|
+ for(let key in data){
|
|
|
+ if(inArray(field,key)){
|
|
|
+ if(!data[key]){
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+ if(key=='multiple' || key=='readonly'){
|
|
|
+ if(!data[key]){
|
|
|
+ continue;
|
|
|
+ }else{
|
|
|
+ data[key]=true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ r[key]=data[key];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ row.edit=JSON.stringify(r);
|
|
|
+ if(this.formDialog.searchList && Object.keys(this.formDialog.searchList).length>0){
|
|
|
+ row.searchList=JSON.stringify(this.formDialog.searchList);
|
|
|
+ }else{
|
|
|
+ row.searchList='';
|
|
|
+ }
|
|
|
+ this.formDialog.show=false;
|
|
|
+ },
|
|
|
+ changeAction:function (action){
|
|
|
+ let recyclebin=false;
|
|
|
+ for(let k in action){
|
|
|
+ if(k=='recyclebin'){
|
|
|
+ recyclebin=true;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.crudForm.recyclebin=recyclebin;
|
|
|
+ this.crudForm.actionList=action;
|
|
|
+ },
|
|
|
+ isShowEdit:function (row){
|
|
|
+ if(!row.edit){
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ if(row.edit=='hidden'){
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ if(row.edit.startsWith("{") && row.edit.endsWith("}")){
|
|
|
+ let edit=JSON.parse(row.edit);
|
|
|
+ if(edit.form=='input' && edit.type=='hidden'){
|
|
|
+ return false;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return true;
|
|
|
+ },
|
|
|
+ openIconPanel:function (){
|
|
|
+ this.$refs.checkicon.open();
|
|
|
+ },
|
|
|
+ clear:function (){
|
|
|
+ Yunqi.confirm(__('支持清除一个小时内的操作,你确定要清除吗')).then(res=>{
|
|
|
+ let postdata={
|
|
|
+ table:this.crudForm.table,
|
|
|
+ controller:this.crudForm.controller,
|
|
|
+ model:this.crudForm.model,
|
|
|
+ fields:this.tableData,
|
|
|
+ actionList:this.crudForm.actionList,
|
|
|
+ actions:{table:0,form:0}
|
|
|
+ };
|
|
|
+ Yunqi.ajax.json('develop/clear',postdata,true,true);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ submit:function (type){
|
|
|
+ let postdata={
|
|
|
+ table:this.crudForm.table,
|
|
|
+ controller:this.crudForm.controller,
|
|
|
+ model:this.crudForm.model,
|
|
|
+ reduced:this.crudForm.reduced,
|
|
|
+ actionList:this.crudForm.actionList,
|
|
|
+ fields:this.tableData,
|
|
|
+ isTree:this.crudForm.isTree,
|
|
|
+ treeTitle:this.crudForm.treeTitle,
|
|
|
+ pagination:!this.crudForm.pagination,
|
|
|
+ tabs:this.crudForm.tabs,
|
|
|
+ summary:this.crudForm.summary,
|
|
|
+ expand:this.crudForm.expand,
|
|
|
+ type:type,
|
|
|
+ actions:{
|
|
|
+ table:0,
|
|
|
+ form:0
|
|
|
+ }
|
|
|
+ };
|
|
|
+ if(inArray(this.actions,'table')){
|
|
|
+ postdata.actions.table=1;
|
|
|
+ }
|
|
|
+ if(inArray(this.actions,'form')){
|
|
|
+ postdata.actions.form=1;
|
|
|
+ }
|
|
|
+ Yunqi.ajax.json('develop/crud',postdata,true,true).then(res=>{
|
|
|
+ if(type=='file'){
|
|
|
+ Yunqi.api.addtabs({
|
|
|
+ url:res,
|
|
|
+ title:__('查看'),
|
|
|
+ icon:'fa fa-th-large',
|
|
|
+ });
|
|
|
+ }
|
|
|
+ if(type=='code'){
|
|
|
+ this.codeDialog.row=res;
|
|
|
+ this.codeDialog.show=true;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+ .checklabel{
|
|
|
+ position: relative;top: 2px;cursor: pointer;
|
|
|
+ }
|
|
|
+ .checklabel input{
|
|
|
+ border: var(--el-checkbox-input-border);
|
|
|
+ }
|
|
|
+ .checklabel span{
|
|
|
+ position: relative;top:-2px;left: 5px;
|
|
|
+ }
|
|
|
+</style>
|