232 lines
8.1 KiB
Plaintext
232 lines
8.1 KiB
Plaintext
<!--
|
|
* @Descripttion: (${genTable.functionName}/${genTable.tableName} 详情弹窗)
|
|
* @version: (1.0)
|
|
* @Author: (${replaceDto.Author})
|
|
* @Date: (${replaceDto.AddTime})
|
|
* @LastEditors: (${replaceDto.Author})
|
|
* @LastEditTime: (${replaceDto.AddTime})
|
|
-->
|
|
<template>
|
|
<el-dialog v-model="props.modelValue" title="${genTable.functionName}信息详情" width="900px" @closed="closeDialog" @open="openDialog">
|
|
<el-form ref="formRef" :model="formData" :disabled="true">
|
|
|
|
<el-row :gutter="20">
|
|
|
|
$if(genTable.TplCategory == "tree")
|
|
<el-col :lg="24">
|
|
<el-form-item :label-width="labelWidth" label="上级菜单" prop="${genTable.Options.TreeParentCode}">
|
|
<el-cascader
|
|
class="w100"
|
|
:options="dataList"
|
|
:props="{ checkStrictly: true, value: '${tool.FirstLowerCase(genTable.Options.TreeCode)}', label: '${tool.FirstLowerCase(genTable.Options.TreeName)}', emitPath: false }"
|
|
placeholder="请选择上级菜单"
|
|
clearable
|
|
v-model="formData.${tool.FirstLowerCase(genTable.Options.TreeParentCode)}">
|
|
<template #default="{ node, data }">
|
|
<span>{{ data.${tool.FirstLowerCase(genTable.Options.TreeName)} }}</span>
|
|
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
|
</template>
|
|
</el-cascader>
|
|
</el-form-item>
|
|
</el-col>
|
|
$end
|
|
|
|
$foreach(column in genTable.Columns)
|
|
$set(labelName = "")
|
|
$set(columnName = column.CsharpFieldFl)
|
|
$set(value = "item.dictValue")
|
|
$if(column.ColumnComment != "")
|
|
$set(labelName = column.ColumnComment)
|
|
$else
|
|
$set(labelName = column.CsharpFieldFl)
|
|
$end
|
|
$if(column.CsharpType == "int" || column.CsharpType == "long")
|
|
$set(value = "parseInt(item.dictValue)")
|
|
$end
|
|
|
|
$if(column.IsInit != true && column.IsPk != true)
|
|
$if(column.HtmlType == "inputNumber" || column.HtmlType == "customInput")
|
|
<el-col :lg="12">
|
|
<el-form-item :label-width="labelWidth" label="${labelName}" >
|
|
<el-input-number v-model.number="formData.${columnName}" controls-position="right" :precision="2" ${column.DisabledStr}/>
|
|
</el-form-item>
|
|
</el-col>
|
|
$elseif(column.HtmlType == "datetime")
|
|
<el-col :lg="12">
|
|
<el-form-item :label-width="labelWidth" label="${labelName}" >
|
|
<el-date-picker v-model="formData.${columnName}" type="datetime" :teleported="false" isabledStr}></el-date-picker>
|
|
</el-form-item>
|
|
</el-col>
|
|
$elseif(column.HtmlType == "imageUpload")
|
|
<el-col :lg="12">
|
|
<el-form-item :label-width="labelWidth" label="${labelName}" >
|
|
<UploadImage ref="uploadRef" v-model="formData.${columnName}" :limit="1" :fileSize="5"
|
|
:drag="true" :isShowTip="false" :isDisabled="true"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
$elseif(column.HtmlType == "fileUpload")
|
|
<el-col :lg="12">
|
|
<el-form-item :label-width="labelWidth" label="${labelName}" >
|
|
<UploadFile v-model="formData.${columnName}" :data=imgData :isShowTip="false"/>
|
|
</el-form-item>
|
|
</el-col>
|
|
$elseif(column.HtmlType == "radio")
|
|
<el-col :lg="12">
|
|
<el-form-item :label-width="labelWidth" label="${labelName}" >
|
|
<el-radio-group v-model="formData.${columnName}"${column.DisabledStr}>
|
|
<el-radio v-for="item in $if(column.DictType != "") ${column.DictType} $else ${column.CsharpFieldFl}Options$end" :key="item.dictValue" :label="${value}">{{item.dictLabel}}</el-radio>
|
|
</el-radio-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
$elseif(column.HtmlType == "editor")
|
|
<el-col :lg="24">
|
|
<el-form-item :label-width="labelWidth" label="${labelName}" >
|
|
<editor v-model="formData.${columnName}" :editorConfig="{ readOnly: true }" :min-height="200" />
|
|
</el-form-item>
|
|
</el-col>
|
|
$elseif(column.HtmlType == "select")
|
|
<el-col :lg="12">
|
|
<el-form-item :label-width="labelWidth" label="${labelName}" >
|
|
<el-select v-model="formData.${columnName}" ${column.DisabledStr}>
|
|
<el-option v-for="item in $if(column.DictType != "") ${column.DictType} $else ${column.CsharpFieldFl}Options$end" :key="item.dictValue" :label="item.dictLabel" :value="${value}"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
$elseif(column.HtmlType == "checkbox")
|
|
<el-col :lg="24">
|
|
<el-form-item :label-width="labelWidth" label="${labelName}" >
|
|
<el-checkbox-group v-model="formData.${columnName}Checked"${column.DisabledStr}>
|
|
<el-checkbox v-for="item in $if(column.DictType != "") ${column.DictType} $else ${column.CsharpFieldFl}Options$end" :key="item.dictValue" :label="item.dictValue">{{item.dictLabel}}</el-checkbox>
|
|
</el-checkbox-group>
|
|
</el-form-item>
|
|
</el-col>
|
|
$elseif(column.HtmlType == "textarea")
|
|
<el-col :lg="24">
|
|
<el-form-item :label-width="labelWidth" label="${labelName}" >
|
|
<el-input v-model="formData.${columnName}" type="textarea" :rows="5" placeholder="请输入${labelName}" ${column.DisabledStr}/>
|
|
</el-form-item>
|
|
</el-col>
|
|
$elseif(column.HtmlType == "map")
|
|
<el-col :lg="24">
|
|
<el-form-item :label-width="labelWidth" label="位置" v-model="locationList" style="margin-top: 20px;"></Map>
|
|
</el-form-item>
|
|
</el-col>
|
|
$else
|
|
<el-col :lg="12">
|
|
<el-form-item :label-width="labelWidth" label="${labelName}" >
|
|
<el-input v-model="formData.${columnName}" ${column.DisabledStr}/>
|
|
</el-form-item>
|
|
</el-col>
|
|
$end
|
|
$end
|
|
$end
|
|
|
|
</el-row>
|
|
</el-form>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ElMessage } from 'element-plus'
|
|
import { reactive, ref, watch } from "vue";
|
|
$if(genTable.TplCategory == "tree")
|
|
import { ${tool.FirstLowerCase(genTable.BusinessName)}TreeList } from "@/api/business/${options.SubNamespace}/${tool.FirstLowerCase(genTable.BusinessName)}.js";
|
|
$end
|
|
|
|
|
|
// 打开弹窗时回调
|
|
const openDialog = async () => {
|
|
$foreach(item in genTable.Columns)
|
|
$if(item.DictType != "")
|
|
await get${item.DictType}()
|
|
$end
|
|
$end
|
|
|
|
$foreach(item in genTable.Columns)
|
|
$if(item.HtmlType == "map")
|
|
if (props.data.longitude) {
|
|
locationList.value.address = props.data.${tool.FirstLowerCase(genTable.BusinessName)}Location;
|
|
locationList.value.longitude = props.data.longitude;
|
|
locationList.value.latitude = props.data.latitude;
|
|
}
|
|
$end
|
|
$end
|
|
$if(genTable.TplCategory == "tree")
|
|
await getTreeList()
|
|
$end
|
|
}
|
|
|
|
const formData = ref({
|
|
...props.data,
|
|
});
|
|
watch(props, async (v) => {
|
|
formData.value = v.data;
|
|
});
|
|
|
|
// -业务参数
|
|
$if(genTable.TplCategory == "tree")
|
|
const dataList = ref([])
|
|
$end
|
|
$foreach(item in genTable.Columns)
|
|
$if(item.HtmlType == "map")
|
|
const locationList = ref({})
|
|
$end
|
|
$end
|
|
$foreach(item in genTable.Columns)
|
|
$if(item.DictType != "")
|
|
// ${item.ColumnComment}字典选项列表
|
|
const ${item.DictType} = ref([]);
|
|
$end
|
|
$end
|
|
|
|
// -业务方法
|
|
$foreach(item in genTable.Columns)
|
|
$if(item.IsInit != true)
|
|
$if((item.HtmlType == "radio" || item.HtmlType == "select" || item.HtmlType == "checkbox") && item.DictType == "")
|
|
// ${item.ColumnComment}选项列表
|
|
const ${item.CsharpFieldFl}Options = ref([
|
|
{ dictLabel: '', dictValue: '1' },
|
|
{ dictLabel: '', dictValue: '2' },
|
|
]);
|
|
$end
|
|
$if(item.DictType != "")
|
|
// 字典获取
|
|
async function get${item.DictType}() {
|
|
await proxy.getDicts('${item.DictType}').then((res) => {
|
|
${item.DictType}.value = res.data
|
|
})
|
|
}
|
|
$end
|
|
$end
|
|
$end
|
|
|
|
|
|
|
|
// 基础参数
|
|
const formRef = ref();
|
|
const labelWidth = 100;
|
|
const { proxy } = getCurrentInstance()
|
|
const props = defineProps({
|
|
modelValue: Boolean,
|
|
data: Object,
|
|
done: Function,
|
|
});
|
|
const emits = defineEmits(["update:modelValue"]);
|
|
|
|
|
|
// -基础方法
|
|
$if(genTable.TplCategory == "tree")
|
|
async function getTreeList() {
|
|
${tool.FirstLowerCase(genTable.BusinessName)}TreeList().then((res) => {
|
|
if (res.code == 200) {
|
|
dataList.value = res.data
|
|
}
|
|
})
|
|
}
|
|
$end
|
|
const closeDialog = () => {
|
|
emits("update:modelValue", false);
|
|
};
|
|
|
|
</script>
|