feat: 新增档案

This commit is contained in:
wanglei
2024-06-25 11:13:29 +08:00
parent f095e344f5
commit 2143da5dce
2 changed files with 170 additions and 116 deletions

View File

@@ -1,119 +1,141 @@
<template> <template>
<ai-detail class="add"> <div>
<template slot="title"> <ai-detail class="add">
<ai-title title="添加档案" isShowBack isShowBottomBorder @onBackClick="cancel(false)"></ai-title> <template slot="title">
</template> <ai-title title="添加档案" isShowBack isShowBottomBorder @onBackClick="cancel(false)"></ai-title>
<template slot="content"> </template>
<el-form class="content-right" :model="form" ref="ruleForm" :rules="rules" label-width="130px" <template slot="content">
label-position="right" size="small"> <el-form class="content-right" :model="form" ref="ruleForm" :rules="rules" label-width="130px"
label-position="right" size="small">
<ai-card title="基本信息"> <ai-card title="基本信息">
<template #content> <template #content>
<el-row type="flex"> <el-row type="flex">
<el-form-item label="经营者姓名:" style="width: 100%;" prop="name"> <el-form-item label="经营者姓名:" style="width: 100%;" prop="name">
<el-input v-model="form.name" placeholder="请输入姓名" autocomplete="off" <el-input v-model="form.name" placeholder="请输入姓名" autocomplete="off"
size="small" maxlength="20"
show-word-limit></el-input>
</el-form-item>
<el-form-item label="身份证号:" style="width: 100%;" prop="idNumber">
<el-input v-model="form.idNumber" placeholder="请输入身份证号" autocomplete="off"
size="small" maxlength="18" @change="idChange"
show-word-limit></el-input>
</el-form-item>
</el-row>
<el-row type="flex">
<el-form-item label="性别:" style="width: 100%;" prop="sex">
<ai-select
v-model="form.sex"
style="width: 100%;"
placeholder="性别"
:selectList="$dict.getDict('sex')">
</ai-select>
</el-form-item>
<el-form-item label="联系电话:" v-model="form.phone" style="width: 100%;" prop="phone">
<el-input v-model="form.phone" placeholder="请输入联系电话" autocomplete="off"
size="small" maxlength="18"
show-word-limit></el-input>
</el-form-item>
</el-row>
<el-row type="flex">
<el-form-item label="出生日期:" style="width: 100%;" prop="birthday">
<el-date-picker value-format="yyyy-MM-dd" size="small" v-model="form.birthday"
placeholder="请选择出生日期" disabled style="width: 100%"></el-date-picker>
</el-form-item>
<el-form-item label="年龄:" style="width: 100%;" prop="age">
<el-input v-model="form.age" placeholder="请输入年龄" disabled autocomplete="off"
size="small"></el-input>
</el-form-item>
</el-row>
</template>
</ai-card>
<ai-card title="门店信息">
<template #content>
<el-row type="flex">
<div class="flex-colum">
<el-form-item label="门店名称:" style="width: 100%;" prop="shopName">
<el-input v-model="form.shopName" placeholder="请输入姓名" autocomplete="off"
size="small" maxlength="20" size="small" maxlength="20"
show-word-limit></el-input> show-word-limit></el-input>
</el-form-item> </el-form-item>
<el-form-item label="经营类型" style="width: 100%;" prop="operatorType"> <el-form-item label="身份证号" style="width: 100%;" prop="idNumber">
<el-input v-model="form.idNumber" placeholder="请输入身份证号" autocomplete="off"
size="small" maxlength="18" @change="idChange"
show-word-limit></el-input>
</el-form-item>
</el-row>
<el-row type="flex">
<el-form-item label="性别:" style="width: 100%;" prop="sex">
<ai-select <ai-select
v-model="form.operatorType" v-model="form.sex"
placeholder="请选择经营范围" style="width: 100%;"
:selectList="$dict.getDict('operatorType')" style="width: 100%;"> placeholder="性别"
:selectList="$dict.getDict('sex')">
</ai-select> </ai-select>
</el-form-item> </el-form-item>
<el-form-item label="所属片区:" style="width: 100%;" prop="girdCode"> <el-form-item label="联系电话:" v-model="form.phone" style="width: 100%;" prop="phone">
<el-select placeholder="请选择所属片区" size="small" v-model="form.girdCode" <el-input v-model="form.phone" placeholder="请输入联系电话" autocomplete="off"
style="width: 100%;"></el-select> size="small" maxlength="18"
show-word-limit></el-input>
</el-form-item> </el-form-item>
</div> </el-row>
<el-row type="flex">
<el-form-item label="出生日期:" style="width: 100%;" prop="birthday">
<el-date-picker value-format="yyyy-MM-dd" size="small" v-model="form.birthday"
placeholder="请选择出生日期" disabled style="width: 100%"></el-date-picker>
</el-form-item>
<el-form-item label="年龄:" style="width: 100%;" prop="age">
<el-input v-model="form.age" placeholder="请输入年龄" disabled autocomplete="off"
size="small"></el-input>
</el-form-item>
</el-row>
</template>
</ai-card>
<ai-card title="门店信息">
<template #content>
<el-row type="flex">
<div class="flex-colum">
<el-form-item label="门店名称:" style="width: 100%;" prop="shopName">
<el-input v-model="form.shopName" placeholder="请输入姓名" autocomplete="off"
size="small" maxlength="20"
show-word-limit></el-input>
</el-form-item>
<el-form-item label="经营类型:" style="width: 100%;" prop="operatorType">
<ai-select
v-model="form.operatorType"
placeholder="请选择经营范围"
:selectList="$dict.getDict('operatorType')" style="width: 100%;">
</ai-select>
</el-form-item>
<el-form-item label="所属片区:" style="width: 100%;" prop="girdCode">
<el-input disabled v-model="form.girdName" size="small" placeholder="请选择片区">
<template slot="append">
<el-button size="small" @click="handleSelectGrid">选择片区</el-button>
</template>
</el-input>
</el-form-item>
</div>
<el-form-item label="门店照片" style="width: 100%;" prop="fileUrl"> <el-form-item label="门店照片" style="width: 100%;" prop="fileUrl">
<ai-uploader <ai-uploader
:instance="instance" :instance="instance"
isShowTip isShowTip
v-model="form.fileUrl" v-model="form.fileUrl"
:limit="1" :limit="1"
:cropOps="cropOps" is-crop>
is-crop> <template slot="tips">
<template slot="tips"> <p>最多上传1张图片,单个文件最大10MB支持jpgjpegpng格式</p>
<p>最多上传1张图片,单个文件最大10MB支持jpgjpegpng格式</p> <p>图片比例1.61</p>
<p>图片比例1.61</p> </template>
</template> </ai-uploader>
</ai-uploader> </el-form-item>
</el-row>
<el-form-item label="社会信用代码:" style="width: 100%;" prop="creditCode">
<el-input v-model="form.creditCode" placeholder="请输入社会统一信用代码" size="small"></el-input>
</el-form-item> </el-form-item>
</el-row> <el-form-item label="门店住址:" style="width: 100%;" prop="addressCode">
<el-form-item label="社会信用代码:" style="width: 100%;" prop="creditCode"> <ai-area-select :instance="instance" clearable always-show
<el-input v-model="form.creditCode" placeholder="请输入社会统一信用代码" size="small"></el-input> :disabled-level="$store.state.user.info.areaList.length"
</el-form-item> @name="v=>form.areaName=v" v-model="form.areaId"/>
<el-form-item label="门店住址:" style="width: 100%;" prop="addressCode"> </el-form-item>
<ai-area-select :instance="instance" clearable v-model="form.addressCode" always-show <el-form-item label="" style="width:100%" prop="address">
@name="v=>form.areaName=v"/> <el-input
</el-form-item> size="small"
<el-form-item label="" style="width:100%" prop="address"> placeholder="请输入详细地址"
<el-input clearable
size="small" v-model="form.address"
placeholder="请输入详细地址" maxlength="50"
clearable show-word-limit
v-model="form.address" ></el-input>
maxlength="50" </el-form-item>
show-word-limit <el-form-item label="门店描述:" style="width: 100%" prop="description">
></el-input> <el-input v-model="form.description" placeholder="请输入门店描述" type="textarea" :rows="3"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="门店描述:" style="width: 100%" prop="description"> </template>
<el-input v-model="form.description" placeholder="请输入门店描述" type="textarea" :rows="3"></el-input> </ai-card>
</el-form-item> </el-form>
</template> </template>
</ai-card> <template #footer>
</el-form> <el-button @click="cancel">取消</el-button>
</template> <el-button type="primary" @click="handleSave">保存</el-button>
<template #footer> </template>
<el-button @click="cancel">取消</el-button> </ai-detail>
<el-button type="primary" @click="handleSave">保存</el-button> <ai-dialog title="选择片区" :visible.sync="dialog" :customFooter="true" border width="720px">
</template> <div class="grid">
</ai-detail> <el-tree
:data="treeList"
:props="defaultProps"
node-key="id"
ref="treeRef"
:check-strictly="true"
show-checkbox
@check="onCheckChange">
</el-tree>
</div>
<div class="dialog-footer" slot="footer">
<el-button size="medium" @click="dialog=false">取消</el-button>
<el-button type="primary" size="medium" @click="getCheckedTree()">确认</el-button>
</div>
</ai-dialog>
</div>
</template> </template>
<script> <script>
@@ -131,7 +153,8 @@ export default {
data() { data() {
return { return {
form: { form: {
id:null, id: null,
areaId: '',
name: '', name: '',
idNumber: '', idNumber: '',
sex: '', sex: '',
@@ -139,6 +162,12 @@ export default {
birthday: '', birthday: '',
age: '', age: '',
}, },
dialog: false,
treeList: [],
defaultProps: {
children: "children",
label: "girdName",
},
rules: { rules: {
name: [{required: true, message: '请输入经营者姓名', trigger: 'blur'}], name: [{required: true, message: '请输入经营者姓名', trigger: 'blur'}],
idNumber: [{required: true, message: '请输入身份证号', trigger: 'blur'}], idNumber: [{required: true, message: '请输入身份证号', trigger: 'blur'}],
@@ -154,11 +183,30 @@ export default {
}, },
created() { created() {
this.$dict.load('sex','operatorType') this.form.areaId = this.$store.state.user.info.areaId
this.$dict.load('sex', 'operatorType')
}, },
methods: { methods: {
async handleSelectGrid() {
try {
this.dialog = true
const {code, data} = await this.instance.post('/app/appgirdinfo/listAll3')
if (code === 0) {
console.log('data--->', data)
}
} catch (e) {
console.error(e)
}
},
getCheckedTree() {
},
onCheckChange(e) {
},
idChange(val) { idChange(val) {
if (val.length == 18) { if (val.length == 18) {
this.IdCard(val); this.IdCard(val);
@@ -180,7 +228,7 @@ export default {
...this.form ...this.form
} }
}) })
if(code===0){ if (code === 0) {
this.$message.success('保存成功'); this.$message.success('保存成功');
this.form = {...data} this.form = {...data}
} }

View File

@@ -2,7 +2,7 @@
<div> <div>
<ai-list class="app-archives-list"> <ai-list class="app-archives-list">
<template slot="title"> <template slot="title">
<ai-title title="门店档案" isShowBottomBorder></ai-title> <ai-title title="门店档案" isShowBottomBorder v-model="search.areaId" isShowArea :hideLevel="hideLevel - 1" @change="search.current = 1, getList()"></ai-title>
</template> </template>
<template slot="content"> <template slot="content">
<ai-search-bar class="search-bar"> <ai-search-bar class="search-bar">
@@ -44,12 +44,6 @@
placeholder="经营类型" placeholder="经营类型"
:selectList="$dict.getDict('operatorType')"> :selectList="$dict.getDict('operatorType')">
</ai-select> </ai-select>
<ai-select
v-model="search.status"
@change="(search.current = 1), getList()"
placeholder="所属片区"
:selectList="$dict.getDict('appIntegralApplyEventStatus')">
</ai-select>
</template> </template>
<template #right> <template #right>
<el-input <el-input
@@ -124,6 +118,7 @@
<script> <script>
import { MessageBox } from 'element-ui' import { MessageBox } from 'element-ui'
import {mapState} from "vuex";
export default { export default {
name: 'List', name: 'List',
@@ -135,6 +130,7 @@ export default {
data () { data () {
return { return {
search: { search: {
areaId:'',
current: 1, current: 1,
size: 10, size: 10,
applyItemId: '', applyItemId: '',
@@ -163,7 +159,17 @@ export default {
} }
}, },
computed:{
...mapState(['user']),
hideLevel () {
return this.user.info.areaList.length || 0
},
},
created () { created () {
this.search.areaId = this.user.info.areaId
this.$dict.load('yesOrNo','storeLevel','operatorType').then(() => { this.$dict.load('yesOrNo','storeLevel','operatorType').then(() => {
this.getList() this.getList()
}) })