提交 c9c9c92b authored 作者: lidongxu's avatar lidongxu

style(inspectiontask/*): 修改:门店类型由 vant 改成 element 组件样式下拉效果

上级 a784c35d
......@@ -56,12 +56,28 @@
</van-field>
</div>
<!-- 门店类型选择 -->
<van-field :model-value="form.selectedType.join('')"
<van-field label-width="150px"
label-position="top"
label="门店类型:"
:model-value="form.selectedType"
placeholder="请选择">
<template #input>
<el-select v-model="form.selectedType"
placeholder="请选择"
@change="handleTypeConfirm">
<el-option v-for="item in typeOptions"
:label="item.text"
:value="item.value" />
</el-select>
</template>
</van-field>
<!-- <van-field :model-value="form.selectedType.join('')"
readonly
label="门店类型"
label-align="top"
placeholder="请选择"
@click="showTypePopup = true" />
@click="showTypePopup = true"
class="store-type" />
<van-popup v-model:show="showTypePopup"
position="bottom"
@close="showTypePopup = false">
......@@ -69,7 +85,7 @@
:columns="typeOptions"
@confirm="handleTypeConfirm"
@cancel="showTypePopup = false" />
</van-popup>
</van-popup> -->
<!-- 信息填写组 -->
<van-tabs v-model:active="active"
class="tabs"
......@@ -191,7 +207,7 @@ const form = reactive({ // 当前页信息总对象
longTimePictureArr: [], // 大日期产品照片
// 前端特有属性和后端接口不一致
commitStorePicture: [], // 上报拍摄的门店照片
selectedType: [], // 门店类型
selectedType: "", // 门店类型
})
// 稽查任务详情
......@@ -201,7 +217,7 @@ const getInspectionTaskDetailFn = async () => {
})
if (res.data) {
Object.assign(form, res.data)
const { storeName, lhldArr, longTimePictureArr, storePicture, storeType, skuNum, cgclRiskRArr } = res.data
const { storeName, lhldArr, longTimePictureArr, storePicture, storeType, skuNum, cgclRiskRArr, dqclRiskRArr } = res.data
// 终端门店照片一直应该是路由上的照片参数,如果路由上没有门头照证明上一个页面列表里这个门店就本身没有照片,那就用门头照拍摄的
if (route.query.storePicture) form.storePicture = route.query.storePicture
// 详情接口有门头照照片,需要设置到特有的属性commitStorePicture
......@@ -211,6 +227,7 @@ const getInspectionTaskDetailFn = async () => {
// 详情接口门店名称如果是空的就用路由传递的
if (!storeName) form.storeName = route.query.storeName
if (!lhldArr) form.lhldArr = []
if (!longTimePictureArr) form.longTimePictureArr = []
else {
// 前端特有结构数据格式处理
......@@ -220,14 +237,15 @@ const getInspectionTaskDetailFn = async () => {
}
if (skuNum === 0) form.skuNum = ''
if (!cgclRiskRArr) form.cgclRiskRArr = []
if (route.query.selectedType) form.selectedType = [route.query.selectedType]
if (!dqclRiskRArr) form.dqclRiskRArr = []
if (route.query.selectedType) form.selectedType = route.query.selectedType
// 如果从新建稽查任务页面过来的,门头照路由上传递过来的
if (route.query.taskStatus && route.query.storePicture) form.commitStorePicture = [{
url: route.query.storePicture
}]
if (storeType) form.selectedType = [storeType]
if (storeType) form.selectedType = storeType
} else {
// 没有的话调用新建接口,得到一个总体稽查任务 id
......@@ -356,13 +374,11 @@ const deleteCommitStorePhotos = async () => {
const typeOptions = ref(typeOption) // 门店类型
const showTypePopup = ref(false)
// 确认门店类型
const handleTypeConfirm = async ({ selectedValues }) => {
form.selectedType = selectedValues
showTypePopup.value = false
const handleTypeConfirm = async () => {
await createInspectionTaskAPI({
storeCode: form.storeCode,
rstId: form.rstId,
storeType: selectedValues.join(',')
storeType: form.selectedType
})
}
......@@ -428,7 +444,6 @@ const deleteLongTimePictureArr = async (file, { name, index }) => {
showNotify({ type: 'success', message: '大日期产品照片,删除成功' })
}
</script>
<style scoped
......@@ -447,6 +462,8 @@ const deleteLongTimePictureArr = async (file, { name, index }) => {
font-weight: bold;
}
/* 终端名称信息 */
.terminal-wrap {
margin-top: 10px;
......@@ -490,6 +507,13 @@ const deleteLongTimePictureArr = async (file, { name, index }) => {
}
.store-type {
::v-deep(input) {
border-bottom: 1px solid gray;
}
}
/* 位置信息 */
.location-wrap {
margin-top: 10px;
......
......@@ -2,15 +2,14 @@
<div class="mobile-page-container">
<!-- 类型选择 -->
<div class="category-select">
<van-field label-width="150px"
<van-field label-width="3.8rem"
label-position="left"
label="品类选择:"
:model-value="selectedTypeObj.label"
placeholder="请输入">
<template #input>
<el-select v-model="selectedTypeObj"
placeholder="请选择"
filterable>
placeholder="请选择">
<el-option v-for="item in typeOptions"
:label="item.label"
:value="item" />
......@@ -20,7 +19,7 @@
<van-field v-model="selectedTypeObj.price"
type="number"
:label="selectedTypeObj.label + ' 价格:'"
label-width="150px"
label-width="3.8rem"
placeholder="请输入价格"
clearable
class="search-input"
......@@ -310,17 +309,6 @@ const typeOptions = ref([
]);
const selectedTypeObj = ref(typeOptions.value[0])
// 创建任务
const createTask = async () => {
const { data } = await createInspectionTaskDetailAPI({
taskDetail: {
rstId: props.form.rstId,
detailName: '品类信息'
}
})
displayGroup.value.push(data)
}
// 价格改变
const handlePriceChange = async () => {
const res = await createInspectionTaskDetailAPI({
......@@ -368,6 +356,15 @@ const init = () => {
return
}
}
// 手动创建品类信息,得到 rstdId
createInspectionTaskDetailAPI({
taskDetail: {
rstId: props.form.rstId,
detailName: '品类信息'
}
}).then(res => {
nowRstdId.value = res.data.rstdId
})
}
defineExpose({
init
......@@ -398,6 +395,10 @@ defineExpose({
.search-input {
margin-top: .2667rem;
::v-deep(input) {
border-bottom: 1px solid gray;
}
}
}
......
......@@ -62,7 +62,7 @@
<!-- 总体判定 -->
<div class="overall">
<p class="title">档期陈列总体判定结果:</p>
<van-checkbox-group v-model="form.cgclRiskRArr"
<van-checkbox-group v-model="form.dqclRiskRArr"
direction="horizontal"
shape="square"
@change="handleOverallChange">
......@@ -232,7 +232,7 @@ const handleOverallChange = async () => {
if (props.isInitializing) return
await createInspectionTaskAPI({
rstId: props.form.rstId,
cgclRiskRArr: props.form.cgclRiskRArr
dqclRiskRArr: props.form.dqclRiskRArr
})
showNotify({ type: 'success', message: '核查结果,保存成功' })
}
......
......@@ -32,7 +32,21 @@
</van-field>
</div>
<!-- 门店类型选择 -->
<van-field :model-value="form.selectedType.join('')"
<van-field label-width="150px"
label-position="top"
label="门店类型:"
:model-value="form.selectedType"
placeholder="请选择">
<template #input>
<el-select v-model="form.selectedType"
placeholder="请选择">
<el-option v-for="item in typeOptions"
:label="item.text"
:value="item.value" />
</el-select>
</template>
</van-field>
<!-- <van-field :model-value="form.selectedType.join('')"
readonly
label="门店类型"
label-align="top"
......@@ -46,7 +60,7 @@
:columns="typeOptions"
@confirm="handleTypeConfirm"
@cancel="showTypePopup = false" />
</van-popup>
</van-popup> -->
</van-form>
</div>
</div>
......@@ -74,7 +88,7 @@ const router = useRouter();
const form = reactive({
storeName: '',
storePicture: [],
selectedType: []
selectedType: ''
})
const typeOptions = ref(typeOption); // 门店类型
const showTypePopup = ref(false);
......@@ -97,10 +111,10 @@ const deletePosPhotos = async () => {
}
// 确认门店类型
const handleTypeConfirm = ({ selectedValues }) => {
form.selectedType = selectedValues;
showTypePopup.value = false;
};
// const handleTypeConfirm = ({ selectedValues }) => {
// form.selectedType = selectedValues;
// showTypePopup.value = false;
// };
// 创建任务(跳转路由传参即可)
const myFormRef = ref(null)
......@@ -115,7 +129,7 @@ const handleCreateTask = () => {
storeName: form.storeName,
storeCode: null,
storePicture: form.storePicture[0]?.url,
selectedType: form.selectedType[0]
selectedType: form.selectedType
}
})
})
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论