huatao-spc
/
huatao-spc-ui
3
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'master' of http://dev.ccwin-in.com:3000/huatao-spc/huatao-spc-ui

master
songguoqiang 12 months ago
parent
36df8d63f9 1c0214c1f8
commit
1166c78cf9
6 changed files with 219 additions and 133 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 8
      src/components/BasicForm/src/BasicForm.vue
  2. 241
      src/components/Detail/src/TemplateDetails.vue
  3. 11
      src/components/UploadFile/src/Preview.vue
  4. 16
      src/components/UploadFile/src/UploadFile.vue
  5. 4
      src/views/spc/detectiontemplate/index.vue
  6. 72
      src/views/spc/detectiontemplate/templateItemDetails.data.ts

8
src/components/BasicForm/src/BasicForm.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<Dialog :title="dialogTitle" v-model="dialogVisible" :width="isBusiness?'60%':'40%'"> <Dialog :title="dialogTitle" v-model="dialogVisible" :width="width?width:isBusiness?'60%':'40%'">
<Form <Form
ref="formRef" ref="formRef"
v-loading="formLoading" v-loading="formLoading"
@ -108,6 +108,11 @@ const props = defineProps({
// required: false, // required: false,
// default: null // default: null
// }, // },
width:{
type: String,
required: false,
default: ''
},
}) })
const { t } = useI18n() // 国际化 const { t } = useI18n() // 国际化
@ -120,6 +125,7 @@ const formType = ref('') // 表单的类型：create - 新增；update - 修改
const formRef = ref() // 表单 Ref const formRef = ref() // 表单 Ref
const formSchema = ref(props.formAllSchemas?.formSchema) const formSchema = ref(props.formAllSchemas?.formSchema)
const width = ref(props.width)
/** 弹层操作 */ /** 弹层操作 */
// formField form表单中的字段 // formField form表单中的字段

241
src/components/Detail/src/TemplateDetails.vue
View File

@ -1,70 +1,86 @@
<template> <template>
<div> <div>
<el-drawer v-model="isShowDrawer" title="模版检测项" direction="rtl" size="80%" v-loading="detailLoading"> <el-drawer
<!-- <template #header> v-model="isShowDrawer"
title="模版检测项"
direction="rtl"
size="80%"
v-loading="detailLoading"
>
<!-- <template #header>
<div class="font-size-18px"> <div class="font-size-18px">
{{ titleValueRef }} <span class="ml-20px font-size-16px">{{ titleNameRef }}</span> {{ titleValueRef }} <span class="ml-20px font-size-16px">{{ titleNameRef }}</span>
</div> </div>
</template> --> </template> -->
<ContentWrap> <ContentWrap>
<!-- 搜索工作栏 --> <!-- 搜索工作栏 -->
<Search :schema="TemplateItemDetails.allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" /> <Search
</ContentWrap> :schema="TemplateItemDetails.allSchemas.searchSchema"
@search="setSearchParams"
@reset="setSearchParams"
/>
</ContentWrap>
<!-- 列表头部 --> <!-- 列表头部 -->
<TableHead <TableHead
:HeadButttondata="HeadButttondata" :HeadButttondata="HeadButttondata"
@button-base-click="buttonBaseClick" @button-base-click="buttonBaseClick"
:routeName="routeName" :routeName="routeName"
@updataTableColumns="updataTableColumns" @updataTableColumns="updataTableColumns"
@searchFormClick="searchFormClick" @searchFormClick="searchFormClick"
:allSchemas="TemplateItemDetails.allSchemas" :allSchemas="TemplateItemDetails.allSchemas"
/> />
<!-- 列表 --> <!-- 列表 -->
<ContentWrap> <ContentWrap>
<Table <Table
:columns="tableColumns" :columns="tableColumns"
:data="tableObject.tableList" :data="tableObject.tableList"
:loading="tableObject.loading" :loading="tableObject.loading"
:pagination="{ :pagination="{
total: tableObject.total total: tableObject.total
}" }"
v-model:pageSize="tableObject.pageSize" v-model:pageSize="tableObject.pageSize"
v-model:currentPage="tableObject.currentPage" v-model:currentPage="tableObject.currentPage"
v-model:sort="tableObject.sort" v-model:sort="tableObject.sort"
> >
<template #code="{row}"> <template #code="{ row }">
<el-button type="primary" link @click="openDetail(row, '代码', row.code)"> <el-button type="primary" link @click="openDetail(row, '代码', row.code)">
<span>{{ row.code }}</span> <span>{{ row.code }}</span>
</el-button> </el-button>
</template> </template>
<template #action="{ row }"> <template #action="{ row }">
<ButtonBase :Butttondata="butttondata" @button-base-click="buttonTableClick($event,row)" /> <ButtonBase
</template> :Butttondata="butttondata"
</Table> @button-base-click="buttonTableClick($event, row)"
</ContentWrap> />
</template>
</Table>
</ContentWrap>
</el-drawer> </el-drawer>
<!-- 表单弹窗：添加/修改 --> <!-- 表单弹窗：添加/修改 -->
<BasicForm <BasicForm
ref="basicFormRef" ref="basicFormRef"
@success="formsSuccess" @success="formsSuccess"
:rules="TemplateItemDetailsRules" :rules="TemplateItemDetailsRules"
:formAllSchemas="TemplateItemDetails.allSchemas" :formAllSchemas="TemplateItemDetails.allSchemas"
:searchTableParams="searchTableParams" :searchTableParams="searchTableParams"
:apiUpdate="TemplateItemDetailsApi.updateTemplateItemDetails" :apiUpdate="TemplateItemDetailsApi.updateTemplateItemDetails"
:apiCreate="TemplateItemDetailsApi.createTemplateItemDetails" :apiCreate="TemplateItemDetailsApi.createTemplateItemDetails"
@searchTableSuccess="searchTableSuccess" @searchTableSuccess="searchTableSuccess"
:isBusiness="false" :isBusiness="false"
/> :width="width"
/>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
defineOptions({ name: 'TemplateDetailsDetail' }) defineOptions({ name: 'TemplateDetailsDetail' })
import download from '@/utils/download' import download from '@/utils/download'
import { TemplateItemDetails,TemplateItemDetailsRules } from '@/views/spc/detectiontemplate/templateItemDetails.data' import {
TemplateItemDetails,
TemplateItemDetailsRules
} from '@/views/spc/detectiontemplate/templateItemDetails.data'
import * as TemplateItemDetailsApi from '@/api/spc/templateItemDetails' import * as TemplateItemDetailsApi from '@/api/spc/templateItemDetails'
import * as defaultButtons from '@/utils/disposition/defaultButtons' import * as defaultButtons from '@/utils/disposition/defaultButtons'
const message = useMessage() // 消息弹窗 const message = useMessage() // 消息弹窗
@ -72,7 +88,7 @@ const { t } = useI18n() // 国际化
const route = useRoute() // 路由信息 const route = useRoute() // 路由信息
const routeName = ref() const routeName = ref()
const isShowDrawer = ref(false) const isShowDrawer = ref(false)
const templateId = ref("") const templateId = ref('')
// routeName.value = route.name // routeName.value = route.name
// routeName.value = routeName.value.substring(0,routeName.value.length - 4) + 'Detail' // routeName.value = routeName.value.substring(0,routeName.value.length - 4) + 'Detail'
const props = defineProps({ const props = defineProps({
@ -136,48 +152,52 @@ const props = defineProps({
required: false, required: false,
default: null default: null
}, },
width:{
type: String,
required: false,
default: ''
},
}) })
const tableColumns = ref(TemplateItemDetails.allSchemas.tableColumns)
const openDetail = async (row: any, titleName: any, titleValue: any, tableName: any) => { const openDetail = async (row: any, titleName: any, titleValue: any, tableName: any) => {
if(row){ console.log('tableColumns',tableColumns.value)
if (row) {
isShowDrawer.value = true isShowDrawer.value = true
templateId.value = row.id; templateId.value = row.id
let param = { let param = {
templateId:templateId.value templateId: templateId.value
} }
setSearchParams(param); await setSearchParams(param)
} }
} }
defineExpose({ openDetail }) // 提供 open 方法，用于打开弹窗 defineExpose({ openDetail }) // 提供 open 方法，用于打开弹窗
const formsSuccess = async (formType,data) => { const formsSuccess = async (formType, data) => {
data.templateId = templateId.value; data.templateId = templateId.value
if(data.type=='NUMBER'&& data.upLimit<data.downLimit){ if (data.type == 'NUMBER' && data.upLimit < data.downLimit) {
message.error('数值型上限值要大于下限') message.error('数值型上限值要大于下限')
return; return
} }
if(data.activeTime==0)data.activeTime = null; if (data.activeTime == 0) data.activeTime = null
if(data.expireTime==0)data.expireTime = null; if (data.expireTime == 0) data.expireTime = null
if (formType === 'create') { if (formType === 'create') {
await TemplateItemDetailsApi.createTemplateItemDetails(data) await TemplateItemDetailsApi.createTemplateItemDetails(data)
message.success(t('common.createSuccess')) message.success(t('common.createSuccess'))
} else { } else {
await TemplateItemDetailsApi.updateTemplateItemDetails(data) await TemplateItemDetailsApi.updateTemplateItemDetails(data)
message.success(t('common.updateSuccess')) message.success(t('common.updateSuccess'))
} }
basicFormRef.value.dialogVisible = false basicFormRef.value.dialogVisible = false
getList() getList()
} }
//主表所需的参数 //主表所需的参数
const masterParmas=ref({ const masterParmas = ref({
masterId:'',//主表id masterId: '', //主表id
number: '',//主表单据号 number: '', //主表单据号
status: '',//主表状态 用于控制子表新增编辑按钮显示情况 status: '' //主表状态 用于控制子表新增编辑按钮显示情况
}) })
routeName.value = route.name routeName.value = route.name
const tableColumns = ref(TemplateItemDetails.allSchemas.tableColumns)
// 字段设置 更新主列表字段 // 字段设置 更新主列表字段
const updataTableColumns = (val) => { const updataTableColumns = (val) => {
@ -186,12 +206,12 @@ const updataTableColumns = (val) => {
// 查询列表页面参数设置 // 查询列表页面参数设置
const searchTableParams = ref([ const searchTableParams = ref([
//{ //{
// formField: 'productItemCode', // formField: 'productItemCode',
// searchTableTitle: '物料信息', // searchTableTitle: '物料信息',
// searchTableAllSchemas: Itembasic.allSchemas, // searchTableAllSchemas: Itembasic.allSchemas,
// searchTablePage: ItembasicApi.getItembasicPage // searchTablePage: ItembasicApi.getItembasicPage
//} //}
]) ])
const { tableObject, tableMethods } = useTable({ const { tableObject, tableMethods } = useTable({
@ -208,7 +228,7 @@ const HeadButttondata = [
// defaultButtons.defaultExportBtn({hasPermi:'wms:templateItemDetails:export'}), // 导出 // defaultButtons.defaultExportBtn({hasPermi:'wms:templateItemDetails:export'}), // 导出
defaultButtons.defaultFreshBtn(null), // 刷新 defaultButtons.defaultFreshBtn(null), // 刷新
// defaultButtons.defaultFilterBtn(null), // 筛选 // defaultButtons.defaultFilterBtn(null), // 筛选
defaultButtons.defaultSetBtn(null), // 设置 defaultButtons.defaultSetBtn(null) // 设置
// { // {
// label: '自定义扩展按钮', // label: '自定义扩展按钮',
// name: 'zdy', // name: 'zdy',
@ -221,16 +241,22 @@ const HeadButttondata = [
// 头部按钮事件 // 头部按钮事件
const buttonBaseClick = (val, item) => { const buttonBaseClick = (val, item) => {
if (val == 'add') { // 新增 if (val == 'add') {
// 新增
openForm('create') openForm('create')
} else if (val == 'import') { // 导入 } else if (val == 'import') {
// 导入
handleImport() handleImport()
} else if (val == 'export') { // 导出 } else if (val == 'export') {
// 导出
handleExport() handleExport()
} else if (val == 'refresh') { // 刷新 } else if (val == 'refresh') {
// 刷新
getList() getList()
} else if (val == 'filtrate') { // 筛选 } else if (val == 'filtrate') {
} else { // 其他按钮 // 筛选
} else {
// 其他按钮
console.log('其他按钮', item) console.log('其他按钮', item)
} }
} }
@ -238,14 +264,16 @@ const buttonBaseClick = (val, item) => {
// 列表-操作按钮 // 列表-操作按钮
const butttondata = [ const butttondata = [
defaultButtons.mainListEditBtn(null), // 编辑 defaultButtons.mainListEditBtn(null), // 编辑
defaultButtons.mainListDeleteBtn(null), // 删除 defaultButtons.mainListDeleteBtn(null) // 删除
] ]
// 列表-操作按钮事件 // 列表-操作按钮事件
const buttonTableClick = async (val, row) => { const buttonTableClick = async (val, row) => {
if (val == 'edit') { // 编辑 if (val == 'edit') {
// 编辑
openForm('update', row) openForm('update', row)
} else if (val == 'delete') { // 删除 } else if (val == 'delete') {
// 删除
handleDelete(row.id) handleDelete(row.id)
} }
} }
@ -253,6 +281,21 @@ const buttonTableClick = async (val, row) => {
/** 添加/修改操作 */ /** 添加/修改操作 */
const basicFormRef = ref() const basicFormRef = ref()
const openForm = (type: string, row?: any) => { const openForm = (type: string, row?: any) => {
if(type=='update')
console.log(row)
TemplateItemDetails.allSchemas.formSchema.forEach(item=>{
if(item.component == 'UploadFile'){
if(row[item.field]){
item.componentProps.modelValue = [{
name:row[item.field],
url:row[item.field],
}]
}else{
item.componentProps.modelValue =[]
}
}
})
basicFormRef.value.open(type, row) basicFormRef.value.open(type, row)
} }
@ -320,9 +363,7 @@ const searchFormClick = (searchData) => {
/** 初始化 **/ /** 初始化 **/
onMounted(async () => { onMounted(async () => {
// importTemplateData.templateUrl = await TemplateItemDetailsApi.importTemplate() // importTemplateData.templateUrl = await TemplateItemDetailsApi.importTemplate()
}) })
</script> </script>

11
src/components/UploadFile/src/Preview.vue
View File

@ -0,0 +1,11 @@
<template>
<div class="preview">
1
</div>
</template>
<script lang="ts" setup>
</script>
<style scoped lang="scss">
</style>

16
src/components/UploadFile/src/UploadFile.vue
View File

@ -8,10 +8,11 @@
v-model:file-list="fileList" v-model:file-list="fileList"
:show-file-list="true" :show-file-list="true"
:auto-upload="autoUpload" :auto-upload="autoUpload"
:action="updateUrl+'?tableId='+upData?.tableId+'&tableName='+ upData?.tableName" :action="updateUrl + '?tableId=' + upData?.tableId + '&tableName=' + upData?.tableName"
:headers="uploadHeaders" :headers="uploadHeaders"
:limit="props.limit" :limit="props.limit"
:drag="drag" :drag="drag"
:accept="fileType.join(',')"
:before-upload="beforeUpload" :before-upload="beforeUpload"
:on-exceed="handleExceed" :on-exceed="handleExceed"
:on-success="handleFileSuccess" :on-success="handleFileSuccess"
@ -26,8 +27,9 @@
大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b> 大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b>
</div> </div>
<div style="font-size: 8px;line-height: initial;"> <div style="font-size: 8px;line-height: initial;">
格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b> 的文件 格式为 <b style="color: #f56c6c">{{ fileType.join(',') }}</b> 的文件
</div> </div>
<Preview/>
</template> </template>
<template v-if="!isShowFile" #file > <template v-if="!isShowFile" #file >
<div> <div>
@ -38,6 +40,7 @@
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { PropType } from 'vue' import { PropType } from 'vue'
import Preview from '@/components/UploadFile/src/Preview'
import { propTypes } from '@/utils/propTypes' import { propTypes } from '@/utils/propTypes'
import { getAccessToken, getTenantId } from '@/utils/auth' import { getAccessToken, getTenantId } from '@/utils/auth'
@ -60,15 +63,16 @@ const props = defineProps({
fileSize: propTypes.number.def(5), // 大小限制(MB) fileSize: propTypes.number.def(5), // 大小限制(MB)
limit: propTypes.number.def(5), // 数量限制 limit: propTypes.number.def(5), // 数量限制
autoUpload: propTypes.bool.def(true), // 自动上传 autoUpload: propTypes.bool.def(true), // 自动上传
drag: propTypes.bool.def(false), // 拖拽上传
isShowTip: propTypes.bool.def(true), // 是否显示提示 isShowTip: propTypes.bool.def(true), // 是否显示提示
isShowFile: propTypes.bool.def(true), // 是否显示上传的文件 isShowFile: propTypes.bool.def(true), // 是否显示上传的文件
}) })
console.log('props.upData',props.upData)
// ========== 上传相关 ========== // ========== 上传相关 ==========
const valueRef = ref(props.modelValue) const valueRef = ref(props.modelValue)
const uploadRef = ref<UploadInstance>() const uploadRef = ref<UploadInstance>()
const uploadList = ref<UploadUserFile[]>([]) const uploadList = ref<UploadUserFile[]>([])
console.log('props.modelValue',props.modelValue)
const fileList = props.modelValue && props.modelValue.length > 0 ? ref<UploadUserFile[]>(props.modelValue) : ref<UploadUserFile[]>([]) const fileList = props.modelValue && props.modelValue.length > 0 ? ref<UploadUserFile[]>(props.modelValue) : ref<UploadUserFile[]>([])
const uploadNumber = ref<number>(0) const uploadNumber = ref<number>(0)
const uploadHeaders = ref({ const uploadHeaders = ref({
@ -91,7 +95,7 @@ const beforeUpload: UploadProps['beforeUpload'] = (file: UploadRawFile) => {
}) })
const isLimit = file.size < props.fileSize * 1024 * 1024 const isLimit = file.size < props.fileSize * 1024 * 1024
if (!isImg) { if (!isImg) {
message.error(`文件格式不正确, 请上传${props.fileType.join('/')}格式!`) message.error(`文件格式不正确, 请上传${props.fileType.join(',')}格式!`)
return false return false
} }
if (!isLimit) { if (!isLimit) {
@ -136,7 +140,9 @@ const handleRemove = (file) => {
} }
} }
const handlePreview: UploadProps['onPreview'] = (uploadFile) => { const handlePreview: UploadProps['onPreview'] = (uploadFile) => {
console.log(uploadFile) console.log('uploadFile',uploadFile)
window.open(uploadFile.url)
} }
// 对象转成指定字符串分隔 // 对象转成指定字符串分隔
const listToString = (list: UploadUserFile[], separator?: string) => { const listToString = (list: UploadUserFile[], separator?: string) => {

4
src/views/spc/detectiontemplate/index.vue
View File

@ -63,6 +63,7 @@
:apiPage="TemplateItemDetailsApi.getTemplateItemDetailsPage" :apiPage="TemplateItemDetailsApi.getTemplateItemDetailsPage"
:apiDelete="TemplateItemDetailsApi.deleteTemplateItemDetails" :apiDelete="TemplateItemDetailsApi.deleteTemplateItemDetails"
:Echo="Echo" :Echo="Echo"
width="60%"
@searchTableSuccessDetail="searchTableSuccessDetail" @searchTableSuccessDetail="searchTableSuccessDetail"
/> />
@ -107,7 +108,8 @@ const { tableObject, tableMethods } = useTable({
}) })
// 获得表格的各种操作 // 获得表格的各种操作
const { getList, setSearchParams } = tableMethods const {getList, setSearchParams } = tableMethods
// 列表头部按钮 // 列表头部按钮
const HeadButttondata = [ const HeadButttondata = [

72
src/views/spc/detectiontemplate/templateItemDetails.data.ts
View File

@ -107,34 +107,54 @@ export const TemplateItemDetails = useCrudSchemas(reactive<CrudSchema[]>([
isSearch: false, isSearch: false,
isTable:false, isTable:false,
form:{ form:{
component:'UploadImg', component:'UploadFile',
componentProps:{
fileType:['image/jpeg', 'image/png', 'image/gif','video/mp4','video/webm'],
fileSize:20,
limit:1,
upData:{
tableId:0,tableName:"detection_template_item_details"
},
modelValue:[]
}
}
},
{
label: '工具图',
field: 'image2',
sort: 'custom',
isSearch: false,
isTable:false,
form:{
component:'UploadFile',
componentProps:{
fileType:['image/jpeg', 'image/png', 'image/gif','video/mp4','video/webm'],
fileSize:20,
limit:1,
upData:{
tableId:0,tableName:"detection_template_item_details"
}
}
}
},
{
label: '操作指导书',
field: 'image3',
sort: 'custom',
isSearch: false,
isTable:false,
form:{
component:'UploadFile',
componentProps:{
fileType:['image/jpeg', 'image/png', 'image/gif','video/mp4','video/webm'],
fileSize:20,
limit:1,
upData:{
tableId:0,tableName:"detection_template_item_details"
}
}
} }
}, },
// {
// label: '工具图',
// field: 'image2',
// sort: 'custom',
// isSearch: false,
// isTable:false,
// form:{
// component:'UploadImg',
// componentProps:{
// upData:{
// tabelId:1,tableName:"detection"
// }
// }
// }
// },
// {
// label: '操作指导书',
// field: 'image3',
// sort: 'custom',
// isSearch: false,
// isTable:false,
// form:{
// component:'UploadImg',
// }
// },
{ {
label: '创建时间', label: '创建时间',
field: 'createTime', field: 'createTime',

Write Preview
Loading…
Cancel
Save